/* ================================================ RAFESA - Custom Stylesheet ================================================ */ /* ===== 1. VARIABLES ===== */ :root { --azul: #3F799E; --gris-oscuro: #4d4d4d; --rosa: #b03983; --rojo: #953b82; --tamaño-texto: clamp(14px, 12.847px + 0.360vw, 18px); --tamano-menu: 14px; --verde-instagram: #DCEDEC; --fondo-gris: #f2f2f2; /* --fondo-azul-claro:#eaeff3; */ --fondo-azul-claro: #ECF5FC; --fondo-gris-transparencia: rgba(242, 242, 242, 0.9); --gris-claro: #e6e6e6; --gris-borde: #b3b3b3; --gris-texto-secundario: #808080; --gris-texto-terciario: #999999; /* --font-serif: "Oswald", serif; */ --font-serif: var(--font-sans-serif); --font-sans-serif: 'Montserrat', sans-serif; --color-texto: #666666; --color-titulo: #262626; --color-boton: #000000; --color-strong: #953b82; --h1-font-size: clamp(30px, 24.811px + 1.622vw, 48px); --h2-font-size: clamp(26px, 21.099px + 1.532vw, 43px); --h3-font-size: clamp(20px, 16.252px + 1.171vw, 33px); --h4-font-size: clamp(20px, 18.27px + 0.541vw, 26px); --texto-xl: clamp(22px, 19.694px + 0.721vw, 30px); --texto-l: clamp(16px, 14.27px + 0.541vw, 22px); --content-heading-color: #000000; --content-heading-font-weight: 500; --content-heading-line-height: normal; --content-heading-letter-spacing: 0; } /* ===== 2. FONTS ===== */ @font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 100; src: url('../fonts/montserrat-v31-latin-100.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 200; src: url('../fonts/montserrat-v31-latin-200.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 300; src: url('../fonts/montserrat-v31-latin-300.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 400; src: url('../fonts/montserrat-v31-latin-regular.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 500; src: url('../fonts/montserrat-v31-latin-500.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 600; src: url('../fonts/montserrat-v31-latin-600.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 700; src: url('../fonts/montserrat-v31-latin-700.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 800; src: url('../fonts/montserrat-v31-latin-800.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Montserrat'; font-style: normal; font-weight: 900; src: url('../fonts/montserrat-v31-latin-900.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Oswald'; font-style: normal; font-weight: 300; src: url('../fonts/oswald-v57-latin-300.woff2') format('woff2'); } @font-face { font-display: swap; font-family: 'Oswald'; font-style: normal; font-weight: 400; src: url('../fonts/oswald-v57-latin-regular.woff2') format('woff2'); } .font1 h1,.font1 h2,.font1 h3,.font1 h4,.font1 h5,.font1 h6,.font1 p{font-family: var(--font-sans-serif);} .font2 h1,.font2 h2,.font2 h3,.font2 h4,.font2 h5,.font2 h6,.font2 p, .font3 h1,.font3 h2,.font3 h3,.font3 h4,.font3 h5,.font3 h6,.font3 p{font-family: var(--font-serif);} /* ===== 3. ANIMACIONS ===== */ @keyframes swing--enter-top { 0% { transform: rotate3d(-1, 0, 0, 90deg); } 100% { transform: none; } } @keyframes swing--enter-right { 0% { transform: rotate3d(0, -1, 0, 90deg); } 100% { transform: none; } } @keyframes swing--enter-bottom { 0% { transform: rotate3d(1, 0, 0, 90deg); } 100% { transform: none; } } @keyframes swing--enter-left { 0% { transform: rotate3d(0, 1, 0, 90deg); } 100% { transform: none; } } @keyframes swing--leave-top { 0% { transform: none; } 100% { transform: rotate3d(-1, 0, 0, 90deg); } } @keyframes swing--leave-right { 0% { transform: none; } 100% { transform: rotate3d(0, -1, 0, 90deg); } } @keyframes swing--leave-bottom { 0% { transform: none; } 100% { transform: rotate3d(1, 0, 0, 90deg); } } @keyframes swing--leave-left { 0% { transform: none; } 100% { transform: rotate3d(0, 1, 0, 90deg); } } @keyframes slide-in-bottom { 0% { opacity: 0; transform: translateY(50px); } 100% { opacity: 1; transform: translateY(0); } } .slide-in-bottom { animation: slide-in-bottom 0.8s ease-in-out 0s 1 normal forwards;} .bloqueanimado {opacity: 0;} /* ===== 4. BASE I RESET ===== */ body{ font-family: var(--font-sans-serif); font-size: var(--tamaño-texto); line-height: normal; font-weight: 400;} a { color: #000; transition: all 0.3s ease; } a:hover{ color: var(--rosa); text-decoration: underline; transition: all 0.3s ease;} b, strong { font-weight: 700;} body li{ line-height: 1.5;} body p { font-weight: 400; margin-bottom: 20px; line-height: 1.5;} i{ font-family: "FontAwesome"; } main .img-fluid img, main .portfolio-thumb .img-fluid { width: 100% !important; } .mix-multiply, .mix-multiply img{mix-blend-mode: multiply !important;} .texto-uppercase *, .texto-uppercase{text-transform: uppercase !important;} .texto-introductorio p, .texto-introductorio{font-size: var(--texto-xl) !important;} .texto-introductorio-2 p, .texto-introductorio-2{font-size: var(--texto-l) !important;} /* ===== 5. TIPOGRAFIA ===== */ p, p a, span, div, li, td{ font-family: var(--font-sans-serif); } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{ font-family: var(--font-serif); } .title, .h1, h1, .h2, h2, .h3, h3, .h4, h4, .h5, h5, .h6, h6{margin-bottom: 25px;} .title, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { color: var(--content-heading-color); font-weight: var(--content-heading-font-weight); line-height: var(--content-heading-line-height); letter-spacing: var(--content-heading-letter-spacing); } h1,.h1 { font-size: var(--h1-font-size); } h2,.h2 { font-size: var(--h2-font-size); } h3,.h3 { font-size: var(--h3-font-size); } /* ===== 6. UTILITATS ===== */ .nopadding{ padding: 0 !important;} .nopadding-r{ padding-right: 0 !important;} .nopadding-l{padding-left: 0 !important;} .rotate{transform: rotatex(180deg);} .effect1{ position: absolute; will-change: transform; right:0} .transparent img{mix-blend-mode: multiply;} .valign-end{display: flex; align-items: end;} .serif p{font-family: var(--font-serif);} .container-lg{max-width: 850px;} /* ===== 7. LAYOUT (containers, spacing, backgrounds) ===== */ header .fullwidth, header .container{margin-top: 0; margin-bottom: 0;} main div .fullwidth:first-child, main div .container:first-child{margin-top: 0;} main div .fullwidth:last-child, main div .container:last-child{margin-bottom: 0;} footer .fullwidth:last-child, footer .container:last-child{margin-bottom: 0;} .fullwidth .fullwidth, .fullwidth .container, .container .container, .container .fullwidth{margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0;} main .container{ margin-top: clamp(50px, 35.586px + 4.505vw, 100px); margin-bottom: clamp(50px, 35.586px + 4.505vw, 100px); margin-left: auto; margin-right: auto; padding-top: 0; padding-bottom: 0; padding-left: 15px; padding-right: 15px; } main .fullwidth{ margin-top: clamp(50px, 35.586px + 4.505vw, 100px); margin-bottom: clamp(50px, 35.586px + 4.505vw, 100px); margin-left: 0; margin-right: 0; padding-top: 0; padding-bottom: 0; padding-left: 0; padding-right: 0; } main .fullwidth.lock-container{max-width: 100%;} /* <=== FONDOS ===> */ div[class*="fondo-"]{padding-top: clamp(25px, 17.793px + 2.252vw, 50px); padding-bottom: clamp(25px, 17.793px + 2.252vw, 50px);} .fondo-azul{background: var(--fondo-azul-claro);} .fondo-azul *{color: inherit;} .fondo-verde{background: var(--verde-instagram);} .fondo-verde *{color: inherit;} .fondo-gris{background-color: var(--fondo-gris);} .fondo-gris *{color: inherit;} .fondo-gris-oscuro{background: inherit;} .fondo-gris-oscuro *{color: inherit;} .fondo-rosa{background: inherit;} .fondo-rosa *{color: inherit;} /* ===== 8. BOTONS ===== */ .btn{height: 48px; border-radius: 0; text-transform: uppercase;} .btn.active:hover, .btn { border: 1px solid #000; padding: 4px 25px; font-size: clamp(14px, 12.847px + 0.360vw, 18px); font-weight: 600; letter-spacing: 0.5px; } .btn.active, .btn:hover{ background-color: #000 ; color: #fff ; box-shadow: unset ; border-color: #000 ; } .list-button{margin-top: clamp(25px, 20.676px + 1.351vw, 40px);} /* ===== 9. FORMULARIS ===== */ form input[type="checkbox"] { margin-right: 5px; } form input[type="checkbox"]{ margin-top: unset !important; } form input[type="text"] {height: auto;} form input[type="email"] { margin: 0 0 10px 0; height: auto; padding: 0 0 0 13px; } form .form-control { height: 48px !important; border-radius: 5px !important; border: 1px solid #e5e5e5 !important; background: var(--fondo-gris) !important; color: var(--gris-texto-secundario) !important; font-size: clamp(12px, 11.423px + 0.180vw, 14px) !important; padding-left: 10px !important; } form .form-control::placeholder { color: var(--gris-texto-secundario) !important; font-size: clamp(10px, 9.423px + 0.180vw, 12px) !important; text-transform: uppercase;} form textarea.form-control { padding-left: 10px !important; height: 200px !important; } form .send-form .btn{width: fit-content; margin: 0 auto;} /* ===== 10. SWIPER ===== */ .swiper-button-next::after{content: "\f105"; font-family: "FontAwesome"; font-size: 30px;} .swiper-button-prev::after{content: "\f104"; font-family: "FontAwesome"; font-size: 30px;} .swiper-button-next{right: 5px;} .swiper-button-prev{left: 5px;} .swiper-button-next, .swiper-button-prev{color: #BCB1BC;} .swiper-button-prev, .swiper-button-next { top: calc(50% - 10px); } /* ===== 11. BANNERS ===== */ .banner{ position: relative; } .banner.absolute {display: flex;} .banner.absolute .banner-content{ position: absolute; z-index: 1; } .banner.left{ justify-content: start;} .banner.right{ justify-content: end;} .banner.center{ justify-content: center;} .banner.top-align{ align-items: start;} .banner.down-align{ align-items: end;} .banner.center-align{ align-items: center;} .banner.left .contentext, .banner.left .title{ text-align: left;} .banner.right .contentext, .banner.right .title{ text-align: right;} .banner.center .contentext, .banner.center .title{ text-align: center;} .banner.left .btn{margin-left: 0; margin-right: auto;} .banner.right .btn{margin-left: auto; margin-right: 0;} .banner.center .btn{margin-left: auto; margin-right: auto;} .banner figure{margin-bottom: 0 !important;} .banner.absolute .banner-content{padding: 30px; max-width: 800px; margin-left: auto; margin-right: auto;} .banner.absolute .banner-content .banner-content-details{padding: 30px;} .banner-animacion .bannerwrapper6 .titol{position: absolute; text-align: center; left: 0; right: 0; z-index: 99999; padding: 40px; pointer-events:none;} .banner-animacion .bannerwrapper6 .titol a{color: #fff; font-family: var(--font-serif); display: block; pointer-events:none; font-weight: 700;} .banner-animacion .bannerwrapper6 .individualbanner6 .container{padding: 0; display: flex; justify-content: center; align-items: center; } .banner-animacion .bannerwrapper6 .individualbanner6 .container .image-caption{ position: absolute; filter: brightness(1.2); width: 20%; opacity: 0; pointer-events: none; transition: all 0.5s ease;} .banner-animacion .bannerwrapper6 .individualbanner6:hover .container .image-caption{ width: 100%; opacity: 1;} .banner-animacion .bannerwrapper6 .individualbanner6 .container .portfolio-thumb {margin-bottom: 0;width:100%;} .individualbanner4 img{filter: brightness(0.7); min-height: 400px; object-fit: cover;} .individualbanner4 .banner-content {max-width: 1000px;} .individualbanner4 .banner-content .banner-content-details{background-color: rgba(255,255,255,0.8);} .contenedor-flotar > .row{ align-items: center; justify-content: center; position:relative; } .contenedor-flotar .flotar{ position: absolute; z-index: 1; width: 86vw; max-width: unset; flex: unset; background: rgba(255,255,255,0.7); padding: 30px 15px; } /* ===== 12. HEADER ===== */ header .navigation-wrap .fullwidth{padding-left: clamp(15px, -10.000px + 2.083vw, 30px); padding-right: clamp(15px, -10.000px + 2.083vw, 30px);} .cbp-af-header{ border-bottom: 2px solid var(--gris-borde) !important; } .cbp-af-header .main-navigation .navbar-brand {margin: 10px 0;} .cbp-af-header .main-navigation .navbar-brand img{width: clamp(200px, 116.667px + 6.944vw, 250px);} .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item{ margin: 15px; padding: 0 ; } .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item:last-child{margin-right: 0;} .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-link { font-size: var(--tamano-menu); text-transform: uppercase; font-weight: 600; padding: 0 !important; margin: 0; } .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav > .nav-item:has(.nav-link.active) > .nav-link, .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-link.active{ color: var(--rosa) !important;} .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-link:hover{ color: var(--rosa) !important;} .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-item.dropdown{ margin: 0; } .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-item.dropdown a.nav-link{ color: #000 !important; } .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-item.dropdown .nav-link{ font-size: var(--tamano-menu); text-transform: uppercase; font-weight: 600; } .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-item.dropdown .nav-link.active{ color: var(--rosa);} .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-item.dropdown .nav-link:hover{ color: var(--rosa) !important;} .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-item.dropdown a .toggler:after { content: "\f107"; font-family: FontAwesome; margin-left: 15px; } .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item.dropdown > a.nav-link::after{display: none !important;} .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item .nav-item.dropdown a:after { content: unset !important; } .cbp-af-header .main-navigation #navbarSupportedContent .navbar-nav .nav-item:last-child .nav-link::before{content: unset;} /* <=== HEADER DESPLEGABLE ===> */ @media (min-width: 1200px){ .cbp-af-header .main-navigation .nav-item.dropdown .dropdown-menu{ box-shadow: 0 0 6px 2px rgba(0,0,0,0.1);} } .cbp-af-header .main-navigation .nav-item.dropdown .dropdown-menu{ background: #fff; padding: 0 !important; } .cbp-af-header .main-navigation .nav-item.dropdown.show > .dropdown-menu{margin-top: 15px !important;} .cbp-af-header .main-navigation .nav-item.dropdown .dropdown-menu ul li.nav-item { margin: 0 !important; margin-bottom: 0 !important; padding: 10px !important; } .cbp-af-header .main-navigation .nav-item.dropdown .dropdown-menu ul li.nav-item .nav-link.dropdown-item{ margin: 0 !important; padding-left: 20px !important; color: #000 !important; font-weight: normal; transition: font-weight 0.5s ease; } .cbp-af-header .main-navigation .nav-item.dropdown .dropdown-menu ul li.nav-item .nav-link.dropdown-item:hover{transition: font-weight 0.5s ease; font-weight: bold;} .cbp-af-header .main-navigation .nav-item.dropdown .dropdown-menu ul li.nav-item .nav-link.dropdown-item::before{content: unset !important;} .cbp-af-header.cbp-af-header-shrink .dropdown-menu::before{top: -15px !important;} /* <=== DROPDOWN DESKTOP: nested submenus ===> */ @media (min-width: 1200px) { .main-navigation .dropdown-menu .nav-item.dropdown { position: relative; } .main-navigation .dropdown-menu .nav-item.dropdown > .dropdown-menu { position: absolute; top: 0; left: 100%; display: none; opacity: 0; visibility: hidden; transition: opacity 0.25s ease, visibility 0.25s ease; min-width: 200px; } .main-navigation .dropdown-menu .nav-item.dropdown:hover > .dropdown-menu, .main-navigation .dropdown-menu .nav-item.dropdown.show > .dropdown-menu { display: block; opacity: 1; visibility: visible; } /* Toggler arrows: hide on desktop (hover handles it) */ .main-navigation .toggler, .main-navigation .toggler-inside { display: none; } } /* <=== DROPDOWN MOBILE/TABLET ===> */ @media (max-width: 1199px) { .main-navigation .navbar-collapse { max-height: 80vh; overflow-y: auto; } .main-navigation .navbar-nav .nav-item { margin: 0 !important; padding: 10px !important; border-bottom: 1px solid rgba(0,0,0,0.06); } .main-navigation .navbar-nav > .nav-item:last-child { border-bottom: none; } .main-navigation .navbar-nav .nav-item .nav-link { padding: 12px 15px !important; display: flex; align-items: center; justify-content: space-between; } .main-navigation .navbar-nav .nav-item .nav-link .data { flex: 1; } .main-navigation .navbar-nav .nav-item.dropdown .nav-link .toggler, .main-navigation .dropdown-menu .nav-item.dropdown > a > .toggler-inside { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; cursor: pointer; flex-shrink: 0; margin: -10px -12px -10px 0; } .main-navigation .navbar-nav .nav-item.dropdown .nav-link .toggler::after, .main-navigation .dropdown-menu .nav-item.dropdown > a > .toggler-inside::after { content: "\f107"; font-family: FontAwesome; font-size: 16px; transition: transform 0.3s ease; } .main-navigation .nav-item.dropdown.show > .nav-link .toggler::after, .main-navigation .nav-item.show > a .toggler-inside::after { transform: rotate(180deg); } /* Dropdown-menu: hidden by default, shown via JS slideToggle */ .main-navigation .dropdown-menu { position: static !important; float: none; width: 100%; border: none; box-shadow: none; margin: 0 !important; padding: 0 0 0 15px !important; background: #f9f9f9; display: none; } .main-navigation .nav-item.dropdown.show > .dropdown-menu { display: block; } .main-navigation .dropdown-menu ul { list-style: none; } .main-navigation .dropdown-menu ul li.nav-item:not(:last-child) { border-bottom: 1px solid rgba(0,0,0,0.04); } .main-navigation .dropdown-menu ul li.nav-item:last-child { border-bottom: none; } /* .main-navigation .dropdown-menu ul li.nav-item > .dropdown-menu ul li.nav-item { border-bottom: unset; } */ .main-navigation .dropdown-menu ul li.nav-item .nav-link.dropdown-item { padding: 10px 15px !important; font-size: 12px; display: flex; align-items: center; justify-content: space-between; } /* Nested sub-dropdown indent */ .main-navigation .dropdown-menu .dropdown-menu { padding-left: 15px !important; background: #f4f4f4; } .dropdown-item{border-bottom: unset !important;} } .extratop-links > .row { justify-content: end; align-items: center; margin: 0; padding: 10px 0 0; } .extratop-links > .row > .col-12 { max-width: unset; flex: unset; width: auto; padding: 0; } .extratop-links .imagelink { display: flex; align-items: center; padding-right: 15px; margin-right: 0; font-size: 16px; color: #1d2943; text-decoration: none; } .extratop-links .imagelink img { max-width: 25px; display: block;} .extratop-links .imagelink.imagelink-active img {filter: brightness(0) saturate(100%) invert(33%) sepia(52%) saturate(2025%) hue-rotate(290deg) brightness(77%) contrast(85%);} .extratop-links .idiomes { list-style: none; display: flex; margin-bottom: 0; gap: 15px; flex-direction: row; padding-left: 15px; border-left: 4px solid #bbb; align-items: center; } .extratop-links .idiomes li a { font-size: 14px; color: #b0b0b0; text-decoration: none; font-weight: 700; text-transform: uppercase; } .extratop-links .idiomes li a:hover, .extratop-links .idiomes li.active a { color: #1d2943; font-weight: 700; } /* ===== 13. FOOTER ===== */ #footer{ padding: 0 !important;} #footer p,#footer .h1,#footer .h2,#footer .h3,#footer li,#footer strong,#footer a:not(.btn){ padding: 0 !important;font-weight: lighter; font-family: var(--font-serif); font-optical-sizing: auto;} #footer p, #footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6, #footer a a:not(.btn), #footer span, #footer .p, #footer .h1, #footer .h2, #footer .h3, #footer .h4, #footer .h5, #footer .h6, #footer a:not(.btn), #footer span, #footer li { font-size: 14px } #footer .btn{border-color: #fff;} #footer .btn:hover{border-color: #000;} #footer .footer-social { background-color: var(--gris-claro); padding-top: 0.5%; padding-bottom: 0.5%; border-top: 2px solid var(--gris-borde); } #footer .footer-social .social-icons .intsocial p{ color: #000 !important; font-size: 23px !important; font-weight: lighter; font-family: var(--font-serif); font-optical-sizing: auto; line-height: 1.2em;} #footer .footer-social .social-icons .intsocial .sociallist{ align-items: center; } #footer .footer-social .social-icons .intsocial .sociallist li{ margin: 0 10px; } #footer .footer-social .social-icons .intsocial .sociallist li a { font-size: 23px !important; color: #000 !important; padding: 5px; border: 2px solid; border-radius: 50px; aspect-ratio: 1 / 1; display: flex; height: 39px; width: 39px; align-items: center; justify-content: center; } #footer .footer-legal{ padding-top: 0.5%; padding-bottom: 0.5%; border-top: 0.5px solid #f6f6f6 ; background-color: var(--rosa); } #footer .footer-legal .contenedor-legal p{text-transform: uppercase;} @media (min-width: 992px){ #footer .footer-legal .contenedor-legal { display: flex; justify-content: center; gap: 10px 20px; flex-wrap: wrap; } #footer .footer-legal p a::before{all:unset; content: "|"; font-weight: 400; color: #fff; margin-right: 20px;} } @media (max-width: 991px){ #footer .footer-legal{padding-top: 15px;} #footer .footer-legal .contenedor-legal{ display: grid; grid-template-columns: 1fr 1fr; text-align: center; gap: 10px 20px;} } #footer .footer-legal p:first-child a::before{content: unset;} #footer .footer-text{ padding-left: 35px; } #footer .footer-text p{ color: var(--gris-claro) !important; margin-bottom: 30px; font-weight: 300;font-size: clamp(12px, 1.6vw, 18px) !important; } #footer .footer-logo{ padding-top: 1%; padding-bottom: 1%; } #footer .footer-contact > div.row{padding-left: clamp(20px,4vw,80px); } #footer .footer-contact p{ color: var(--gris-claro) !important; font-weight: 300; font-size: 18px !important;} #footer .footer-contact p a{ font-size: 18px !important;} #footer .footer-contact p:last-child{margin-bottom: 30px;} #footer .footer-contact .btn.btn-brand {border-radius: 40px; border: 1px solid #fff; text-transform: unset !important; padding: 8px 50px !important; font-size: clamp(14px, 12.847px + 0.360vw, 18px); font-weight: 400; height: auto; width: auto; background: var(--gris-oscuro);} #footer .footer-contact .btn.btn-brand:hover{ background-color: #4d4d4d !important; border-color: #fff !important;} #footer .footer-member .h3{letter-spacing: 2px; font-weight: normal;font-size: clamp(16px, 13.982px + 0.631vw, 23px) !important;} #footer .footer-member .beauty {justify-content: center;} #footer .filtro-gris{filter: grayscale(1);} #footer .footer-logo img, #footer .logo-footer img { height: 40px; width: auto; } @media (max-width: 991px){ #footer .footer-logo img, #footer .logo-footer img{display: block; margin: 0 auto 30px;} } #footer .certificado-footer {max-width: unset !important; flex: unset !important; width: fit-content;} #footer .certificado-footer img{height: clamp(60px, 54.234px + 1.802vw, 80px); width: fit-content !important;} #footer .miembro-footer {max-width: 50% !important; flex: 0 0 50% !important; } #footer .miembro-footer img{height: clamp(40px, 37.117px + 0.901vw, 50px); width: fit-content !important;} /* ===== 14. HOME ===== */ #index main.margin-principal{margin-top: 0 !important;} #index .galeria-home .item{padding-right: 0; padding-left: 0;} #index .home-slider .home-slider-box div.row{display: flex; justify-content: right; } #index .home-slider .home-slider-box .caption{ padding: 0; top: 25%; position: absolute; z-index: 1;} /* #index .home-slider .home-slider-box .caption > div{ padding: 0; color: #000; font-size: clamp(18px, 3vw, 58px); font-weight: 100; font-family: var(--font-sans-serif); width: 56%; line-height: normal; } */ #index .individualbanner2 {display: flex; justify-content: center; align-items: center; } #index .individualbanner2 .caption{ pointer-events: all; display: block;} #index .individualbanner2 .caption h2{ margin-bottom: 30px; line-height: normal;} #index .individualbanner2 .caption h2 a{ color: #000; font-size: clamp(1.875rem, 1.775rem + 0.5vw, 2.375rem); font-weight: 600; margin-bottom: 15px; } #index .individualbanner2 .caption .details.info{ display: flex; justify-content: center;} #index .individualbanner2 .caption .details.info p{margin: 0; font-weight: normal; font-size: var(--tamaño-texto); width: 75%; line-height: normal;} #index .individualbanner2 .caption .portfolio-thumb{ margin: 0; } #index .listado-blog{margin-bottom: 50px;} #index .banner-makeup .individualbanner1 .caption figcaption p { color: var(--color-texto); } #index .bottom-banner .individualbanner2{ justify-content: start; } #index .bottom-banner .individualbanner2 .caption{padding: 0 !important;} #index .bottom-banner .individualbanner2 .caption .details .info p{width: 50%;} #index .banner-sostenibilidad h2{margin-bottom: 15px; font-size: clamp(33px, 10.426px + 2.278vw, 43px);font-family: var(--font-serif); letter-spacing: 3px;} #index .banner-sostenibilidad .info-banner .banner-text p { margin: 0 auto; color: var(--color-texto); font-size: clamp(18px, -23.524px + 3.463vw, 26px); font-weight: 300; line-height: normal; } /* #index .banner-sostenibilidad .info-banner .btn.btn-brand{ border-radius: 40px; border: 1px solid #000; text-transform: unset !important; padding: 8px 35px; font-size: clamp(14px, 12.847px + 0.360vw, 18px); font-weight: 500;height: auto;} #index .banner-sostenibilidad .info-banner .btn.btn-brand:hover{ background-color: #000 !important; } */ #index .banner-sostenibilidad .imagen-encima-contenedor > .row{justify-content: end;} #index .banner-sostenibilidad .imagen-encima { position: absolute; right: 50%; margin-top: 15%; } /* <=== INTRODUCTION ===> */ .introduction h1{ font-family: var(--font-sans-serif); color: #4d4d4d; font-weight: 400; font-size: clamp(30px, 20.775px + 2.883vw, 62px);} .introduction p { color: #4d4d4d; line-height: normal; font-weight: 300;font-size: clamp(22px, 19.694px + 0.721vw, 30px);} .introduction.v2 p { color: #4d4d4d; line-height: normal; font-weight: 300;font-size: clamp(16px, 14.27px + 0.541vw, 22px);} .introduction p strong { font-weight: 500;} /* ===== 15. PRODUCTOS ===== */ #productos .banner-animacion .banner-animacion-item .titol{top: 0 !important;} #productos .banner-animacion .banner-animacion-item .titol{font-size: clamp(24px, 19.964px + 1.261vw, 38px); font-weight: 700;} #productos .banner-animacion .banner-animacion-item:nth-child(1) .bannerwrapper6 .titol { text-align: right; } #productos .banner-animacion .banner-animacion-item:nth-child(2) .bannerwrapper6 .titol { text-align: left; width: 50%; } /* <=== LISTADO PRODUCTOS ===> */ #listado_productos .cat-banner > div.row{ justify-content: center; align-items: center; } #listado_productos .cat-banner .cat-caption{ position: absolute; right: 10%; } #listado_productos .cat-banner .cat-caption h1{ text-align: right; color: #fff; } .Productos-wrapper .filter-wrapper {} @media (min-width: 768px){ body:not(.Productos.fitxa) .Productos-wrapper .product-list-wrapper:not(:has(.featured-product-swiper, .accesorios-relacionados)) { padding-left: 75px; padding-right: 105px; padding-top: 75px;} } @media (max-width: 768px){ body:not(.Productos.fitxa) .Productos-wrapper .product-list-wrapper:not(:has(.featured-product-swiper, .accesorios-relacionados)) { padding-left: 30px; padding-right: 30px; padding-top: 30px;} } @media (max-width: 400px){ .product-list .Productos .item{ flex: 0 0 100% !important; max-width: 100% !important;} } .product-list .Productos .item{ padding: 0 15px; margin-bottom: 30px;} .product-list .Productos .item .post-details .title{ font-size: 20px; font-family: var(--font-sans-serif); text-align: center; line-height: normal; margin-bottom: 10px;} .product-list .Productos .item .post-details .referencia{ text-align: center; font-size: 16px; } .product-list .Productos .item .post-details .cat-item{margin-bottom: 0;} .product-list .Productos .item:hover img{ transform: unset; } .product-list .Productos .item:hover a{ text-decoration: unset !important; } .product-list picture{background-color: rgba(200,200,200,0.1);height: 100%; display: block;overflow: hidden;} .product-list picture img{mix-blend-mode:multiply} .product-list .post-details{margin-top:15px;} .product-list .Productos .item img{transition: 0.15s linear all;} .product-list .Productos .item:hover img{transform: scale(1.05);} /* <=== LANDING PAGINA CATEGORIA ===> */ #categoria-productos h1{text-transform: uppercase;} /* Categoria landing - reusable blocks layout */ #categoria-productos .categorias .reusable-block [data-settag="div"] { justify-content: flex-end; align-items: start; } #categoria-productos .categorias .reusable-block [data-settag="div"] > .active { margin-right: auto; } #categoria-productos .categorias .reusable-block .banner-overlay-content { pointer-events: none; } #categoria-productos .categorias .reusable-block .banner-overlay-details { pointer-events: auto; } /* Text gravita cap al centre de la composicio */ #categoria-productos .categorias .reusable-block [data-settag="div"] > div:nth-child(1) .banner-overlay-content { justify-content: flex-end !important; align-items: flex-end !important; padding: 40px !important; } #categoria-productos .categorias .reusable-block [data-settag="div"] > div:nth-child(2) .banner-overlay-content { justify-content: flex-start !important; align-items: flex-end !important; padding: 40px !important; } #categoria-productos .categorias .reusable-block [data-settag="div"] > div:nth-child(3) .banner-overlay-content { justify-content: flex-end !important; align-items: flex-start !important; padding: 40px !important; } #categoria-productos .categorias .reusable-block [data-settag="div"] > div:nth-child(4) .banner-overlay-content { justify-content: flex-start !important; align-items: flex-start !important; padding: 40px !important; } #categoria-productos .acceso-productos .reusable-block .row{justify-content: center;} /* <=== FITXA LISTADO PRODUCTOS POR CATEGORIA ===> */ .Productos.lev-1 .cat-banner > div.row{ justify-content: center; align-items: center; } .Productos.lev-1 .cat-banner .cat-caption{ position: absolute; right: 10%; } .Productos.lev-1 .cat-banner .cat-caption h1{ text-align: right; color: #fff; } /* <=== FITXA PRODUCTOS ===> */ .headerproduct .caption{position:absolute; z-index: 10;left: 0; right: 0;} .headerproduct .int-header > .row{display:flex;align-items: center;} .catproduct{text-align: right; color:#fff; margin-bottom:0;} .fotoheader { max-height: 150px; overflow: hidden; } @media (max-width: 991px){ .fotoheader { margin-bottom: 30px;} } .breadcrumb-container{margin: 0 auto; position: absolute; left: 0; right: 0; bottom: 0;} .breadcrumb-container > div{text-align: right;} .breadcrumb-container .breadcrumb { background: transparent;} .breadcrumb-container .breadcrumb a,.breadcrumb ul li::after{color:#fff;} .breadcrumb-container .breadcrumb ul li:first-child{display:none;} .menuprods{margin: 0 auto !important; position: absolute; left: 0; right: 0;} #catheader .caption{position:absolute; z-index: 10;left: 0; right: 0;} #catheader > .row{display:flex;align-items: center;} #catheader h1{margin-bottom:0; } .Productos.fitxa h1{ margin-bottom: 0 !important; font-size: clamp(24px, 22.270px + 0.541vw, 30px);} .Productos.fitxa .referencia-container { color: var(--gris-texto-secundario); font-size: 14px; } .Productos.fitxa .referencia-container:has(span:empty){display: none;} .Productos.fitxa .accesorios-relacionados{background-color: var(--gris-claro); padding: 15px; border-radius: 10px; } .Productos.fitxa .accesorios-relacionados h2 { font-size: var(--h4-font-size); font-weight: 700; color: #000; font-family: var(--font-sans-serif); margin-bottom: 15px; } .Productos.fitxa .encuentra-producto { color: var(--rojo); text-transform: uppercase; font-family: var(--font-sans-serif); letter-spacing: normal; line-height: normal; font-size: 20px; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2); height: fit-content; padding: 20px; display: block; width: fit-content; /* margin-top: 10px; */ font-weight: 500; } .Productos.fitxa .encuentra-producto:hover{text-decoration: none !important; color: #fff; background-color: var(--rojo);} .Productos.fitxa .Productos-wrapper .product-list-wrapper:has(.accesorios-relacionados){ padding-left: 15px; padding-right: 15px; padding-top: 0; } .Productos.fitxa .accesorios-relacionados .listado-related.product-list > .row{margin: 0 !important;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item{margin: 5px 0; background-color: #F2F2F2; border-radius: 10px; padding: 10px;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item .single-post-slide-wrap .post-details {margin-top: 0;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item .single-post-slide-wrap .post-details .post-content a {display: flex; align-items: center; gap: 5px;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item .single-post-slide-wrap .post-details .post-content a .post-image {margin-right: 15px;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item .single-post-slide-wrap .post-details .post-content a .post-image img{width: 40px !important; mix-blend-mode: darken; padding: 0 !important;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item .single-post-slide-wrap .post-details .post-content a h3 {margin-bottom: 0; color: #000; font-size: 16px; font-family: var(--font-sans-serif); font-weight: normal;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item .single-post-slide-wrap .post-details .post-content a .referencia {margin-bottom: 0; color: var(--gris-texto-terciario); font-size: 16px; font-family: var(--font-sans-serif); font-weight: 500;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item .single-post-slide-wrap .post-details .post-content a .referencia .Referencia {margin-bottom: 0; color: var(--gris-texto-terciario); font-size: 16px; font-family: var(--font-sans-serif); font-weight: normal;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item .single-post-slide-wrap .post-details .post-content a .item-arrow {color: #BCB1BC; position: absolute; right: 5%; transition: all 0.5s ease;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item .single-post-slide-wrap .post-details .post-content a .item-arrow i{font-size: 30px;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item:hover .single-post-slide-wrap .post-details .post-content a { text-decoration: unset !important; color: #000 !important;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item:hover .single-post-slide-wrap .post-details .post-content a img{ transform: unset !important; filter: unset !important;} .Productos.fitxa .accesorios-relacionados .listado-related.product-list .item:hover .single-post-slide-wrap .post-details .post-content a .item-arrow {color: #BCB1BC; position: absolute; right: 3%;} .Productos.fitxa .table-container{ width: 100%; overflow-x: auto; margin-bottom: 20px;} .Productos.fitxa .table-container table{ font-size: 14px; width: 100%; line-height: 24px; transition: all 250ms linear;} .Productos.fitxa .table-container table thead tr th{ font-weight: 600; background-color: var(--gris-claro); padding: 0 10px; height: 60px; font-size: 14px;text-align: center; line-height: normal;} .Productos.fitxa .table-container table thead tr th.caja-header{max-width: 90px;} .Productos.fitxa .table-container table tbody tr td { font-size: 14px; line-height: normal; padding: 0 10px; background-color: var(--fondo-gris); height: 60px; font-weight: 500;text-align: center; } .Productos.fitxa .table-container table tbody tr td.cantidad-carrito{display: flex; flex-direction: row; align-items: center; column-gap: 10px;} .Productos.fitxa .table-container table tbody tr td.cantidad-carrito .quantitat{ display: flex; flex-direction: row; border: 1px solid #ced4da; width: fit-content; margin: 0 auto;} .Productos.fitxa .table-container table tbody tr td.cantidad-carrito .quantitat input {width: 45px; margin-bottom: 0; text-align: center; font-family: var(--font-sans-serif); padding: 0; font-size: 12px; border-radius: 0; border: none;} .Productos.fitxa .table-container table tbody tr td.cantidad-carrito .quantitat input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .Productos.fitxa .table-container table tbody tr td.cantidad-carrito .quantitat button{ height: auto; padding: 7px; font-size: 12px; margin-bottom: 0; border: none; background-color: #fff; transition: all 0.3s ease-in-out;} .Productos.fitxa .table-container table tbody tr td.cantidad-carrito .quantitat button:hover{background-color: #000; color: #fff;} .Productos.fitxa .table-container table tbody tr td .comprarbut{border: none; background: none; padding: 0;} .Productos.fitxa .table-container table tbody tr:nth-child(even) td{ background-color: #fff;} /* .Productos.fitxa .table-container table thead tr th:first-child, .Productos.fitxa .table-container table tbody tr td:first-child{position: sticky; left: 0; z-index: 10; filter: brightness(0.95);} .Productos.fitxa .table-container table thead tr th:last-child, .Productos.fitxa .table-container table tbody tr td:last-child{position: sticky; right: 0; z-index: 10; filter: brightness(0.95);} */ .Productos.fitxa .table-legend{display: none;} .Productos.fitxa .table-legend div{ display: flex; justify-content: center; align-items: center; gap: 7px; } .Productos.fitxa .table-legend p{font-size: 12px; text-align: center;} .Productos.fitxa .table-legend i{font-size: 16px;} .Productos.fitxa .table-legend i:first-child, .Productos.fitxa .table-legend i:last-child{font-size: 12px;} .Productos.fitxa .post-cat .cat-item a{color: var(--azul); font-weight: 500;} .product-list .Productos .post-cat { display: flex ; flex-wrap: wrap; align-items: center; justify-content: center; } .product-list .Productos .post-cat .cat-item a{color: var(--azul); font-weight: 500;} .Productos.fitxa .galeria-producto { max-width: calc(100% - 30px); margin-left: auto; margin-right: auto; } .Productos.fitxa .product-info{margin-top: 30px;} .Productos.fitxa .articles-table{margin-top: 30px; margin-bottom: 30px;} .Productos.fitxa .gallery-thumbs .swiper-wrapper{padding: 1px;} .Productos.fitxa .gallery-thumbs-wrap { max-width: 100%; } .Productos.fitxa .gallery-thumbs-wrap .gallery-main { width: 100%; margin-bottom: 10px; } .Productos.fitxa .gallery-thumbs-wrap .gallery-main .swiper-slide { overflow: hidden; } .Productos.fitxa .gallery-thumbs-wrap .gallery-main .swiper-slide picture, .Productos.fitxa .gallery-thumbs-wrap .gallery-main .swiper-slide img { width: 100%; height: auto; display: block; object-fit: contain; } .Productos.fitxa .gallery-thumbs-wrap .gallery-thumbs { width: 100%; } .Productos.fitxa .gallery-thumbs-wrap .gallery-thumbs .swiper-slide { opacity: 0.5; cursor: pointer; transition: opacity 0.3s; overflow: hidden; } .Productos.fitxa .gallery-thumbs-wrap .gallery-thumbs .swiper-slide-thumb-active { opacity: 1; outline: 1px solid #ddd; } .Productos.fitxa .gallery-thumbs-wrap .gallery-thumbs .swiper-slide img { width: 100%; object-fit: cover; display: block; aspect-ratio: 1; padding: 5px; } /* .table-container tr td:nth-child(6), .table-container tr td:nth-child(7), .table-container thead th:nth-child(7), .table-container thead th:nth-child(6){display: none !important; } */ /* ===== 16. SERVICIOS ===== */ #servicios .overlay { height: unset !important; } #servicios .listado-categorias .product-list article.item .single-post-slide-wrap .post-details{top: unset !important; bottom: 0;} #servicios .listado-servicios .icontext-bloc .individualbanner1 .caption{ width: 100%; margin-bottom: 0; margin-top: unset; bottom: 20px; padding: 0 30px;} #servicios .listado-servicios .icontext-bloc .individualbanner1 .caption h2{color: #fff !important; margin:0;} #servicios .listado-servicios .icontext-bloc .individualbanner1 .caption h2 a { color: #fff !important; font-family: var(--font-serif); font-size: clamp(20px, 17.694px + 0.721vw, 28px); line-height: 1em; display: block;} #servicios .listado-servicios .icontext-bloc .individualbanner1 .caption .details{display: none;} #servicios .listado-servicios .icontext-bloc .individualbanner1:hover .caption h2{transform: unset !important;} #servicios .listado-servicios .icontext-bloc .icontext{display: flex; justify-content: center; margin-bottom: 15px;} #servicios .listado-servicios .icontext-bloc .icontext .feature-info{ position: absolute; padding-top: 15px;} #servicios .listado-servicios .icontext-bloc .icontext .feature-info h2{color: #fff !important;} #servicios .listado-servicios .icontext-bloc p{text-align: center; } #servicios .listado-servicios .icontext-bloc{padding: 0; } #servicios .listado-servicios .banner.absolute{display: block;} #servicios .listado-servicios .icontext-bloc .row{display: block; padding: 0; margin: 0;} #servicios .listado-servicios .icontext-bloc .individualbanner1details .info p{font-weight: 300;} #servicios .listado-servicios .icontext-bloc .individualbanner1details .info {padding: 15px;} #quadrat .product-list .item .post-details{ bottom: 30px!important;} /* <=== FITXA SERVICIOS ===> */ #headservicio {align-items: center; background-color: #F2F2F2;} #headservicio .servicios-foto{padding: 50px 0;} #servicio_fitxa .servicios-titular{position: absolute; left: 10%; } #servicio_fitxa .servicios-titular-2{background-color: rgba(255, 255, 255, 0.6); padding: 20px;} #servicio_fitxa .servicios-titular h1{ font-family: var(--font-serif); color: #222; font-weight: 400; font-size: clamp(1.875rem, 1.775rem + 1vw, 3.875rem); margin-bottom: 15px} #servicio_fitxa .servicios-titular h2{ font-family: var(--font-sans-serif); color: #222; font-weight: 500; margin-bottom:0; } #servicio_fitxa .servicios-titular p{font-size: 18px !important; color: #222; } #servicio_fitxa .banner-animacion .banner-animacion-item .titol{top: 0 !important}; #servicio_fitxa .banner-animacion .banner-animacion-item:nth-child(1) .bannerwrapper6 .titol, #servicio_fitxa .banner-animacion .banner-animacion-item:nth-child(2) .bannerwrapper6 .titol, #servicio_fitxa .banner-animacion .banner-animacion-item:nth-child(3) .bannerwrapper6 .titol{bottom: 0;} #servicio_fitxa .bloque-texto-imagen{padding: 0;} #servicio_fitxa .bloque-texto-imagen h2{margin-bottom: 20px;} #servicio_fitxa .bloque-texto-imagen p{margin-bottom: 20px; font-size: 18px;} #servicio_fitxa .bloque-texto-imagen:nth-child(odd){background-color: var(--fondo-gris);} #servicio_fitxa .bloque-texto-imagen:nth-child(odd) img{mix-blend-mode: multiply;} #servicio_fitxa .bloque-texto-imagen:last-child{padding: 0;} #servicio_fitxa main .fullwidth {margin-top:0; margin-bottom:0} .bannerproducto.banner.right{ justify-content: flex-start; text-align: left;} .bannerproducto{ padding: 50px 0;} .bannerproducto h2{ font-size: 2.875rem; line-height: 1em; display: block; bottom: 0; margin: 0; letter-spacing: 2px; top: unset !important; font-family: var(--font-serif);} .bannerproducto h2 a{font-family: var(--font-serif);} .bannerproducto h3{font-family: var(--font-sans-serif);} .bannerproducto .int-foto{ margin: 0 auto; width: fit-content; display: block;} .bannerproducto .int-foto img{height: clamp(300px, 271.171px + 9.009vw, 400px); width: fit-content !important;} .bannerproducto .info{ flex-direction: column; align-items: baseline; justify-content: center; display: flex;} #banners_servicios .banner-animacion-item .bannerwrapper6 .titol{ font-size: 3.775rem; line-height: 1em; display: block; bottom: 0; margin: 0; letter-spacing: 2px; top: unset !important;font-family: var(--font-serif); } #banners_servicios .banner-animacion-item .bannerwrapper6 .titol a{line-height: inherit;} #banners_servicios .banner-animacion-item .bannerwrapper6 .individualbanner6 .container{ display: block;} /* ===== 17. BLOG ===== */ .listado-blog-wrapper .listado-especial.listado-blog article .single-post-slide-wrap .post-details { position: absolute; padding: 15px; background-color: var(--fondo-gris); margin: 0 -15px; width: calc(100% - 30px); } .listado-blog-wrapper .listado-especial.listado-blog .new-blog-container > div.row article{width: 50%; padding: 0 15px; } .listado-blog-wrapper .listado-especial.listado-blog .new-blog-container > div.row article .post-details { position: absolute; padding: 15px; background-color: var(--fondo-gris); margin: 0 -15px; width: calc(100% - 30px); } .listado-especial.listado-blog .listado-pagina .item .single-post-slide-wrap > a{width: 100% !important;} .Blog.lev-1 .listado-especial.listado-blog article .single-post-slide-wrap .post-details { position: absolute; padding: 15px; background-color: var(--fondo-gris); margin: 0 -15px; width: calc(100% - 30px); } .Blog.lev-1 .listado-especial.listado-blog .new-blog-container > div.row article{width: 50%; padding: 0 15px; } .Blog.lev-1 .listado-especial.listado-blog .new-blog-container > div.row article .post-details { position: absolute; padding: 15px; background-color: var(--fondo-gris); margin: 0 -15px; width: calc(100% - 30px); } .listado-blog .swiper .item {margin-bottom: 0 !important;} .listado-blog .swiper .item .blogfoto{width:100%;} .listado-blog-wrapper { margin: 0 !important; } .listado-blog-wrapper .item {margin-bottom: 30px; } .listado-blog-wrapper .item .single-post-slide-wrap { display: flex; align-items: end; justify-content: center; } .listado-blog-wrapper .item .single-post-slide-wrap > a{width: 100%;} .listado-blog-wrapper .item .single-post-slide-wrap img { filter: grayscale(100%) brightness(1.0) sepia(25%) hue-rotate(170deg) saturate(250%); transition: filter 0.3s ease-in-out;} .listado-blog-wrapper .item .single-post-slide-wrap .post-details { position: absolute; width: 100%; padding: 15px clamp(16px, 14.270px + 0.541vw, 22px); background-color: var(--fondo-gris); } .listado-blog-wrapper .item .single-post-slide-wrap .post-details h3 { font-family: var(--font-sans-serif); font-size: clamp(14px, 12.27px + 0.541vw, 20px); font-weight: 500; color: #666666; } .listado-blog-wrapper .listado-pagina .item .single-post-slide-wrap .post-details h3 { font-family: var(--font-sans-serif); font-size: 16px; font-weight: 500; margin-bottom: 20px; color: #666;} .listado-blog-wrapper .item .single-post-slide-wrap .post-details .block-ellipsis{font-size: 14px; margin-bottom: 20px;} .listado-blog-wrapper .listado-pagina .item .single-post-slide-wrap .post-details .block-ellipsis{font-size: 15px; margin-bottom: 20px; color: #666;} .listado-blog-wrapper .item .single-post-slide-wrap .post-details .publicacion { font-weight: 300; color: #666; font-size: clamp(12px, 11.423px + 0.180vw, 14px); } .listado-blog-wrapper .listado-pagina .item .single-post-slide-wrap .post-details .publicacion {color: var(--gris-texto-terciario);} .listado-blog-wrapper .item:hover img { filter: grayscale(0%) brightness(1) sepia(0%) hue-rotate(0deg) saturate(100%);} .listado-blog-wrapper .item:hover a { text-decoration: unset !important; } .listado-blog-wrapper .listado-pagina .item-special .single-post-slide-wrap .post-details h3{ font-size: clamp(14px, 9.387px + 1.441vw, 30px); } .listado-blog-wrapper .listado-pagina .item-special .single-post-slide-wrap .post-details .publicacion { font-size: clamp(14px, 13.423px + 0.180vw, 16px); } /* <=== FITXA BLOG ===> */ .Blog.fitxa .share-block .details__footer{ background-color: var(--gris-claro); border: unset; } .Blog.fitxa .share-block .details__footer .details__footer__item{ padding: 10px !important; width: 100%; } .Blog.fitxa .share-block .details__footer .details__footer__item .footer-item-right{ width: 100%; margin: 0; } .Blog.fitxa .share-block .details__footer .details__footer__item .footer-item-right .share-item{ display: flex; justify-content: space-around; } .Blog.fitxa .share-block .details__footer .details__footer__item .footer-item-right .share-item a{ margin: 0; width: 30px; display: inline-block; text-align: center; color: var(--gris-texto-secundario); line-height: normal;} .Blog.fitxa .share-block .details__footer .details__footer__item .footer-item-right .share-item a i{font-size: 23px;} .Blog.fitxa .portada img{ border-radius: 5px; margin-bottom: 35px; } .Blog.fitxa .descripcion li, .Blog.fitxa .descripcion p { text-align: left; font-size: 21px; color: #333; font-weight: 300; } .Blog.fitxa .publicacion p { text-align: left; margin: 0; font-weight: 600; color: var(--gris-texto-terciario); font-size: clamp(14px, 12.559px + 0.450vw, 19px); margin-bottom: 15px; } .Blog.fitxa .titular{ margin-bottom: 25px; } .Blog.fitxa .titular h1 { font-weight: 200; font-family: var(--font-sans-serif); font-size: clamp(28px, 22.234px + 1.802vw, 48px); color: #666666;} .Blog.fitxa .titular .seccion{ text-align: left; color: #888888; font-size: 18px; } .Blog.fitxa h2{ font-weight: 400; } .Blog.fitxa .listado-especial.listado-blog article .single-post-slide-wrap{ display: flex; align-items: end; justify-content: center; } .Blog.fitxa .listado-especial.listado-blog article .single-post-slide-wrap .post-details{ width: calc(100% - 30px); padding: 15px; background-color: var(--fondo-gris); } .Blog.fitxa .listado-especial.listado-blog article .single-post-slide-wrap .post-details h3{ font-family: var(--font-sans-serif); font-weight: normal; line-height: normal; font-size: 20px; } .Blog.fitxa .listado-especial.listado-blog article .single-post-slide-wrap .post-details .publicacion{ font-weight: 600; color: var(--gris-oscuro); font-size: 12px; } .Blog.fitxa .listado-especial.listado-blog article:hover img{ transform: unset; } .Blog.fitxa .listado-especial.listado-blog article:hover a{ text-decoration: unset !important; } .Blog.fitxa .subtitulo h2 { padding-left: 60px; color: #666; font-weight: 200; font-family: var(--font-sans-serif); font-size: clamp(20px, 17.694px + 0.721vw, 28px); } .Blog.fitxa .subtitulo h2::before {font-family: "FontAwesome";content: url(/media/images/iconos/flecha_rafesa.svg);position: absolute;left: 15px;top: 5px;color: #B8DBD9;width: 50px;} .Blog.fitxa .post-cat{display: flex; gap: 10px;} .Blog.fitxa .post-cat .cat-item{margin-bottom: 0;} .Blog.fitxa .post-cat .cat-item a { color: var(--gris-texto-terciario); font-weight: 200; font-size: 23px; } .Blog.fitxa .contentext .h1, .Blog.fitxa .contentext .h2, .Blog.fitxa .contentext .h3, .Blog.fitxa .contentext .h4, .Blog.fitxa .contentext .h5, .Blog.fitxa .contentext .h6, .Blog.fitxa .contentext h1, .Blog.fitxa .contentext h2, .Blog.fitxa .contentext h3, .Blog.fitxa .contentext h4, .Blog.fitxa .contentext h5, .Blog.fitxa .contentext h6, .Blog.fitxa .contentext .title { margin-bottom: 20px; font-weight: 300; font-family: var(--font-sans-serif); color: #000; } .Blog.fitxa .contentext ul + h2, .Blog.fitxa .contentext p + h2{margin-top: 45px;} .Blog.fitxa .contentext ul + h3, .Blog.fitxa .contentext p + h3{margin-top: 30px;} .Blog.fitxa .contentext h5+h3, .Blog.fitxa .contentext h4+h3 { margin-top: 30px; } .Blog.fitxa .contentext ul+h5, .Blog.fitxa .contentext p+h5, .Blog.fitxa .contentext ul+h4, .Blog.fitxa .contentext p+h4 { margin-top: 20px; } .Blog.fitxa .contentext p+h5, .Blog.fitxa .contentext p+h4, .Blog.fitxa .contentext p:has(+ p) { margin-bottom: 20px; } /* ===== 18. EVENTOS ===== */ #eventos .listado-categorias .product-list article.item .single-post-slide-wrap .post-details{ top: 0; bottom: 0; height: fit-content; margin: auto; } #eventos .overlay { height: unset !important; } .Eventos.fitxa .btn-sheet .btn{width: fit-content; } .Eventos.fitxa .post-information-box .post-information .fechas{font-weight: bold;} .Eventos.fitxa .post-information-box .post-information {margin-bottom: 20px;} .Eventos.fitxa .post-information-box .post-information p.name-event{font-size: clamp(18px, 16.559px + 0.450vw, 23px); color: #4d4d4d; margin-bottom: 0; font-weight: 200;} .Eventos.fitxa .post-information-box .post-information p.date-event{font-size: clamp(10px, 9.423px + 0.180vw, 12px); color: #4d4d4d; margin: 10px 0; font-weight: 700;} .Eventos.fitxa .post-information-box .post-information p.stand-event{font-size: clamp(18px, 16.559px + 0.450vw, 23px); color: #4d4d4d; font-weight: 200;} .Eventos.fitxa h1{font-family: var(--font-sans-serif); font-size: clamp(28px, 22.234px + 1.802vw, 48px); margin-bottom: 15px; font-weight: 200;} .Eventos.fitxa .contentext p{color: #333; font-size: clamp(16px, 14.559px + 0.450vw, 21px);} .Eventos.fitxa .h2, .Eventos.fitxa .h3, .Eventos.fitxa .h4, .Eventos.fitxa .h5, .Eventos.fitxa .h6, .Eventos.fitxa h2, .Eventos.fitxa h3, .Eventos.fitxa h4, .Eventos.fitxa h5, .Eventos.fitxa h6, .Eventos.fitxa .title { margin-bottom: 20px; font-weight: 300; font-family: var(--font-sans-serif); color: #000; } .Eventos.fitxa .imagen-principal img{aspect-ratio: 1; object-fit: contain; border: 3px solid #eee; padding: 10px;} .listado-eventos .item .post-details { background-color: var(--fondo-gris); padding: 20px; } .listado-eventos .item .post-details .Fechas { font-weight: bold; } .listado-eventos .item .post-details a {text-decoration: none;} .listado-eventos .item .post-details h3 { font-size: clamp(16px, 14.27px + 0.541vw, 22px); font-weight: 200; font-family: var(--font-sans-serif); margin-bottom: 5px; } .listado-eventos .item .post-details p.name-event { font-size: clamp(11px, 10.423px + 0.180vw, 13px); color: #666; margin-bottom: 5px; } .listado-eventos .item .post-details p.date-event { font-size: 12px; color: #9b9b9b; margin-bottom: 5px; font-weight: 400; } .listado-eventos .item .post-details p.stand-event { font-size: 12px; font-weight: 500; color: #9b9b9b; } .listado-eventos .item { height: auto; margin-bottom: 30px; } .listado-eventos .item .single-post-slide-wrap { height: 100%; display: flex; flex-direction: column; } .listado-eventos .item .post-details { background-color: #f3f3f3; padding: 20px; height: 100%; margin-top: 0;} .listado-eventos .item img { filter: sepia(1) hue-rotate(175deg) saturate(0.7) brightness(1.12); transition: filter 0.3s ease; } .listado-eventos .item:hover img { transform: unset; filter: none; } .listado-eventos .item:hover .single-post-slide-wrap > a { background: transparent; } .listado-eventos .item:hover .single-post-slide-wrap > a::after { opacity: 0; } .listado-eventos .item .single-post-slide-wrap > a { position: relative; display: block; overflow: hidden; flex-shrink: 0; background: #cde4f3; } .listado-eventos .item .single-post-slide-wrap > a::after { content: ""; position: absolute; inset: 0; background: rgba(63, 121, 158, 0.18); pointer-events: none; transition: opacity 0.3s ease; } .listado-eventos .swiper .item{margin-bottom: 0;} .listado-eventos .swiper .item .post-details{ background-color: #e6e5e5;} /* ===== 19. EMPRESA I EQUIP ===== */ #empresa .gallery .swiper-slide{padding: 15px;} #empresa .gallery .swiper-button-next{right: clamp(15px, 10.676px + 1.351vw, 30px); top: calc(50% - 16px);} #empresa .gallery .swiper-button-prev{left: clamp(15px, 10.676px + 1.351vw, 30px); top: calc(50% - 16px);} /* #empresa h2{font-family: var(--font-serif); margin-bottom: 5px; font-size: 43px; letter-spacing: 3px;} */ .bannerpopup { border: 1px solid #666; padding: 15px; aspect-ratio: 1 / 1; display: flex; flex-direction: column; border-radius: 25px; margin-bottom: 30px;} .bannerpopup .portfolio-thumb{margin-bottom: 5px !important;} #empresa .bannerpopup .portfolio-thumb img{ max-width: 170px; } #empresa .bannerpopup .infopop h2{ font-size: clamp(18px, 2vw, 28px); line-height: normal; letter-spacing: 1px;} #empresa .bannerpopup .infopop span{display: block; line-height: normal; letter-spacing: 0; font-size: clamp(16px, 1.9vw, 24px); font-weight: 500;} #empresa .bannerpopup .infopop .btn{ padding: 10px; line-height: normal; width: 35px; height: 35px; border: 2px solid #000; margin-top: 15px;} .modalpop img{ max-width: 145px; } .modalpop .modal-title{ font-size: clamp(18px, 2.5vw, 38px); line-height: normal; letter-spacing: 1px; font-family: var(--font-serif); text-align: center;} .modalpop .modal-title span{display:block; font-size: clamp(16px, 2.3vw, 34px); letter-spacing: 0;} .modalpop .modal-text p{ font-weight: 300; line-height: normal;} .modalpop .modal-text p strong{ font-weight: 500; } .modalpop .close{ padding: 0px; line-height: normal; width: 35px; height: 35px; border: 2px solid #000; opacity: 1; border-radius: 50%; display: flex; align-items: center; justify-content: center;} .modalpop .modal-footer{ justify-content: center; padding-bottom: 30px;} .modalpop .close span{ line-height: 0; display: block;} .modalpop .modal-dialog { max-width: 780px; padding: 30px;} .modalpop .modal-content{ border-radius: 15px;} #empresa #ISO .gallery .gallerycontent{ justify-content: space-around; margin-bottom: 30px;} #empresa #ISO .gallery .gallerycontent .item{max-width: 20%; flex: 0 0 20%;} .empresa-first-box .empresa-first-box-right{padding-left: clamp(15px, -86.583px + 10.251vw, 60px);} .empresa-first-box .empresa-first-box-right p{margin-bottom: 30px;} .empresa-first-box .empresa-first-box-right p:last-child{margin-bottom: 0;} #empresa .galeria-membresias .gallery .item { background: var(--fondo-azul-claro); margin-bottom: 0 !important; } #empresa .galeria-membresias .gallery .item > div { mix-blend-mode: multiply; background: white; } #empresa .galeria-membresias .gallery .item > div > a > picture > img { aspect-ratio: 1; display: block; object-fit: contain; object-position: center; padding: 15px; } #empresa .compromiso-rsc .gallery .item {display: flex; align-items: center; aspect-ratio: 1; object-fit: contain;} #equipo{ align-items: end; overflow: hidden; } #equipo .extra-info{ position: absolute; background: var(--fondo-gris); height: 35px; max-width: calc(100% - 30px); overflow: hidden; transition: all 0.3s ease-in-out;} #equipo img{filter: grayscale(1);} #equipo:hover .extra-info{height: 100%;} #equipo .extra-info h3{margin-bottom: 0;} #equipo .extra-info .cargo p{font-weight: bold; font-size: 14px;} #equipo .extra-info p{font-size: 12px; margin-bottom: 0;} .imagen-equipo img{mix-blend-mode: multiply;} /* <=== LISTADO EQUIPO ===> */ .itemstaff{padding: 0; cursor: pointer;} .itemstaff .image{ filter: saturate(0);padding: 0; transition: all 0.3s ease-in-out;} .itemstaff:hover .image{ filter: saturate(1);} .itemstaff > .row{position:relative;} .itemstaff .excerpt{position: absolute; background: rgba(255, 255, 255, 0.8); bottom: 0;} .itemstaff .excerpt::before{} .itemstaff .excerpt .nom .h2 .title, .itemstaff .excerpt .nom .h2{font-family: var(--font-sans-serif); font-size: 18px; font-weight: 300; margin-bottom: 5px;} .itemstaff .excerpt .carrec .h3{font-family: var(--font-sans-serif); font-size: 14px;} .itemstaff .excerpt .xarxes{display:none;} .itemstaff .excerpt .curriculum{display:none;} .itemstaff .excerpt .curriculum p{font-size: 12px;} .itemstaff.active .excerpt .xarxes{display:block;} .itemstaff.active .excerpt .curriculum{display:block;} .itemstaff .excerpt{ position: absolute; left: 0; right: 0; bottom: 0; height: 80px; overflow: hidden; background: rgba(255,255,255,0.7); transition: height .45s ease; padding: 20px; clip-path: polygon(0% 0%, calc(50% - 14px) 0%, 50% 14px, calc(50% + 14px) 0%, 100% 0%, 100% 100%, 0% 100%); } .itemstaff.active .excerpt{ height: 100%; } .itemstaff .excerpt .xarxes, .itemstaff .excerpt .curriculum{ opacity: 0; transform: translateY(10px); transition: opacity .3s ease .2s, transform .3s ease .2s; } .itemstaff.active .excerpt .xarxes, .itemstaff.active .excerpt .curriculum{ opacity: 1; transform: translateY(0); } .itemstaff .social-icons li a { color: var(--button-content); border-radius: 5px; border: 2px solid var(--button-content); width: 30px; height: 30px; display: inline-block; } .itemstaff .fa-linkedin:before { content: "\f0e1"; } .itemstaff .intsocial { justify-content: flex-start; padding: 0 15px; } .product-list .Equipo .item {margin-bottom: 30px;} .product-list .Equipo .item .single-post-slide-wrap { overflow: hidden; position: relative; border-radius: 10px;} .product-list .Equipo .item .post-miniature img{filter: grayscale(1);} .product-list .Equipo .item .post-content { padding: 10px; background: var(--fondo-gris-transparencia); } .product-list .Equipo .item .post-details .post-title .title{ margin-bottom: 10px; } .product-list .Equipo .item .post-details .post-cargo{margin-bottom: 10px;} .product-list .Equipo .item .post-details .post-contacto{ display: flex; flex-wrap: wrap; gap: 10px; justify-content: start; margin-bottom: 10px;} .product-list .Equipo .item .post-details .post-contacto > div { aspect-ratio: 1 / 1; width: 30px; height: 30px; display: flex ; align-items: center; justify-content: center; border-width: 1px !important; font-size: 15px; } .product-list .Equipo .item .post-details .post-contacto .linkedin{ border-radius: 10px; padding: 2px; border: 1px solid #000;} .product-list .Equipo .item .post-details .post-contacto .email, .product-list .Equipo .item .post-details .post-contacto .telefono{padding: 2px; border-radius: 100px; border: 1px solid #000;} .product-list .Equipo .item {height: auto;} .product-list .Equipo .item .single-post-slide-wrap{ display: flex ; flex-direction: column; justify-content: end; position: relative; } .product-list .Equipo .item .single-post-slide-wrap .post-details{ position: absolute; width: 100%; display: flex; flex-direction: column; justify-content: end;} .product-list .Equipo .item .single-post-slide-wrap, .product-list .Equipo .item .single-post-slide-wrap .post-details {height: 100%;} @media only screen and (min-width: 992px) { .product-list .Equipo .item .post-content-overflow {opacity: 0;pointer-events: none; transform: translateY(500px); transition: all 0.5s ease-in-out; position: absolute;top: 0;bottom: 0;height: 100%; width: 100%;} .product-list .Equipo .item .post-content-overflow-inner {padding: 30px 10px 0;background: var(--fondo-gris-transparencia);height: 100%;} .product-list .Equipo .item:hover .post-content-overflow {opacity: 1; pointer-events: unset; transform: translateY(0); height: unset;} .product-list .Equipo .item .post-content {transition: all 0.3s ease-in-out;} .product-list .Equipo .item:hover .post-content {opacity: 0; pointer-events: unset; visibility: hidden;} .product-list .Equipo .item .post-content-overflow .post-summary p{ font-weight: 400; font-size: clamp(12px, 10.847px + 0.360vw, 16px); line-height: 150%; letter-spacing: 0.3px; vertical-align: middle; } .product-list .Equipo .item .post-content .btn{display: none;} } @media only screen and (max-width: 991px) { .product-list .Equipo .item .post-content{display: none;} .product-list .Equipo .item .post-content-overflow { padding: 10px; background: var(--fondo-gris-transparencia); } } .empresa-valores-right{padding-left: clamp(15px, 6.351px + 2.703vw, 45px);} /* ===== 20. CONTACTE ===== */ #contacte h1{font-family: var(--font-sans-serif); font-weight: 300; margin-bottom: 0;} #contacte h2.h1{font-family: var(--font-serif); font-weight: 400; text-transform: uppercase;} #contacte .faqForm{ color: #000; } #contacte .faqForm .contact-form-wrapper form fieldset > .form-input-item{ align-items: end; margin-bottom: 20px; } #contacte .faqForm .contact-form-wrapper form fieldset > .form-input-item:nth-child(5){ justify-content: unset; align-items: unset; flex-direction: column; } #contacte .faqForm .contact-form-wrapper form fieldset > .form-input-item textarea{ height: 130px; } #contacte .faqForm .contact-form-wrapper form fieldset > .form-input-item label{ width: unset; text-transform: uppercase; } #contacte .faqForm .contact-form-wrapper form fieldset > .form-input-item input, #contacte .faqForm .contact-form-wrapper form fieldset > .form-input-item textarea{ background-color: transparent; width: 100% !important; } #contacte .faqForm button#singlebutton { border: 1px solid #000; color: #000; width: auto; padding: 10px 50px; margin-bottom: 10px; text-transform: uppercase !important; font-size: clamp(0.625rem, 0.573rem + 0.2778vw, 0.75rem); background-color: transparent; transition: all 0.5s ease-in-out; border-radius: 0; pointer-events: all; margin-top: 0px; } #contacte .faqForm button#singlebutton:hover { background-color: #000 !important; color: #fff; box-shadow: unset; } #contacte .faqForm .form-style::placeholder {color:#4d4d4d!important;opacity: 1;padding-left: 0 !important;} #contacte .faqForm .form-style{ margin-left: 0;padding-left: 0 !important; border: 1px solid #ccc; color: #000; border-top: 0; border-right: 0; border-left: 0; border-radius: 0; border-color:#4d4d4d; } #contacte .faqForm .contact-form-wrapper form .form-input-item:last-child{text-align: unset;} #contacte .faqForm small{margin-bottom: 4%; display: block;} #contacte .faqForm .texto-normal h2{text-transform: uppercase; font-weight: normal; margin-bottom: 5px !important;} #contacte .faqForm .social-contacto .social-icons .intsocial{justify-content: start; padding: 0 15px;} #contacte .faqForm .social-contacto .social-icons .intsocial .sociallist{ margin-bottom: 0; gap: 16px; } #contacte .faqForm .social-contacto .social-icons .intsocial .sociallist li{ margin-right: 0; } #contacte .faqForm .social-contacto .social-icons .intsocial .sociallist li a{ color: #000; } #contacte .faqForm .social-contacto .social-icons .intsocial .sociallist li a:hover{ text-decoration: underline; } #contacte .faqForm .social-contacto .social-icons .intsocial .sociallist li a::after{content: "/"; position: absolute; margin-left: 5px;} #contacte .faqForm .social-contacto .social-icons .intsocial .sociallist li:last-child a::after{content: unset;} #contacte form .send-form{margin-top: 45px;} #contacte form a{color: var(--azul); text-decoration: underline;} /* <=== CONTACT FORM REDESIGN ===> */ #contacte .contact-form-wrapper .form-control { background-color: #edf4fb !important; border: none !important; border-radius: 4px !important; padding: 14px 18px !important; font-size: 12px; color: #333; height: auto; } #contacte .contact-form-wrapper .form-control::placeholder { color: var(--gris-texto-secundario) !important; text-transform: uppercase; font-size: 11px; letter-spacing: 0.5px; opacity: 1; } .contact-details{position: relative;} .contact-details .contact-item{ display: flex; align-items: start; gap: 15px; margin-bottom: 30px; } .contact-details .contact-item .contact-icon {display: flex; align-items: center;} .contact-details .contact-item .contact-icon::after{content: ""; width: 30px; border-bottom: 2px dotted var(--gris-borde); margin-left: 2px; } .contact-details .contact-item .contact-icon i{color: var(--gris-texto-terciario); border: 2px solid var(--gris-borde); border-radius: 50%; padding: 10px; aspect-ratio: 1 / 1; height: 45px; display: flex; align-items: center; justify-content: center; } .contact-details .contact-item .contact-info p{margin-bottom: 0; font-size: clamp(14px, 12.847px + 0.360vw, 18px); color: #80b1c5;} .contact-details .contact-item .contact-info p a{color: #80b1c5;} .contact-details .contact-item .contact-info p.title{font-size: clamp(18px, 16.559px + 0.450vw, 23px); font-family: var(--font-serif); font-weight: 400; color: #000;} /* ===== 21. FILTRES ===== */ /* <=== FILTRO PRODUCTOS ===> */ /* <=991px: filtro colapsado por defecto */ @media only screen and (max-width: 991px){ .Productos-wrapper.main-content-wrap .filter .filter-menu.collapse:not(.show){display: none;} .Productos-wrapper.main-content-wrap .filter .filter-menu.collapse.show:not(.filter-opened){display: none;} .Productos-wrapper.main-content-wrap .filter .filter-menu.collapse.show.filter-opened{display: block;} } /* >=992px: filtro siempre abierto, botón expander oculto */ @media only screen and (min-width: 992px){ .Productos-wrapper.main-content-wrap .filter-expander{pointer-events: none;} .Productos-wrapper.main-content-wrap .filter-expander button svg{display: none !important;} .Productos-wrapper.main-content-wrap .filter .filter-menu.collapse{display: block !important;} } .custom-select{padding:0; border:none; margin-top: 15px; height: auto;} .filter-box h2,.filter-box h3,.filter-box h4,.filter-box h5,.filter-box h6,.filter-box p,.filter-box label,.filter-box a,.filter-box button,.filter-box .btn{font-family: var(--font-serif);} .filter-box .btn{text-transform: uppercase !important;} .Productos-wrapper.main-content-wrap .filter {box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2); height: fit-content; padding: 40px 40px;} .Productos-wrapper.main-content-wrap .filter .filter-expander {border-bottom: 1px solid #ccc;} .Productos-wrapper.main-content-wrap .filter .filter-expander h3{ color: var(--rojo); text-transform: uppercase; letter-spacing: normal; line-height: normal; font-size: 20px; font-weight: 500; margin-bottom: 15px;} .Productos-wrapper.main-content-wrap .filter .filter-expander button { background: none; border: none; padding: 0 10px; margin: 0; font: inherit; color: #000; text-align: inherit; display: flex; align-items: center; justify-content: space-between; width: 100%; } .Productos-wrapper.main-content-wrap .filter .filter-expander button:focus, .Productos-wrapper.main-content-wrap .filter .filter-expander button:focus-visible{border: none; box-shadow: none; outline: none;} .Productos-wrapper.main-content-wrap .filter .filter-expander button svg{transform: unset; transition: all 0.3s ease-in-out;margin-bottom: 10px;} .Productos-wrapper.main-content-wrap .filter .filter-expander button[aria-expanded="true"] svg{transform: rotate(180deg);} .Productos-wrapper.main-content-wrap .filter .filter-menu{padding-top: 10px;} .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group{border-bottom: 1px solid #ccc; padding-bottom: 30px; margin-bottom: 10px; padding-top: 20px;} .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group .form-check, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group .form-check{display: flex; align-items: center; margin-top: 5px;} .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group > p, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group > p{font-size: 22px; font-weight: bold;} .Productos-wrapper.main-content-wrap .filter .Capacidad{display: none !important;} .Productos-wrapper.main-content-wrap .filter .filter-buttons{display: flex;justify-content: space-between;} .Productos-wrapper.main-content-wrap .filter .filter-buttons button{ padding: 10px 20px !important; font-size: 0.675rem !important; height: auto; background-color: var(--rojo); min-width: 125px; font-weight: 400;} .Productos-wrapper.main-content-wrap .filter .filter-buttons input{ padding: 10px 20px; background: transparent; color: var(--rojo); font-size: 0.675rem !important; height: auto; min-width: 125px; font-weight: 400;} .Productos-wrapper.main-content-wrap .filter .filter-buttons input:hover{background-color: var(--rojo) !important; color: #fff; } .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group {padding-left: 10px; padding-right: 10px;} .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group button, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group button { font-size: clamp(16px, 14.27px + 0.541vw, 22px); border-radius: unset !important; border: unset !important; text-align: left; padding: 0; width: 100%; justify-content: space-between; display: flex; background: unset; font-weight: 400; } .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group button:hover, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group button:hover{background-color: unset !important; color: #000 !important; } .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group button:focus, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group button:focus{outline: none; box-shadow: unset;} .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group button i, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group button i{transition: all 0.3s ease;} /* SVG rotation for category & customfields collapse buttons */ .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group button svg, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group button svg { transform: unset; transition: all 0.3s ease-in-out; } .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group button[aria-expanded="true"] svg, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group button[aria-expanded="true"] svg { transform: rotate(180deg); } /* Estilos per categories com a enllacos */ .Productos-wrapper.main-content-wrap .filter .cat-active .cat-current { font-weight: 600; color: var(--rojo); } .Productos-wrapper.main-content-wrap .filter .cat-link { text-decoration: none; color: inherit; } .Productos-wrapper.main-content-wrap .filter .cat-link:hover { color: var(--rojo); } .Productos-wrapper.main-content-wrap .filter .cat-link-all { font-weight: 500; } .Productos-wrapper.main-content-wrap .filter .filter-menu .category-group-items > *:first-child, .Productos-wrapper.main-content-wrap .filter .filter-menu .customfields-group-items > *:first-child{ margin-top: 10px; } .Productos-wrapper.main-content-wrap .filter .filter-menu label{ font-size: clamp(12px, 14.423px + 0.180vw, 18px); font-weight: 300;} .Productos-wrapper.main-content-wrap .filter .filter-buttons{margin-top: 30px;} /* <=== FILTRO EVENTOS ===> */ .filter-box[data-product-line="62"] .filter .filter-menu {margin-bottom: 60px;} .filter-box[data-product-line="62"] .filter .filter-menu .category-group, .filter-box[data-product-line="62"] .filter .filter-menu .category-group .category-group-items{ display: flex; flex-wrap: wrap; gap: 30px 20px; } .filter-box[data-product-line="62"] .filter .filter-menu .category-group .form-check{display: flex; align-items: center;} .filter-box[data-product-line="62"] .filter .filter-menu .category-group .form-check input{visibility: hidden; opacity: 0;} .filter-box[data-product-line="62"] .filter .filter-menu .category-group .form-check{ padding-left: 0; margin-top: 0;} .filter-box[data-product-line="62"] .filter .filter-buttons .form-check-label, .filter-box[data-product-line="62"] .filter .filter-menu .category-group .form-check .form-check-label{ color: var(--gris-borde); cursor: pointer; font-size: clamp(23px, 15.793px + 2.252vw, 48px); font-family: var(--font-serif); line-height: normal; transition: all 0.3s ease-in-out;} .filter-box .filter-buttons .form-check-label {text-transform: lowercase;} .filter-box:not(:has(.form-check:not(.filter-buttons) input:checked)) .filter-buttons .form-check-label { color: #000; } .filter-box[data-product-line="62"] .filter .filter-buttons::before, .filter-box[data-product-line="62"] .filter .filter-menu .category-group .form-check:not(:first-child)::before { content: ""; margin-right: 20px; font-size: clamp(23px, 15.793px + 2.252vw, 48px); line-height: clamp(25px, 17.793px + 2.252vw, 50px); background: var(--gris-borde); width: 3px; height: 100%; } .filter-box[data-product-line="62"] .filter .filter-buttons .form-check-label:hover, .filter-box[data-product-line="62"] .filter .filter-menu .category-group .form-check .form-check-label:hover, .filter-box[data-product-line="62"] .filter .filter-menu .category-group .form-check:has(input:checked) .form-check-label{ color: #000; } .filter-box[data-product-line="62"] .filter .filter-buttons{display: flex;justify-content: space-between; margin-top: 0;} .filter-box[data-product-line="62"] .filter .filter-buttons input{visibility: hidden; opacity: 0; display: none;} .filter-box[data-product-line="62"] .filter .filter-menu label{font-size: clamp(12px, 11.423px + 0.180vw, 14px);} /* ===== 22. LISTADOS I CARRUSELS ===== */ .modulo-instagram{ background-color: var(--verde-instagram); padding-top: clamp(25px, 17.793px + 2.252vw, 50px) !important; padding-bottom: clamp(25px, 17.793px + 2.252vw, 50px) !important; } .modulo-instagram .swiper .icono{ margin-bottom: 15px; padding: 20px 30px; display: flex ; align-items: center;} .modulo-instagram .swiper .icono i{ font-size: clamp(24px, 19.964px + 1.261vw, 38px); } .modulo-youtube{ padding-top: 2%; padding-bottom: 2%; padding-left: 15px; padding-right: 15px; margin-bottom: 30px !important;} .modulo-youtube .banner-default .individualbanner1 { display: flex; justify-content: center; align-items: center; } .modulo-youtube .banner-default .individualbanner1 .caption { pointer-events: all; position: absolute; width: calc(100% - 30px); padding: 0 15px !important; } .modulo-youtube .banner-default .individualbanner1 .caption div {color: #fff;} .modulo-youtube .banner-default .individualbanner1 .caption a {color: #fff; font-size: 28px;} .modulo-youtube .banner-default .individualbanner1:hover .caption a {text-decoration: unset !important;} .modulo-youtube .banner-default .individualbanner1 figcaption.details{display: none;} .modulo-youtube .banner-default .individualbanner1 .portfolio-thumb{margin-bottom: 0;} .modulo-youtube .banner-default .individualbanner1 .portfolio-thumb img{border-radius: 10px;} .modulo-youtube .banner-video-texto > div.row{display: flex; justify-content: center; align-items: end;} .modulo-youtube .banner-video-texto .texto-banner{ position: absolute; z-index: 1;} .modulo-youtube .banner-video-texto .texto-banner p{ margin-bottom: 0; padding: 10px; text-align: center; background-color: rgba(255,255,255,0.8); border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;} .modulo-youtube .banner-video-texto .video-banner .video{ border-radius: 10px; } .modulo-youtube .banner-video-texto .video-banner .video .ytplayer{ display: block; border-radius: 10px; } .modulo-youtube .banner-video-texto .video-banner .video .ytplayer .ytplayer-logo{ cursor: pointer; pointer-events: all; display: flex; align-items: center; justify-content: center;} .modulo-youtube .banner-video-texto .video-banner .video .ytplayer img{ border-radius: 10px; } .modulo-youtube .icono{ margin-bottom: 15px; padding: 10px 30px; } .modulo-youtube .icono i{ font-size: clamp(24px, 19.964px + 1.261vw, 38px); } .featured-product-swiper .swiper-title{ text-align: center; margin-bottom: clamp(25px, 20.676px + 1.351vw, 40px); } .featured-product-swiper .swiper-slide .single-post-slide-wrap a picture{ display: flex; justify-content: center; } .featured-product-swiper .swiper-slide .single-post-slide-wrap a picture img{width: 100%;} .featured-product-swiper .swiper-slide .single-post-slide-wrap .post-details{display: none;} .featured-product-swiper .swiper-slide img{transition: all .3s ease-in-out;} .featured-product-swiper .swiper-slide:hover img{ transform: unset; filter: brightness(0.9);} .boton-todos {display: none;} .menu-horizontal ul{ justify-content: center; align-items: center; padding-left: 0; flex-wrap: wrap; margin-bottom: 0;} .menu-horizontal ul li{display: flex; column-gap: 5px;} .menu-horizontal ul li{margin-right: 0;} .menu-horizontal ul li:has(+ li){margin-right: 10px;} .menu-horizontal ul li::after{content: "/"; font-size: 30px;} .menu-horizontal ul li:last-child:after{content: unset !important;} .menu-horizontal ul li a{font-size: 30px; } .menu-horizontal ul li a.active-page, .menu-horizontal ul li a:hover{ color: #3f799e; text-decoration: unset !important; } /* <=== EMPRESAS ASOCIADAS ===> */ .swiper-empresas-asociadas .swiper-slide{ height: auto; display: flex ; align-items: center; padding: 15px; } /* <=== LISTADO MULTIELEMENTOS ===> */ .listado-categorias-multielementos .product-list article.item{ width: 50% !important; padding: 0 !important;} .listado-categorias-multielementos .product-list .item .container{padding: 0 !important;} .listado-categorias-multielementos .product-list .item .single-post-slide-wrap{ margin-bottom: 0 !important; width: 100%;} .listado-categorias-multielementos .product-list .item .single-post-slide-wrap .overlay > .row{width: 100%;} .listado-categorias-multielementos .product-list .item .single-post-slide-wrap .overlay > .row > div{padding: 0 !important;} .listado-categorias-multielementos .product-list .item .single-post-slide-wrap .post-details{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 10001;pointer-events: none; padding: 15px;} .listado-categorias-multielementos .product-list .item .single-post-slide-wrap .post-details h3 { color: #fff; font-size: clamp(24px, 19.964px + 1.261vw, 38px); transition: opacity 0.3s linear; margin-bottom: 0 !important; font-family: var(--font-sans-serif); text-transform: uppercase; letter-spacing: 10px; font-weight: 400; white-space: nowrap; } .listado-categorias-multielementos .product-list .item:hover img{ transform: unset;} .listado-categorias-multielementos .product-list .item:nth-child(odd){padding-right: 0;} .listado-categorias-multielementos .product-list .item:nth-child(even){padding-left: 0;} .listado-categorias .listado-categorias-multielementos .product-list .item .post-details > .row{position: static;} .listado-categorias-multielementos.row-2 .product-list .item .post-details{display: flex;} .listado-categorias-multielementos.row-2 .product-list .item:nth-child(1) .post-details{align-items: end; justify-content: end;} .listado-categorias-multielementos.row-2 .product-list .item:nth-child(2) .post-details{align-items: end; justify-content: start;} .listado-categorias-multielementos.row-2 .product-list .item:nth-child(3) .post-details{align-items: start; justify-content: end;} .listado-categorias-multielementos.row-2 .product-list .item:nth-child(4) .post-details{align-items: start; justify-content: start;} .listado-categorias-multielementos.row-4 .product-list .item .single-post-slide-wrap .post-details{top: unset !important; bottom: 15px !important;} .listado-categorias-multielementos.row-4 .product-list .item .single-post-slide-wrap .post-details .post-content h3{text-align: center;} /* ===== 23. HOVER OVERLAY ===== */ body .hover { position: relative; display: flex; align-items: center; justify-items: center; } body .content { flex: 1; text-align: center;} body .content h2{ position: absolute; } body .overlay { position: absolute; height: 100%; width: 100%; background-color: rgba(255,255,255, 0.0); text-align: left; display: flex; justify-content: center; align-items: center; z-index: 10000; left: 0; padding: 0 !important;} body .overlay .overlay-content{ max-width: 100%; max-height: 100%; } body .hover {overflow: hidden;perspective: 400px;} body .hover .overlay {transform: translate3d(0, -120%, 0);animation-duration: 0.3s;animation-fill-mode: forwards;animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);} body .hover.mouseenter.top {perspective-origin: center top;} body .hover.mouseenter.top .overlay {animation-name: swing--enter-top;transform-origin: center top;} body .hover.mouseenter.right {perspective-origin: right center;} body .hover.mouseenter.right .overlay {animation-name: swing--enter-right;transform-origin: right center;} body .hover.mouseenter.bottom {perspective-origin: center bottom;} body .hover.mouseenter.bottom .overlay {animation-name: swing--enter-bottom;transform-origin: center bottom;} body .hover.mouseenter.left {perspective-origin: left center;} body .hover.mouseenter.left .overlay {animation-name: swing--enter-left;transform-origin: left center;} body .hover.mouseleave.top {perspective-origin: center top;} body .hover.mouseleave.top .overlay {animation-name: swing--leave-top;transform-origin: center top;} body .hover.mouseleave.right {perspective-origin: right center;} body .hover.mouseleave.right .overlay {animation-name: swing--leave-right;transform-origin: right center;} body .hover.mouseleave.bottom {perspective-origin: center bottom;} body .hover.mouseleave.bottom .overlay {animation-name: swing--leave-bottom;transform-origin: center bottom;} body .hover.mouseleave.left {perspective-origin: left center;} body .hover.mouseleave.left .overlay {animation-name: swing--leave-left;transform-origin: left center;} /* ===== 24. PAGINADOR ===== */ .product-list .pagination {gap: 10px; align-items: center;} .product-list .pagination li{margin: 0;} .product-list .pagination .pagination-arrow{margin: 0 10px;} .product-list .pagination .pagination-arrow i{font-size: 28px;} .product-list .pagination li a{transition: all 0.3s ease; border-radius: 50%; height: 18px; width: 18px; font-size: 0 !important; padding: 0; margin: 0; background: #D8E4EC; border: unset !important; } .product-list .pagination li.active_page a, .product-list .pagination li a:hover{background-color: #b03983; height: 20px; width: 20px;} /* ===== 25. ALTRES ===== */ .galeriagris img{filter:saturate(0);transition: all 0.2s linear;} .galeriagris img:hover{filter:saturate(1);} /* BANNER OVERLAY */ .banner-overlay, .banner-overlay figure{width: 100%;} .banner-overlay .overlay img{height: 100%;} .banner-overlay .banner-overlay-title{text-transform: uppercase; font-size: var(--h2-font-size);} /* PAGINA SOLUCIONES PACKAGING */ #soluciones-packaging h2{text-transform: uppercase;} #soluciones-packaging .texto-introduccion p{ } /* PAGINA CATALOGO */ .catalogo-perfumeria .acceso-productos > .row > .col-12 > .row {margin: 0;} .catalogo-perfumeria .acceso-productos > .row > .col-12 > .row > .col-12{border-top: 3px solid #953b82;} .catalogo-cosmetica .acceso-productos{ padding: 0 15px;} .catalogo-cosmetica .acceso-productos > .row > .col-12 > .row {margin: 0;} .catalogo-cosmetica .acceso-productos > .row > .col-12 > .row > .col-12{border-top: 3px solid #1d2943;} .catalogo-home-fragrance .acceso-productos > .row > .col-12 > .row {margin: 0;} .catalogo-home-fragrance .acceso-productos > .row > .col-12 > .row > .col-12{border-top: 3px solid #ffb99f;} .catalogo-make-up .acceso-productos > .row > .col-12 > .row {margin: 0;} .catalogo-make-up .acceso-productos > .row > .col-12 > .row > .col-12{border-top: 3px solid #ff713d;} /* PAGINA PRODUCCION PROPIA */ #produccion-propia .content-block picture { aspect-ratio: 1 / 1; overflow: hidden; object-fit: contain; object-position: center; display: flex; align-items: center; justify-content: center; } #produccion-propia .content-block picture img{mix-blend-mode: multiply; object-fit: contain;} #produccion-propia .content-block .content-block-text .title{font-size: var(--h4-font-size);} #produccion-propia .content-block .content-block-text p{font-size: var(--texto-l) !important;} @media (max-width: 991px){ .content-block {padding-top: 30px !important; padding-bottom: 30px !important;} .content-block picture {max-width: 300px; display: block; margin: 0 auto;} } /* SOSTENIBILIDAD */ #sostenibilidad .content-block .content-block-text .title{text-transform: uppercase;} #sostenibilidad .content-block .content-block-text p{font-size: var(--texto-l) !important;} #sostenibilidad .banner-inicial .individualbanner1 { position: relative; display: block; } #sostenibilidad .banner-inicial .individualbanner1 .portfolio-thumb { margin: 0; line-height: 0; } #sostenibilidad .banner-inicial .individualbanner1 .portfolio-thumb img { width: 100%; height: auto; display: block; } #sostenibilidad .banner-inicial .individualbanner1 .caption { pointer-events: all; display: flex; flex-direction: column; align-items: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; height: fit-content; width: 65%; background: rgba(255,255,255,0.92); padding: 45px 65px; text-align: center; } #sostenibilidad .banner-inicial .individualbanner1 .caption h1 { font-size: var(--h2-font-size); text-transform: uppercase; margin: 0 0 50px;} #sostenibilidad .banner-inicial .individualbanner1 .caption h1 a { color: inherit; text-decoration: none !important; } #sostenibilidad .banner-inicial .individualbanner1 .caption .info p {font-size: var(--texto-l)} #sostenibilidad .banner-inicial .individualbanner1 .caption .projectebotservei { display: none; } #sostenibilidad .banner-inicial .individualbanner1:hover .caption h1 { transform: unset !important; } #sostenibilidad .banner-inicial .individualbanner1:hover .portfolio-thumb img { filter: brightness(100%); } /* PERSONALIZACION */ #personalizacion .contenido > .row > .col-12{padding-top: 200px; margin-top: -200px;} #personalizacion .contenido .content-block picture {aspect-ratio: 1/1; display: block; position: relative;} #personalizacion .contenido .content-block picture img{mix-blend-mode: multiply; object-fit: contain; width: 100%; height: 100%;} #personalizacion .contenido .content-block-text p{font-size: var(--texto-l) !important;} /* FULL SERVICE */ #full-service .content-block .content-block-text .title{text-transform: uppercase;} #full-service .contenido .content-block-text p{font-size: var(--texto-l) !important;} /* EMPRESA */ #empresa .btn-download{margin-bottom: 30px; width: 100%;} #empresa .galeria-iso{ padding: 0 50px 30px;} #empresa .galeria-iso .gallerycontent{justify-content: space-around;} /* EQUIPO */ .staff.list .item{ margin-bottom: 30px; } .staff.list .item .single-post-slide-wrap{border-radius: 6px; overflow: hidden; position: relative;} .listado-productos-destacados { padding-top: 30px !important; padding-bottom: 30px !important; } .buscador-expander{ margin-right: 10px;;} #ajax-search-input { height: 30px !important; border-radius: 0 !important; border: 1px solid #eee !important; background: transparent !important; color: var(--gris-texto-secundario) !important; font-size: 10px !important; padding-left: 10px !important; box-shadow: none !important; } .buscador-group-inner { display: flex; align-items: center; background: #fff; border: none; border-radius: 4px; padding: 4px 8px; box-shadow: none; min-width: 280px; } /* BLOQUE DE CONTENIDO */ @media only screen and (min-width: 991px){ .order-md-1.content-block-media, .content-block-text{padding-right: 30px; padding-left: 15px;} .order-md-2.content-block-text, .content-block-media{padding-left: 30px; padding-right: 15px;} } /* MISSING IMAGE */ .product-list .item img.missing, .gallery .item img.missing, .gallery-thumbs-wrap img.missing { opacity: 0.1; padding: 50px; mix-blend-mode: multiply; } .gallery-thumbs-wrap picture.missing, .gallery picture.missing { background-color: rgba(200, 200, 200, 0.1); } .gallery-thumbs-wrap a.fancybox.missing, .gallery a.fancybox.missing { pointer-events: none; } /* BANNER 1 */ .banner .btn{margin-top: 30px;} .banner a:not(.btn){text-decoration: none; color: inherit;} /* INDIVIDUALBANNER2 - Responsive <=991px: text below image, no hover */ @media (max-width: 991px) { .individualbanner2 { margin-bottom: 30px; } .individualbanner2 .banner-overlay-link { position: static !important; opacity: 1 !important; display: block; } .individualbanner2 .banner-overlay { display: none; } .individualbanner2 .banner-content { position: static; padding: 15px 5px; color: #000 !important; } .individualbanner2 .banner-content .title, .individualbanner2 .banner-content .content-text, .individualbanner2 .banner-content .btn { color: #000 !important; } .individualbanner2:hover .banner-overlay-link { opacity: 1 !important; } } /* === Lighthouse fixes 2026-04-07 === */ /* Fix: color contrast language selector (ratio 4.5:1 min) */ .extratop-links .idiomes li a { color: #595959; } /* Fix: swiper nav buttons touch target min 24x24 */ .swiper-button-next, .swiper-button-prev { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; } /* Fix: font-display swap for Font Awesome (override block -> swap) */ @font-face { font-family: "Font Awesome 6 Brands"; font-display: swap; src: url(../webfonts/fa-brands-400.woff2) format("woff2"); } @font-face { font-family: "Font Awesome 6 Free"; font-weight: 400; font-display: swap; src: url(../webfonts/fa-regular-400.woff2) format("woff2"); } @font-face { font-family: "Font Awesome 6 Free"; font-weight: 900; font-display: swap; src: url(../webfonts/fa-solid-900.woff2) format("woff2"); }