html {
scrollbar-gutter: stable;
}
:where(.wp-site-blocks *:focus) {
outline-style: none;
}
html,
body {
overscroll-behavior-x: none;
overscroll-behavior-y: auto;
}
.d-block {
display: block;
}
.w-100 {
width: 100%;
}
.fw-100 {
font-weight: 100 !important;
}
.fw-300 {
font-weight: 300 !important;
}
.fw-400 {
font-weight: 400 !important;
}
.fw-500 {
font-weight: 500 !important;
}
.fw-700 {
font-weight: 700 !important;
}
.fw-raleway {
font-family: "Raleway", sans-serif !important;
}
.fw-newfrank {
font-family: "New Frank", serif !important;
}
.fw-gotham {
font-family: "Gotham", sans-serif !important;
}
.likeh1 {
font-size: clamp(28px, 3.8vw, 58px);
}
.small-title {
font-size: clamp(15px, 1.2vw, 20px);
}
.standard-text,
p {
font-size: clamp(16px, 1.302vw, 25px);
}
.small-text {
font-size: clamp(14px, 0.833vw, 16px);
}
.padding-x {
padding-right: clamp(30px, 5.5vw, 100px);
padding-left: clamp(30px, 5.5vw, 100px);
}
.padding-x-low {
padding-right: clamp(15px, 2.2vw, 50px);
padding-left: clamp(15px, 2.2vw, 50px);
}
.padding-x-hi {
padding-right: clamp(30px, 16vw, 300px);
padding-left: clamp(30px, 16vw, 300px);
}
.padding-left {
padding-left: clamp(30px, 5.5vw, 100px);
}
.padding-left-low {
padding-left: clamp(15px, 2.2vw, 50px);
}
.padding-right {
padding-right: clamp(30px, 5.5vw, 100px);
}
.padding-right-low {
padding-right: clamp(15px, 2.2vw, 50px);
}
.padding-y {
padding-top: clamp(30px, 3.8vw, 70px);
padding-bottom: clamp(30px, 3.8vw, 70px);
}
.padding-top {
padding-top: clamp(30px, 3.8vw, 70px);
}
.padding-bottom {
padding-bottom: clamp(30px, 3.8vw, 70px);
}
.padding-y-low {
padding-top: clamp(15px, 2vw, 30px);
padding-bottom: clamp(15px, 2vw, 30px);
}
.padding-top-low {
padding-top: clamp(15px, 2vw, 30px);
}
.padding-bottom-low {
padding-top: clamp(15px, 2vw, 30px);
}
.padding-y-hi {
padding-top: clamp(30px, 16vw, 300px);
padding-bottom: clamp(30px, 16vw, 300px);
}
.padding-bottom-hi {
padding-bottom: clamp(30px, 16vw, 300px);
}
.mt-0 {
margin-top: 0 0 !important;
}
.mb-0 {
margin-bottom: 0 !important;
}
.ml-0 {
margin-left: 0 !important;
}
.mr-0 {
margin-right: 0 !important;
}
.m-0 {
margin: 0 !important;
}
.pt-0 {
padding-top: 0;
}
.pb-0 {
padding-bottom: 0;
}
.pl-0 {
padding-left: 0 !important;
}
.pr-0 {
padding-right: 0 !important;
}
.p-0 {
padding-top: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
.underline {
text-decoration: underline !important;
}
.small-underline {
text-decoration-thickness: 0.04em !important;
}
.italic {
font-style: italic;
}
.uppercase {
text-transform: uppercase;
}
.lowercase {
text-transform: initial !important;
}
.text-center {
text-align: center;
}
.hidden {
display: none;
}
.mobile {
display: none !important;
}
.hidden {
display: none !important;
}
.line1 {
line-height: 1;
}
.line12 {
line-height: 1.2;
}
.line14 {
line-height: 1.4;
}
.flex-end {
align-items: flex-end;
}
.flex-start {
align-items: flex-start;
}
.color-white {
color: #FFFFFF;
}
.color-black {
color: #1D1D1B;
}
.color-blue {
color: #202A3B;
}
.color-red {
color: #AB4B48;
}
.color-gold {
color: #DFBD93;
}
.opacity-50 {
opacity: 0.5;
}
.false-p {
display: inline-block !important;
font-weight: 300 !important;
font-size: clamp(16px, 1.302vw, 25px) !important;
line-height: 1.4;
}
.half-gold-bg {
background-image: linear-gradient(0deg, #dfbd93 0%, #dfbd93 80%, #ffffff 80%, #ffffff 100%);
}
.bg-top-right {
background-position: top right;
}
.bg-top-center {
background-position: top center;
}
body p,
body a,
body ul li,
body ol li {
font-family: "Raleway", sans-serif;
color: #202A3B;
font-weight: 300;
}
a {
text-decoration-thickness: 0 !important;
text-decoration: none !important;
cursor: pointer;
}
section {
margin-block-start: 0 !important;
}
strong {
font-weight: 700;
}
blockquote {
border-left: 0 !important; margin-bottom: 1em !important;
}
.gifrab-button,
.gifrab-button:focus,
.gifrab-button:visited,
.aw_application .aw_applyLink {
display: inline-block;
padding: 10px 40px;
color: #DFBD93 !important;
border: solid 1px #DFBD93;
border-radius: 1.5em !important;
line-height: 1;
transition: 0.25s ease-in-out;
}
.gifrab-button:hover,
.aw_application .aw_applyLink:hover {
color: #FFFFFF !important;
background-color: #DFBD93;
}
.white-button,
.white-button:focus,
.white-button:visited {
color: #FFFFFF !important;
border: solid 1px #FFFFFF;
background-color: transparent;
}
.white-button:hover {
color: #DFBD93 !important;
border: solid 1px #FFFFFF;
background-color: #FFFFFF;
}
.wp-block-polylang-language-switcher {
padding-left: 0;
list-style-type: none;
display: flex;
position: relative;
li {
margin: 0 6px;
a {
font-weight: 700;
}
}
}
.wp-block-polylang-language-switcher:before {
content: '/';
position: absolute;
top: 50%;
left: 42%;
transform: translate(-50%, -50%);
}
.wp-block-polylang-language-switcher {
margin-top: 0;
margin-bottom: 0;
line-height: 1;
}
.no-desktop-arrow .stk-block-carousel__buttons {
display: none;
}
.sr-only {
position: absolute !important;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
} .wp-site-blocks {
position: relative;
}
header {
position: absolute;
top: 0;
left: 0;
right: 0;
padding-top: 25px;
padding-bottom: 25px;
font-family: "Raleway", sans-serif;
font-size: clamp(16px, 1.4vw, 20px);
font-weight: 700;
color: #FFFFFF;
z-index: 99;
.header-custom .header {
max-width: none;
}
.wp-block-navigation button {
position: relative;
background-image: url(//www.gifrab.it/wp-content/uploads/2026/01/menu-icon.svg);
background-position: center;
background-size: cover;
height: 16px;
width: 30px;
svg {
display: none;
}
}
.wp-block-navigation button:before {
content: 'MENU ';
position: absolute;
top: 50%;
left: -62px;
transform: translateY(-50%);
line-height: 1;
}
.wp-block-navigation__responsive-container.is-menu-open {
padding-top: 25px;
padding-bottom: 25px;
background-image: url(//www.gifrab.it/wp-content/uploads/2026/01/menu-open_bg.webp);
background-size: cover;
background-position: center;
.wp-block-navigation__container {
margin-top: clamp(25px, 3.5vw, 50px);
}
.wp-block-navigation__responsive-dialog {
text-align: right;
line-height: 1;
}
button {
background-image: url(//www.gifrab.it/wp-content/uploads/2026/01/close-icon.svg);
height: 18px;
width: 18px;
}
button:before {
content: none;
}
.wp-block-site-logo {
display: none;
}
}
.wp-block-navigation__responsive-container-content {
align-items: center !important;
color: #FFFFFF;
position: relative;
.wp-block-navigation__container {
align-items: center !important;
}
.wp-block-navigation-item__content,
.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
margin-left: auto !important;
margin-right: auto !important;
text-align: center;
}
.wp-block-navigation-item__content span {
display: inline-block;
text-transform: uppercase;
font-family: "Raleway", sans-serif;
font-size: clamp(18px, 2vw, 30px);
font-weight: 500;
transition: transform .25s ease, text-shadow .25s ease;
will-change: transform;
}
.wp-block-navigation-item__content:hover span {
transform: scaleX(1.04);
text-shadow: .35px 0 0 currentColor, .7px 0 0 currentColor;
}
.wp-block-navigation__submenu-container .wp-block-navigation-item__content span {
font-size: clamp(14px, 1.4vw, 22px);
font-weight: 300;
}
.wp-block-navigation-item:nth-child(9) { margin-top: clamp(20px, 2vw, 40px);
}
.wp-block-navigation-item:nth-child(9) .wp-block-navigation-item__content span,
.wp-block-navigation-item:nth-child(10) .wp-block-navigation-item__content span {  font-size: clamp(14px, 1.5vw, 20px);
font-weight: 300;
}
}
.wp-block-navigation__responsive-container-content:before {
content: '';
width: 230px;
height: 55px;
background-image: url(//www.gifrab.it/wp-content/uploads/2026/01/logo_gifrab.svg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.wp-block-navigation__responsive-close {
max-width: none !important;
}
.wp-block-polylang-language-switcher {
margin-right: 100px;
}
a,
a:visited,
a:active,
a:focus,
a:hover {
color: #FFFFFF;
}
.custom-logo-link img {
width: 150px;
}
.wp-block-navigation__responsive-container.has-modal-open.is-menu-open {
scrollbar-width: none !important;
-ms-overflow-style: none !important;
}
.wp-block-navigation__responsive-container.has-modal-open.is-menu-open::-webkit-scrollbar {
width: 0 !important;
height: 0 !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
height: 0;
overflow: hidden;
padding: 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container.expanded {
height: auto;
overflow: initial;
padding: initial;
}
}
header.scrolled {
position: fixed;
z-index: 99999;
background-color: #202A3B;
} main,
.entry-content {
padding: 0;
margin: 0;
}
.entry-content {
max-width: none;
}
main {
:where(.is-layout-flex) {
gap: 0 !important;
}
}
.bg-shape,
.bg-shape-gray {
background-image: url(//www.gifrab.it/wp-content/uploads/2026/01/bg-shape.svg);
background-position: top -3vw left -10vw;
background-repeat: no-repeat;
background-size: 55vw;
}
.bg-shape-gray {
background-image: url(//www.gifrab.it/wp-content/uploads/2026/02/bg-shape-gray.svg);
}
body.privacy-page header {
position: initial;
background-color: #202A3B;
} body.home .header {
justify-content: end;
.wp-block-site-logo {
display: none;
}
}
body.home .scrolled .header {
justify-content: space-between;
.wp-block-site-logo {
display: block;
}
}
.top-section-auto {
position: relative;
justify-content: center;
min-height: 600px;
min-height: max(600px, 100vh);
min-height: max(600px, 100svh);
min-height: max(600px, 100dvh);
.gifrab-logo {
width: clamp(200px, 30vw, 600px);
}
}
.logo-carousel {
padding-right: clamp(15px, 2.7vw, 50px) !important;
padding-left: clamp(15px, 2.7vw, 50px) !important;
padding-top: clamp(20px, 2.8vw, 50px) !important;
padding-bottom: clamp(20px, 2.8vw, 50px) !important;
.stk-block-column {
display: flex;
align-items: center;
}
img {
width: clamp(80px, 12vw, 180px);
max-height: clamp(55px, 5vw, 75px);
}
}
.default-article {
h1,
h3 {
margin-bottom: 1em;
}
p:not(:last-of-type) {
margin-bottom: 1em;
}
}
.padding-left-h2 {
padding-right: 39vw;
}
.numbers-box {
justify-content: center;
align-items: flex-start;
.col1,
.col2,
.col3 {
align-items: center;
}
p,
p:not(:last-of-type) {
margin-bottom: 0;
line-height: 1;
text-align: center;
}
.highlight-number {
font-size: clamp(40px, 8vw, 150px);
padding-bottom: 15px;
}
.highlight-text {
position: relative;
margin-bottom: 20px !important;
padding-bottom: 15px;
}
.highlight-text:before {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 90px;
height: 6px;
background-color: #DFBD93;
transform: translateX(-50%);
}
}
.wp-block-stackable-tabs>.stk-row>.wp-block-stackable-tab-labels {
box-shadow: none !important;
.stk-block-tab-labels__wrapper {
justify-content: center;
}
}
.brand-tabs {
.stk-block-tabs__tab {
padding: 10px 40px;
border-radius: 1.5em;
line-height: 1;
transition: 0.25s ease-in-out;
.stk-block-tab-labels__text {
transition: 0.25s ease-in-out;
}
}
.stk-f856144 .stk-block-tabs__tab:not(.stk-block-tabs__tab--active):hover {
background-color: #DFBD93 !important;
.stk-block-tab-labels__text {
color: #FFFFFF !important;
}
}
.stk-block-carousel__slider,
.stk-block.stk-block-column.stk-column>.stk-column-wrapper {
margin-left: 0;
margin-right: 0;
}
.stk-block-carousel.stk--arrows-outside.stk--arrows-justify-space-between.stk--arrows-align-center .stk-block-carousel__slider {
width: 100%;
figure {
margin-bottom: 0;
img {
width: 100%;
}
}
}
.stk-block-carousel__button__prev {
margin-left: -50px !important;
}
.stk-block-carousel__button__next {
margin-right: -50px !important;
}
}
.section-brand,
.section-ecosystem {
.brand-image-link {
position: relative;
.overlay {
position: absolute;
inset: 0;
z-index: 1;
transition: 0.25s ease-in-out;
}
.blogo {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;
width: clamp(180px, 16vw, 300px);
max-height: clamp(90px, 8vw, 150px);
transition: 0.25s ease-in-out;
}
}
.brand-image-link:hover .overlay {
opacity: 0;
z-index: 0;
}
.brand-image-link:hover .blogo {
opacity: 0;
z-index: 0;
}
img {
width: 100%;
max-width: 100%;
}
}
.section-network,
.section-careers {
>div {
align-items: stretch;
}
h2 {
border-bottom: 1px solid #DFBD93;
margin-bottom: 1em;
padding-bottom: 1em;
}
}
.section-careers.bg-shape-gray {
background-position: top 3vw left -10vw;
}
.section-news.bg-shape {
background-size: 62vw;
}
.section-values {
p {
font-size: clamp(16px, 2vw, 40px);
}
strong {
font-weight: 700;
color: #DFBD93;
}
.founder-sign {
position: relative;
margin-top: 30px;
font-size: clamp(15px, 1.2vw, 22px);
}
.founder-sign:before {
content: '';
position: absolute;
top: -25px;
left: 50%;
transform: translateX(-50%);
height: 10px;
width: 50px;
border-radius: 10px;
background-color: #DFBD93;
}
} .header-text-title {
font-size: clamp(22px, 3vw, 40px);
}
.button-style {
padding: 10px 30px;
border: 1px solid #FFFFFF;
border-radius: clamp(28px, 3vw, 40px);
line-height: 1;
}
.section-title-big {
display: grid !important;
grid-template-columns: 1fr auto 1fr;
align-items: center;
margin: 0 !important;
text-align: center;
}
.section-title-big:before {
content: "";
transform: translateY(-50%);
height: 1px;
background-color: #DFBD93;
margin-right: clamp(30px, 2.8vw, 50px);
}
.section-title-big.white:before {
background-color: #FFFFFF;
}
.section-title-big:after {
content: "";
margin-left: clamp(30px, 2.8vw, 50px);
}
.slim-article-content {
padding-left: 20vw;
padding-right: 20vw;
p:not(:last-of-type) {
margin-bottom: 1em;
}
}
.gruppo-chi-article .numbers-box {
.highlight-text {
padding-bottom: 0 !important;
margin-bottom: 0 !important;
}
.highlight-number {
padding-bottom: 0;
}
.highlight-text:before {
content: none;
}
}
.section-ecosystem {
.wp-block-stackable-tab-labels {
padding-bottom: 20px;
border-bottom: 1px solid #DFBD93;
}
.brand-tabs {
.stk-block-tabs__tab {
padding: 0 40px;
border-radius: 0;
background-color: transparent !important;
border: none !important;
}
.stk-block-tabs__tab.stk-block-tabs__tab--active {
background-color: transparent !important;
border: none !important;
.stk-block-tab-labels__text {
font-weight: 700 !important;
color: #DFBD93 !important;
}
}
.stk-f856144 .stk-block-tabs__tab:hover {
background-color: transparent !important;
.stk-block-tab-labels__text {
font-weight: 700;
color: #DFBD93 !important;
}
}
}
}
.no-desktop-arrow.single .stk-block-carousel__slider .stk-block-content {
width: 50%;
margin-left: auto;
margin-right: auto;
}
.mission-box {
--pt: clamp(30px, 3.2vw, 60px);
position: relative;
padding-top: var(--pt);
.mission-title {
position: absolute;
left: 15%;
top: calc(var(--pt) + (100% - var(--pt)) / 2);
transform: translate(-50%, -50%) rotate(-90deg);
transform-origin: center;
white-space: nowrap;
line-height: 1;
font-size: clamp(18px, 2.2vw, 50px);
}
.mission-description {
position: relative;
}
.mission-description::before {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: -2.7vw;
width: 1px;
background-color: #DFBD93;
}
}
.mobile-timeline {
display: none;
}
.timeline {
display: flex;
position: relative;
flex-direction: column;
box-sizing: border-box;
padding-bottom: clamp(30px, 2.8vw, 50px);
.timeline-years {
display: flex;
justify-content: space-between;
}
.single-year-box {
display: flex;
flex-direction: column;
align-items: center;
padding-top: clamp(30px, 5.5vw, 100px);
.year-text {
color: #FFFFFF;
font-weight: 700;
cursor: pointer;
transition: transform 0.3s ease-in-out;
line-height: 1;
opacity: 0.5;
}
}
.single-year-box.active-year {
.year-text {
color: #DFBD93;
transform: scale(1.6);
opacity: 1;
}
}
.timeline-slides {
overflow: hidden;
}
.single-slide {
display: flex;
.text {
width: 60%;
padding-left: 2vw;
display: flex;
flex-direction: column;
justify-content: center;
h3 {
font-size: clamp(18px, 2.2vw, 50px);
}
p {
margin-top: 0;
}
}
.image {
width: 40%;
padding-right: 2vw;
img {
max-width: 100%;
}
}
}
}
.step-box {
>div {
padding: 0 20px;
}
.step-title {
position: relative;
font-size: clamp(40px, 8vw, 150px);
margin-bottom: 0 !important;
line-height: 1;
z-index: 1;
}
.step-text {
position: relative;
}
.step-text:before {
content: '';
position: absolute;
top: -1.45vw;
left: 0;
right: 0;
height: 0.46vw;
background-color: #DFBD93;
}
.col1 .step-title {
opacity: 0.4;
}
.col2 .step-title {
opacity: 0.6;
}
.col3 .step-title {
opacity: 0.8;
}
}
.retail-box {
gap: 30px !important;
line-height: 1;
.col1,
.col2 {
gap: 30px !important;
}
.retail-single {
position: relative;
line-height: 1;
}
.retail-single-text {
position: absolute;
inset: clamp(30px, 6vw, 80px);
display: flex;
flex-direction: column;
justify-content: center;
h3 {
margin-top: 0;
margin-bottom: clamp(20px, 3vw, 50px);
}
p {
margin: 0;
}
}
}
.brands-header {
display: grid !important;
grid-template-rows: 1.4fr 1.6fr;
>div {
justify-content: center;
background-position: center;
}
>* {
height: 100%;
}
}
.brands-grid {
row-gap: clamp(15px, 5.3vw, 80px);
column-gap: clamp(25px, 6.6vw, 100px);
a {
display: flex;
justify-content: center;
align-items: center;
}
a img {
width: 100%;
transition: 0.25s ease-in-out;
width: clamp(80px, 12vw, 180px);
max-height: clamp(80px, 6vw, 100px);
}
a:hover img {
transform: scale(1.03);
}
}
.single-brand-page header:not(.scrolled) {
border-bottom: 1px solid #FFFFFF;
}
.single-brand-page footer {
border-top: 1px solid #FFFFFF;
}
.single-brand-page h1 {
font-size: clamp(18px, 2.2vw, 50px);
}
.single-brand-logo {
text-align: center;
img {
width: clamp(180px, 16vw, 300px);
max-height: clamp(90px, 8vw, 150px);
}
}
.back-button {
padding-top: 80px;
}
.back-button a {
position: relative;
}
.back-button a:after {
content: '';
position: absolute;
left: -20px;
bottom: -20px;
right: 0;
top: 0;
background-image: url(//www.gifrab.it/wp-content/uploads/2026/02/back-arrow.svg);
background-size: 100%;
background-position: left center;
background-repeat: no-repeat;
transition: 0.25s ease-in-out;
}
.back-button:hover a:after {
transform: translateX(-10px);
}
.single-brand-social {
margin-top: clamp(15px, 1.6vw, 35px) !important;
padding-top: clamp(15px, 1.6vw, 35px);
border-top: 1px solid #DFBD93;
}
.social-brands {
width: 50%;
display: flex;
justify-content: flex-end;
a {
margin-left: 11px;
transition: 0.25s ease-in-out;
img {
height: 30px;
width: 30px;
}
}
a:hover {
transform: scale(1.05);
}
}
.theblogos {
justify-content: space-between;
figure {
width: 16.67%;
}
img {
width: 100%;
padding: clamp(10px, 2vw, 30px);
}
} .press-page {
.top-section-auto {
justify-content: flex-start;
}
.press-header {
aspect-ratio: 16 / 5;
justify-content: center;
}
}
.single-post {
header:not(.scrolled) {
position: initial;
background-color: #202A3B;
}
main {
position: relative;
.single-title {
display: flex;
flex-direction: column;
justify-content: center;
h1 {
font-family: "Raleway", sans-serif;
color: #DFBD93;
text-transform: uppercase;
}
}
.entry-content {
h2,
h3,
h4,
h5,
h6 {
font-family: "Raleway", sans-serif;
color: #202A3B;
text-transform: uppercase;
}
a,
a:focus,
a:visited {
color: #DFBD93;
}
a:hover {
color: #202A3B;
}
}
}
} .section-environment-impatto {
.col-environment-impatto {
aspect-ratio: 16 / 5;
background-position-y: top 1vw;
justify-content: center;
>div,
h2 {
margin-bottom: auto;
}
}
}
.bucalo-thun-row {
align-items: stretch;
p:not(:last-of-type) {
margin-bottom: 1em;
}
.loghi-img {
max-width: 35%;
margin-left: auto;
margin-right: auto;
}
.bucalo-thun-col>div {
margin-top: auto;
margin-bottom: auto;
position: relative;
}
.bucalo-thun-col>div:after,
.bucalo-thun-col>div:before {
content: '';
position: absolute;
width: 120px;
height: 80px;
left: 50px;
top: -40px;
background-image: url(//www.gifrab.it/wp-content/uploads/2026/02/cit_1.svg);
background-repeat: no-repeat;
background-size: 100%;
background-position: center;
opacity: 0.7;
}
.bucalo-thun-col>div:after {
left: auto;
top: auto;
bottom: -40px;
right: 50px;
background-image: url(//www.gifrab.it/wp-content/uploads/2026/02/cit_2.svg);
}
}
.section-allibo {
a,
p,
h3,
h4,
h5,
h6 {
font-family: "Raleway", sans-serif;
}
}
.contact-form {
margin-top: 25px !important;
.row-form:nth-child(3) p {
margin-top: 0;
margin-bottom: 0;
}
input[type="email"],
input[type="text"],
textarea {
padding: 15px 20px;
width: 100%;
border: 1px solid #12152A;
box-sizing: border-box;
background-color: transparent;
font-family: "Libre Franklin", sans-serif;
font-size: clamp(15px, 1vw, 18px);
}
input[type="submit"] {
background-color: transparent;
}
input[type="submit"]:hover {
background-color: #DFBD93;
}
.wpcf7-not-valid-tip {
margin-top: 5px;
font-size: clamp(14px, 0.833vw, 16px);
font-family: "Libre Franklin", sans-serif;
}
.wpcf7-list-item {
margin-left: 0;
}
.informativa,
.informativa a {
font-size: clamp(13px, 0.833vw, 15px);
}
.row-form.submit p {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 0;
.bucalo-button {
margin-top: 0 !important;
background-color: transparent !important;
width: max-content;
text-transform: uppercase;
padding: 10px 30px !important;
}
.wpcf7-spinner {
margin: 5px auto 0 auto;
}
}
.row-form.split {
display: flex;
justify-content: space-between;
.col-form {
width: 48%;
}
}
p {
line-height: 1 !important;
}
} .byou {
.top-section-auto {
text-align: center;
align-items: center;
p:first-of-type {
margin-bottom: 1em;
}
}
.section-perche-byou h3 {
font-size: clamp(18px, 2.2vw, 50px);
}
.step-box .step-text:before {
content: none;
}
.byou-stages {
position: relative;
}
.byou-stages:before {
content: '';
position: absolute;
left: 50%;
top: 52%;
transform: translate(-50%, -50%);
width: 30vW;
height: 75%;
background-position: center;
background-image: url(//www.gifrab.it/wp-content/uploads/2026/02/lines.svg);
background-repeat: no-repeat;
background-size: contain;
z-index: -1;
}
.buttons {
text-align: center;
a {
display: inline-block;
}
a:first-of-type {
margin-right: 5px;
}
a:last-of-type {
margin-left: 5px;
}
}
.section-come-byou {
background-repeat: no-repeat;
background-position: left 20vw top -3vw;
background-size: 35vw !important;
}
.section-brands-byou {
overflow: hidden;
}
.infinite-carousel {
display: flex !important;
flex-wrap: nowrap;
align-items: center;
position: relative;
width: max-content;
.single-carousel {
display: flex;
justify-content: center;
align-items: center;
margin-left: clamp(10px, 6vw, 60px);
margin-right: clamp(10px, 6vw, 60px);
margin-top: 0;
}
img {
width: 180px;
max-height: 50px;
}
}
.byou-level {
margin-left: clamp(5px, 1vw, 15px);
margin-right: clamp(5px, 1vw, 15px);
border-radius: 30px;
overflow: hidden;
figure {
position: relative;
max-width: 100%;
border-radius: 0 0 30px 30px;
overflow: hidden;
margin-bottom: clamp(15px, 1.6vw, 30px);
}
figure:before {
content: '';
position: absolute;
inset: 0;
background-color: rgba(82, 82, 82, 0.3);
}
p {
box-sizing: border-box;
padding-left: clamp(10px, 0.8vw, 15px);
padding-right: clamp(10px, 0.8vw, 15px);
}
p:last-of-type {
padding-bottom: clamp(15px, 1.6vw, 30px);
}
}
.top-levels-box {
padding-top: clamp(10px, 2vw, 30px);
gap: clamp(10px, 2vw, 30px) !important;
.top-levels {
justify-content: space-between;
padding-top: clamp(15px, 2.2vw, 50px);
padding-bottom: clamp(15px, 2.2vw, 50px);
border-radius: 30px;
.title {
font-size: clamp(32px, 3.5vw, 45px);
}
.points {
font-size: clamp(28px, 3vw, 40px);
}
}
}
.benefici-byou {
align-items: stretch;
.texts {
margin-top: 8vw;
justify-content: center !important;
}
}
.faq-title {
font-size: clamp(25px, 2.2vw, 36px);
padding: clamp(15px, 1.6vw, 30px);
border-top: 1px solid #dfbd93;
border-left: 1px solid #dfbd93;
border-right: 1px solid #dfbd93;
cursor: pointer;
background-image: url(//www.gifrab.it/wp-content/uploads/2026/02/open-faq.svg);
background-repeat: no-repeat;
background-position: right clamp(15px, 1.6vw, 30px) center;
background-size: 35px;
}
.faq-title.active {
background-image: url(//www.gifrab.it/wp-content/uploads/2026/02/close-faq.svg);
}
.faq-box>div:last-of-type .faq-title:not(.active) {
border-bottom: 1px solid #dfbd93;
}
.faq-text {
font-size: clamp(18px, 1.8vw, 28px);
height: 0;
overflow: hidden;
border-left: 1px solid #dfbd93;
border-right: 1px solid #dfbd93;
}
.faq-text.opened {
height: auto;
padding: clamp(15px, 1.6vw, 30px);
border-top: 1px solid #dfbd93;
}
.faq-box>div:last-of-type .faq-text.opened {
border-bottom: 1px solid #dfbd93;
}
} .infinite-scroll-animation {
animation: infinite-scroll 240s linear infinite;
}
.infinite-scroll-animation-reverse {
animation: infinite-scroll 240s linear infinite reverse;
}
@keyframes infinite-scroll {
from {
transform: translateX(0);
}
to {
transform: translateX(-50%);
}
} footer {
margin-top: 0 !important;
background-color: #202A3B;
*,
p,
a,
a:focus,
a:visited,
a:hover {
font-family: 'Raleway', sans-serif;
font-size: clamp(15px, 1.2vw, 18px);
color: #FFFFFF;
}
p {
margin-top: 0;
margin-bottom: 0;
}
a {
display: inline-block;
}
strong {
font-weight: 700;
}
.footer-wrapper {
display: flex;
flex-direction: column;
padding-bottom: clamp(15px, 1.6vw, 30px);
}
.footer-logo,
.footer-nav,
.footer-company-info {
margin: 0 auto;
width: clamp(260px, 50vw, 900px);
}
.social-row one-col {
display: none;
}
.footer-logo {
display: flex;
justify-content: center;
}
.footer-nav,
.footer-company-info {
--cols: 3;
--gap: 20px;
display: grid;
grid-template-columns: repeat(var(--cols), 1fr);
gap: var(--gap);
position: relative;
}
.footer-company-info {
margin-top: clamp(15px, 1.6vw, 30px);
padding-top: clamp(15px, 1.6vw, 30px);
}
.footer-company-info:before {
content: '';
position: absolute;
left: 0;
right: calc(-1 * ((100vw - 100%) / 2 - clamp(30px, 5.5vw, 100px)));
top: 0;
height: 1px;
background-color: #FFFFFF;
}
.footer-company-info .col4,
.social-row.one-col {
a {
width: 30px;
height: 30px;
margin-left: 5px;
transition: 0.25s ease-in-out;
img {
width: 100%;
height: 100%;
}
}
a:hover {
transform: scale(1.05);
}
}
.footer-company-info .col4 {
padding-top: clamp(15px, 1.6vw, 30px);
position: absolute;
top: 0;
bottom: 0;
left: auto;
right: calc(-1 * ((100vw - 100%) / 2 - clamp(30px, 5.5vw, 100px)));
width: auto;
display: flex;
justify-content: flex-end;
gap: 6px;
}
.social-row.one-col {
display: none;
}
.bottom-footer-wrapper {
display: flex;
justify-content: space-between;
margin-top: clamp(15px, 1.6vw, 30px);
padding-top: clamp(15px, 1.6vw, 30px);
text-transform: uppercase;
border-top: 1px solid #FFFFFF;
}
.bottom-footer,
.bottom-footer a,
.bottom-footer a:hover {
font-size: clamp(14px, 0.833vw, 16px);
}
}
#cmplz-document {
max-width: none;
} @media screen and (max-width:1439px) {
.section-ecosystem .brand-tabs .stk-block-tabs__tab {
padding: 0 20px;
}
.bucalo-thun-row {
.bucalo-thun-col>div:after,
.bucalo-thun-col>div:before {
content: '';
width: 80px;
height: 60px;
left: 50px;
top: -25px;
}
.bucalo-thun-col>div:after {
left: auto;
top: auto;
bottom: -25px;
right: 50px;
}
}
}
@media screen and (max-width:1200px) {
.section-careers .col1 {
padding-left: 15px;
padding-right: 15px;
}
}
@media screen and (max-width:1024px) {
.bucalo-thun-row {
.bucalo-thun-col>div:after,
.bucalo-thun-col>div:before {
width: 80px;
height: 55px;
left: 35px;
top: -20px;
}
.bucalo-thun-col>div:after {
left: auto;
top: auto;
bottom: -20px;
right: 35px;
}
}
}
@media screen and (max-width:991px) {
.padding-y-low,
.padding-y-hi,
.padding-y {
padding-top: 50px;
padding-bottom: 50px;
}
.padding-top-low,
.padding-top-hi,
.padding-top {
padding-top: 50px;
}
.padding-x-hi,
.padding-x,
.padding-x-low {
padding-right: 50px;
padding-left: 50px;
}
.padding-left {
padding-left: 50px;
}
.padding-right {
padding-right: 50px;
}
.slim-article-content {
padding-left: 15vw;
padding-right: 15vw;
}
.section-careers .col1 {
padding-left: 0;
padding-right: 0;
justify-content: center;
}
footer {
.footer-logo,
.footer-nav,
.footer-company-info {
width: 88vw;
}
.footer-nav,
.footer-company-info {
--cols: 4;
--gap: 8px;
}
.footer-logo {
width: 250px;
}
.bottom-footer-wrapper {
flex-direction: column;
text-align: center;
}
}
.brand-tabs {
padding-left: 0;
padding-right: 0;
}
.section-ecosystem .brand-tabs .stk-block-tabs__tab {
padding: 0 6px;
}
.mission-box .mission-title {
left: 6%;
}
.bucalo-thun-row {
.bucalo-thun-col>div:after,
.bucalo-thun-col>div:before {
width: 60px;
height: 45px;
top: 0;
}
.bucalo-thun-col>div:after {
top: auto;
bottom: -15px;
}
.loghi-img {
max-width: 50%;
}
}
.section-environment-impatto .col-environment-impatto {
aspect-ratio: 16 / 8;
background-position-y: top 3vw;
background-position-x: left -13vW;
>div,
h2 {
margin-bottom: auto;
margin-top: auto;
padding-top: 0;
}
}
}
@media screen and (max-width:800px) {
.desktop {
display: none !important;
}
.mobile {
display: block !important;
}
.slim-article-content {
padding-left: 12vw;
padding-right: 12vw;
}
.bg-shape,
.bg-shape-gray {
background-position: top -4vw left -26vw;
background-size: 80vw;
}
.section-news.bg-shape {
background-size: 70vw;
}
.section-careers.bg-shape-gray {
background-position: top 3vw left -26vw;
}
.section-careers .col1 {
padding-top: 0;
}
.timeline {
display: none;
}
.mobile-timeline {
display: block;
max-width: 100%;
margin: 0 auto !important;
box-sizing: border-box;
}
.year-text {
font-size: clamp(28px, 5vW, 58px);
}
.single-brand-page article,
.single-brand-page article>.wp-block-group {
flex-direction: row;
figure:not(.single-brand-logo):not(.theblogos figure) {
margin-top: 20px;
margin-bottom: 35px;
flex-basis: 100%;
}
>.wp-block-group {
flex-basis: 100%;
padding-left: 0 !important;
}
}
.single-brand-page .padding-x,
.contatti-row,
.mobile-timeline {
padding-left: 10vW;
padding-right: 10vw;
}
.single-brand-logo img {
width: 220px;
max-height: 100px;
}
.tommy .single-brand-logo img,
.tommyk .single-brand-logo img {
width: 280px;
}
.tommyj .single-brand-logo img {
max-height: 60px;
}
.norths .single-brand-logo img {
max-height: 120px;
}
.theblogos {
flex-wrap: wrap;
figure {
width: 28%;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
} .contatti-row {
flex-direction: column-reverse !important;
padding-bottom: 40px;
.col2 {
padding: 0;
}
.col1 {
display: none;
}
>* {
flex-basis: 100%;
}
}
.byou {
.byou-logo img {
max-width: 68%;
margin-left: auto !important;
margin-right: auto !important;
}
.section-cosa-byou {
padding-bottom: 0;
.step-box {
.step-title {
text-align: center !important;
}
}
}
.byou-stages {
padding-top: 0;
>div {
padding-top: 15px;
}
}
.section-come-byou {
padding-bottom: 0;
}
.byou-level {
margin-left: 5px;
margin-right: 5px;
border-radius: 25px;
p {
padding-left: 5px;
padding-right: 5px;
}
figure {
border-radius: 0 0 25px 25px;
}
}
.top-levels-box .top-levels {
padding-left: 25px;
padding-right: 25px;
border-radius: 25px;
.tile {
padding-right: 10px;
}
}
.benefici-byou.half-gold-bg {
padding-top: 0;
background-image: none;
background-color: #DFBD93;
.texts {
margin-top: 0;
}
figure {
margin-top: auto;
margin-bottom: auto;
}
}
.faq-title {
background-size: 22px;
}
}
.bb-articles__filters {
justify-content: center;
flex-direction: column;
padding-top: 30px;
padding-bottom: 30px;
border-radius: 60px;
}
}
@media screen and (max-width:767px) {
.padding-y-low,
.padding-y-hi,
.padding-y {
padding-top: 40px;
padding-bottom: 40px;
}
.padding-top-low,
.padding-top-hi,
.padding-top {
padding-top: 40px;
}
.padding-x-hi,
.padding-x,
.single-brand-page .padding-x,
.padding-x-low, .contatti-row,
.section-stakeholder {
padding-right: 35px;
padding-left: 35px;
}
.padding-left {
padding-left: 35px;
}
.padding-left-h2 {
padding-right: 0;
}
.padding-right {
padding-right: 35px;
}
body:not(.single-post) .slim-article-content,
.mobile-timeline {
padding-right: 0;
padding-left: 0;
}
body.single-post .slim-article-content {
padding-left: 35px;
padding-right: 35px;
}
body.single-post main .single-title {
padding-top: 30px;
}
.small-text {
font-size: 13px;
}
header {
.wp-block-polylang-language-switcher {
margin-right: 60px;
}
.custom-logo-link img {
width: 120px;
}
.wp-block-navigation button {
height: 14px;
width: 25px;
}
}
.logo-carousel,
.byou .infinite-carousel {
img {
width: 120px;
max-height: 40px;
}
.bucalo img {
width: 130px;
}
.marville img {
max-height: 45px;
}
.tommy img,
.tommyk img {
width: 140px;
}
.tommyj img,
.emme img,
.theb img {
max-height: 30px;
}
.theb img {
max-height: 34px;
}
.la-malfa img {
max-height: 55px;
}
}
body:not(.single-brand-page) .default-article>.wp-block-group,
.section-network>.wp-block-group,
.section-careers>.wp-block-group {
flex-direction: column;
>* {
flex-basis: 100%;
}
p:has(> a.gifrab-button) {
padding-top: 15px;
width: 100%;
text-align: center;
}
}
.likeh1,
.small-title {
text-align: center;
}
.company-article {
.col1 {
padding-bottom: 40px;
padding-right: 0;
}
.col2 {
padding-left: 0;
}
}
.section-careers>.wp-block-group {
flex-direction: column;
>* {
padding-left: 0;
padding-right: 0;
}
}
.no-desktop-arrow .stk-block-carousel__buttons {
display: flex;
}
.numbers-box {
flex-direction: column;
.col1,
.col2,
.col3 {
flex-basis: 100%;
padding-left: 0;
padding-right: 0;
text-align: center;
width: 100%;
}
.col1,
.col2 {
padding-bottom: 40px;
}
}
.section-brand {
padding-left: 0;
padding-right: 0;
>h2,
>p {
padding-left: 35px;
padding-right: 35px;
}
}
.brand-tabs {
.wp-block-stackable-tab-labels button:first-of-type {
margin-left: 35px;
}
.wp-block-stackable-tab-labels button:last-of-type {
margin-right: 35px;
}
.wp-block-stackable-tab-content {
padding-left: 35px;
padding-right: 35px;
}
.stk-block-carousel__slider,
.stk-block.stk-block-column.stk-column>.stk-column-wrapper {
margin-left: initial;
margin-right: initial;
}
.stk-block-carousel__button {
width: 20px !important;
height: 40px !important;
}
.stk-block-carousel__button__prev {
margin-left: -28px !important;
}
.stk-block-carousel__button__next {
margin-right: -28px !important;
}
.stk-block-carousel.stk--arrows-outside.stk--arrows-justify-space-between.stk--arrows-align-center .stk-block-carousel__slider {
width: initial;
figure {
margin-bottom: 0;
img {
width: initial;
}
}
}
.stk-block-carousel__slider {
overflow-x: scroll !important;
overflow-y: hidden !important;
.wp-block-stackable-column:hover {
transform: none;
}
}
}
.section-network {
.col1 {
aspect-ratio: 1/1;
}
.col2 p:not(.small-title) {
text-align: left;
padding-left: 0;
padding-right: 0;
}
}
.footer-logo {
width: 190px;
}
footer {
.footer-nav,
.footer-company-info {
--cols: 1;
--gap: 0;
text-align: center;
.col2,
.col3 {
padding-top: 30px;
}
.col4 {
display: none;
}
.col1 {
order: 1;
}
.col2 {
order: 2;
}
.col3 {
order: 3;
}
}
.social-row.one-col {
display: flex;
justify-content: center;
padding-bottom: 30px;
}
.bottom-footer-wrapper .col1 {
padding-bottom: 10px;
}
.bottom-footer,
.bottom-footer a,
.bottom-footer a:hover {
font-size: 13px;
}
}
body:not(.home):not(.byou) .top-section-auto,
.press-page .press-header {
min-height: auto;
aspect-ratio: 4/3;
}
.section-ecosystem .brand-tabs,
.brands-grid {
padding-left: 0;
padding-right: 0;
}
.brands-header {
aspect-ratio: auto !important;
max-width: 100%;
display: flex !important;
>div:first-child {
aspect-ratio: 4/3;
}
}
.box-grid-brands {
padding-top: 0;
}
.brands-grid {
row-gap: 5vw;
column-gap: 14vw;
grid-template-columns: repeat(2, minmax(0, 1fr));
a img {
width: 100%;
max-height: 65px;
max-width: 120px;
padding: 10px 0;
}
}
.back-button:hover a:after {
transform: none;
}
.social-brands {
a {
margin-left: 5px;
}
}
.single-brand-logo img {
width: 180px;
max-height: 80px;
}
.tommy .single-brand-logo img,
.tommyk .single-brand-logo img {
width: 230px;
}
.tommyj .single-brand-logo img {
max-height: 50px;
}
.norths .single-brand-logo img {
max-height: 100px;
}
.theblogos {
justify-content: space-evenly;
figure {
width: 40%;
}
}
.header-text-title {
margin-left: 30px !important;
margin-right: 30px !important;
text-align: center;
}
.section-environment-impatto .col-environment-impatto {
aspect-ratio: auto;
background-position-y: top 3vw;
background-position-x: left -22vw;
background-size: 326% !important;
background-repeat: no-repeat;
background-color: #dbd1c7;
}
.row-environment-impatto {
flex-direction: column;
>div {
flex-basis: 100%;
width: 100%;
}
>div:first-of-type {
aspect-ratio: 1/1;
}
}
.contact-form {
.row-form:nth-child(3) p {
margin-top: 15px;
margin-bottom: 15px;
}
.row-form.split {
flex-direction: column;
justify-content: flex-start;
.col-form {
width: 100%;
}
}
}
.mission-box {
flex-direction: column;
.mission-description::before {
content: none;
}
.mission-title {
position: initial;
transform: none;
font-size: 22px;
padding-bottom: 35px;
}
}
body.byou {
.top-section-auto {
min-height: auto;
aspect-ratio: 4/7;
padding-left: 20px;
padding-right: 20px;
}
.byou-logo img {
max-width: 50%;
margin-left: auto !important;
margin-right: auto !important;
}
.section-cosa-byou .step-box,
.byou-stages>div,
.byou-levels,
.top-levels-box,
.benefici-byou {
flex-direction: column;
}
.byou-stages>div:nth-child(even) {
flex-direction: column-reverse;
}
.section-cosa-byou .step-box {
align-items: center;
>div {
padding-left: 13vw;
padding-right: 13vw;
}
>div:not(.last-of-type) {
padding-bottom: 35px;
}
.step-title {
padding-bottom: 10px;
}
}
.byou-stages {
>div>* {
padding-left: 0;
padding-right: 0;
}
figure {
padding-bottom: 35px;
}
h3 {
width: 100%;
text-align: center;
}
}
.byou-stages:before {
content: none;
}
.section-come-byou {
p {
margin-bottom: 0;
}
.buttons {
a {
min-width: 120px;
margin-left: 0;
margin-right: 0;
}
a:first-of-type {
margin-bottom: 15px;
}
}
}
.byou-level {
margin-bottom: 35px;
}
.byou-level p,
.top-levels-box .top-levels .title,
.top-levels-box .top-levels .points {
font-size: 20px;
}
.top-levels-box {
padding-top: 0;
gap: 35px !important;
.top-levels {
width: 100%;
}
}
.section-perche-byou p.padding-bottom {
padding-bottom: 0;
}
.benefici-byou.half-gold-bg {
padding-left: 40px;
padding-right: 40px;
padding-top: 35px;
.texts {
padding-left: 0;
padding-right: 0;
}
}
.single-faq {
padding-left: 0;
padding-right: 0;
.faq-title,
.faq-text {
box-sizing: border-box;
}
.faq-title {
padding-right: 35px;
font-size: 18px;
background-size: 15px;
background-position: right 10px center;
}
}
}
.approccio-retail {
>* {
padding-left: 0;
padding-right: 0;
}
h2 {
padding-bottom: 35px;
}
}
body:not(.byou) .step-box {
padding-top: 0 !important;
>div {
padding-left: 13vw !important;
padding-right: 13vw !important;
width: 100%;
padding-bottom: 0 !important;
p.step-title {
text-align: center;
padding-bottom: 15px;
}
p.step-text:before {
content: none;
}
}
>div:not(:first-of-type) p.step-title {
padding-top: 35px;
}
}
.retail-box {
gap: 0 !important;
>div:first-of-type {
padding-bottom: 0;
}
}
}
@media screen and (max-width:570px) {
header {
.wp-block-navigation button:before {
content: none;
}
.wp-block-polylang-language-switcher {
margin-right: 0;
}
.custom-logo-link img {
width: 100px;
}
}
.padding-y-low,
.padding-y-hi,
.padding-y {
padding-top: 30px;
padding-bottom: 30px;
}
.padding-top-low,
.padding-top-hi,
.padding-top {
padding-top: 30px;
}
.section-title-big {
display: block !important;
padding-left: 35px;
padding-right: 35px;
}
.section-title-big:before,
.section-title-big:after {
content: none;
}
.mission-box .mission-title {
padding-bottom: 30px;
}
body.byou {
.section-cosa-byou .step-box>div:not(.last-of-type) {
padding-bottom: 30px;
}
.byou-stages {
figure {
padding-bottom: 30px;
}
}
.byou-level {
margin-bottom: 30px;
}
.top-levels-box {
gap: 30px !important;
}
.benefici-byou.half-gold-bg {
padding-left: 35x;
padding-right: 35px;
padding-top: 30px;
}
}
.section-stakeholder .section-title-big {
padding-left: 0;
padding-right: 0;
}
.approccio-retail h2 {
padding-bottom: 30px;
}
.credits .d-block {
display: inline;
}
.bblogo {
max-width: 170px;
}
.bucalo-thun-row .loghi-img {
max-width: 75%;
}
}
@media screen and (max-width:375px) {
.gifrab-button,
.gifrab-button:focus,
.gifrab-button:visited,
.aw_application .aw_applyLink {
padding: 10px 20px;
}
}