/*!**************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./assets/scss/frontend.scss ***! \**************************************************************************************************************************************************************/ @charset "UTF-8"; @font-face { font-family: "Gotham"; font-weight: 500; src: url(../a52599fa8cce74bab773.otf) format("opentype"); } @font-face { font-family: "Sofia Pro"; font-weight: normal; src: url(../build/fonts/081d8f0408bc6c2fcf21.woff) format("woff"); } @font-face { font-family: "Sofia Pro"; font-weight: 300; src: url(../build/fonts/85954286ddf6cb70bd5c.woff) format("woff"); } @font-face { font-family: "Sofia Pro"; font-weight: 500; src: url(../build/fonts/c4e6d42592d5d49c4030.woff) format("woff"); } @font-face { font-family: "Sofia Pro"; font-weight: 800; src: url(../build/fonts/086ed00f3060992f2938.woff) format("woff"); } /**************************************************************** / Base contains TAGS general styling /****************************************************************/ @view-transition { navigation: auto; } html, * { font-family: "Sofia Pro" !important; } body { text-rendering: geometricPrecision; font-smooth: antialiased; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overscroll-behavior: none; } @media (hover: none) and (pointer: coarse) { body { scroll-behavior: smooth; } } a { text-decoration: none; color: inherit; cursor: pointer; } p a { text-decoration: underline; } p { text-wrap: pretty; } /*** The new CSS reset - version 1.8.4 (last updated 14.2.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } * { margin: 0; padding: 0; } body { min-height: 100vh; min-height: 100dvh; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { font-style: italic; height: auto; max-inline-size: 100%; max-block-size: 100%; } img, picture, svg, video { display: block; max-width: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; -moz-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; } /* reset default text opacity of input placeholder */ ::-moz-placeholder { color: unset; } ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: initial; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; } .underline { text-decoration-line: underline; text-decoration-thickness: 1px; text-decoration-color: initial; -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none; text-underline-offset: 0.12em; } .richtext p, .richtext ul, .richtext ol { padding-bottom: 1em; } .richtext ul { list-style-type: disc; padding-left: 1em; } .richtext ol { list-style-type: decimal; padding-left: 1em; } .richtext h1, .richtext h2, .richtext h3, .richtext h4, .richtext h5, .richtext h6 { padding-bottom: 0.5em; padding-top: 1em; } .richtext a { text-decoration-line: underline; text-decoration-thickness: 1px; text-decoration-color: initial; -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none; text-underline-offset: 0.12em; } .bg-cover { background-position: center; background-repeat: no-repeat; background-size: cover; } .bg-contain { background-position: center; background-repeat: no-repeat; background-size: contain; } .pt-05 { padding-top: 0.5em; } .pt-1 { padding-top: 1em; } .pt-2 { padding-top: 2em; } .pt-3 { padding-top: 3em; } .pt-4 { padding-top: 4em; } .pt-5 { padding-top: 5em; } .pb-05 { padding-bottom: 0.5em; } .pb-1 { padding-bottom: 1em; } .pb-2 { padding-bottom: 2em; } .pb-3 { padding-bottom: 3em; } .pb-4 { padding-bottom: 4em; } .pb-5 { padding-bottom: 5em; } header { background-color: white; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2); left: 0; padding: 70px; position: fixed; top: 0; width: 100%; z-index: 100; } header .logo { background-size: cover; margin-right: 77px; vertical-align: middle; position: absolute; top: 10px; left: 30px; z-index: 100; } header .logo > img { max-width: 130px; width: 100%; height: 100%; } @media (max-width: 1270px) { header .logo { left: 25px; } } @media (max-width: 1200px) { header .logo { left: 10px; margin-right: 0; top: 18px; width: 90px; } } header .nav-toggle { cursor: pointer; flex-direction: column; position: absolute; right: 30px; top: 20px; z-index: 101; display: none; } @media (max-width: 1200px) { header .nav-toggle { display: flex; } } header .nav-toggle .bar { height: 2px; width: 30px; background-color: black; margin: 3px 0; transition: 0.3s; } header .nav-toggle.active .bar:nth-child(1) { transform: rotate(-45deg) translate(-6px, 6px); } header .nav-toggle.active .bar:nth-child(2) { opacity: 0; } header .nav-toggle.active .bar:nth-child(3) { transform: rotate(45deg) translate(-5px, -5px); } header nav.desktop { display: flex; justify-content: flex-end; padding-right: 1.5rem; } @media (max-width: 1200px) { header nav.desktop { display: none; } } header nav.desktop .primary-menu { align-items: center; display: flex; list-style: none; margin-bottom: 0; padding: 0; } header nav.desktop .primary-menu li { font-weight: 500; margin-right: 30px; position: relative; } @media (max-width: 1450px) { header nav.desktop .primary-menu li { margin-right: 15px; } } header nav.desktop .primary-menu li a { display: inline-block; color: black; text-decoration: none; padding-left: 5px; } header nav.desktop .primary-menu li a.active, header nav.desktop .primary-menu li a:active, header nav.desktop .primary-menu li a:hover { text-shadow: 0 0 0px rgb(0, 0, 0); } header nav.desktop .primary-menu li a span.down { background: url(../build/img/down.png); display: inline-block; height: 5px; margin-bottom: 2px; margin-left: 5px; width: 9px; } header nav.desktop .primary-menu li.menu-item-has-children:hover .sub-menu { display: block; } header nav.desktop .primary-menu li .sub-menu { background-color: white; border-radius: 5px; display: none; left: -6px; list-style: none; padding: 10px 10px 0px 5px; position: absolute; text-wrap: nowrap; top: 100%; width: 150px; } header nav.desktop .primary-menu li .sub-menu li { margin-bottom: 10px; } header nav.desktop .primary-menu li .sub-menu li a { font-weight: normal; font-size: 14px; display: block; } header nav.desktop .primary-menu li .sub-menu li a:hover { font-weight: bold; } header nav.desktop ul.primary-menu:last-child { margin-left: 30px; list-style: none; } header nav.desktop ul.primary-menu:last-child li a { display: flex; align-items: center; } header nav.desktop ul.primary-menu:last-child li a img { margin-right: 5px; } header nav.desktop ul.primary-menu:last-child li a span { margin-left: 0.3em; } header nav.mobile { background-color: #9cbce3; color: black; display: flex; font-size: 20px; font-weight: 500; height: calc(100vh - 54px); justify-content: flex-start; justify-content: space-between; left: 0; margin-top: 70px; opacity: 0; padding-top: 60px; position: fixed; top: 0; transition: opacity 0.3s, visibility 0.3s; visibility: hidden; width: 100%; } header nav.mobile.active { opacity: 1; visibility: visible; } header nav.mobile .primary-menu { list-style: none; padding: 0px 45px; } header nav.mobile .primary-menu li { margin-bottom: 20px; width: -moz-max-content; width: max-content; } header nav.mobile .primary-menu li.menu-item-has-children .sub-menu { border-radius: 5px; display: none; left: -6px; list-style: none; padding-left: 20px; padding: 10px 10px 0px 5px; } header nav.mobile .primary-menu li.menu-item-has-children:focus-within .sub-menu, header nav.mobile .primary-menu li.menu-item-has-children:hover .sub-menu { display: block; } header nav.mobile .primary-menu li.menu-item-has-children > a { position: relative; } header nav.mobile .primary-menu li.menu-item-has-children > a::after { content: ""; display: inline-block; width: 9px; height: 5px; background: url(../build/img/down.png); margin-left: 5px; } header nav.mobile .primary-menu li a { color: inherit; display: inline-block; text-decoration: none; } header nav.mobile .primary-menu li a.active, header nav.mobile .primary-menu li a:active, header nav.mobile .primary-menu li a:hover { font-weight: bold; } header nav.mobile .primary-menu li .sub-menu { display: none; padding: 10px 30px 0px 30px; list-style: none; } header nav.mobile .primary-menu li .sub-menu li { margin-bottom: 20px; width: 100%; } header nav.mobile .primary-menu li .sub-menu li:last-child { margin-bottom: 0; padding-top: 0px; font-size: 13px; } header nav.mobile .primary-menu li .sub-menu li a { font-size: 16px; font-weight: 500; width: 100%; } @media (max-width: 767px) { header nav.mobile .primary-menu li .sub-menu li a:hover { font-weight: bold; } } nav.desktop .primary-menu li.menu-item-has-children > a::after, nav.mobile .primary-menu li.menu-item-has-children > a::after { content: ""; display: inline-block; width: 9px; height: 5px; background: url(../build/img/down.png) no-repeat center center; background-size: contain; margin-left: 5px; vertical-align: middle; } nav.desktop .primary-menu li.menu-item-has-children > a::after, nav.mobile .primary-menu li.menu-item-has-children > a::after { content: ""; display: inline-block; width: 9px; height: 5px; background: url(../build/img/down.png) no-repeat center center; background-size: contain; margin-left: 5px; vertical-align: middle; } nav.desktop .primary-menu li.menu-item-has-children:hover > a::after, nav.mobile .primary-menu li.menu-item-has-children:hover > a::after { transform: rotate(180deg); } nav.mobile .primary-menu li.menu-item-has-children.active > .sub-menu { display: block; } .search-container { display: flex; flex-direction: column; margin-right: 5px; position: relative; } .search-input { border-radius: 5px; border: 1px solid #2a2a43; display: none; font-size: 16px; min-width: 200px; padding: 10px; padding: 10px; position: absolute; top: 40px; width: 100%; } .search-button { background-color: #fff; border-bottom: none; border-left: 1px solid #000; border-right: 1px solid #000; border-top: none; cursor: pointer; font-size: 16px; padding: 0.25rem 1rem; position: relative; z-index: 5; } .mainmenu { align-items: center; display: flex; font-size: 14px; font-weight: 700; gap: 3rem; line-height: clamp(16px, 1.428vw, 20px); } .mainmenu ul { display: flex; justify-content: space-between; gap: 1rem; } @media only screen and (max-width: 990px) { .mainmenu { background-color: white; flex-direction: column; height: 0; overflow: hidden; position: fixed; right: 0; top: 0; transition: all 0.5s ease; width: 0; z-index: 101; } .mainmenu > * { padding: calc(fluid(110) + 3vw) fluid(20) fluid(20); opacity: 0; transition: all 0.1s ease; } .mainmenu.expanded { background-color: hsl(0, 50%, 50%); font-size: clamp(15px, 2.5vw, 25px); height: 100vh; padding: 5vw; pointer-events: all; width: 100vw; } .mainmenu.expanded > * { opacity: 1; transition: all 0.4s ease 0.4s; } .mainmenu.expanded ul { border-radius: 10px; flex-direction: column; gap: 1rem; padding: 2rem; } .mainmenu.expanded ul li { margin: 0.5rem 0; } } .footer { background-color: #8f7a4a; padding: 70px; display: grid; grid-template-columns: repeat(1, 1fr); grid-template-rows: auto; gap: 20px; } @media (max-width: 767px) { .footer { padding: 40px 25px; display: block; } } .footer .footer-grid { display: grid; grid-template-columns: repeat(12, 1fr); row-gap: 20px; width: 100%; } @media (max-width: 767px) { .footer .footer-grid { row-gap: 75px; } } .footer .footer-logo { grid-column: span 2; text-align: center; } @media (max-width: 767px) { .footer .footer-logo { grid-column: span 12; } } .footer .footer-logo img { max-width: 100px; } .footer .footer-menu { grid-column: span 2; } @media (max-width: 767px) { .footer .footer-menu { grid-column: span 6; margin-bottom: 20px; } } .footer .footer-menu .primary-menu { list-style: none; padding: 0; font-weight: 800; font-size: 18px; line-height: 30px; } .footer .footer-menu .primary-menu a { text-decoration: none; color: white; } .footer .footer-menu .primary-menu .submenu { list-style: none; padding: 0; font-weight: 300; font-size: 16px; line-height: 30px; } .footer .footer-social { grid-column: 9/13; } @media (max-width: 767px) { .footer .footer-social { grid-column: span 12; margin-bottom: 20px; } } .footer .footer-social .social-menu { list-style: none; padding: 0; margin-bottom: 30px; } .footer .footer-social .social-menu li { display: inline-block; margin-right: 10px; } .footer .footer-social .social-menu li a.icon { width: 39px; height: 39px; display: block; background-size: contain; background-repeat: no-repeat; } .footer .footer-social .social-menu li a.icon.fb { background-image: url(../build/img/facebook.png); } .footer .footer-social .social-menu li a.icon.ig { background-image: url(../build/img/instagram.png); } .footer .footer-social .social-menu li a.icon.x { background-image: url(../build/img/x.png); } .footer .footer-social .social-menu li a.icon.ln { background-image: url(../build/img/linkedin.png); } .footer .footer-social .social-menu li a.icon.yt { background-image: url(../build/img/youtube.png); } .footer .footer-social .join-title { font-weight: 800; font-size: 18px; line-height: 30px; color: white; } .footer .footer-social .join-text { font-weight: 800; font-size: 14px; line-height: 18px; color: white; padding-right: 25px; margin-bottom: 40px; } .footer .footer-social .button { margin-bottom: 100px; } .footer .footer-bottom { grid-column: 3/12; display: flex; justify-content: space-between; align-items: center; } @media (max-width: 767px) { .footer .footer-bottom { grid-column: span 12; flex-direction: column-reverse; align-items: flex-end; justify-content: flex-start; } } .footer .footer-bottom img { max-width: 100px; margin-right: 20px; } @media (max-width: 767px) { .footer .footer-bottom img { margin-bottom: 10px; align-self: flex-end; } } .footer .footer-bottom .legal { font-weight: 500; font-size: 12px; color: white; display: flex; align-items: center; } .footer .footer-bottom .legal a { text-decoration: none; color: inherit; } .footer .footer-bottom .legal span { opacity: 0.5; margin-right: 15px; } @media (max-width: 767px) { .footer .footer-bottom .legal { flex-direction: row; align-items: flex-start; } } .footer .button.color3.bw { background-color: #8f7a4a; border-radius: 18px; border: 1px solid #fff; color: #fff; display: inline-block; font-size: 16px; font-weight: 700; line-height: 16px; margin-bottom: 100px; min-width: 135px; padding: 8px 20px 5px; row-gap: 20px; text-align: center; text-decoration: none; text-transform: uppercase; } @media (max-width: 767px) { .footer .button.color3.bw { margin-bottom: 40px; } } .btn, .btn--header { background-color: #ffffff; border-radius: 1.5rem; border: 1px solid #000000; cursor: pointer; display: flex; gap: 0.5em; padding: 0.8125em 1.5em; position: relative; text-align: center; transition: background-color 0.3s ease, color 0.3s ease; width: -moz-max-content; width: max-content; } .btn > img, .btn--header > img { width: 20px; height: 20px; } .btn:hover, .btn--header:hover, .btn:active, .btn--header:active, .btn:focus, .btn--header:focus { background-color: black; color: white; } .btn:hover > img, .btn--header:hover > img, .btn:active > img, .btn--header:active > img, .btn:focus > img, .btn--header:focus > img { filter: invert(1); } .btn--header { min-width: 9rem; font-size: 1.9rem; background-color: inherit; } .c-hamburger { align-items: center; cursor: pointer; display: none; flex-direction: column; height: 4rem; justify-content: center; margin-right: 1rem; position: relative; transition: all 0.2s ease-out; z-index: 102; /* Styling the hamburger lines */ } @media only screen and (max-width: 990px) { .c-hamburger { display: flex; } } .c-hamburger__line { width: 22px; height: 4px; margin: 0 0 5px 0; background: crimson; transition: transform 0.5s ease, opacity 0.2s ease; } .c-hamburger__line:last-of-type { margin-bottom: 0; } .c-hamburger.expanded .c-hamburger__line { color: black; background: hsl(90, 90%, 90%); width: 29px; } .c-hamburger.expanded .c-hamburger__line:nth-child(1) { transform: rotate(45deg) translate(6.3px, 6.3px); } .c-hamburger.expanded .c-hamburger__line:nth-child(2) { opacity: 0; } .c-hamburger.expanded .c-hamburger__line:nth-child(3) { transform: rotate(-45deg) translate(6.3px, -6.3px); } main.news { padding: 130px 0px 0px 0px; font-weight: 800; } @media (max-width: 1200px) { main.news { padding: 100px 0px 0px 0px; } } main.news .s-title { align-items: center; background-color: #2a2a43; color: white; display: flex; flex-direction: column; justify-content: space-between; padding: 110px 0 70px 0px; } @media (max-width: 1200px) { main.news .s-title { padding: 75px 0px 50px 0px; } } main.news .s-title > h1 { margin: 0; text-align: center; font-size: 2.5rem; font-weight: 800; } main.news .s-categories { align-items: center; background-color: #2a2a43; color: white; display: flex; flex-direction: column; justify-content: space-between; } main.news .s-categories__items { align-items: center; display: flex; gap: 3rem; justify-content: space-around; list-style: none; margin-bottom: 1rem; margin-top: 20px; padding-left: 0; width: min(100% - 2rem, 1200px); } @media (max-width: 1200px) { main.news .s-categories__items { flex-wrap: wrap; font-size: 14px; gap: 1.5rem; text-wrap: nowrap; } } main.news .s-categories__items > li > .filter-button { position: relative; text-decoration: none; color: white; background: none; border: none; cursor: pointer; font-size: inherit; } main.news .s-categories__items > li > .filter-button:hover::after { content: ""; color: #9cbce3; bottom: -4px; display: block; height: 4px; left: 0; position: absolute; width: 100%; } main.news .s-categories__items > li > .filter-button.active::after { content: ""; display: block; width: 100%; height: 4px; background-color: #9cbce3; position: absolute; bottom: -4px; left: 0; } main.news .s-posts { gap: 2rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 500px), 1fr)); padding: 100px 0px; margin-inline: auto; width: min(100% - 2rem, 1200px); } @media (max-width: 768px) { main.news .s-posts { padding: 50px 0px; } } main.news .s-posts > article { align-items: flex-start; aspect-ratio: 1/1; background-position: center; background-repeat: no-repeat; background-size: cover; padding: 1.25rem 2rem; transition: all 0.3s ease-in-out; position: relative; } main.news .s-posts > article .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); } main.news .s-posts > article > a { display: flex; flex-direction: column; justify-content: space-between; position: relative; text-decoration: none; height: 100%; } main.news .s-posts > article:hover { transform: scale(1.03); } main.news .s-posts__category { background-color: #9cbce3; color: white; padding: 10px; width: -moz-max-content; width: max-content; } main.news .s-posts__title { color: white; font-size: 30px; font-style: normal; line-height: 35px; /* 116.667% */ } main.news .links { display: flex; justify-content: space-between; gap: 10px; margin-bottom: -20px; flex-wrap: wrap; } @media (max-width: 768px) { main.news .links { flex-direction: column; gap: 0; } } main.news .links .link { flex: 1; margin-bottom: 20px; display: flex; flex-direction: column; justify-content: space-between; background-color: #9cbce3; padding: 0 8px; } main.news .links .link .content { display: flex; flex-direction: column; flex-grow: 1; } main.news .links .link .names { text-align: center; font-weight: bold; font-size: 28px; padding: 80px 30px 10px 30px; font-size: 28px; font-style: normal; line-height: 32px; } @media (max-width: 767px) { main.news .links .link .names { padding: 80px 10px 10px 10px; } } main.news .links .link .buttons { text-align: center; margin-top: auto; /* Empuja el botón hacia la parte inferior */ padding-bottom: 80px; padding-top: 40px; } main.news .links .link .buttons a { background-color: #2a2a43; border-radius: 50px; color: white; display: inline-block; padding: 12px 20px 10px 20px; text-decoration: none; text-transform: uppercase; } main.blog { margin-inline: auto; padding-top: 100px; } @media (max-width: 1200px) { main.blog { padding-top: 54px; } } @media (max-width: 767px) { main.blog .p25 { padding-left: 25px; padding-right: 25px; } } main.blog .s-categories { align-items: center; background-color: #2a2a43; color: white; display: flex; flex-direction: column; font-weight: 800; justify-content: space-between; } main.blog .s-categories__items { align-items: center; display: flex; flex-wrap: wrap; gap: 3rem; justify-content: space-between; list-style: none; margin-bottom: 1rem; margin-top: 20px; padding-left: 0; width: min(100% - 2rem, 1200px); } @media only screen and (max-width: 767px) { main.blog .s-categories__items { justify-content: space-around; } } main.blog .s-categories__items > li > .filter-button { position: relative; text-decoration: none; color: white; background: none; border: none; pointer-events: none; font-size: inherit; } main.blog .s-categories__items > li > .filter-button:hover::after { content: ""; color: #9cbce3; bottom: -4px; display: block; height: 4px; left: 0; position: absolute; width: 100%; } main.blog .s-categories__items > li > .filter-button.active::after { content: ""; display: block; width: 100%; height: 4px; background-color: #9cbce3; position: absolute; bottom: -4px; left: 0; } main.blog .s-title { background-color: #2a2a43; color: white; } main.blog .s-title h1 { font-size: 40px; font-weight: bold; margin-bottom: 0; margin-inline: auto; padding: 110px 0px 20px 0px; width: min(100% - 2rem, 1200px); } main.blog .s-intro { padding-top: 4.875rem; margin-inline: auto; width: min(100% - 2rem, 1200px); } @media (max-width: 767px) { main.blog .s-intro { padding-top: 40px; } } main.blog .s-intro h2 { padding: 30px 0; font-weight: bold; font-size: 50px; line-height: 60px; } @media (max-width: 767px) { main.blog .s-intro h2 { font-size: 40px; line-height: 50px; } } main.blog .s-intro h3 { color: #9cbce3; font-size: 40px; line-height: 45px; margin-bottom: 50px; } @media (max-width: 767px) { main.blog .s-intro h3 { font-size: 24px; line-height: 30px; font-size: 28px; line-height: 32px; margin-top: 25px; margin-bottom: 25px; } } main.blog .s-intro__image-container { aspect-ratio: 16/9; height: auto; position: relative; margin-bottom: 80px; } main.blog .s-intro__image-container img, main.blog .s-intro__image-container figure { height: 100%; -o-object-fit: cover; object-fit: cover; width: 100%; } main.blog .s-intro__video-container { aspect-ratio: 16/9; height: auto; position: relative; margin-bottom: 80px; } main.blog .s-intro__video-container iframe, main.blog .s-intro__video-container video { height: 100%; left: 0; position: absolute; top: 0; width: 100%; } @media (max-width: 767px) { main.blog .s-intro__video-container { margin-bottom: 40px; } } main.blog .s-content { margin-inline: auto; overflow: hidden; width: min(100% - 2rem, 1200px); padding-bottom: 5rem; } @media (max-width: 767px) { main.blog .s-content { padding-bottom: 2rem; } } main.blog .s-content h2 { padding: 30px 0; font-weight: bold; font-size: 50px; line-height: 60px; } @media (max-width: 767px) { main.blog .s-content h2 { font-size: 40px; line-height: 50px; } } main.blog .s-content h3 { color: #9cbce3; font-size: 40px; line-height: 45px; margin-bottom: 80px; margin-inline: auto; margin-top: 80px; width: min(100%, 1200px); } @media (max-width: 767px) { main.blog .s-content h3 { font-size: 24px; line-height: 30px; font-size: 28px; line-height: 32px; margin-top: 25px; margin-bottom: 25px; } } main.blog .s-content h3.intro { margin-top: 0px; margin-bottom: 50px; } @media (max-width: 767px) { main.blog .s-content h3.intro { font-size: 24px; line-height: 30px; font-size: 28px; line-height: 32px; margin-top: 25px; margin-bottom: 25px; } } main.blog .s-content__image-container { margin-left: 14rem; margin-top: 80px; } main.blog .s-content__image-container img, main.blog .s-content__image-container figure { height: 100%; -o-object-fit: cover; object-fit: cover; width: 100%; } @media (max-width: 767px) { main.blog .s-content__image-container { margin-top: 50px; margin-left: 0rem; } } main.blog .s-content__image-container p { font-size: 14px; line-height: 22px; color: #8f7a4a; border-bottom: 1px solid #8f7a4a; padding-top: 5px; padding-bottom: 5px; margin-bottom: 80px; } @media (max-width: 767px) { main.blog .s-content__image-container p { margin-bottom: 50px; margin-left: 0; } } main.blog .s-content .image-container { margin-left: 14rem; margin-top: 80px; } main.blog .s-content .image-container img, main.blog .s-content .image-container figure { height: 100%; -o-object-fit: cover; object-fit: cover; width: 100%; } @media (max-width: 767px) { main.blog .s-content .image-container { margin-top: 50px; margin-left: 0rem; } } main.blog .s-content .image-container p { font-size: 14px; line-height: 22px; color: #8f7a4a; border-bottom: 1px solid #8f7a4a; padding-top: 5px; padding-bottom: 5px; margin-bottom: 80px; } @media (max-width: 767px) { main.blog .s-content .image-container p { margin-bottom: 50px; margin-left: 0; } } main.blog .s-content__double-image-container { display: flex; justify-content: space-between; margin-top: 80px; } main.blog .s-content__double-image-container img, main.blog .s-content__double-image-container figure { height: 100%; -o-object-fit: cover; object-fit: cover; width: 100%; } main.blog .s-content__double-image-container p.footer-image { font-size: 14px; line-height: 22px; color: #8f7a4a; border-bottom: 1px solid #8f7a4a; padding-top: 5px; padding-bottom: 5px; margin-bottom: 80px; } @media (max-width: 767px) { main.blog .s-content__double-image-container p.footer-image { margin-bottom: 50px; } } @media (max-width: 767px) { main.blog .s-content__double-image-container { flex-direction: column; } } main.blog .s-content .double-image-container { display: flex; justify-content: space-between; margin-top: 80px; } main.blog .s-content .double-image-container p.footer-image { font-size: 14px; line-height: 22px; color: #8f7a4a; border-bottom: 1px solid #8f7a4a; padding-top: 5px; padding-bottom: 5px; margin-bottom: 80px; } @media (max-width: 767px) { main.blog .s-content .double-image-container p.footer-image { margin-bottom: 50px; } } @media (max-width: 767px) { main.blog .s-content .double-image-container { flex-direction: column; } } main.blog .s-content .video-container { aspect-ratio: 16/9; height: auto; position: relative; margin-bottom: 80px; } main.blog .s-content .video-container iframe, main.blog .s-content .video-container video { height: 100%; left: 0; position: absolute; top: 0; width: 100%; } @media (max-width: 767px) { main.blog .s-content .video-container { margin-bottom: 40px; } } main.blog .s-content p.text { font-size: 20px; line-height: 26px; margin-left: 14rem; padding-bottom: 1em; } @media (max-width: 767px) { main.blog .s-content p.text { font-size: 16px; line-height: 22px; margin-left: 0rem; } } main.blog .s-content p.inside { padding-left: 40px; margin-left: 14rem; padding-bottom: 0em; } @media (max-width: 767px) { main.blog .s-content p.inside { margin-left: 0rem; padding-left: 0px; } } main.blog .s-content p.bold { font-weight: bold; margin-bottom: 25px; margin-left: 14rem; margin-top: 50px; padding-bottom: 0em; } @media (max-width: 767px) { main.blog .s-content p.bold { margin-bottom: 10px; margin-left: 0rem; margin-top: 25px; } } main.blog .s-content p.footer-image { font-size: 14px; line-height: 22px; color: #8f7a4a; border-bottom: 1px solid #8f7a4a; padding-top: 5px; padding-bottom: 5px; margin-bottom: 80px; } @media (max-width: 767px) { main.blog .s-content p.footer-image { margin-bottom: 50px; } } main.blog .s-content p.uppercase { text-transform: uppercase; } main.blog .links { display: flex; justify-content: space-between; gap: 10px; margin-bottom: -20px; flex-wrap: wrap; } @media (max-width: 768px) { main.blog .links { flex-direction: column; gap: 0; } } main.blog .links .link { flex: 1; margin-bottom: 20px; display: flex; flex-direction: column; justify-content: space-between; background-color: #9cbce3; padding: 0 8px; } main.blog .links .link .content { display: flex; flex-direction: column; flex-grow: 1; } main.blog .links .link .names { text-align: center; font-weight: bold; font-size: 28px; padding: 80px 30px 10px 30px; font-size: 28px; font-style: normal; line-height: 32px; } @media (max-width: 767px) { main.blog .links .link .names { padding: 80px 10px 10px 10px; } } main.blog .links .link .buttons { text-align: center; margin-top: auto; /* Empuja el botón hacia la parte inferior */ padding-bottom: 80px; padding-top: 40px; } main.blog .links .link .buttons a { background-color: #2a2a43; border-radius: 50px; color: white; display: inline-block; padding: 12px 20px 10px 20px; text-decoration: none; text-transform: uppercase; } .filter-button.active { background-color: #9cbce3; color: white; } /*# sourceMappingURL=frontend.min.css.map*/