.elementor-297 .elementor-element.elementor-element-2fc787f3{--display:flex;overflow:visible;}.elementor-297 .elementor-element.elementor-element-149f9508{--display:flex;overflow:visible;}.elementor-297 .elementor-element.elementor-element-1d838443 .elementor-repeater-item-a8da1c2 .swiper-slide-bg{background-color:#833ca3;background-image:url(https://iesdivinojesus.edu.pe/wp-content/uploads/2026/09/images.jpg);background-size:cover;}.elementor-297 .elementor-element.elementor-element-1d838443 .elementor-repeater-item-a8da1c2 .swiper-slide-contents{margin-right:auto;}.elementor-297 .elementor-element.elementor-element-1d838443 .elementor-repeater-item-a8da1c2 .swiper-slide-inner{align-items:center;}.elementor-297 .elementor-element.elementor-element-1d838443 .elementor-repeater-item-8f838c3 .swiper-slide-bg{background-color:#833ca3;background-image:url(https://iesdivinojesus.edu.pe/wp-content/uploads/2026/09/escolta.jpg);background-size:cover;}.elementor-297 .elementor-element.elementor-element-1d838443 .elementor-repeater-item-8f838c3 .swiper-slide-contents{margin-right:auto;}.elementor-297 .elementor-element.elementor-element-1d838443 .elementor-repeater-item-8f838c3 .swiper-slide-inner{align-items:center;}.elementor-297 .elementor-element.elementor-element-1d838443 .swiper-slide{height:763px;transition-duration:calc(5000ms*1.2);}.elementor-297 .elementor-element.elementor-element-1d838443 .swiper-slide-contents{max-width:66%;}.elementor-297 .elementor-element.elementor-element-1d838443 .swiper-slide-inner{text-align:center;}.elementor-297 .elementor-element.elementor-element-1d838443 .elementor-slide-heading{font-family:"Arial", Sans-serif;}.elementor-297 .elementor-element.elementor-element-338fb396{--display:flex;--min-height:409px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}.elementor-297 .elementor-element.elementor-element-5127121f{text-align:start;}.elementor-297 .elementor-element.elementor-element-5127121f .elementor-heading-title{font-family:"Arial", Sans-serif;color:#D8A25C;}.elementor-297 .elementor-element.elementor-element-5127121f.elementor-element{--align-self:flex-start;}.elementor-297 .elementor-element.elementor-element-454ed5a1{font-family:"Arial", Sans-serif;width:var( --container-widget-width, 37.086% );max-width:37.086%;--container-widget-width:37.086%;--container-widget-flex-grow:0;}.elementor-297 .elementor-element.elementor-element-454ed5a1.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-297 .elementor-element.elementor-element-3d6603d2 img{width:94%;max-width:100%;height:199px;border-radius:21px 21px 21px 21px;}.elementor-297 .elementor-element.elementor-element-3d6603d2{width:var( --container-widget-width, 19% );max-width:19%;--container-widget-width:19%;--container-widget-flex-grow:0;top:66.543px;}.elementor-297 .elementor-element.elementor-element-3d6603d2.elementor-element{--flex-grow:0;--flex-shrink:0;}body:not(.rtl) .elementor-297 .elementor-element.elementor-element-3d6603d2{left:1240.132px;}body.rtl .elementor-297 .elementor-element.elementor-element-3d6603d2{right:1240.132px;}.elementor-297 .elementor-element.elementor-element-778f7131 img{width:94%;max-width:100%;height:199px;border-radius:21px 21px 21px 21px;}.elementor-297 .elementor-element.elementor-element-778f7131{width:var( --container-widget-width, 15% );max-width:15%;--container-widget-width:15%;--container-widget-flex-grow:0;top:360.901px;}.elementor-297 .elementor-element.elementor-element-778f7131.elementor-element{--flex-grow:0;--flex-shrink:0;}body:not(.rtl) .elementor-297 .elementor-element.elementor-element-778f7131{left:1382.02px;}body.rtl .elementor-297 .elementor-element.elementor-element-778f7131{right:1382.02px;}.elementor-297 .elementor-element.elementor-element-386e5fc1 img{width:99%;max-width:100%;height:199px;border-radius:21px 21px 21px 21px;}.elementor-297 .elementor-element.elementor-element-386e5fc1{width:var( --container-widget-width, 15% );max-width:15%;--container-widget-width:15%;--container-widget-flex-grow:0;top:360.948px;}.elementor-297 .elementor-element.elementor-element-386e5fc1.elementor-element{--flex-grow:0;--flex-shrink:0;}body:not(.rtl) .elementor-297 .elementor-element.elementor-element-386e5fc1{left:1087.177px;}body.rtl .elementor-297 .elementor-element.elementor-element-386e5fc1{right:1087.177px;}.elementor-297 .elementor-element.elementor-element-21c64976{--display:flex;overflow:visible;}.elementor-297 .elementor-element.elementor-element-4e046e7e{--display:grid;--e-con-grid-template-columns:repeat(4, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;overflow:visible;}.elementor-297 .elementor-element.elementor-element-7087f38{--display:flex;overflow:visible;}.elementor-297 .elementor-element.elementor-element-1267b0b4{--display:flex;overflow:visible;}.elementor-297 .elementor-element.elementor-element-437f2be3{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(3, 1fr);--grid-auto-flow:row;overflow:visible;}.elementor-297 .elementor-element.elementor-element-5b3e5fc7{--display:flex;overflow:visible;}@media(max-width:1024px){.elementor-297 .elementor-element.elementor-element-4e046e7e{--grid-auto-flow:row;}.elementor-297 .elementor-element.elementor-element-437f2be3{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-297 .elementor-element.elementor-element-4e046e7e{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-297 .elementor-element.elementor-element-437f2be3{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}}/* Start custom CSS for container, class: .elementor-element-149f9508 */@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700;800;900&display=swap'); /* ============================================================ SLIDER INSTITUCIONAL PREMIUM PALETA: MORADO PRINCIPAL #5B2C83 MORADO OSCURO #35124F MORADO PROFUNDO #250B36 MORADO CLARO #7D4AA8 AMARILLO #F4C430 AMARILLO CLARO #FFD84A ROJO #C62828 ROJO OSCURO #941B1B WIDGET: sg-slider-pro ============================================================ */ /* ============================================================ CONTENEDOR PRINCIPAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508{ --sg-height:650px; --morado:#5B2C83; --morado-oscuro:#35124F; --morado-profundo:#250B36; --morado-claro:#7D4AA8; --amarillo:#F4C430; --amarillo-claro:#FFD84A; --rojo:#C62828; --rojo-oscuro:#941B1B; --blanco:#FFFFFF; position:relative !important; width:100vw !important; max-width:100vw !important; flex-basis:100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; margin-top:0 !important; margin-bottom:0 !important; padding:0 !important; gap:0 !important; overflow:visible !important; box-sizing:border-box !important; font-family: "Roboto", Arial, sans-serif !important; } /* ============================================================ INNER ELEMENTOR ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 > .e-con-inner{ width:100% !important; max-width:none !important; margin:0 !important; padding:0 !important; gap:0 !important; overflow:visible !important; } /* ============================================================ RESET ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro *, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro *::before, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro *::after{ box-sizing:border-box; } /* ============================================================ WIDGET ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro{ position:relative !important; display:block !important; width:100% !important; max-width:none !important; height: var(--sg-height) !important; margin:0 !important; padding:0 !important; overflow:hidden !important; border-radius:0 !important; background: linear-gradient( 135deg, var(--morado), var(--morado-profundo) ) !important; font-family: "Roboto", Arial, sans-serif !important; } /* ============================================================ CONTENEDOR INTERNO ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-widget-container{ position:relative !important; width:100% !important; height:var(--sg-height) !important; margin:0 !important; padding:0 !important; overflow:hidden !important; border:0 !important; border-radius:0 !important; background: var(--morado-profundo) !important; } /* ============================================================ SWIPER ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-container, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-main-swiper, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slides-wrapper{ position:relative !important; width:100% !important; max-width:none !important; height: var(--sg-height) !important; margin:0 !important; padding:0 !important; overflow:hidden !important; border-radius:0 !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-wrapper{ width:100% !important; height: var(--sg-height) !important; margin:0 !important; padding:0 !important; align-items:stretch !important; } /* ============================================================ CADA SLIDE ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide{ position:relative !important; width:100% !important; height: var(--sg-height) !important; margin:0 !important; padding:0 !important; overflow:hidden !important; isolation:isolate; background: var(--morado-profundo) !important; } /* ============================================================ IMAGEN DE FONDO ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-bg{ position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; background-repeat: no-repeat !important; background-size: cover !important; background-position: center center !important; filter: saturate(.94) contrast(1.04); transform: scale(1.055); transition: transform 7s cubic-bezier(.2,.7,.2,1), filter 1s ease !important; } /* SLIDE ACTIVO */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-active .swiper-slide-bg{ transform: scale(1.01); } /* ============================================================ OVERLAY PRINCIPAL MÁS ELEGANTE Y MENOS PESADO ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide::before{ content:""; position:absolute; z-index:1; inset:0; pointer-events:none; background: linear-gradient( 90deg, rgba(26,5,38,.97) 0%, rgba(53,18,79,.94) 22%, rgba(91,44,131,.84) 43%, rgba(91,44,131,.52) 65%, rgba(53,18,79,.16) 100% ), radial-gradient( circle at 9% 12%, rgba(255,216,74,.17), transparent 26% ), radial-gradient( circle at 92% 90%, rgba(198,40,40,.13), transparent 30% ); } /* ============================================================ BRILLO DECORATIVO ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide::after{ content:""; position:absolute; z-index:1; width:680px; height:680px; top:-410px; right:-180px; border-radius:50%; pointer-events:none; background: radial-gradient( circle, rgba(255,216,74,.16) 0%, rgba(125,74,168,.09) 39%, transparent 70% ); filter: blur(2px); } /* ============================================================ CONTENIDO ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-inner{ position:relative !important; z-index:3 !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; width:100% !important; max-width:1600px !important; height: var(--sg-height) !important; margin: 0 auto !important; padding: 60px clamp(88px,8vw,160px) !important; text-align:left !important; } /* ============================================================ CONTENEDOR DEL TEXTO ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-contents{ position:relative; width:100% !important; max-width: 780px !important; margin:0 !important; padding: 4px 0 !important; text-align:left !important; } /* ============================================================ BADGE ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-contents::before{ content:"IESTP DIVINO JESÚS"; display:inline-flex; align-items:center; justify-content:center; margin-bottom: 21px; padding: 9px 16px; color: var(--morado-oscuro); background: linear-gradient( 135deg, var(--amarillo-claro), var(--amarillo) ); border: 1px solid rgba(255,255,255,.25); border-radius: 999px; box-shadow: 0 10px 30px rgba(25,4,37,.20); font-size: 9px; font-weight: 900; line-height:1; letter-spacing: 1.3px; text-transform: uppercase; } /* ============================================================ TÍTULO ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-heading{ max-width: 780px !important; margin: 0 0 18px !important; padding: 0 !important; color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; font-family: "Roboto", Arial, sans-serif !important; font-size: clamp(44px,5vw,68px) !important; font-weight: 900 !important; line-height: 1.015 !important; letter-spacing: -1.8px !important; text-shadow: 0 6px 26px rgba(18,2,27,.30) !important; } /* ============================================================ LÍNEA DECORATIVA ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-heading::after{ content:""; display:block; width: 108px; height: 5px; margin-top: 20px; border-radius: 999px; background: linear-gradient( 90deg, var(--amarillo-claro) 0%, var(--amarillo) 55%, var(--rojo) 100% ); box-shadow: 0 5px 16px rgba(244,196,48,.20); } /* ============================================================ DESCRIPCIÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-description{ max-width: 680px !important; margin: 0 0 29px !important; padding: 0 !important; color: rgba(255,255,255,.88) !important; -webkit-text-fill-color: rgba(255,255,255,.88) !important; font-family: "Roboto", Arial, sans-serif !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.72 !important; text-align: left !important; text-shadow: 0 3px 12px rgba(25,4,37,.18); } /* ============================================================ BOTÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-button{ display:inline-flex !important; align-items:center !important; justify-content:center !important; width:auto !important; min-height: 52px !important; padding: 0 25px !important; color: var(--morado-oscuro) !important; -webkit-text-fill-color: var(--morado-oscuro) !important; background: linear-gradient( 135deg, var(--amarillo-claro), var(--amarillo) ) !important; border: 1px solid rgba(255,255,255,.20) !important; border-radius: 12px !important; font-size: 12.5px !important; font-weight: 850 !important; line-height: 1 !important; text-decoration: none !important; box-shadow: 0 14px 32px rgba(25,4,37,.25) !important; transition: transform .3s ease, color .3s ease, background .3s ease, box-shadow .3s ease !important; } /* FLECHA */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-button::after{ content:"→"; margin-left: 9px; font-size: 17px; font-weight: 900; line-height: 1; transition: transform .3s ease; } /* HOVER BOTÓN */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-button:hover{ color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; background: linear-gradient( 135deg, var(--rojo), var(--rojo-oscuro) ) !important; transform: translateY(-4px); box-shadow: 0 20px 40px rgba(25,4,37,.36) !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-button:hover::after{ transform: translateX(4px); } /* ============================================================ FLECHAS DEL SLIDER ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-prev, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-next{ width: 50px !important; height: 50px !important; display:flex !important; align-items:center !important; justify-content:center !important; color: #FFFFFF !important; background: rgba(53,18,79,.52) !important; border: 1px solid rgba(255,255,255,.20) !important; border-radius: 50% !important; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 10px 28px rgba(25,4,37,.24) !important; transition: transform .3s ease, background .3s ease, color .3s ease, border-color .3s ease !important; } /* HOVER FLECHAS */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button:hover, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-prev:hover, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-next:hover{ color: var(--morado-oscuro) !important; background: linear-gradient( 135deg, var(--amarillo-claro), var(--amarillo) ) !important; border-color: rgba(255,216,74,.55) !important; transform: scale(1.08); } /* SVG */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button svg{ width: 19px !important; height: 19px !important; fill: currentColor !important; } /* POSICIÓN */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button-prev, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-prev{ left: 28px !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button-next, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-next{ right: 28px !important; } /* ============================================================ PAGINACIÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-pagination{ position:absolute !important; z-index: 20 !important; left: 50% !important; bottom: 19px !important; width: auto !important; display:flex !important; align-items:center !important; justify-content:center !important; gap: 8px; padding: 8px 12px; background: rgba(37,11,54,.56) !important; border: 1px solid rgba(255,255,255,.15); border-radius: 999px; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); transform: translateX(-50%); box-shadow: 0 8px 24px rgba(25,4,37,.22); } /* DOT */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-pagination-bullet{ width: 8px !important; height: 8px !important; margin: 0 !important; opacity: 1 !important; border-radius: 999px !important; background: rgba(255,255,255,.52) !important; transition: width .3s ease, background .3s ease, transform .3s ease; } /* DOT ACTIVO */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-pagination-bullet-active{ width: 30px !important; background: linear-gradient( 90deg, var(--amarillo-claro), var(--amarillo), var(--rojo) ) !important; } /* ============================================================ LÍNEA INFERIOR ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro::after{ content:""; position:absolute; z-index: 30; left:0; bottom:0; width:100%; height: 5px; pointer-events:none; background: linear-gradient( 90deg, var(--morado-claro) 0%, var(--morado) 29%, var(--amarillo) 62%, var(--rojo) 100% ); } /* ============================================================ ANIMACIÓN DE CONTENIDO ============================================================ */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-active .swiper-slide-contents{ animation: sgSlidePremium .85s cubic-bezier(.2,.7,.2,1) both; } @keyframes sgSlidePremium{ from{ opacity:0; transform: translateY(24px); } to{ opacity:1; transform: translateY(0); } } /* ============================================================ TABLET ============================================================ */ @media(max-width:1024px){ .elementor-297 .elementor-element.elementor-element-149f9508{ --sg-height: 590px; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-inner{ padding: 52px 7% !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-heading{ font-size: clamp(39px,6vw,55px) !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-description{ max-width: 590px !important; font-size: 15px !important; line-height: 1.68 !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button-prev, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-prev{ left: 14px !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button-next, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-next{ right: 14px !important; } } /* ============================================================ MÓVIL ============================================================ */ @media(max-width:767px){ .elementor-297 .elementor-element.elementor-element-149f9508{ --sg-height: 550px; width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; } /* OVERLAY VERTICAL */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide::before{ background: linear-gradient( 180deg, rgba(91,44,131,.08) 0%, rgba(91,44,131,.25) 28%, rgba(53,18,79,.80) 62%, rgba(25,4,37,.98) 100% ), radial-gradient( circle at 8% 10%, rgba(255,216,74,.11), transparent 25% ); } /* CONTENIDO ABAJO */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-inner{ align-items: flex-end !important; padding: 34px 20px 70px !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-contents{ max-width: 100% !important; } /* BADGE */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-contents::before{ margin-bottom: 13px; padding: 7px 11px; font-size: 8px; } /* TÍTULO */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-heading{ margin-bottom: 12px !important; font-size: 34px !important; line-height: 1.05 !important; letter-spacing: -1px !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-heading::after{ width: 72px; height: 4px; margin-top: 13px; } /* DESCRIPCIÓN */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-description{ max-width: 100% !important; margin-bottom: 19px !important; font-size: 13.5px !important; line-height: 1.6 !important; text-align: left !important; } /* BOTÓN */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-button{ min-height: 44px !important; padding: 0 18px !important; font-size: 11px !important; } /* FLECHAS */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-prev, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-next{ width: 40px !important; height: 40px !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button-prev, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-prev{ left: 8px !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-swiper-button-next, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-button-next{ right: 8px !important; } /* PAGINACIÓN */ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-pagination{ bottom: 13px !important; padding: 7px 10px; } } /* ============================================================ CELULAR PEQUEÑO ============================================================ */ @media(max-width:480px){ .elementor-297 .elementor-element.elementor-element-149f9508{ --sg-height: 520px; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .swiper-slide-inner{ padding: 28px 17px 64px !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-heading{ font-size: 30px !important; } .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro .elementor-slide-description{ font-size: 12.8px !important; line-height: 1.57 !important; } } /* ============================================================ REDUCIR MOVIMIENTO SI EL USUARIO LO PREFIERE ============================================================ */ @media(prefers-reduced-motion:reduce){ .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro *, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro *::before, .elementor-297 .elementor-element.elementor-element-149f9508 .sg-slider-pro *::after{ animation-duration: .01ms !important; transition-duration: .01ms !important; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-338fb396 *//* ============================================================ SECCIÓN INSTITUCIONAL IESTP DIVINO JESÚS DISEÑO CORREGIDO TÍTULO SUPERIOR TEXTO IZQUIERDA GALERÍA DERECHA PALETA: MORADO #5B2C83 OSCURO #35124F PROFUNDO #250B36 AMARILLO #F4C430 ROJO #C62828 ============================================================ */ /* ============================================================ RESET ============================================================ */ .sg-about, .sg-about *, .sg-about *::before, .sg-about *::after{ box-sizing:border-box; } /* ============================================================ SECCIÓN PRINCIPAL ============================================================ */ .sg-about{ --morado:#5B2C83; --morado-oscuro:#35124F; --morado-profundo:#250B36; --morado-claro:#7D4AA8; --amarillo:#F4C430; --amarillo-claro:#FFD84A; --rojo:#C62828; --rojo-oscuro:#941B1B; position:relative !important; display:grid !important; grid-template-columns: repeat(12,minmax(0,1fr)) !important; grid-template-rows: auto auto auto !important; column-gap: 28px !important; row-gap: 22px !important; width:100vw !important; max-width:100vw !important; left:50% !important; margin-left:-50vw !important; margin-right:-50vw !important; padding: 78px max(5%,calc((100vw - 1450px)/2)) 85px !important; overflow:hidden !important; background: radial-gradient( circle at 4% 5%, rgba(255,216,74,.14), transparent 21% ), radial-gradient( circle at 96% 94%, rgba(198,40,40,.08), transparent 23% ), linear-gradient( 135deg, #FFFFFF 0%, #FBF8FD 58%, #F3EBF8 100% ) !important; font-family: "Segoe UI", Arial, sans-serif !important; } /* ============================================================ MUY IMPORTANTE ELEMENTOR NO INTERRUMPE EL GRID ============================================================ */ .sg-about > .e-con-inner{ display:contents !important; } /* ============================================================ DECORACIÓN SUPERIOR ============================================================ */ .sg-about::before{ content:""; position:absolute; width:520px; height:520px; top:-350px; right:-240px; border-radius:50%; background: radial-gradient( circle, rgba(91,44,131,.15), transparent 68% ); pointer-events:none; } /* ============================================================ LÍNEA INFERIOR ============================================================ */ .sg-about::after{ content:""; position:absolute; z-index:30; left:0; bottom:0; width:100%; height:5px; background: linear-gradient( 90deg, #35124F 0%, #5B2C83 34%, #F4C430 70%, #C62828 100% ); pointer-events:none; } /* ============================================================ TÍTULO OCUPA TODO EL ANCHO ============================================================ */ .sg-about-title{ position:relative !important; z-index:5; grid-column: 1 / 13 !important; grid-row: 1 !important; width:100% !important; max-width: 900px !important; margin: 0 auto 22px !important; padding-top: 44px !important; text-align: center !important; } /* ============================================================ BADGE ============================================================ */ .sg-about-title::before{ content:"CONOCE NUESTRA INSTITUCIÓN"; position:absolute; top:0; left:50%; transform: translateX(-50%); display:inline-flex; align-items:center; justify-content:center; padding: 9px 16px; white-space: nowrap; color: #35124F; background: linear-gradient( 135deg, #FFD84A, #F4C430 ); border-radius: 999px; box-shadow: 0 9px 23px rgba(53,18,79,.13); font-size: 8px; font-weight: 900; line-height:1; letter-spacing: 1.1px; text-transform: uppercase; } /* ============================================================ TÍTULO PRINCIPAL ============================================================ */ .sg-about-title .elementor-heading-title{ margin:0 !important; color: #35124F !important; font-family: "Segoe UI", Arial, sans-serif !important; font-size: clamp(42px,4.4vw,60px) !important; font-weight: 900 !important; line-height: 1.04 !important; letter-spacing: -1.7px !important; text-align: center !important; } /* ============================================================ LÍNEA DEL TÍTULO ============================================================ */ .sg-about-title::after{ content:""; display:block; width: 95px; height: 5px; margin: 20px auto 0; border-radius: 999px; background: linear-gradient( 90deg, #5B2C83, #F4C430 60%, #C62828 ); } /* ============================================================ TEXTO - COLUMNA IZQUIERDA ============================================================ */ .sg-about-text{ position:relative !important; z-index:5; grid-column: 1 / 6 !important; grid-row: 2 / 4 !important; width:100% !important; max-width:none !important; min-width:0 !important; margin:0 !important; padding:0 !important; align-self:stretch !important; display:flex !important; } /* ============================================================ CARD REAL DEL TEXTO ============================================================ */ .sg-about-text .elementor-widget-container{ position:relative !important; width:100% !important; height:100% !important; min-height: 510px !important; display:flex !important; flex-direction:column !important; justify-content:center !important; padding: 44px 38px !important; overflow:hidden !important; background: linear-gradient( 145deg, #5B2C83 0%, #35124F 62%, #250B36 100% ) !important; border: 1px solid rgba(255,255,255,.09) !important; border-radius: 27px !important; box-shadow: 0 24px 55px rgba(53,18,79,.18) !important; } /* ============================================================ LUZ INTERNA CARD ============================================================ */ .sg-about-text .elementor-widget-container::before{ content:""; position:absolute; width: 280px; height: 280px; right:-150px; top:-140px; border-radius:50%; background: radial-gradient( circle, rgba(255,216,74,.17), transparent 68% ); pointer-events:none; } /* ============================================================ BORDE INFERIOR DEL CARD ============================================================ */ .sg-about-text .elementor-widget-container::after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:6px; background: linear-gradient( 90deg, #FFD84A, #F4C430, #C62828 ); } /* ============================================================ TEXTO ============================================================ */ .sg-about-text, .sg-about-text p{ position:relative; z-index:3; color: rgba(255,255,255,.87) !important; font-family: "Segoe UI", Arial, sans-serif !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.8 !important; text-align: left !important; } .sg-about-text p{ margin: 0 0 16px !important; } .sg-about-text p:last-child{ margin-bottom: 0 !important; } .sg-about-text strong{ color: #FFD84A !important; font-weight: 800 !important; } /* ============================================================ TODAS LAS IMÁGENES ============================================================ */ .sg-about-img{ position:relative !important; z-index:5; top:auto !important; right:auto !important; bottom:auto !important; left:auto !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; transform: none !important; background: #FFFFFF !important; border: 5px solid #FFFFFF !important; border-radius: 24px !important; box-shadow: 0 20px 48px rgba(53,18,79,.15) !important; transition: transform .4s ease, box-shadow .4s ease !important; } /* ============================================================ FOTO PRINCIPAL ============================================================ */ .sg-about-img-1{ grid-column: 6 / 13 !important; grid-row: 2 !important; width: 100% !important; height: 310px !important; border-bottom: 6px solid #F4C430 !important; } /* ============================================================ FOTO SECUNDARIA 1 ============================================================ */ .sg-about-img-2{ grid-column: 6 / 9 !important; grid-row: 3 !important; width: 100% !important; height: 178px !important; border-bottom: 6px solid #C62828 !important; } /* ============================================================ FOTO SECUNDARIA 2 ============================================================ */ .sg-about-img-3{ grid-column: 9 / 13 !important; grid-row: 3 !important; width: 100% !important; height: 178px !important; border-bottom: 6px solid #7D4AA8 !important; } /* ============================================================ CONTENEDOR ELEMENTOR DE LAS FOTOS ============================================================ */ .sg-about-img .elementor-widget-container{ position:relative !important; width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; border-radius: 18px !important; } /* ============================================================ IMAGEN ============================================================ */ .sg-about-img img{ display:block !important; width: 100% !important; height: 100% !important; margin: 0 !important; object-fit: cover !important; object-position: center !important; border-radius: 18px !important; filter: saturate(.98) contrast(1.03); transition: transform .55s ease, filter .4s ease !important; } /* ============================================================ OVERLAY ============================================================ */ .sg-about-img::after{ content:""; position:absolute; z-index:3; inset:0; background: linear-gradient( 180deg, rgba(53,18,79,0) 48%, rgba(53,18,79,.14) 100% ); border-radius: 18px; pointer-events:none; } /* ============================================================ BADGE FOTO PRINCIPAL ============================================================ */ .sg-about-img-1::before{ content:"DIVINO JESÚS"; position:absolute; z-index:6; left:18px; bottom:18px; display:inline-flex; align-items:center; padding: 8px 12px; color: #35124F; background: #FFD84A; border-radius: 999px; box-shadow: 0 8px 20px rgba(53,18,79,.18); font-size: 8px; font-weight: 900; line-height: 1; letter-spacing: 1px; text-transform: uppercase; pointer-events:none; } /* ============================================================ ESQUINA FOTO PRINCIPAL ============================================================ */ .sg-about-img-1 .elementor-widget-container::before{ content:""; position:absolute; z-index:6; left: 18px; top: 18px; width: 55px; height: 55px; border-top: 4px solid #FFD84A; border-left: 4px solid #FFD84A; border-radius: 7px 0 0 0; pointer-events:none; } /* ============================================================ HOVER ============================================================ */ .sg-about-img:hover{ z-index: 20 !important; transform: translateY(-6px) !important; box-shadow: 0 30px 65px rgba(53,18,79,.22) !important; } .sg-about-img:hover img{ transform: scale(1.045); filter: saturate(1.05) contrast(1.04); } /* ============================================================ TABLET GRANDE ============================================================ */ @media(max-width:1100px){ .sg-about{ padding: 68px 4% 72px !important; column-gap: 22px !important; } .sg-about-text{ grid-column: 1 / 6 !important; } .sg-about-text .elementor-widget-container{ min-height: 470px !important; padding: 35px 30px !important; } .sg-about-img-1{ grid-column: 6 / 13 !important; height: 285px !important; } .sg-about-img-2{ grid-column: 6 / 9 !important; height: 162px !important; } .sg-about-img-3{ grid-column: 9 / 13 !important; height: 162px !important; } } /* ============================================================ TABLET ============================================================ */ @media(max-width:800px){ .sg-about{ grid-template-columns: repeat(2,minmax(0,1fr)) !important; grid-template-rows: auto !important; gap: 18px !important; padding: 58px 22px 65px !important; } /* TÍTULO */ .sg-about-title{ grid-column: 1 / -1 !important; grid-row: auto !important; margin-bottom: 18px !important; } /* TEXTO */ .sg-about-text{ grid-column: 1 / -1 !important; grid-row: auto !important; } .sg-about-text .elementor-widget-container{ min-height: auto !important; padding: 34px 30px 37px !important; } /* FOTO GRANDE */ .sg-about-img-1{ grid-column: 1 / -1 !important; grid-row: auto !important; height: 340px !important; margin-top: 4px !important; } /* DOS FOTOS PEQUEÑAS */ .sg-about-img-2{ grid-column: 1 !important; grid-row: auto !important; height: 220px !important; } .sg-about-img-3{ grid-column: 2 !important; grid-row: auto !important; height: 220px !important; } } /* ============================================================ MÓVIL ============================================================ */ @media(max-width:600px){ .sg-about{ grid-template-columns: 1fr !important; gap: 15px !important; padding: 48px 16px 55px !important; } /* TÍTULO */ .sg-about-title{ grid-column: 1 !important; padding-top: 41px !important; margin-bottom: 12px !important; } .sg-about-title .elementor-heading-title{ font-size: 34px !important; line-height: 1.06 !important; } .sg-about-title::before{ padding: 8px 12px; font-size: 7.5px; } .sg-about-title::after{ width: 75px; height: 4px; margin-top: 16px; } /* TEXTO */ .sg-about-text{ grid-column: 1 !important; grid-row: auto !important; } .sg-about-text .elementor-widget-container{ padding: 30px 23px 33px !important; border-radius: 21px !important; } .sg-about-text, .sg-about-text p{ font-size: 14px !important; line-height: 1.72 !important; } /* TODAS LAS FOTOS UNA DEBAJO DE OTRA */ .sg-about-img-1, .sg-about-img-2, .sg-about-img-3{ grid-column: 1 !important; grid-row: auto !important; width: 100% !important; } .sg-about-img-1{ height: 295px !important; margin-top: 5px !important; } .sg-about-img-2, .sg-about-img-3{ height: 210px !important; } } /* ============================================================ MÓVIL PEQUEÑO ============================================================ */ @media(max-width:420px){ .sg-about{ padding: 42px 13px 50px !important; } .sg-about-title .elementor-heading-title{ font-size: 30px !important; } .sg-about-text .elementor-widget-container{ padding: 27px 19px 30px !important; } .sg-about-img-1{ height: 260px !important; } .sg-about-img-2, .sg-about-img-3{ height: 185px !important; } } /* ============================================================ ACCESIBILIDAD ============================================================ */ @media(prefers-reduced-motion:reduce){ .sg-about-img, .sg-about-img img{ transition: none !important; } } /* ============================================================ EVITAR SCROLL HORIZONTAL ============================================================ */ html, body{ max-width: 100% !important; overflow-x: hidden !important; } /* ============================================================ CORRECCIÓN DEL BLOQUE DE TEXTO FONDO CLARO + TEXTO MORADO ============================================================ */ .sg-about-text{ background:transparent !important; } /* CARD DEL TEXTO */ .sg-about-text .elementor-widget-container{ position:relative !important; width:100% !important; height:100% !important; min-height:510px !important; display:flex !important; flex-direction:column !important; justify-content:center !important; padding:44px 40px !important; overflow:hidden !important; background: linear-gradient( 145deg, #FFFFFF 0%, #FCF9FD 58%, #F5EDF8 100% ) !important; border: 1px solid rgba(91,44,131,.13) !important; border-left: 5px solid #5B2C83 !important; border-radius: 27px !important; box-shadow: 0 22px 55px rgba(53,18,79,.13) !important; } /* DECORACIÓN SUPERIOR */ .sg-about-text .elementor-widget-container::before{ content:""; position:absolute; width:240px; height:240px; top:-135px; right:-120px; border-radius:50%; background: radial-gradient( circle, rgba(244,196,48,.18), transparent 68% ); pointer-events:none; } /* FRANJA INFERIOR */ .sg-about-text .elementor-widget-container::after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:5px; background: linear-gradient( 90deg, #5B2C83 0%, #F4C430 65%, #C62828 100% ); pointer-events:none; } /* ============================================================ TEXTO ============================================================ */ .sg-about-text, .sg-about-text p, .sg-about-text .elementor-widget-container, .sg-about-text .elementor-widget-container p{ position:relative; z-index:3; color:#514657 !important; -webkit-text-fill-color:#514657 !important; font-family: "Segoe UI", Arial, sans-serif !important; font-size:15px !important; font-weight:400 !important; line-height:1.82 !important; text-align:left !important; } /* PÁRRAFOS */ .sg-about-text p, .sg-about-text .elementor-widget-container p{ margin:0 0 17px !important; } .sg-about-text p:last-child, .sg-about-text .elementor-widget-container p:last-child{ margin-bottom:0 !important; } /* ============================================================ TEXTO DESTACADO ============================================================ */ .sg-about-text strong, .sg-about-text b{ color:#5B2C83 !important; -webkit-text-fill-color:#5B2C83 !important; font-weight:800 !important; } /* ADMISION 2027 O TEXTO DESTACADO */ .sg-about-text strong:last-child{ color:#C62828 !important; -webkit-text-fill-color:#C62828 !important; } /* ============================================================ LINKS DENTRO DEL TEXTO ============================================================ */ .sg-about-text a{ color:#5B2C83 !important; -webkit-text-fill-color:#5B2C83 !important; font-weight:700 !important; text-decoration:none !important; border-bottom: 2px solid #F4C430; } /* ============================================================ MÓVIL ============================================================ */ @media(max-width:600px){ .sg-about-text .elementor-widget-container{ min-height:auto !important; padding: 29px 23px 32px !important; border-radius: 20px !important; } .sg-about-text, .sg-about-text p, .sg-about-text .elementor-widget-container, .sg-about-text .elementor-widget-container p{ font-size: 14px !important; line-height: 1.72 !important; } } /* ============================================================ MEJORA DEFINITIVA CARD DE TEXTO INSTITUCIONAL MORADO + AMARILLO + ROJO ============================================================ */ /* CONTENEDOR GENERAL DEL TEXTO */ .sg-about-text{ position:relative !important; z-index:8 !important; display:flex !important; width:100% !important; max-width:none !important; margin:0 !important; padding:0 !important; align-self:stretch !important; } /* ============================================================ CARD MORADO REAL ============================================================ */ .sg-about-text .elementor-widget-container{ position:relative !important; display:flex !important; flex-direction:column !important; justify-content:center !important; width:100% !important; height:100% !important; min-height:355px !important; padding:45px 38px 42px !important; overflow:hidden !important; background: radial-gradient( circle at 100% 0%, rgba(255,216,74,.18), transparent 28% ), radial-gradient( circle at 0% 100%, rgba(198,40,40,.10), transparent 30% ), linear-gradient( 145deg, #5B2C83 0%, #35124F 58%, #250B36 100% ) !important; border: 1px solid rgba(255,255,255,.12) !important; border-radius: 24px !important; box-shadow: 0 22px 50px rgba(53,18,79,.18), inset 0 1px 0 rgba(255,255,255,.07) !important; } /* ============================================================ BORDE LATERAL AMARILLO ============================================================ */ .sg-about-text .elementor-widget-container::before{ content:""; position:absolute; left:0; top:30px; bottom:30px; width:5px; border-radius: 0 999px 999px 0; background: linear-gradient( 180deg, #FFD84A 0%, #F4C430 65%, #C62828 100% ); box-shadow: 3px 0 18px rgba(244,196,48,.18); pointer-events:none; } /* ============================================================ DECORACIÓN CIRCULAR ============================================================ */ .sg-about-text::before{ content:""; position:absolute; z-index:1; width:230px; height:230px; top:-115px; right:-115px; border-radius:50%; border: 1px solid rgba(255,255,255,.08); background: radial-gradient( circle, rgba(255,216,74,.12), transparent 67% ); pointer-events:none; } /* ============================================================ ETIQUETA SUPERIOR ============================================================ */ .sg-about-text::after{ content:"INFORMACIÓN INSTITUCIONAL"; position:absolute; z-index:5; top:20px; left:38px; display:inline-flex; align-items:center; justify-content:center; padding: 7px 11px; color: #35124F; background: linear-gradient( 135deg, #FFD84A, #F4C430 ); border-radius: 999px; font-family: "Segoe UI", Arial, sans-serif; font-size: 7px; font-weight: 900; line-height: 1; letter-spacing: 1px; text-transform: uppercase; box-shadow: 0 8px 20px rgba(25,4,37,.18); pointer-events:none; } /* ============================================================ TEXTO ============================================================ */ .sg-about-text .elementor-widget-container, .sg-about-text .elementor-widget-container p, .sg-about-text p{ position:relative !important; z-index:3 !important; color: rgba(255,255,255,.88) !important; -webkit-text-fill-color: rgba(255,255,255,.88) !important; font-family: "Segoe UI", Arial, sans-serif !important; font-size: 14.5px !important; font-weight: 400 !important; line-height: 1.8 !important; text-align: left !important; } /* ESPACIO PARA LA ETIQUETA */ .sg-about-text .elementor-widget-container{ padding-top: 65px !important; } /* PÁRRAFOS */ .sg-about-text p{ margin: 0 0 20px !important; } .sg-about-text p:last-child{ margin-bottom: 0 !important; } /* ============================================================ DESTACADOS ============================================================ */ .sg-about-text strong, .sg-about-text b{ color: #FFD84A !important; -webkit-text-fill-color: #FFD84A !important; font-weight: 800 !important; } /* ADMISION 2027 CON MÁS FUERZA */ .sg-about-text strong:last-child, .sg-about-text b:last-child{ color: #FFD84A !important; -webkit-text-fill-color: #FFD84A !important; text-shadow: 0 0 18px rgba(255,216,74,.18); } /* ============================================================ LINKS ============================================================ */ .sg-about-text a{ color: #FFD84A !important; -webkit-text-fill-color: #FFD84A !important; font-weight: 700 !important; text-decoration: none !important; border-bottom: 1px solid rgba(255,216,74,.55); } /* ============================================================ HOVER SUAVE DEL CARD ============================================================ */ .sg-about-text .elementor-widget-container{ transition: transform .35s ease, box-shadow .35s ease !important; } .sg-about-text:hover .elementor-widget-container{ transform: translateY(-4px); box-shadow: 0 30px 65px rgba(53,18,79,.24), inset 0 1px 0 rgba(255,255,255,.08) !important; } /* ============================================================ AJUSTE DE ALINEACIÓN CON LAS FOTOS ============================================================ */ .sg-about-text{ min-height: 100% !important; } /* ============================================================ TABLET ============================================================ */ @media(max-width:800px){ .sg-about-text .elementor-widget-container{ min-height:auto !important; padding: 62px 30px 35px !important; border-radius: 22px !important; } } /* ============================================================ MÓVIL ============================================================ */ @media(max-width:600px){ .sg-about-text .elementor-widget-container{ padding: 58px 22px 30px !important; border-radius: 19px !important; } .sg-about-text::after{ top: 18px; left: 22px; font-size: 6.8px; } .sg-about-text .elementor-widget-container, .sg-about-text .elementor-widget-container p, .sg-about-text p{ font-size: 14px !important; line-height: 1.72 !important; } .sg-about-text .elementor-widget-container::before{ top: 24px; bottom: 24px; width: 4px; } } /* ============================================================ FIX DEFINITIVO - BLOQUE INSTITUCIONAL IZQUIERDO IESTP DIVINO JESÚS MORADO + AMARILLO + ROJO PEGAR AL FINAL DE TODO EL CSS ============================================================ */ /* ============================================================ CONTENEDOR MORADO ============================================================ */ .sg-about .sg-about-text{ position:relative !important; z-index:10 !important; display:flex !important; flex-direction:column !important; justify-content:center !important; width:100% !important; max-width:none !important; min-height:338px !important; margin:0 !important; padding: 68px 34px 38px !important; overflow:hidden !important; background: radial-gradient( circle at 100% 0%, rgba(255,216,74,.18), transparent 30% ), radial-gradient( circle at 0% 100%, rgba(198,40,40,.13), transparent 32% ), linear-gradient( 145deg, #6C358F 0%, #5B2C83 32%, #41185F 67%, #2B0D40 100% ) !important; border: 1px solid rgba(255,255,255,.14) !important; border-left: 6px solid #F4C430 !important; border-radius: 24px !important; box-shadow: 0 24px 55px rgba(53,18,79,.22), inset 0 1px 0 rgba(255,255,255,.08) !important; } /* ============================================================ QUITAR CUALQUIER FONDO BLANCO INTERNO DE ELEMENTOR ============================================================ */ .sg-about .sg-about-text .elementor-widget-container{ position:relative !important; z-index:3 !important; width:100% !important; height:auto !important; min-height:0 !important; margin:0 !important; padding:0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } /* ============================================================ LUZ DECORATIVA ============================================================ */ .sg-about .sg-about-text::before{ content:""; position:absolute; z-index:1; width:270px; height:270px; right:-135px; top:-145px; border-radius:50%; background: radial-gradient( circle, rgba(255,216,74,.20) 0%, rgba(255,216,74,.06) 40%, transparent 70% ); pointer-events:none; } /* ============================================================ ETIQUETA ============================================================ */ .sg-about .sg-about-text::after{ content:"INFORMACIÓN INSTITUCIONAL"; position:absolute; z-index:20; top:22px; left:34px; display:inline-flex; align-items:center; justify-content:center; padding: 8px 13px; color: #35124F !important; -webkit-text-fill-color: #35124F !important; background: linear-gradient( 135deg, #FFD84A, #F4C430 ) !important; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; box-shadow: 0 8px 20px rgba(25,4,37,.20); font-family: "Segoe UI", Arial, sans-serif; font-size: 7px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 1px; text-transform: uppercase; pointer-events:none; } /* ============================================================ IMPORTANTE: FORZAR TODO EL TEXTO A BLANCO ============================================================ */ .sg-about .sg-about-text, .sg-about .sg-about-text p, .sg-about .sg-about-text span, .sg-about .sg-about-text div, .sg-about .sg-about-text li, .sg-about .sg-about-text .elementor-widget-container, .sg-about .sg-about-text .elementor-widget-container p, .sg-about .sg-about-text .elementor-widget-container span{ color: rgba(255,255,255,.92) !important; -webkit-text-fill-color: rgba(255,255,255,.92) !important; font-family: "Segoe UI", Arial, sans-serif !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.75 !important; text-align: left !important; } /* ============================================================ PÁRRAFOS ============================================================ */ .sg-about .sg-about-text p{ position:relative !important; z-index:5 !important; margin: 0 0 20px !important; } .sg-about .sg-about-text p:last-child{ margin-bottom: 0 !important; } /* ============================================================ DESTACADOS EN AMARILLO ============================================================ */ .sg-about .sg-about-text strong, .sg-about .sg-about-text b, .sg-about .sg-about-text strong *, .sg-about .sg-about-text b *{ color: #FFD84A !important; -webkit-text-fill-color: #FFD84A !important; font-weight: 800 !important; } /* ============================================================ LINKS ============================================================ */ .sg-about .sg-about-text a{ color: #FFD84A !important; -webkit-text-fill-color: #FFD84A !important; font-weight: 750 !important; text-decoration: none !important; border-bottom: 1px solid rgba(255,216,74,.60); } /* ============================================================ FRANJA INFERIOR ============================================================ */ .sg-about .sg-about-text .elementor-widget-container::after{ content:""; position:absolute; left:0; bottom:-38px; width:100%; height:5px; background: linear-gradient( 90deg, #FFD84A 0%, #F4C430 55%, #C62828 100% ); border-radius: 999px; } /* ============================================================ PEQUEÑOS DETALLES CIRCULARES ============================================================ */ .sg-about .sg-about-text .elementor-widget-container::before{ content:""; position:absolute; z-index:5; right:2px; bottom:-20px; width:7px; height:7px; border-radius:50%; background: #FFD84A; box-shadow: 14px 0 0 rgba(255,216,74,.45), 28px 0 0 #C62828; pointer-events:none; } /* ============================================================ HOVER MUY SUAVE ============================================================ */ .sg-about .sg-about-text{ transition: transform .35s ease, box-shadow .35s ease !important; } .sg-about .sg-about-text:hover{ transform: translateY(-4px) !important; box-shadow: 0 30px 70px rgba(53,18,79,.28), inset 0 1px 0 rgba(255,255,255,.09) !important; } /* ============================================================ AJUSTAR FOTO PRINCIPAL PARA QUE EMPATE VISUALMENTE ============================================================ */ .sg-about .sg-about-img-1{ box-shadow: 0 22px 52px rgba(53,18,79,.17) !important; } /* ============================================================ TABLET ============================================================ */ @media(max-width:800px){ .sg-about .sg-about-text{ min-height:auto !important; padding: 64px 30px 35px !important; border-radius: 22px !important; } .sg-about .sg-about-text::after{ left: 30px; } } /* ============================================================ MÓVIL ============================================================ */ @media(max-width:600px){ .sg-about .sg-about-text{ padding: 59px 22px 31px !important; border-left-width: 5px !important; border-radius: 20px !important; } .sg-about .sg-about-text::after{ top: 18px; left: 22px; padding: 7px 10px; font-size: 6.5px !important; } .sg-about .sg-about-text, .sg-about .sg-about-text p, .sg-about .sg-about-text span, .sg-about .sg-about-text div, .sg-about .sg-about-text li{ font-size: 13.5px !important; line-height: 1.7 !important; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-21c64976 *//* ============================================================ REQUISITOS DE ADMISIÓN - TARJETAS CON FONDO MORADO PREMIUM IESTP DIVINO JESÚS ============================================================ */ /* ============================================================ CONTENEDOR GENERAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-21c64976 { --morado: #5B2C83; --morado-oscuro: #35124F; --morado-profundo: #250B36; --morado-claro: #7D4AA8; --amarillo: #F4C430; --amarillo-claro: #FFD84A; --rojo: #C62828; position: relative !important; isolation: isolate; width: 100vw !important; max-width: 100vw !important; left: 50% !important; margin-left: -50vw !important; margin-right: -50vw !important; padding: 80px 5% 90px !important; overflow: hidden !important; background: radial-gradient(circle at 10% 20%, rgba(91, 44, 131, 0.08), transparent 40%), radial-gradient(circle at 90% 80%, rgba(244, 196, 48, 0.08), transparent 40%), linear-gradient(135deg, #FFFFFF 0%, #FAF7FC 50%, #F4EBF9 100%) !important; font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif !important; /* REINICIAR CONTADOR EN 0 */ counter-reset: req-counter 0; } /* FRANJA INFERIOR */ .elementor-297 .elementor-element.elementor-element-21c64976::after { content: ""; position: absolute; z-index: 20; left: 0; bottom: 0; width: 100%; height: 6px; background: linear-gradient(90deg, #35124F 0%, #5B2C83 35%, #F4C430 70%, #C62828 100%); } /* ============================================================ GRID Y CONTENEDOR INTERNO ============================================================ */ .elementor-297 .elementor-element.elementor-element-21c64976 .req-grid, .elementor-297 .elementor-element.elementor-element-21c64976 .req-grid > .e-con-inner { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 24px !important; width: 100% !important; max-width: 1350px !important; margin: 0 auto !important; padding: 0 !important; } /* ============================================================ ESTILO DE TARJETAS EN FONDO MORADO ============================================================ */ .elementor-297 .elementor-element.elementor-element-21c64976 .req-card { /* CONTADOR AUTOMÁTICO */ counter-increment: req-counter; position: relative !important; isolation: isolate; display: flex !important; flex-direction: column !important; justify-content: flex-start !important; width: 100% !important; min-height: 240px !important; margin: 0 !important; padding: 75px 24px 28px !important; /* FONDO DE GRADIENTE MORADO INSTITUCIONAL */ background: linear-gradient(145deg, #35124F 0%, #250B36 100%) !important; border-radius: 22px !important; border: 1px solid rgba(255, 255, 255, 0.12) !important; border-top: 4px solid #FFD84A !important; /* LÍNEA DUPERIOR EN DORADO */ box-shadow: 0 15px 35px rgba(37, 11, 54, 0.25) !important; transition: all 0.35s cubic-bezier(0.165, 0.84, 0.44, 1) !important; overflow: hidden !important; } /* DECORACIÓN DE FONDO DENTRO DE LA TARJETA */ .elementor-297 .elementor-element.elementor-element-21c64976 .req-card::after { content: ""; position: absolute; top: -40px; right: -40px; width: 120px; height: 120px; background: radial-gradient(circle, rgba(255, 216, 74, 0.12) 0%, transparent 70%); pointer-events: none; } /* ============================================================ NÚMEROS EN CAJA DE CRISTAL / DORADO (01, 02, 03...) ============================================================ */ .elementor-297 .elementor-element.elementor-element-21c64976 .req-card::before { content: counter(req-counter, decimal-leading-zero) !important; position: absolute !important; z-index: 5; left: 22px !important; top: 20px !important; width: 44px !important; height: 44px !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #250B36 !important; /* TEXTO OSCURO PARA CONTRASTE */ background: linear-gradient(135deg, #FFD84A 0%, #F4C430 100%) !important; border-radius: 12px !important; box-shadow: 0 8px 18px rgba(0, 0, 0, 0.25) !important; font-family: "Plus Jakarta Sans", sans-serif !important; font-size: 15px !important; font-weight: 900 !important; line-height: 1 !important; } /* ============================================================ EFECTO HOVER DE LAS TARJETAS MORADAS ============================================================ */ .elementor-297 .elementor-element.elementor-element-21c64976 .req-card:hover { transform: translateY(-8px) !important; background: linear-gradient(145deg, #421663 0%, #2A0B3D 100%) !important; border-color: #FFD84A !important; box-shadow: 0 22px 45px rgba(37, 11, 54, 0.4) !important; } .elementor-297 .elementor-element.elementor-element-21c64976 .req-card:hover::before { transform: scale(1.1) rotate(-3deg) !important; } /* ============================================================ TIPOGRAFÍA Y TEXTOS (EN BLANCO Y AMARILLO) ============================================================ */ /* TÍTULOS DE CADA TARJETA */ .elementor-297 .elementor-element.elementor-element-21c64976 .req-card strong, .elementor-297 .elementor-element.elementor-element-21c64976 .req-card h2, .elementor-297 .elementor-element.elementor-element-21c64976 .req-card h3, .elementor-297 .elementor-element.elementor-element-21c64976 .req-card h4 { display: block !important; margin: 0 0 10px !important; color: #FFFFFF !important; font-size: 17px !important; font-weight: 800 !important; line-height: 1.3 !important; letter-spacing: -0.3px !important; } /* DESCRIPCIÓN Y TEXTO INTERNO */ .elementor-297 .elementor-element.elementor-element-21c64976 .req-card, .elementor-297 .elementor-element.elementor-element-21c64976 .req-card p, .elementor-297 .elementor-element.elementor-element-21c64976 .req-card span { color: rgba(255, 255, 255, 0.82) !important; font-size: 13.5px !important; font-weight: 400 !important; line-height: 1.6 !important; } /* ============================================================ ADAPTABILIDAD RESPONSIVA (MÓVIL Y TABLET) ============================================================ */ @media (max-width: 1100px) { .elementor-297 .elementor-element.elementor-element-21c64976 .req-grid, .elementor-297 .elementor-element.elementor-element-21c64976 .req-grid > .e-con-inner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } @media (max-width: 767px) { .elementor-297 .elementor-element.elementor-element-21c64976 .req-grid, .elementor-297 .elementor-element.elementor-element-21c64976 .req-grid > .e-con-inner { grid-template-columns: 1fr !important; } .elementor-297 .elementor-element.elementor-element-21c64976 .req-card { padding: 70px 20px 24px !important; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-7087f38 *//* ============================================================ CRONOGRAMA / FECHAS IMPORTANTES IESTP DIVINO JESÚS NUEVO DISEÑO MODERNO Y ESTABLE MISMAS CLASES / MISMOS ELEMENTOS PALETA: MORADO PRINCIPAL #5B2C83 MORADO OSCURO #35124F MORADO PROFUNDO #250B36 MORADO CLARO #7D4AA8 AMARILLO #F4C430 AMARILLO CLARO #FFD84A ROJO #C62828 ============================================================ */ /* ============================================================ RESET INTERNO ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38, .elementor-297 .elementor-element.elementor-element-7087f38 *, .elementor-297 .elementor-element.elementor-element-7087f38 *::before, .elementor-297 .elementor-element.elementor-element-7087f38 *::after{ box-sizing:border-box; } /* ============================================================ SECCIÓN PRINCIPAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38{ --morado:#5B2C83; --morado-oscuro:#35124F; --morado-profundo:#250B36; --morado-claro:#7D4AA8; --amarillo:#F4C430; --amarillo-claro:#FFD84A; --rojo:#C62828; --rojo-oscuro:#941B1B; position:relative !important; isolation:isolate; width:100vw !important; max-width:100vw !important; left:50% !important; margin-left:-50vw !important; margin-right:-50vw !important; padding:82px 5% 92px !important; overflow:hidden !important; background: linear-gradient( rgba(255,255,255,.022) 1px, transparent 1px ), linear-gradient( 90deg, rgba(255,255,255,.022) 1px, transparent 1px ), radial-gradient( circle at 5% 7%, rgba(255,216,74,.15), transparent 23% ), radial-gradient( circle at 95% 92%, rgba(198,40,40,.11), transparent 25% ), linear-gradient( 135deg, #5B2C83 0%, #35124F 55%, #250B36 100% ) !important; background-size: 42px 42px, 42px 42px, auto, auto, auto !important; font-family: "Segoe UI", Arial, sans-serif !important; } /* ============================================================ INNER GENERAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 > .e-con-inner{ width:100% !important; max-width:1380px !important; margin:0 auto !important; padding:0 !important; } /* ============================================================ DECORACIÓN DE FONDO ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38::before{ content:""; position:absolute; z-index:0; width:540px; height:540px; top:-370px; right:-250px; border-radius:50%; background: radial-gradient( circle, rgba(255,216,74,.16), rgba(125,74,168,.08) 42%, transparent 70% ); pointer-events:none; } /* ============================================================ FRANJA INFERIOR ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38::after{ content:""; position:absolute; z-index:30; left:0; bottom:0; width:100%; height:5px; background: linear-gradient( 90deg, #7D4AA8 0%, #5B2C83 30%, #FFD84A 68%, #C62828 100% ); pointer-events:none; } /* ============================================================ TÍTULO GENERAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-title{ position:relative !important; z-index:5; width:100% !important; max-width:950px !important; margin:0 auto 14px !important; text-align:center !important; } /* ============================================================ BADGE ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-title::before{ content:"FECHAS IMPORTANTES"; display:inline-flex; align-items:center; justify-content:center; margin-bottom:18px; padding:9px 15px; color:#35124F !important; background: linear-gradient( 135deg, #FFD84A, #F4C430 ) !important; border-radius:999px; border: 1px solid rgba(255,255,255,.28); box-shadow: 0 9px 22px rgba(25,4,37,.22); font-size:8px; font-weight:900; line-height:1; letter-spacing:1.1px; text-transform:uppercase; } /* ============================================================ TÍTULO PRINCIPAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-title .elementor-heading-title{ margin:0 !important; color:#FFFFFF !important; -webkit-text-fill-color:#FFFFFF !important; font-size: clamp(42px,4.5vw,60px) !important; font-weight:900 !important; line-height:1.04 !important; letter-spacing:-1.6px !important; text-align:center !important; text-shadow: 0 6px 24px rgba(25,4,37,.28) !important; } /* ============================================================ LÍNEA DEL TÍTULO ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-title::after{ content:""; display:block; width:95px; height:5px; margin: 19px auto 0; border-radius:999px; background: linear-gradient( 90deg, #FFD84A, #F4C430 60%, #C62828 ); } /* ============================================================ INTRODUCCIÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-intro{ position:relative !important; z-index:5; width:100% !important; max-width:800px !important; margin: 0 auto 48px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-intro, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-intro p{ color: rgba(255,255,255,.86) !important; -webkit-text-fill-color: rgba(255,255,255,.86) !important; font-size:15px !important; font-weight:400 !important; line-height:1.8 !important; text-align:center !important; margin-bottom:0 !important; } /* ============================================================ LISTA PRINCIPAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list{ position:relative !important; z-index:5; counter-reset:paso; display:grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap:22px !important; width:100% !important; max-width:1180px !important; margin:0 auto !important; padding:0 !important; } /* ============================================================ SI ELEMENTOR GENERA E-CON-INNER ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner{ counter-reset:paso; display:grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap:22px !important; width:100% !important; max-width:1180px !important; margin:0 auto !important; padding:0 !important; } /* ============================================================ TARJETA SE APLICA DIRECTAMENTE AL CRONO-ITEM ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item{ --accent:#5B2C83; --accent-dark:#35124F; --accent-soft:rgba(91,44,131,.12); counter-increment:paso; position:relative !important; z-index:2; display:block !important; width:100% !important; max-width:none !important; min-width:0 !important; min-height:225px !important; margin:0 !important; padding: 78px 28px 28px !important; overflow:hidden !important; background: linear-gradient( 145deg, #FFFFFF 0%, #FCF9FD 62%, #F5EDF8 100% ) !important; border: 1px solid rgba(255,255,255,.55) !important; border-top: 5px solid var(--accent) !important; border-radius: 23px !important; box-shadow: 0 20px 48px rgba(25,4,37,.20) !important; transform:none !important; transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease !important; } /* ============================================================ QUITAR FLEX / POSICIONES HEREDADAS DE ELEMENTOR ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item > .e-con-inner{ position:relative !important; display:block !important; width:100% !important; margin:0 !important; padding:0 !important; gap:0 !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item .elementor-element{ position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; width:auto !important; max-width:100% !important; margin-left:0 !important; margin-right:0 !important; } /* ============================================================ WIDGET CONTAINER IMPORTANTE: SIN FONDOS NI POSICIONES ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item .elementor-widget-container{ position:relative !important; z-index:3 !important; display:block !important; width:100% !important; min-height:0 !important; margin:0 !important; padding:0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; transform:none !important; overflow:visible !important; } /* ============================================================ QUITAR LÍNEA VERTICAL DEL DISEÑO ANTERIOR ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item::after{ content:""; position:absolute; z-index:1; width:170px; height:170px; top:-100px; right:-90px; border-radius:50%; background: radial-gradient( circle, var(--accent-soft), transparent 70% ); pointer-events:none; } /* ============================================================ NÚMERO ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item::before{ content: counter(paso,decimal-leading-zero); position:absolute !important; z-index:10 !important; left:25px !important; top:22px !important; width:46px !important; height:46px !important; display:flex !important; align-items:center !important; justify-content:center !important; color:#FFFFFF !important; -webkit-text-fill-color:#FFFFFF !important; background: linear-gradient( 135deg, var(--accent), var(--accent-dark) ) !important; border: 2px solid #FFFFFF !important; border-radius: 14px !important; box-shadow: 0 10px 22px rgba(53,18,79,.18), 0 0 0 5px var(--accent-soft) !important; font-size:14px !important; font-weight:900 !important; line-height:1 !important; transform:none !important; opacity:1 !important; visibility:visible !important; } /* ============================================================ FECHA YA NO ES ABSOLUTA ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item .crono-date{ position:relative !important; z-index:5 !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; display:inline-flex !important; align-items:center !important; width:max-content !important; max-width:100% !important; margin: 0 0 14px !important; padding: 7px 12px !important; color: #35124F !important; -webkit-text-fill-color: #35124F !important; background: linear-gradient( 135deg, #FFD84A, #F4C430 ) !important; border:0 !important; border-radius: 999px !important; box-shadow: 0 7px 18px rgba(244,196,48,.18) !important; font-size: 10px !important; font-weight: 850 !important; line-height: 1.25 !important; letter-spacing: .2px !important; text-align: left !important; text-transform: uppercase !important; } /* ============================================================ TÍTULOS ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h1, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h2, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h3, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h4, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h5, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h6, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item .elementor-heading-title, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item strong, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item b{ position:relative !important; z-index:4 !important; display:block !important; margin: 0 0 9px !important; padding:0 !important; color: #35124F !important; -webkit-text-fill-color: #35124F !important; font-family: "Segoe UI", Arial, sans-serif !important; font-size: 18px !important; font-weight: 850 !important; line-height: 1.3 !important; letter-spacing: -.2px !important; text-align: left !important; } /* ============================================================ TEXTO FORZADO A COLOR VISIBLE ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item p, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item span:not(.crono-date), .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item li, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item div, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item .elementor-text-editor, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item .elementor-widget-text-editor{ color: #665B6C !important; -webkit-text-fill-color: #665B6C !important; font-family: "Segoe UI", Arial, sans-serif !important; font-size: 13.5px !important; font-weight: 400 !important; line-height: 1.7 !important; text-align: left !important; } /* REFORZAR TÍTULOS DESPUÉS DEL RESET */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h1, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h2, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h3, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h4, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h5, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h6, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item strong, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item b{ color:#35124F !important; -webkit-text-fill-color: #35124F !important; } /* REFORZAR FECHA */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item .crono-date, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item .crono-date *{ color:#35124F !important; -webkit-text-fill-color: #35124F !important; } /* ============================================================ PÁRRAFOS ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item p{ margin: 0 0 8px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item p:last-child{ margin-bottom: 0 !important; } /* ============================================================ COLORES DE LAS ETAPAS ============================================================ */ /* 01 */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:nth-child(1), .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner > .crono-item:nth-child(1){ --accent:#5B2C83; --accent-dark:#35124F; --accent-soft:rgba(91,44,131,.14); } /* 02 */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:nth-child(2), .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner > .crono-item:nth-child(2){ --accent:#F4C430; --accent-dark:#D0A312; --accent-soft:rgba(244,196,48,.18); } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:nth-child(2)::before, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner > .crono-item:nth-child(2)::before{ color:#35124F !important; -webkit-text-fill-color:#35124F !important; } /* 03 */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:nth-child(3), .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner > .crono-item:nth-child(3){ --accent:#C62828; --accent-dark:#941B1B; --accent-soft:rgba(198,40,40,.14); } /* 04 */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:nth-child(4), .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner > .crono-item:nth-child(4){ --accent:#7D4AA8; --accent-dark:#5B2C83; --accent-soft:rgba(125,74,168,.15); } /* 05 */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:nth-child(5), .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner > .crono-item:nth-child(5){ --accent:#FFD84A; --accent-dark:#E4B71C; --accent-soft:rgba(255,216,74,.18); } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:nth-child(5)::before, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner > .crono-item:nth-child(5)::before{ color:#35124F !important; -webkit-text-fill-color:#35124F !important; } /* 06 */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:nth-child(6), .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner > .crono-item:nth-child(6){ --accent:#C62828; --accent-dark:#941B1B; --accent-soft:rgba(198,40,40,.14); } /* ============================================================ HOVER ============================================================ */ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:hover{ transform: translateY(-7px) !important; box-shadow: 0 30px 65px rgba(25,4,37,.28) !important; border-color: var(--accent) !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item:hover::before{ transform: scale(1.08) !important; } /* ============================================================ TABLET ============================================================ */ @media(max-width:950px){ .elementor-297 .elementor-element.elementor-element-7087f38{ padding: 66px 25px 74px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner{ gap: 18px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item{ min-height: 205px !important; padding: 75px 24px 25px !important; } } /* ============================================================ MÓVIL ============================================================ */ @media(max-width:767px){ .elementor-297 .elementor-element.elementor-element-7087f38{ padding: 54px 17px 62px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-title .elementor-heading-title{ font-size: 35px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-intro{ margin-bottom: 34px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-intro, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-intro p{ font-size: 14px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-list > .e-con-inner{ grid-template-columns: 1fr !important; gap: 15px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item{ min-height: auto !important; padding: 72px 21px 24px !important; border-radius: 19px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item::before{ left: 20px !important; top: 18px !important; width: 42px !important; height: 42px !important; font-size: 13px !important; } } /* ============================================================ CELULAR PEQUEÑO ============================================================ */ @media(max-width:480px){ .elementor-297 .elementor-element.elementor-element-7087f38{ padding: 47px 14px 55px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-title .elementor-heading-title{ font-size: 31px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-title::before{ font-size: 7px; padding: 8px 12px; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item{ padding: 70px 18px 22px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h1, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h2, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h3, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h4, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h5, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item h6, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item strong, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item b{ font-size: 16px !important; } .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item p, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item span:not(.crono-date), .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item li{ font-size: 13px !important; } } /* ============================================================ ACCESIBILIDAD ============================================================ */ @media(prefers-reduced-motion:reduce){ .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item, .elementor-297 .elementor-element.elementor-element-7087f38 .crono-item::before{ transition:none !important; } } /* ============================================================ EVITAR DESBORDAMIENTO ============================================================ */ html, body{ width:100%; max-width:100%; overflow-x:hidden !important; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-5b3e5fc7 */@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700;800;900&display=swap'); /* ============================================================ INFORMES E INSCRIPCIONES / CONTACTO IESTP DIVINO JESÚS MISMA ESTRUCTURA NUEVA PALETA INSTITUCIONAL MORADO PRINCIPAL #5B2C83 MORADO OSCURO #35124F MORADO PROFUNDO #250B36 MORADO CLARO #7D4AA8 AMARILLO #F4C430 AMARILLO CLARO #FFD84A ROJO #C62828 ROJO OSCURO #941B1B ============================================================ */ /* ============================================================ CONTENEDOR PRINCIPAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7{ --morado:#5B2C83; --morado-oscuro:#35124F; --morado-profundo:#250B36; --morado-claro:#7D4AA8; --amarillo:#F4C430; --amarillo-claro:#FFD84A; --rojo:#C62828; --rojo-oscuro:#941B1B; --blanco:#FFFFFF; --gris:#6D6372; position:relative !important; isolation:isolate; width:100vw !important; max-width:100vw !important; left:50% !important; margin-left:-50vw !important; margin-right:-50vw !important; padding:0 !important; overflow:hidden !important; display:grid !important; grid-template-columns: minmax(330px,40%) minmax(0,60%) !important; grid-template-areas: "left-title right-title" "left-text right-text" "left-text result-btn"; grid-template-rows: auto auto auto; align-items:center !important; min-height:560px !important; background: linear-gradient( 90deg, #5B2C83 0%, #35124F 40%, #FBF8FD 40%, #F3ECF7 100% ) !important; font-family: "Roboto", Arial, sans-serif !important; } /* ============================================================ LÍNEA SUPERIOR ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7::before{ content:""; position:absolute; z-index:30; top:0; left:0; width:100%; height:5px; background: linear-gradient( 90deg, #5B2C83 0%, #7D4AA8 30%, #FFD84A 67%, #C62828 100% ); pointer-events:none; } /* ============================================================ DECORACIÓN DE FONDO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7::after{ content:""; position:absolute; z-index:1; width:470px; height:470px; left:-260px; bottom:-280px; border-radius:50%; background: radial-gradient( circle, rgba(255,216,74,.18), rgba(198,40,40,.04) 43%, transparent 70% ); pointer-events:none; } /* ============================================================ INNER ELEMENTOR ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 > .e-con-inner{ width:100% !important; max-width:none !important; margin:0 !important; padding:0 !important; display:grid !important; grid-template-columns: minmax(330px,40%) minmax(0,60%) !important; grid-template-areas: "left-title right-title" "left-text right-text" "left-text result-btn"; grid-template-rows: auto auto auto; align-items:center !important; column-gap:0 !important; row-gap:0 !important; } /* ============================================================ RESET DE WIDGETS ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title, .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text, .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title, .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text, .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn{ --width:100% !important; position:relative !important; width:100% !important; max-width:none !important; margin:0 !important; z-index:5; } /* ============================================================ ÁREAS ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title{ grid-area:left-title !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text{ grid-area:left-text !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title{ grid-area:right-title !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text{ grid-area:right-text !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn{ grid-area:result-btn !important; } /* ============================================================ PANEL IZQUIERDO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title{ align-self:end !important; padding: 72px 45px 0 !important; text-align:center !important; } /* ============================================================ ICONO PRINCIPAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title::before{ content:"\f05a"; display:flex; align-items:center; justify-content:center; width:88px; height:88px; margin: 0 auto 26px; color: #35124F; background: linear-gradient( 135deg, #FFD84A, #F4C430 ); border: 1px solid rgba(255,255,255,.28); border-radius: 26px; box-shadow: 0 18px 38px rgba(25,4,37,.30), 0 0 0 9px rgba(255,216,74,.07); font-family: "Font Awesome 5 Free"; font-size: 36px; font-weight: 900; line-height:1; transition: transform .35s ease, box-shadow .35s ease; } /* ============================================================ TÍTULO IZQUIERDO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title .elementor-heading-title{ margin:0 !important; color:#FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; font-size: clamp(26px,2.4vw,36px) !important; font-weight: 900 !important; line-height: 1.15 !important; letter-spacing: -.7px !important; text-align: center !important; text-shadow: 0 5px 19px rgba(25,4,37,.28); } /* ============================================================ TEXTO IZQUIERDO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text{ align-self:start !important; padding: 18px 50px 72px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text, .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text p{ margin:0 !important; color: rgba(255,255,255,.87) !important; -webkit-text-fill-color: rgba(255,255,255,.87) !important; font-size: 14.5px !important; font-weight: 400 !important; line-height: 1.82 !important; text-align: left !important; } /* ============================================================ LÍNEA DECORATIVA IZQUIERDA ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text::after{ content:""; display:block; width:88px; height:5px; margin: 27px auto 0; border-radius: 999px; background: linear-gradient( 90deg, #FFD84A, #F4C430 62%, #C62828 ); } /* ============================================================ PANEL DERECHO - TÍTULO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title{ align-self:end !important; padding: 64px 7% 0 !important; text-align:left !important; } /* ============================================================ BADGE DERECHO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title::before{ content:"ADMISIÓN · ORIENTACIÓN"; display:inline-flex; align-items:center; justify-content:center; min-height:31px; margin-bottom: 17px; padding: 0 14px; color: #35124F; background: linear-gradient( 135deg, #FFD84A, #F4C430 ); border: 1px solid rgba(244,196,48,.28); border-radius: 999px; box-shadow: 0 8px 18px rgba(53,18,79,.10); font-size: 8px; font-weight: 900; letter-spacing: .9px; text-transform: uppercase; } /* ============================================================ TÍTULO DERECHO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title .elementor-heading-title{ max-width: 800px !important; margin: 0 !important; color: #35124F !important; -webkit-text-fill-color: #35124F !important; font-size: clamp(36px,3.5vw,50px) !important; font-weight: 900 !important; line-height: 1.07 !important; letter-spacing: -1.3px !important; text-align: left !important; } /* ============================================================ LÍNEA DE TÍTULO DERECHO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title::after{ content:""; display:block; width: 96px; height: 5px; margin-top: 18px; border-radius: 999px; background: linear-gradient( 90deg, #5B2C83, #F4C430 60%, #C62828 ); } /* ============================================================ CONTENEDOR DATOS ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text{ align-self:start !important; padding: 27px 7% 0 !important; } /* ============================================================ TARJETAS DE CONTACTO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p{ --icon:#5B2C83; --icon2:#35124F; --soft:rgba(91,44,131,.10); --icon-text:#FFFFFF; position:relative; display:flex; align-items:center; min-height: 68px; width:100%; max-width: 790px; margin: 0 0 13px !important; padding: 13px 18px 13px 73px !important; color: #625969 !important; -webkit-text-fill-color: #625969 !important; background: radial-gradient( circle at 100% 0, var(--soft), transparent 30% ), linear-gradient( 145deg, #FFFFFF, #FCF9FD ) !important; border: 1px solid rgba(91,44,131,.11); border-left: 4px solid var(--icon); border-radius: 16px; box-shadow: 0 10px 25px rgba(53,18,79,.08); font-size: 14px !important; font-weight: 500 !important; line-height: 1.55 !important; text-align: left !important; transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease; } /* ============================================================ ICONO BASE ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p::before{ content:"\f05a"; position:absolute; left: 15px; top: 50%; transform: translateY(-50%); width: 43px; height: 43px; display:flex; align-items:center; justify-content:center; color: var(--icon-text); -webkit-text-fill-color: var(--icon-text); background: linear-gradient( 135deg, var(--icon), var(--icon2) ); border: 1px solid rgba(255,255,255,.20); border-radius: 13px; box-shadow: 0 8px 19px var(--soft); font-family: "Font Awesome 5 Free"; font-size: 17px; font-weight: 900; line-height: 1; transition: transform .28s ease; } /* ============================================================ TELÉFONO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(1){ --icon:#5B2C83; --icon2:#35124F; --soft:rgba(91,44,131,.13); } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(1)::before{ content:"\f095"; } /* ============================================================ CORREO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(2){ --icon:#FFD84A; --icon2:#F4C430; --soft:rgba(244,196,48,.15); --icon-text:#35124F; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(2)::before{ content:"\f0e0"; } /* ============================================================ UBICACIÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(3){ --icon:#C62828; --icon2:#941B1B; --soft:rgba(198,40,40,.12); } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(3)::before{ content:"\f3c5"; } /* ============================================================ HORARIO ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(4){ --icon:#7D4AA8; --icon2:#5B2C83; --soft:rgba(125,74,168,.13); } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(4)::before{ content:"\f017"; } /* ============================================================ DOCUMENTO / INFORMACIÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(5){ --icon:#FFD84A; --icon2:#F4C430; --soft:rgba(255,216,74,.14); --icon-text:#35124F; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(5)::before{ content:"\f15c"; } /* ============================================================ MÁS FILAS ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(6n){ --icon:#C62828; --icon2:#941B1B; --soft:rgba(198,40,40,.12); } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:nth-of-type(6n)::before{ content:"\f086"; } /* ============================================================ HOVER TARJETAS ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:hover{ transform: translateX(6px); border-color: var(--icon); box-shadow: 0 17px 36px rgba(53,18,79,.13); } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:hover::before{ transform: translateY(-50%) scale(1.07); } /* ============================================================ BOTÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn{ align-self:start !important; justify-self:start !important; width:auto !important; padding: 19px 7% 66px !important; } /* ============================================================ BOTÓN PRINCIPAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn .elementor-button{ position:relative; display:inline-flex !important; align-items:center !important; justify-content:center !important; width:auto !important; min-height: 53px; padding: 0 25px !important; color: #35124F !important; -webkit-text-fill-color: #35124F !important; background: linear-gradient( 135deg, #FFD84A, #F4C430 ) !important; border: 1px solid rgba(244,196,48,.32) !important; border-radius: 13px !important; box-shadow: 0 13px 28px rgba(53,18,79,.14) !important; font-size: 12px !important; font-weight: 850 !important; line-height: 1 !important; text-decoration: none !important; transition: transform .3s ease, background .3s ease, color .3s ease, box-shadow .3s ease !important; } /* ============================================================ ICONO BOTÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn .elementor-button::before{ content:"\f15c"; margin-right: 10px; font-family: "Font Awesome 5 Free"; font-size: 15px; font-weight: 900; line-height: 1; } /* ============================================================ FLECHA BOTÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn .elementor-button::after{ content:"→"; display:inline-block; margin-left: 10px; font-size: 17px; line-height: 1; transition: transform .3s ease; } /* ============================================================ HOVER BOTÓN ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn .elementor-button:hover{ color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; background: linear-gradient( 135deg, #C62828, #941B1B ) !important; transform: translateY(-4px); box-shadow: 0 18px 36px rgba(53,18,79,.22) !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn .elementor-button:hover::after{ transform: translateX(4px); } /* ============================================================ HOVER ICONO PRINCIPAL ============================================================ */ .elementor-297 .elementor-element.elementor-element-5b3e5fc7:hover .rs-left-title::before{ transform: translateY(-6px) rotate(-3deg); box-shadow: 0 24px 48px rgba(25,4,37,.36), 0 0 0 11px rgba(255,216,74,.08); } /* ============================================================ TABLET ============================================================ */ @media(max-width:1024px){ .elementor-297 .elementor-element.elementor-element-5b3e5fc7, .elementor-297 .elementor-element.elementor-element-5b3e5fc7 > .e-con-inner{ grid-template-columns: minmax(290px,39%) minmax(0,61%) !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7{ background: linear-gradient( 90deg, #5B2C83 0%, #35124F 39%, #FBF8FD 39%, #F2EAF6 100% ) !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title{ padding: 58px 30px 0 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text{ padding: 15px 33px 58px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text, .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text p{ font-size: 14px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title{ padding: 57px 5% 0 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text{ padding: 24px 5% 0 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn{ padding: 18px 5% 52px !important; } } /* ============================================================ MÓVIL ============================================================ */ @media(max-width:767px){ .elementor-297 .elementor-element.elementor-element-5b3e5fc7, .elementor-297 .elementor-element.elementor-element-5b3e5fc7 > .e-con-inner{ grid-template-columns: 1fr !important; grid-template-areas: "left-title" "left-text" "right-title" "right-text" "result-btn" !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7{ min-height: auto !important; background: linear-gradient( 180deg, #5B2C83 0%, #35124F 40%, #FBF8FD 40%, #F2EAF6 100% ) !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title{ padding: 48px 23px 0 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title::before{ width: 74px; height: 74px; margin-bottom: 21px; border-radius: 21px; font-size: 30px; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title .elementor-heading-title{ font-size: 27px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text{ padding: 13px 26px 47px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text, .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text p{ font-size: 13.5px !important; line-height: 1.75 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title{ padding: 44px 20px 0 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title .elementor-heading-title{ font-size: 31px !important; line-height: 1.1 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text{ padding: 24px 20px 0 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p{ max-width: none; min-height: 62px; padding: 11px 13px 11px 67px !important; font-size: 13px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p::before{ left: 13px; width: 40px; height: 40px; font-size: 16px; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p:hover{ transform:none; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn{ padding: 18px 20px 42px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7:hover .rs-left-title::before{ transform:none; } } /* ============================================================ MÓVIL PEQUEÑO ============================================================ */ @media(max-width:480px){ .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-title{ padding: 41px 18px 0 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-left-text{ padding: 11px 20px 40px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title{ padding: 39px 17px 0 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-title .elementor-heading-title{ font-size: 27px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text{ padding: 20px 17px 0 !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p{ min-height: 59px; padding: 10px 11px 10px 61px !important; font-size: 12.5px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-right-text p::before{ left: 11px; width: 37px; height: 37px; border-radius: 10px; font-size: 14px; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn{ width: 100% !important; padding: 17px 17px 35px !important; } .elementor-297 .elementor-element.elementor-element-5b3e5fc7 .rs-btn .elementor-button{ width: 100% !important; min-height: 50px; } } /* ============================================================ EVITAR SCROLL ============================================================ */ html, body{ width:100%; max-width:100%; overflow-x: hidden !important; }/* End custom CSS */