/*Avraham Adv New*/ :root { --black: #030303; --dgray: #606060; --gray: #A2A2A2; --yellow: #eeff02; --pink: #fe1765; --green: #00ff3c; --gap-2: 0.104vw; --gap-4: 0.208vw; --gap-6: 0.313vw; --gap-8: 0.417vw; --gap-10: 0.521vw; --gap-12: 0.625vw; --gap-14: 0.729vw; --gap-16: 0.833vw; --gap-18: 0.938vw; --gap-20: 1.042vw; --gap-21: 1.094vw; --gap-22: 1.146vw; --gap-24: 1.25vw; --gap-26: 1.354vw; --gap-28: 1.458vw; --gap-30: 1.563vw; --gap-32: 1.667vw; --gap-36: 1.875vw; --gap-40: 2.083vw; --gap-44: 2.292vw; --gap-48: 2.5vw; --gap-50: 2.604vw; --gap-52: 2.708vw; --gap-56: 2.917vw; --gap-60: 3.125vw; --gap-64: 3.333vw; --gap-66: 3.438vw; --gap-70: 3.646vw; --gap-72: 3.75vw; --gap-80: 4.17vw; --gap-90: 4.688vw; --gap-96: 5vw; --gap-98: 5.104vw; --gap-100: 5.208vw; --gap-110: 5.729vw; --gap-114: 5.938vw; --gap-120: 6.25vw; --gap-140: 7.292vw; --gap-150: 7.813vw; --gap-156: 8.125vw; --gap-160: 8.333vw; --gap-165: 8.594vw; --gap-170: 8.854vw; --gap-180: 9.375vw; --gap-190: 9.896vw; --gap-195: 10.156vw; --gap-200: 10.417vw; --gap-210: 10.938vw; --gap-220: 11.458vw; --gap-240: 12.5vw; --gap-250: 13.021vw; --gap-260: 13.542vw; --gap-300: 15.625vw; --fs-13: 0.677vw; --fs-14: 0.729vw; --fs-15: 0.781vw; --fs-16: 0.833vw; --fs-17: 0.885vw; --fs-18: 0.938vw; --fs-19: 0.99vw; --fs-20: 1.042vw; --fs-21: 1.094vw; --fs-22: 1.146vw; --fs-24: 1.25vw; --fs-25: 1.302vw; --fs-26: 1.354vw; --fs-28: 1.458vw; --fs-30: 1.563vw; --fs-31: 1.615vw; --fs-32: 1.667vw; --fs-45: 2.344vw; --fs-48: 2.5vw; --fs-50: 2.604vw; --fs-55: 2.865vw; --fs-64: 3.333vw; --fs-38: 1.979vw; fs-55: 2.865vw; --fs-72: 3.75vw; --fs-80: 4.167vw; --fs; --fs-55: 2.865vw; --fs-88: 4.583vw; --fs-65: 3.385vw; --fs-90: 4.688vw; --fs-120: 6.25vw; --fs-140: 7.292vw; --fs-160: 8.333vw; --fs-168: 8.75vw; --fs-200: 10.417vw; --font-1: 'almoni-regular-aaa', sans-serif; --font-2: 'almoni-ultrabold-aaa'; --font-3: 'abcdiatypehebrew-heavy-trial'; } /*------------------------------------------/* GENERAL /*------------------------------------------*/ html { font-size: 62.5%; overflow-x: clip; } body { opacity: 0; color: rgb(75 85 99); background: var(--white); transition: 0.3s opacity ease; font-family: var(--font-1) !important; /* line-height: 1; */ font-size: 2rem; zoom: 1 !important; position: relative; transition-delay: 0.5s; } body { font-size: clamp(15px, var(--fs-18),300px); font-family: var(--font-1); } body.shown { opacity: 1; } body, body.modal-open { padding: 0 !important; overflow: clip !important; } .modal { z-index: 10000; } .modal-backdrop.in { opacity: 0.5; } .gallery-cubes-modal { padding: 0 !important; } .gallery-cubes-modal .flexslider .slides { display: flex; align-items: center; flex-wrap: wrap; } .gallery-cubes-modal .flexslider .flex-direction-nav li a { outline: unset; } .gallery-cubes-modal .flexslider a.flex-next:before, .gallery-cubes-modal .flexslider a.flex-prev:before { font-size: 250%; } h1, .section-title h1, .section-title h2, .grid-rows .grid-row-text h2, #DynamicFormObject .dynamicFormObjectTitleAndText h3.dynamicFormObjectTitle, #pageview :is(#text1, #text2) > h2, #headline h1 { position: relative; display: inline-block; max-width: 100%; width: 100%; font-family: var(--font-3); color: var(--black); line-height: 0.91; font-size: clamp(125px,var(--fs-168),300px); letter-spacing: -5.6px; direction: ltr; margin: 0; /* overflow: hidden; */ } .grid-text-content :is(p, li), .grid-box-fulltext :is(p, li), .grid-text :is(p, li), :is(#lobbyText, #text1, #text2, .text1, .text2) :is(p, li), .grid-rows .grid-row-text :is(p, li), :is(#text1, #text2) > span, .section-topText :is(p, li), #catalogText :is(p, li) { font-size: clamp(16px,var(--fs-20),300px); position: relative; line-height: 1.35; color: var(--black); } .grid-text .grid-text-content h2, .grid-rows .grid-row-text h3 { font-size: clamp(22px,var(--fs-26),300px); font-family: var(--font-2); line-height: 1.2; color: var(--black); margin: 0; } .section-title, .grid-text-section .section-title { margin: 0; } #SiteContainer { position: relative; z-index: 1; } body:not(.home-page, .about, .contact) #SiteGrid { overflow-x: clip; padding-top: var(--headerHeight); } body:not(:has(#GridTop.noTopImage)) #SiteGrid { padding: 0; } #SiteGridContainer { position: relative; z-index: 2; } #GridWrapInner { max-width: var(--app-width); display: flex; flex-direction: column; } #allSectionsWrapper { z-index: 2; background: var(--lpink); } .sections .section, section.section { margin-bottom: 0; /* background: transparent; */ padding: 0; max-width: var(--app-width); width: 100%; min-height: 100vh; } .grid-rows .grid-row { background: inherit; } .grid-row li.slider-item, .grid-boxes .grid-box-image { padding-bottom: 0; overflow: visible; } .grid-boxes .grid-box-image-container, .grid-row .grid-row-image-container, .grid-short-box-image .image-container { position: relative; height: 100%; } .grid-text.gridHasVideo .grid-iframe-holder { padding: 0; display: flex; overflow: hidden; } .grid-text.gridHasVideo .grid-iframe-holder video { width: 100%; } .grid-boxes { display: flex; margin: 0; width: 100%; } .grid-boxes .grid-box { margin: 0; padding: 0; } .grid-boxes .grid-box .grid-box-image, #lobbyview .grid-boxes .grid-box-image, :is(div, #LobbyModule) .grid-boxes .grid-box-image { margin: 0; } .grid-boxes .grid-box-title h3 a { color: var(--dbrown)-; outline: none !important; transition: 0.3s ease all; } #lobbyview .grid-boxes, #LobbyModule .grid-boxes { max-width: unset; padding: 0; margin: 0; } #LobbyModule .grid-box { opacity: inherit; font-size: 2rem; margin: 0; } #text1 p:last-child { margin: 0; } #GridPage { padding: 0; background: var(--lpink); } #main-header .max-width, #GridPage .max-width, .blog-grid #GridPage .max-width, .max-width, .lobby-grid #GridPage .max-width { width: 100%; padding: 0; max-width: 100%; margin: 0; } .grid-text-content, .grid-text .grid-text-content { opacity: initial; margin: 0; width: 100%; padding: 0; } .grid-text p { margin-top: 0; } b, strong { font-weight: unset; font-family: var(--font-2); } li::marker { color: var(--black); } a:hover, a:focus { color: inherit; } .container-fluid { padding: 0; } .gallery-container { width: 100%; } .gallery-cubes { display: flex; } .box-image-animation { outline: unset !important; } .box-image-animation:hover img { transform: none !important; } .box-image-animation img { } #GridPromo { width: 100%; margin: 0; padding: 0; } #CatalogModule { padding: 0; } .itemContentWrapper { margin: 0; } .catalogContainer.container { width: 100%; padding: 0; margin: 0; } .row { margin: 0; } .slick-track::before, .slick-track::after, .grid-boxes::before, .grid-boxes::after, .grid-rows::before, .grid-rows .grid-row::after, #gridshort-view > div::before, #gridshort-view > div::after, .gallery-cubes::before, .gallery-cubes::after, .row::before, .row::after, .clearfix:before, .clearfix:after, .dl-horizontal dd:before, .dl-horizontal dd:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after, .panel-body:before, .panel-body:after, .modal-footer:before, .modal-footer:after, .clearfix:before, .clearfix:after, .dl-horizontal dd:before, .dl-horizontal dd:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after, .panel-body:before, .panel-body:after, .modal-footer:before, .modal-footer:after, .clearfix { display: none !important; } /*.swiper-scrollbar.swiper-scrollbar-0 { display: none; }*/ #GridTop, #GridTop.blog { height: 32.292vw; background-repeat: no-repeat; background-size: contain; } #GridTop.noTopImage.longer { height: 0; overflow: hidden; } #home-gallery .scroll-down { display: none; } #player-controls { display: none; } .cartItemsCounter { background: var(--blue); } .cartItemsCounter span.CartItems { color: var(--white); left: 50%; top: 60%; } footer { padding: 0; display: block; position: relative; z-index: 1000; } #SiteFooter { float: none; } h1, .h1, h2, .h2, h3, .h3 { margin: 0; } #SiteGridContainer .newCatalogItemQuantity .item-quantity-options button svg { fill: white; /* width: 23px; */ } .st0 { fill: white !important; width: 5px; height: 43px; } .CatalogItemHowMuchDidYouSaved span.SavedAmountSpan:after, .itemBeforeDiscountPrice.hasDiscount:after { content: "₪"; font-size: 100%; } #home-gallery .opacity-layer { opacity: 1 !important; position: absolute; z-index: 3; background: white; } .gallery-cubes .image-link-container { display: none; } .blog-post { padding: 0; direction: ltr; } #video-content-modal.videoInPop .modal-content { background: none; max-width: none; } .spinner { top: 150%; } .line { overflow: hidden; white-space: nowrap; direction: ltr; } .normal-form input::placeholder { font-family: var(--font-1), sans-serif; color: var(--black); } .normal-form :is(input,textarea) { font-size: clamp(16px,var(--fs-20),300px); } .normal-form input:focus { border: unset !important; border-bottom: 1px solid var(--black) !important; } input[type=file]:focus, input[type=radio]:focus, input[type=checkbox]:focus { outline: none !important; } #video-content-modal.modal .close { left: 50%; transform: translateX(-50%); font-size: unset; margin: 0; top: 0; } #video-content-modal.modal .close svg { width: 20px; height: auto; aspect-ratio: 1; } @media(min-width: 1026px) { #multi-content-modal.videoInPop .modal-content { background: none; padding: 0; height: 60vh; } .highlights { position: fixed; width: var(--gap-120); height: var(--gap-100); left: 1%; top: 1%; overflow: hidden; opacity: 0; transition: 0.3s ease all; mix-blend-mode: difference; z-index: -1; } .highlights:after { content: ""; width: 100%; position: absolute; height: 100%; left: 0; background: black; transition: 0.6s ease all; } .highlights .wrapper { position: absolute; left: 0; bottom: 0; width: var(--gap-120); height: 100%; background-image: url("https://media.getmood.io/warehouse/dynamic/704858.svg"); background-position: center; background-repeat: no-repeat; background-size: contain; animation: scroll-bg 2s linear infinite; } .highlights .wrapper:first-child { left: -100%; } body.scrolling .highlights { opacity: 1; z-index: 1000; width: var(--gap-120); } body.scrolling .highlights:after { width: 0; direction: ltr; } .pin-spacer:has(.alt-cubes-animated) { background: white; } .gsap-wrapper { background: white; } .yellow-btn { position: relative; display: inline-block; overflow: hidden; padding: 12px 24px; } .yellow-btn::before, .yellow-btn::after { content: attr(data-text); position: absolute; left: 0; width: 100%; height: 100%; text-align: center; transition: transform 0.3s ease; background: var(--yellow); align-content: center; } .yellow-btn::before { top: 0; transform: translateY(0); } .yellow-btn::after { top: 100%; } .yellow-btn:hover::before { transform: translateY(-100%); } .yellow-btn:hover::after { transform: translateY(-100%); } } @media(max-width: 1025px) { :root { --gap-2: 2px; --gap-4: 4px; --gap-6: 6px; --gap-8: 8px; --gap-10: 10px; --gap-12: 12px; --gap-14: 14px; --gap-16: 16px; --gap-18: 18px; --gap-20: 20px; --gap-24: 24px; --gap-28: 28px; --gap-30: 30px; --gap-32: 32px; --gap-36: 36px; --gap-40: 40px; --gap-44: 44px; --gap-48: 48px; --gap-50: 50px; --gap-52: 52px; --gap-56: 56px; --gap-60: 60px; --gap-64: 64px; --gap-72: 72px; --gap-80: 80px; --gap-90: 90px; --gap-96: 96px; --gap-100: 100px; --gap-120: 120px; --gap-140: 140px; --gap-160: 160px; --gap-180: 180px; --gap-200: 200px; --gap-240: 240px; --fs-12: 12px; --fs-14: 14px; --fs-15: 15px; --fs-16: 16px; --fs-18: 18px; --fs-20: 20px; --fs-26: 26px; --fs-28: 28px; --fs-30: 30px; --fs-32: 32px; --fs-44: 44px; --fs-56: 56px; } .top-caption { position: absolute; transform: translateX(-50%); left: 50%; margin: 0; height: fit-content; justify-content: center; font-family: var(--font-2); } .grid-text-content :is(p, li), .grid-box-fulltext :is(p, li), .grid-text :is(p, li), :is(#lobbyText, #text1, #text2, .text1, .text2) :is(p, li), .grid-rows .grid-row-text :is(p, li), :is(#text1, #text2) > span, .section-topText :is(p, li), #catalogText :is(p, li) { font-size: 18px; line-height: 1.35; } .opacity-layer-slide { position: absolute; width: 100%; height: 100%; opacity: 0.2; background: black; z-index: 3; } h1, h2, .section-title h1, .section-title h2, .grid-text h2, .grid-rows .grid-row-text h2, #DynamicFormObject .dynamicFormObjectTitleAndText h3.dynamicFormObjectTitle, #pageview :is(#text1, #text2) > h2, #headline h1 { font-size: 50px; line-height: 0.95; letter-spacing: -2px; } .faq-headline .button-open { /* display: none; */ } #GridTop, #GridTop.blog { height: auto; /* aspect-ratio: 1; */ height: 280px; position: relative; } .sections .section, section.section { max-width: unset; } #PageBreadCrumps, .lobby-grid #PageBreadCrumps { font-size: var(--fs-16); padding: var(--gap-12) var(--gap-24) var(--gap-40); justify-content: normal; position: relative; } .categories-strip ul.hidden-xs { gap: var(--gap-4) var(--gap-8); padding: var(--gap-10) var(--gap-24); width: 100vw; flex-wrap: nowrap; overflow-x: auto; } .categories-strip ul.hidden-xs li a { font-size: var(--fs-16); } .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 1%; } .swiper-pagination-bullet-active { background: var(--black) !important; } :is(div,#LobbyModule) #lobbyview #headline h1 { font-size: 50px; line-height: 0.95; letter-spacing: -2px; } .grid-text .grid-text-content h2, .grid-rows .grid-row-text h3 { font-size: 20px; letter-spacing: -0.4px; line-height: 1.2; } #multi-content-modal.videoInPop .modal-content { height: 150px; padding: 0; max-width: 100%; margin: 0; background: none; } #SiteGrid > div { position: relative; z-index: 1; } .col-md-4 { will-change: transform; } } /*------------------------------------------/* HEADER /*------------------------------------------*/ #main-header { background: none !important; padding: var(--gap-20); display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: stretch; /* height: var(--gap-56); */ } #main-header .header-container { /* padding: var(--gap-20); */ justify-content: center; align-items: stretch; width: fit-content; margin-inline: auto; padding: var(--gap-6) var(--gap-28); background: var(--black); border-radius: 50px; align-items: center; position: absolute; left: 50%; transform: translateX(-50%); } #main-header .header-container > * { transition: 0.5s ease all; /* width: 100%; */ overflow: hidden; } body.scrolling #main-header .header-container:after { content: ""; background-image: url("https://media.getmood.io/warehouse/dynamic/696004.svg"); width: 0px; height: var(--gap-21); transition: all 0.3s ease; background-size: contain; background-repeat: no-repeat; } #main-header .header-container .header-right { background: var(--black); width: fit-content; } #main-header .header-container .header-right .menu-nav { position: static; } #main-header .header-container .header-right .menu-nav ul#menu { color: white; gap: var(--gap-28); transition: 0.3s ease all; white-space: nowrap; } #main-header .header-container .header-right .menu-nav ul#menu li.social-mobile { display: none; } #main-header .header-container .header-right .menu-nav ul#menu li.active a { color: var(--yellow); } #main-header .header-container .header-left { display: flex; background: var(--black); padding-inline-start: var(--gap-24); width: fit-content; } #main-header .header-container .header-left a.logoHeader { display: block; width: 100%; flex: 1; } #main-header .header-container .header-left a.logoHeader img { width: 132px; height: 44px; } #main-header li:has(.yellow-btn) { list-style: none; height: 100%; height: var(--gap-56); } #main-header li:has(.yellow-btn) a.yellow-btn { background: var(--yellow); padding-inline: var(--gap-32); display: block; height: 100%; text-align: center; align-content: center; border-radius: 50px; font-size: clamp(15px,var(--fs-18),300px); color: var(--black); } body.scrolling #main-header:not(.open) .header-container { padding-inline: var(--gap-8); border-radius: 50px; } body.scrolling #main-header .header-container > * { } body.scrolling #main-header:not(.open) .header-container:after { width: var(--gap-40); } #main-header section.section.grid-content-section.stories { min-height: 0; width: fit-content; margin: 0; } #main-header section.section.grid-content-section.stories .grid-boxes { height: auto; width: 100%; gap: var(--gap-8); transition: 0.3s ease all; opacity: 1; } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box { height: fit-content; width: fit-content; /* aspect-ratio: 1; */ } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image { height: fit-content; width: fit-content; margin-inline: auto; } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container { width: fit-content; height: fit-content; } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container a.box-image-animation { height: fit-content; width: fit-content; border-radius: 50%; padding: 2px; overflow: visible; } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container a.box-image-animation img { position: relative; width: var(--gap-50); height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 50%; } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container a.box-image-animation .grid-iframe-holder { display: none; } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-title { margin-top: var(--gap-6); } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-title h3 { font-size: unset; font-family: var(--font-1); } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-title h3 a { font-family: var(--font-1), sans-serif; color: var(--gray); line-height: 1.35; letter-spacing: 0.39px; font-size: clamp(10px,var(--fs-13),300px); } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container a.box-image-animation:after { position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; content: ""; background-image: url("https://media.getmood.io/warehouse/dynamic/696005.svg"); background-position: center; background-repeat: no-repeat; transform: scale(1.1); background-size: contain; } @media(max-width: 1025px) { #main-header:not(.open) .header-container { border: 1px solid #3d3d3d; } #main-header .header-container { padding-inline: 5px 24px; gap: 12px; position: fixed; overflow: hidden; gap: 0; justify-content: inherit; transition: 0.3s ease all; width: 54%; position: relative; transform: unset; left: unset; } #main-header .header-container:after { width: 0px; background-image: url(https://media.getmood.io/warehouse/dynamic/696004.svg); content: ""; height: 14px; } #main-header .header-container .header-left { padding: 0; /* position: absolute; */ left: 50%; /* transform: translateX(50%); */ z-index: 3; width: fit-content; border-radius: 15px; } #main-header .header-container .header-left a.logoHeader { width: fit-content; } #main-header .header-container .header-left a.logoHeader img { object-fit: contain; width: fit-content; height: 14px; } #main-header .header-container .header-right { width: 40px; min-width: 40px; height: auto; aspect-ratio: 1; justify-content: center; border-radius: 50%; background: var(--yellow); position: static; transition: width 0s; margin-inline-end: 6px; } #main-header .header-container .header-right .menu-nav.open { } #main-header .header-container .header-right .menu-nav ul#menu { gap: 0; transform: translateY(99%); transition-delay: 0.3s; /* border-radius: 30px; */ } #main-header .header-container .header-right .menu-nav.open ul#menu { height: fit-content; transition-delay: 0.3s; margin: 0; /* border-radius: 0; */ } #main-header .header-container .header-right .menu-nav:after { content: ""; width: 100%; height: 100%; position: absolute; bottom: 0; right: 0; border-radius: 33px; /* background: var(--black); */ } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-title h3 { font-size: 13px; margin: 0; } #main-header.open section.section.grid-content-section.stories { height: 120px; } body.scrolling #main-header:not(.open) .header-container { width: 112px; gap: 0; } body.scrolling #main-header:not(.open) .header-container:after { background-position: center; background-size: contain; background-repeat: no-repeat; width: 40px; height: 14px; } body.scrolling #main-header .header-container > .header-right { width: 40px !important; opacity: 1; padding: 0; } body.scrolling #main-header:not(.open) .header-container > .header-left { width: 0; } #nav-toggle span { background: var(--yeloow); } #nav-toggle span:before { top: -5px; } #nav-toggle span:after { bottom: -5px; } #main-header ul.menu li.active { text-decoration: none; } #main-header li:has(.yellow-btn) a.yellow-btn { border-radius: 0; } #main-header li.last-item { /* display: none; */ color: var(--black); border-radius: 0; padding: 4px; } #main-header .menu-nav ul.menu { width: 100%; height: 100%; bottom: 0; left: 0; position: absolute; padding: 0; right: unset; top: unset; transform: translateY(100%); z-index: -1; background: var(--black); height: fit-content; text-align: center; justify-content: center; gap: 0; border-radius: 0; } #main-header .menu-nav ul.menu li { /* flex: 1; */ height: 0px; overflow: hidden; transition: 0.3s ease all; transition-delay: 0.3s; align-content: center; opacity: 0; } #main-header.open .header-container { width: 94%; overflow: visible; border-radius: 0; } #main-header.open .header-container::after { z-index: -1; } #main-header.open .header-container .header-left { position: absolute; right: 50%; transform: translateX(50%); } #main-header.open .menu-nav ul.menu li { height: 56px; opacity: 1; } #main-header:not(.open) .header-container .header-right .menu-nav:after { z-index: -1; } #main-header section.section.grid-content-section.stories { margin-inline: auto; height: 0; align-content: center; transition: 0.3s ease all; transition-delay: 0.3s; } #main-header section.section.grid-content-section.stories .grid-boxes { gap: 4px; } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box { gap: 2px; min-height: 0; } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-title h3 a { font-size: 13px; } #main-header section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image { margin: 0; } } @media(min-width: 1025px) { #main-header .header-container .header-left a.logoHeader img { width: 6.875vw; height: 2.292vw; transition: 0.3s ease all; } #main-header .header-container .header-right .menu-nav ul#menu li { max-width: 1000px; transition: 0.3s ease all; } #main-header .header-container .header-right .menu-nav ul#menu li a:hover { color: var(--yellow); } body.scrolling #main-header .header-container > * { width: fit-content; opacity: 0; padding: 0; } body.scrolling #main-header .header-container .header-right .menu-nav ul#menu { gap: 0; } body.scrolling #main-header .header-container .header-right .menu-nav ul#menu li { max-width: 0; } body.scrolling #main-header .header-container .header-left a.logoHeader img { width: 0; } body.scrolling #main-header section.section.grid-content-section.stories .grid-boxes { opacity: 0; } body.scrolling #main-header section.section.grid-content-section.stories .highlights { opacity: 1; } } /*------------------------------------------/* SECTIONS /*------------------------------------------*/ #allSectionsWrapper .section.grid-text-section { align-content: center; } #allSectionsWrapper .section.grid-text-section .section-title { margin-bottom: var(--gap-40); width: 85%; margin-inline: auto; } #allSectionsWrapper .section.grid-text-section .grid-text { width: 38%; margin-inline: auto; } #allSectionsWrapper .section.grid-text-section .grid-text .grid-text-content { } #allSectionsWrapper .section.grid-text-section .grid-text .grid-text-content h2 { margin-bottom: var(--gap-12); } #allSectionsWrapper .section.grid-text-section .grid-text .grid-text-content a.sec-button { background: var(--yellow); padding-inline: var(--gap-32); display: inline-block; height: var(--gap-56); text-align: center; align-content: center; border-radius: 50px; font-size: clamp(18px, var( --fs-18), 300px); color: var(--black); min-width: var(--gap-150); } #allSectionsWrapper .section.grid-text-section .grid-text .grid-text-content:has(a) h2 { margin-bottom: var(--gap-40); } #allSectionsWrapper .section.grid-row-section.cards { margin-top: var(--headerHeight); } #allSectionsWrapper .section.grid-row-section.cards .grid-rows { position: relative; display: block; /* height: 500px; */ margin-top: var(--headerHeight); } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row { direction: rtl !important; display: inline-flex; height: 25vw; border-top: 1px solid var(--black); position: sticky; top: 0; background: white; } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row:last-child { border-bottom: 1px solid var(--black); } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text { display: flex !important; min-height: 100%; flex: 1; padding-block: var(--gap-20) var(--gap-96); padding-inline: var(--gap-20); } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text { width: 100%; display: flex; flex-direction: column; text-align: center; } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text h2 { font-size: clamp(100px,var(--fs-140),300px); text-align: center; } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text > .wrapped { margin-top: auto; width: 54%; margin-inline: auto; } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text > .wrapped h3 { margin-bottom: var(--gap-12); } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.flexslider-box { display: flex !important; align-items: center; padding-inline-start: var(--gap-20); } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.flexslider-box ul.slides { flex: 1; } #allSectionsWrapper .section.grid-row-section.numbers { overflow: hidden; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child { display: flex; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper { display: flex; flex-direction: column; flex: 1; background: var(--yellow); position: relative; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper .grid-row-cell.grid-row-cell-text { width: 100%; height: 100vh; aspect-ratio: 1; display: inline-block !important; align-content: center; /* position: sticky; */ /* top: 0; */ background: var(--yellow); } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .grid-row-cell.flexslider-box { position: relative; top: 0; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper .grid-row-cell.grid-row-cell-text .grid-row-text { text-align: center; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper .grid-row-cell.grid-row-cell-text .grid-row-text h2 { line-height: 1; letter-spacing: -6.72px; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper .grid-row-cell.grid-row-cell-text .grid-row-text h3 { margin-bottom: var(--gap-10); } #allSectionsWrapper .section.grid-content-section.jobs { min-height: unset; padding-bottom: var(--gap-260); } #allSectionsWrapper .section.grid-content-section.jobs .grid-boxes { display: flex; flex-direction: column; } #allSectionsWrapper .section.grid-content-section.jobs .grid-boxes .grid-box { position: relative; width: 100%; border-top: 1px solid var(--black); background: white; transition: 0.3s ease all; } #allSectionsWrapper .section.grid-content-section.jobs .grid-boxes .grid-box .grid-box-subtitle.button { position: absolute; font-size: unset; bottom: 50%; left: var(--gap-20); transform: translateY(50%); font-size: clamp(20px,var(--fs-20),300px); } #allSectionsWrapper .section.grid-content-section.jobs .grid-boxes .grid-box .grid-box-title { display: block; } #allSectionsWrapper .section.grid-content-section.jobs .grid-boxes .grid-box .grid-box-title h3 { font-size: unset; margin: 0; font-family: var(--font-3); font-size: clamp(32px,var(--fs-32),300px); width: 100%; display: block; } #allSectionsWrapper .section.grid-content-section.jobs .grid-boxes .grid-box .grid-box-title h3 a { color: var(--black); display: block; padding-block: var(--gap-24); line-height: 0.91; letter-spacing: -0.64px; } #allSectionsWrapper .section.grid-content-section.jobs .grid-boxes .grid-box .grid-box-subtitle.button a:after { content: url("https://media.getmood.io/warehouse/dynamic/690152.svg"); margin-inline-start: var(--gap-12); } #allSectionsWrapper .section.grid-content-section.jobs .grid-boxes .grid-box .grid-box-title h3 a { } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .circle { width: var(--gap-24); height: auto; aspect-ratio: 1; position: fixed; left: 49.1%; bottom: 45.7%; background: var( --black); border-radius: 50%; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .section-topText { width: 36%; position: absolute; bottom: 20%; left: 50%; transform: translate(-50%,-50%); } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes { flex-direction: column; width: fit-content; margin-inline: auto; max-height: var(--gap-140); overflow-y: hidden; overflow-x: visible; position: absolute; left: 30%; top: 50%; transform: translate(-50%,-50%); overflow-x: visible; overflow-y: clip; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box { min-height: var(--gap-140); position: relative; padding-inline-start: var(--gap-16); } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box:first-child { width: 100%; display: flex; flex-direction: row-reverse; justify-content: flex-end; overflow-x: visible; float: none !important; overflow: visible; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box:first-child .grid-box-subtitle { font-size: unset; width: 31.25vw; position: absolute; left: 101%; display: flex; justify-content: flex-end; overflow: hidden; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box:first-child .grid-box-subtitle span { font-family: var(--font-3); font-size: clamp(100px,var(--fs-140),300px); display: block; width: fit-content; /*height: 140px;*/ line-height: 1; white-space: nowrap; letter-spacing: -4.2px; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box:first-child .grid-box-subtitle { width: 94%; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box:first-child .grid-box-subtitle span { padding-inline-end: var(--gap-60); } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box:first-child .grid-box-subtitle:after { content: ""; position: absolute; right: 5%; top: 72%; width: 1vw; height: auto; aspect-ratio: 1; background-image: url("https://media.getmood.io/warehouse/dynamic/698892.svg"); background-size: contain; background-repeat: no-repeat; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box .grid-box-title { width: fit-content; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box .grid-box-title h3 { font-size: unset; margin: 0; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box .grid-box-title h3 a { font-family: var(--font-3); font-size: clamp(100px,var(--fs-140),300px); letter-spacing: -4.2px; color: var(--black); line-height: 1; display: block; text-align: right; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery { direction: ltr; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .section-title { width: fit-content; overflow-x: auto; overflow-y: hidden; display: flex; direction: ltr; position: relative; min-height: inherit; max-height: 100%; transform: translateZ(0); backface-visibility: hidden; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .section-title h2 { font-size: clamp(490px,25.521vw,700px); white-space: nowrap; width: fit-content; display: block; /* overflow-y: hidden; */ /* overflow-x: auto; */ max-width: fit-content; align-content: center; z-index: 1; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .gallery-container { position: absolute; height: 100%; z-index: 1; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .gallery-container .gallery-cubes { height: 100%; justify-content: space-between; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .gallery-container .gallery-cubes > div { height: 100%; width: fit-content; padding: var(--gap-100) var(--gap-20); display: flex; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .gallery-container .gallery-cubes > div:nth-child(even) { align-items: flex-end; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .gallery-container .gallery-cubes > div:nth-child(odd) { align-items: flex-start; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .gallery-container .gallery-cubes > div .boxes-images-outer-image { padding: 0; width: 480px; height: 290px; background-size: contain !important; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .gallery-container .gallery-cubes > div .boxes-images-outer-image .image-link-container { position: static; } #allSectionsWrapper .section.grid-gallery-section.more-gallery { background: white; padding-block: var(--gap-120); padding-inline: var(--gap-20); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .section-title { text-align: left; margin-bottom: var(--gap-56); float: none; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .section-title h2 { font-size: clamp(110px,var(--fs-140),300px); line-height: 0.9; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container { float: none; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes { flex-direction: column; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group { width: 100%; display: flex; flex-direction: column; gap: var(--gap-200); /* margin-bottom: var(--gap-200); */ } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group:not(:last-child) { margin-bottom: var(--gap-200); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) { width: 100%; display: flex; direction: ltr; gap: var(--gap-20); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) > div .boxes-images-outer-image { padding: 0; width: 100%; height: auto; aspect-ratio: 1; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) > div .boxes-images-outer-image:after { content: ""; width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; transition: 0.3s ease all; z-index: 200; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div { height: fit-content; width: fit-content; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div:first-child .boxes-images-outer-image { /* width: 394px; */ } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div:first-child .boxes-images-outer-image { width: min(394px,20.521vw); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div:first-child .boxes-images-outer-image:after { background: var(--green); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div:last-child { margin-inline-start: auto; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div:last-child .boxes-images-outer-image { margin-inline-start: auto; width: min(453px,23.594vw); height: fit-content; aspect-ratio: 1; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div:last-child .boxes-images-outer-image:after { background: var(--yellow); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div:nth-child(2) .boxes-images-outer-image { width: min(611px,31.823vw); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div:nth-child(2) .boxes-images-outer-image:after { background: var(--pink); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div .blog-post-image { } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div .blog-post-image img { height: auto; aspect-ratio: 1; object-fit: cover; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > .blog-post { position: relative; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .last-two { justify-content: space-between; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .last-two > div:first-child .boxes-images-outer-image { width: min(832px,43.333vw); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .last-two > div:first-child .boxes-images-outer-image:after { background: var(--yellow); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .last-two > div:last-child .boxes-images-outer-image { width: min(611px,31.823vw); height: fit-content; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .last-two > div:last-child .boxes-images-outer-image:after { background: var(--green); } #allSectionsWrapper .section.grid-gallery-section.logos { min-height: unset; } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container { } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container .gallery-cubes { background: var(--black); gap: var(--gap-60); padding-block: var(--gap-10); justify-content: flex-start; padding-inline-start: var(--gap-64); } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container .gallery-cubes { display: flex; flex-wrap: nowrap; width: max-content; animation: scrollText 102s linear infinite; } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container .gallery-cubes > div { width: var(--gap-110); } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container .gallery-cubes > div .image-link-container { display: none; } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container .gallery-cubes > div .boxes-images-outer-image { padding: 0; height: var(--gap-40); width: 100%; background-position: center; background-size: contain !important; background-repeat: no-repeat; } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container .gallery-cubes > div .boxes-images-outer-image { filter: unset; } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container .slide-wrapper { display: flex; width: 100%; background: var(--black); } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery, .logos) .gallery-container .gallery-cubes div:has(> .boxes-images-outer-image) { overflow: hidden; width: 100%; width: fit-content; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .gallery-container .gallery-cubes div:has(> .boxes-images-outer-image):after { transition: 0.3s ease all; } /*#allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .gallery-container .gallery-cubes div > .boxes-images-outer-image.shown:after { transform: translateY(-100%); }*/ #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .gallery-container .gallery-cubes div:has(> .boxes-images-outer-image.shown) .boxes-images-outer-image { transition: 0.3s ease all; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .gallery-container .gallery-cubes div:has(> .boxes-images-outer-image.shown) .boxes-images-outer-image:hover { filter: unset; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .gallery-container .gallery-cubes div:has(> .boxes-images-outer-image.shown) .boxes-images-outer-image iframe { pointer-events: none; width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; width: 180.78% !important; height: 101% !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%); transition: 0.3s ease all; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .image-link-container { display: block; opacity: 1; background: none; position: static; top: 100%; height: fit-content; /* top: unset; */ } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .image-link-container :is(h4,p) { margin: 0; color: var(--black); text-align: right; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .image-link-container .image-link-inner { display: none; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .image-link-container a.image-link-content { float: none; height: fit-content; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .image-link-container a.image-link-content .p-vert { } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .image-link-container a.image-link-content .p-vert .image-link-outer { padding-top: var(--gap-12); margin: 0; width: 100%; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .image-link-container a.image-link-content .p-vert .image-link-outer p { font-size: clamp(16px,var(--fs-18),300px); } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .image-link-container a.image-link-content .plus-sign.play-sign { display: none; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .image-link-container h4 { font-size: clamp(16px,var(--fs-18),300px); display: block; } #allSectionsWrapper .section.grid-contents:not(.circle) { min-height: unset; /* flex-direction: column; */ } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content { flex-direction: column; } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div { width: 100%; padding: 0; background: white; border-top: 1px solid var(--black); transition: 0.2s ease all; } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div .grid-short-box { margin: 0; } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext { position: relative; } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext .grid-short-box-label { padding: 0; font-size: unset; font-family: var(--font-3); color: var(--black); font-size: clamp(24px,var(--fs-32),300px); padding-block: var(--gap-24); line-height: 0.91; letter-spacing: -0.64px; } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext .grid-short-box-link { position: absolute; bottom: 0; width: 100%; height: 100%; } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext .grid-short-box-link a { display: block; opacity: 0; height: 100%; } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext .grid-short-box-label:after { content: url("https://media.getmood.io/warehouse/dynamic/690152.svg"); position: absolute; display: flex; bottom: 50%; left: var(--gap-20); transform: translateY(50%); } @media(min-width: 1026px) { #allSectionsWrapper .section.grid-text-section .section-title h2 { font-size: clamp(100px,var(--fs-140),300px); } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div:hover { filter: invert(1); } #allSectionsWrapper .section.grid-content-section.jobs .grid-boxes .grid-box:hover { filter: invert(1); } #allSectionsWrapper .section.grid-text-section.connections .section-title h2 { font-size: clamp(100px,var(--fs-140),300px); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) > div .boxes-images-outer-image.shown:after { transform: translateY(-100%); } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .gallery-container .gallery-cubes div:has(> .boxes-images-outer-image.shown) .boxes-images-outer-image iframe:not(.contemp-active) { opacity: 0; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .gallery-container .gallery-cubes div:has(> .boxes-images-outer-image.shown):hover .boxes-images-outer-image iframe:not(.contemp-active) { opacity: 1; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery, .logos) .gallery-container .gallery-cubes .boxes-images-outer-image:has(iframe:not(.contemp-active)):before { content: ""; position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; background-image: url("https://media.getmood.io/warehouse/dynamic/740828.svg"); background-position: center; background-repeat: no-repeat; z-index: 100; } } @media(max-width: 1025px) { #allSectionsWrapper .section.grid-text-section { min-height: unset; padding-block: var(--gap-80); padding-inline: 24px; } #allSectionsWrapper .section.grid-text-section .section-title { width: 100%; display: flex; margin-bottom: 20px; } #allSectionsWrapper .section.grid-text-section .grid-text { width: 100%; } #allSectionsWrapper .section.grid-text-section .grid-text .grid-text-content h2 { margin-bottom: 8px; } #allSectionsWrapper .section.grid-contents .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext .grid-short-box-label { font-size: 21px; width: 70%; text-align: start; direction: ltr; margin-inline-end: auto; padding-inline: 20px; } #allSectionsWrapper .section.grid-contents .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext .grid-short-box-label:after { left: unset; right: 20px; transform: scale(-1) translateY(-50%); } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext .grid-short-box-label { font-size: 21px; padding: 20px; width: 90%; letter-spacing: -0.21px; line-height: 1.1; } #allSectionsWrapper .section.grid-contents:not(.circle) .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext .grid-short-box-label:after { left: unset; transform: translateY(50%) scale(-1); } #allSectionsWrapper .section.grid-row-section.numbers { min-height: 0; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child { display: flex !important; flex-direction: column; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .grid-row-cell.flexslider-box { float: none !important; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .grid-row-cell.flexslider-box ul.slides { } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .grid-row-cell.flexslider-box ul.slides img { height: auto; aspect-ratio: 1; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper { padding-block: 80px; padding-inline: 48px; gap: 96px; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper .grid-row-cell.grid-row-cell-text { height: unset; aspect-ratio: unset; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper .grid-row-cell.grid-row-cell-text .grid-row-text { padding: 0; margin: 0; width: 100%; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper .grid-row-cell.grid-row-cell-text .grid-row-text h2 { font-size: 140px; letter-spacing: -5.6px; } #allSectionsWrapper .section.grid-row-section.numbers .grid-rows .grid-row:first-child .text-wrapper .grid-row-cell.grid-row-cell-text .grid-row-text h3 { font-size: 20px; letter-spacing: -0.4px; } #allSectionsWrapper .section.grid-row-section.cards { margin: 0; } #allSectionsWrapper .section.grid-row-section.cards .grid-rows { margin: 0; } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row { height: unset; display: flex !important; flex-direction: column-reverse; top: var(--headerHeight); } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.flexslider-box { padding: 0; } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text { padding: 16px; padding-bottom: 20px; } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text { margin: 0; padding: 0; gap: var(--gap-90); } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text h2 { font-size: 50px; } #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text > .wrapped { width: 100%; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .section-title { will-change: transform; transform: translate3d(0,0,0); } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .section-title h2 { font-size: 160px; } #allSectionsWrapper .section.grid-gallery-section.sliding-gallery .gallery-container .gallery-cubes > div .boxes-images-outer-image { width: 220px; height: 132px; } #allSectionsWrapper .section.grid-gallery-section.more-gallery { padding-block: 80px; padding-inline: 20px; margin: 0; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .section-title { margin-bottom: 16px; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .section-title h2 { font-size: 50px; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group { gap: 40px; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group:not(:last-child) { gap: 40px; margin-bottom: 40px !important; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) { flex-direction: column; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) > div:first-child { width: 100%; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) > div:first-child .boxes-images-outer-image { width: 100%; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) > div:nth-child(2) { width: 208px; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) > div:nth-child(2) .boxes-images-outer-image { width: 100%; } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group :is(.first-three, .last-two) > div .boxes-images-outer-image.shown:after { transform: translateY(-100%); } #allSectionsWrapper .section.grid-gallery-section.more-gallery .gallery-container .gallery-cubes .group .first-three > div:last-child .boxes-images-outer-image { width: 253px; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery, .logos) .gallery-container .gallery-cubes div:has(> .boxes-images-outer-image) { width: unset; } section.section.grid-content-section.stories { min-height: 0; width: fit-content; margin: 0; margin-inline: auto; } section.section.grid-content-section.stories .grid-boxes { height: auto; width: 100%; gap: var(--gap-8); } section.section.grid-content-section.stories .grid-boxes .grid-box { height: fit-content; width: fit-content; /* aspect-ratio: 1; */ display: flex; flex-direction: column; align-items: center; justify-content: space-between; min-height: 89px; } section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image { height: fit-content; width: fit-content; margin-inline: auto; display: block; } section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container { width: fit-content; height: fit-content; } section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container a.box-image-animation { height: fit-content; width: fit-content; border-radius: 50%; padding: 5px; overflow: visible; } section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container a.box-image-animation img { position: relative; width: var(--gap-50); height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 50%; } section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container a.box-image-animation .grid-iframe-holder { display: none; } section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-title { margin-top: 4px; } section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-title h3 { font-size: unset; font-family: var(--font-1); } section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-title h3 a { font-family: var(--font-1), sans-serif; color: var(--gray); line-height: 1.35; letter-spacing: 0.39px; font-size: clamp(13px,var(--fs-13),300px); text-transform: capitalize; } section.section.grid-content-section.stories .grid-boxes .grid-box .grid-box-image .grid-box-image-container a.box-image-animation:after { position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; content: ""; background-image: url("https://media.getmood.io/warehouse/dynamic/696005.svg"); background-position: center; background-repeat: no-repeat; transform: scale(1.1); } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 20px; padding: 80px 24px; background: white; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .section-topText { position: static; transform: unset; width: 100%; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes { position: static; transform: unset; max-height: 50px; width: 100%; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box { min-height: 80px; /*transform: translateX(-74%); */ } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box .grid-box-title { width: fit-content; margin-inline: auto; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box .grid-box-title h3 a { font-size: 50px; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box:first-child { /* transform: translateX(-74%); */ width: 50%; margin-inline-start: auto; justify-content: end; padding: 0; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box:first-child .grid-box-subtitle { width: 111%; left: 97%; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .grid-boxes .grid-box:first-child .grid-box-subtitle span { font-size: 50px; padding-inline: 12px; } #allSectionsWrapper .section.grid-content-section.alt-cubes-animated .circle { left: 50%; bottom: 20%; transform: translate(-50%,50%); } } /*------------------------------------------/* CONTACT-PAGE FORM /*------------------------------------------*/ body.contact .form-container-wide:has(#DynamicFormObject) { /* margin: 0 auto; */ /* padding: var(--gap-20); */ /* padding-right: var(--gap-40); */ } body.contact .form-container-wide #DynamicFormObject { /* max-width: 100% !important; */ display: flex; flex-direction: column; width: 100%; justify-content: center; /* align-items: center; */ /* padding: var(--gap-120) var(--gap-180); */ /* background: transparent; */ /* margin: 0 auto; */ /* border: 1px solid var(--lgray); */ border: none; } body.contact .form-container-wide #DynamicFormObject::after { display: none; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectTitleAndText { padding: 0; margin: 0; width: 100%; font-size: 100%; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectTitleAndText h3.dynamicFormObjectTitle { /* font-size: clamp(1.2rem, var(--fs-56), 1000rem); */ /* margin-bottom: var(--gap-24); */ /* line-height: 0.9; */ } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields { padding: 0; margin: 0; width: 100%; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields .top-form { display: block !important; margin: 0 auto var(--gap-64); font-size: clamp(1.2rem, var(--fs-15), 1000rem); color: var(--black); letter-spacing: 0.18px; line-height: 1.5; max-width: 30vw; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset { gap: var(--gap-20); display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap-12); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField { padding: 0; width: 100%; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField :is(input:not([type="checkbox"], [type="radio"]), select, textarea) { width: 100%; max-width: 100%; padding: 0 var(--gap-10); box-shadow: none; border-radius: 0; border: unset !important; /* border-bottom: 1px solid var(--black) !important; */ margin: 0; font-size: clamp(1.3rem, var(--fs-18), 1000rem); letter-spacing: 0.18px; color: var(--black); height: var(--gap-56); border-bottom: none !important; background: var(--fgray); padding: var(--gap-16); /* font-size: clamp(16px, var(--fs-16), 300px); */ /* color: var(--running-text) !important; */ } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField select, .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField :is(input:not([type="checkbox"], [type="radio"]), select, textarea)::placeholder { color: var(--black) !important; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.FileUploaderField input.fileUploadTrigger { padding: var(--gap-6) var(--gap-20); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.textareaField { grid-column: 1 / -1; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.checkboxField { grid-column: 1 / -1; display: flex; gap: 10px; justify-content: center; margin: 0; align-items: center; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.checkboxField input { margin: 0; height: var(--gap-16); width: var(--gap-16); accent-color: var(--black); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.checkboxField label { margin: 0; font-size: clamp(1rem, var(--fs-14), 1000rem); color: var(--gray); font-weight: unset; text-align: start; letter-spacing: 0.3px; color: var(--running-text); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.checkboxField input[type="checkbox"] { position: relative; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.checkboxField input[type="checkbox"]:after { display: block; width: 100%; height: 100%; content: ""; /* background-image: url("https://media.getmood.io/warehouse/dynamic/637761.svg"); */ position: absolute; z-index: 100; top: 0; right: 0; background-position: center; opacity: 0; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.checkboxField input[type="checkbox"]:checked { } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.checkboxField input[type="checkbox"]:checked:after { opacity: 1; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField .select-wrapper:after { left: 24%; top: 50%; content: "\f107"; font-size: clamp(1.2rem, var(--fs-20), 1000rem); text-align: right; right: unset; left: 0; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField .input-wrapper.input-file input { padding-inline-start: var(--gap-32); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.FileUploaderField: :after { top: 50%; transform: translateY(-50%); left: unset; inset-inline-start: 3%; font-size: 0; content: ''; font-family: none; width: var(--gap-16); height: auto; aspect-ratio: 1; background-repeat: no-repeat; background-position: center; background-image: url(/warehouse/dynamic/614766.svg); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField .must::before { inset-inline-start: 0; top: 27%; font-size: var(--fs-16); color: var(--gray); font-family: 'ping-regular-2025'; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField :is(span.error, .fileUploader-error) { font-size: clamp(1rem, var(--fs-14), 1000rem); left: unset; ins; inset-inline-end: 3%; top: -27%; -weight: unset; margin: 0; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.FileUploaderField span.error { inset-inline-end: var(--gap-18); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.FileUploaderField .error.fileUploader-error { top: calc(100% + var(--gap-4)); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit { width: 100%; padding: 0; grid-column: 1 / -1; margin-top: var(--gap-40); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit button { /* background-color: var(--green); */ height: 2.8vw; display: inline-flex; font-size: clamp(1.2rem, var(--fs-18), 1000rem); font-family: var(--font-1); transition: 0.3s all ease; min-width: var(--gap-140); letter-spacing: 0.18px; padding: 0 var(--gap-32); align-items: center; justify-content: center; border: unset; border-radius: 50px; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit .spinner { color: var(--white); } @media(min-width: 1025px) { body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit button .btn-text-wrapper { height: 1vw; display: flex; overflow: hidden; align-items: center; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit button .btn-text-wrapper span.inner-text-container { text-shadow: 0px 1vw 0px var(--white); transition: transform 0.5s cubic-bezier(.23, 1, .32, 1); display: block; } /* .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit button:is(:hover, :focus) { background: var(--lgray); }*/ body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit button:is(:hover, :focus) .btn-text-wrapper { } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit button:is(:hover, :focus) .btn-text-wrapper span.inner-text-container { transition: transform 0.5s cubic-bezier(.23, 1, .32, 1); transform: translateY(-1vw); } } @media(max-width: 1025px) { body.contact .form-container-wide:has(#DynamicFormObject) { max-width: 100%; padding: var(--gap-32) var(--gap-24); margin: 0 auto var(--gap-64); } body.contact .form-container-wide #DynamicFormObject { width: 100%; border: unset; max-width: 100% !important; padding: 0; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectTitleAndText h3.dynamicFormObjectTitle { font-size: var(--fs-26); margin-bottom: var(--gap-64); line-height: 1.2; margin-bottom: var(--gap-12); } body.contact .form-container-wide #DynamicFormObject:has( .dynamicFormObjectFields .top-form) .dynamicFormObjectTitleAndText h3.dynamicFormObjectTitle { margin-bottom: var(--gap-16); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields { width: 100%; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields .top-form { font-size: var(--fs-16); max-width: unset; margin: 32px auto var(--gap-32); letter-spacing: 0.48px; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset { grid-template-columns: repeat(1, 1fr); gap: var(--gap-12); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField { width: 100%; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField :is(input:not([type="checkbox"], [type="radio"]), select, textarea) { font-size: var(--fs-18) !important; height: var(--gap-48); padding: var(--gap-4) var(--gap-8); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.textareaField textarea { height: var(--gap-120) !important; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField.checkboxField label { font-size: var(--fs-14); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField .select-wrapper:after { font-size: 100%; left: 0; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField .must::before { top: var(--gap-6); font-size: var(--fs-14); inset-inline-start: 1%; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField .error { top: 10px; left: 12px; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit { margin-top: 0; } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectSubmit button { height: auto; font-size: var(--fs-14); min-width: var(--gap-120); padding: var(--gap-16); width: max-content; font-family: var(--font-1); } body.contact .form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset .dynamicFormObjectField :is(span.error, .fileUploader-error) { top: 7%; } } /*-------------------------------------------/* CONTACT PAGE /*------------------------------------------*/ body.contact #GridTop.noTopImage { display: none; } body.contact #lobbyview h2 { font-size: clamp(20px,var(--fs-20),300px); font-family: var(--font-2); color: var(--black); margin-bottom: var(--gap-60); line-height: 1.2; } body.contact :is(#BlogModule, div) #headline { margin-bottom: var(--gap-32); } body.contact :is(#BlogModule, div) #headline h1 { font-size: clamp(120px,var(--fs-160),300px); } body.contact :is(#BlogModule, div) .lobbyTextContainer { } body.contact :is(#BlogModule, div) .lobbyTextContainer #lobbyText { width: 72%; } body.contact :is(#BlogModule, div) .section.grid-form-section { min-height: unset; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide { } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject { padding: 0; width: 75%; margin-inline: auto; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields { } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields .top-form { display: none !important; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form { margin-block: 0 var(--gap-210); } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset { display: flex; flex-wrap: wrap; /* column-gap: var(--gap-20); */ row-gap: var(--gap-20); justify-content: space-between; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField { } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper { } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input { padding: 0; height: var(--gap-40); padding-inline: var(--gap-14); border-bottom: 1px solid var(--black) !important; font-size: clamp(18px,var(--fs-18),300px); ) } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper::before { inset-inline-start: 0; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input::placeholder { color: var(--black) !important; font-size: clamp(18px,var(--fs-20),300px); } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField:not(.checkboxField) { width: 24%; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit { display: flex; margin-top: 32px; justify-content: center; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit input { width: fit-content; font-size: clamp(14px,var(--fs-16),300px); font-family: var(--font-1); background: var(--yellow); color: var(--black); border-radius: 44px; padding-block: var(--gap-12); height: unset; min-height: var(--gap-40); /* display: flex; */ min-width: var(--gap-140); margin-inline: auto; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .select-wrapper { border-bottom: 1px solid; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .select-wrapper select { padding-block: 0; padding-inline: var(--gap-14); height: var(--gap-40); border-bottom: 1px soild var(--black) !important; color: var(--black) !important; font-size: clamp(18px,var(--fs-20),300px); } @media(min-width: 1025px) { body.contact #SiteGrid { padding-top: var(--gap-250); } body.contact #SiteGrid > .wrapped-container #PageBreadCrumps { padding-top: var(--gap-64); } body.contact #SiteGrid > .wrapped-container #lobbyview { padding-bottom: var(--gap-64); } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit input:hover { background: var(--dark-bg); color: var(--white); border: 1px solid var(--dark-bg); } body.contact #lobbyview h2 { max-width: 55%; margin-inline: auto; } } @media(max-width: 1025px) { body.contact #BlogModule { padding-inline: 24px; } body.contact #BlogModule #lobbyview { } body.contact #lobbyview { padding-inline: 24px; } body.contact #lobbyview h2 { font-size: 18px; line-height: 1.2; letter-spacing: 0; } body.contact #lobbyview #headline { font-size: unset; margin-bottom: 24px; } body.contact #SiteGrid { padding-top: 144px; } body.contact :is(#BlogModule, div) .lobbyTextContainer #lobbyText { width: 100%; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide { padding: 0; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject { width: 100%; padding-inline: 24px; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset { flex-direction: column; row-gap: 0; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField:not(.checkboxField) { width: 100%; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField.checkboxField { padding-block: 24px; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField.checkboxField label { font-size: 13px; line-height: 1.3; letter-spacing: -0.13px; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit input { text-transform: uppercase; font-size: 18px !important; font-family: var(--font-1); letter-spacing: -0.18px; line-height: 1.35; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input { height: 50px; } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .select-wrapper select { height: 50px; } } body.contact :is(#BlogModule, div) .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField.full-width { width: 100%; } /*------------------------------------------/* PAGES /*------------------------------------------*/ #home-gallery .spline-cube-wrapper { position: absolute; bottom: 0; left: 0; display: block; width: 100%; height: 100%; z-index: 199; } #home-gallery .spline-cube-wrapper canvas { width: 100% !important; height: 100% !important; } #home-gallery .gallery-caption { top: 50%; transform: translate(-50%,-50%); z-index: 4; width: 100%; } #home-gallery .gallery-caption .gallery-text { font-size: unset; } #home-gallery .gallery-caption .gallery-text h1 { text-align: center; letter-spacing: -6.72px; line-height: 1; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes { background: var(--black); padding-bottom: 0; height: fit-content; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title { min-height: 100vh; align-content: center; position: sticky; top: 0; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title h2 { color: white; font-size: clamp(100px, var(--fs-140),300px); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title .content-section-Btn { position: relative; z-index: 100; margin-top: var(--gap-40); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title .content-section-Btn a { display: block; width: fit-content; margin-inline: auto; color: var(--black); background: var(--yellow); height: var(--gap-56); padding-inline: var(--gap-32); align-content: center; border-radius: 50px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container { /* padding-inline: var(--gap-20); */ padding-bottom: 100vh; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes { height: 100%; position: relative; height: 1523px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div { position: absolute; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div .boxes-images-outer-image { padding: 0; height: auto; aspect-ratio: 1; width: 100%; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div .image-link-container .image-link-outer > * { color: var(--white); line-height: 1.35; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(2) { top: 0; right: var(--gap-20); width: 740px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(3) { left: var(--gap-20); bottom: 42%; transform: translateY(50%); width: 547px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:last-child { bottom: 0; width: 445px; right: 115px; /* margin-bottom: 100vh; */ } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(2)::after { background: var(--yellow); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(3)::after { background: var(--pink); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:last-child:after { background: var(--green); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:has(.shown)::after { transform: translateY(-100%); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes { height: 100%; position: relative; min-height: 79.323vw; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div { position: absolute; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div .boxes-images-outer-image { padding: 0; height: auto; aspect-ratio: 1; width: 100%; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(2) { top: 0; right: var(--gap-20); width: 38.542vw; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(3) { left: var(--gap-20); bottom: 42%; transform: translateY(50%); width: 28.49vw; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:last-child { bottom: 0; width: 23.177vw; right: 5.99vw; } /*------------------------------------------/* PAGES /*------------------------------------------*/ #home-gallery .gallery-caption { top: 50%; transform: translate(-50%,-50%); z-index: 4; width: 100%; } #home-gallery .gallery-caption .gallery-text { font-size: unset; } #home-gallery .gallery-caption .gallery-text h1 { text-align: center; letter-spacing: -6.72px; line-height: 1; } body.home-page #allSectionsWrapper { background: var(--black); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes { background: var(--black); padding-bottom: 0; height: fit-content; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title { /*min-height: 100vh;*/ align-content: center; position: absolute; top: 0; left: 50%; transform: translateX(-50%) } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title h2 { color: white; font-size: clamp(100px, var(--fs-140),300px); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title .content-section-Btn { position: relative; z-index: 100; margin-top: var(--gap-40); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title .content-section-Btn a { display: block; width: fit-content; margin-inline: auto; color: var(--black); background: var(--yellow); height: var(--gap-56); padding-inline: var(--gap-32); align-content: center; border-radius: 50px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container { /* padding-inline: var(--gap-20); */ padding-bottom: 100vh; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes { height: 100%; position: relative; height: 1523px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div { position: absolute; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div .boxes-images-outer-image { padding: 0; height: auto; aspect-ratio: 1; width: 100%; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div .image-link-container .image-link-outer > * { color: var(--white); line-height: 1.35; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(2) { top: 0; right: var(--gap-20); width: 740px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(3) { left: var(--gap-20); bottom: 42%; transform: translateY(50%); width: 547px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:last-child { bottom: 0; width: 445px; right: 115px; /* margin-bottom: 100vh; */ } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div .boxes-images-outer-image:after { content: ""; position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; transition: 0.3s ease all; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(2) .boxes-images-outer-image::after { background: var(--yellow); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(3) .boxes-images-outer-image::after { background: var(--pink); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:last-child .boxes-images-outer-image:after { background: var(--green); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div .boxes-images-outer-image.shown::after { transform: translateY(-101%); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes { height: 100%; position: relative; min-height: 179.323vw; justify-content: flex-end; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div { position: absolute; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div .boxes-images-outer-image { padding: 0; height: auto; aspect-ratio: 1; width: 100%; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(2) { top: 0; right: var(--gap-20); width: 38.542vw; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(3) { left: var(--gap-20); bottom: 42%; transform: translateY(50%); width: 28.49vw; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:last-child { bottom: 0; width: 23.177vw; right: 5.99vw; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes .section-title { left: 50%; transform: translateX(-50%); position: relative; max-height: 100vh; } body.home-page #allSectionsWrapper .section.grid-contents { min-height: 100vh; } body.home-page #allSectionsWrapper .section.grid-contents .grid-boxes.grid-boxes-content { flex-direction: row; } body.home-page #allSectionsWrapper .section.grid-contents.circle { height: fit-content; background: var(--black); } body.home-page #allSectionsWrapper .section.grid-contents.circle > .pin-height { position: relative; z-index: 100000; } body.home-page #allSectionsWrapper .section.grid-contents.circle .section-title { width: 100%; text-align: center; position: relative; z-index: 50; } body.home-page #allSectionsWrapper .section.grid-contents.circle .section-title h2 { color: white; position: absolute; left: 50%; bottom: 95%; transform: translateX(-50%); } body.home-page #allSectionsWrapper .section.grid-contents.circle .section-title { position: absolute; top: 0; left: 0; width: 100%; height: 400vh; text-align: center; z-index: 100000; /* height: fit-content; */ display: flex; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content { overflow: hidden; height: 100vh; position: relative; z-index: 1; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > .section-title { height: fit-content; top: 70%; aspect-ratio: unset; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div { position: absolute; top: 100%; left: -100%; aspect-ratio: 1; width: 100%; z-index: -1; left: 0%; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box { position: absolute; top: -37%; left: 50%; transform: translate(-50%,-50%); filter: grayscale(1); transition: 0.3s ease all; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div img:not(.logo) { position: static; height: auto; aspect-ratio: 1; transform: unset; width: min(360px,18.75vw); } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box-image { padding: 0; z-index: 100000; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box-image a { display: block; position: relative; height: 100%; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box-image a img.logo { width: 100%; object-fit: none; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-fulltext { display: none; } body.home-page #allSectionsWrapper .section.grid-contents.circle .content-section-Btn { position: absolute; bottom: 92%; left: 50%; transform: translateX(-50%); } body.home-page #allSectionsWrapper .section.grid-contents.circle .content-section-Btn a { background: var(--yellow); padding-inline: var(--gap-32); display: block; height: var(--gap-56); text-align: center; align-content: center; border-radius: 50px; font-size: clamp(18px, var( --fs-18), 300px); color: var(--black); } body.about .grid-top-container { position: relative; height: 100vh; } body.about .grid-top-container section#GridTop { /* height: fit-content; */ width: 57.292vw; height: 8.073vw; position: absolute; bottom: 50%; left: 50%; transform: translate(-50%,50%); z-index: 10; } body.about .grid-top-container .section.grid-content-section { display: flex; } body.about .grid-top-container .section.grid-content-section .grid-boxes { min-height: 100%; position: relative; } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box { width: fit-content; display: flex; position: absolute; } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box .grid-box-image { } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box .grid-box-image .grid-box-image-container { } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box .grid-box-image .grid-box-image-container a { display: flex; } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box .grid-box-image .grid-box-image-container a img { } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box:first-child { width: 28.646vw; height: 16.927vw; z-index: 100; top: 2%; right: 1%; } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box:nth-child(2) { width: 14.271vw; height: 8.646vw; bottom: 2%; right: 1%; } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box:last-child { width: 23.698vw; height: 15.104vw; left: 1%; bottom: 2%; } body.about.work .grid-top-container section#GridTop { height: fit-content; } body.about.work .grid-top-container section#GridTop .top-caption { color: var(--black); font-family: var(--font-3); position: static; transform: unset; text-align: center; font-size: unset; display: flex; flex-direction: column; gap: var(--gap-48); } body.about.work .grid-top-container section#GridTop .top-caption span { line-height: 1; letter-spacing: -6.72px; font-size: clamp(125px,8.75vw,300px); } body.about.work .grid-top-container section#GridTop .top-caption .top-caption-subtitle { font-family: var(--font-1); width: 38%; margin-inline: auto; font-size: clamp(18px,var(--fs-20),300px); line-height: 1.35; color: var(--black); } body.about.work #LobbyModule #lobbyview { display: none; } body.about.work #allSectionsWrapper .section.grid-text-section .section-title { width: 65%; } body.about.work #allSectionsWrapper .section.grid-text-section .section-title h2 { font-size: clamp(110px,var(--fs-140),300px); } body.news #headline { font-size: unset; margin: 0; margin-bottom: var(--gap-200); } body.news #headline h1 { line-height: 1; letter-spacing: -6.72px; } body.news #SiteGrid { padding-top: var(--gap-250); } body.news #GridTop { display: none; } body.news #allSectionsWrapper .section.grid-row-section.cards { margin-top: 0; } body.news #allSectionsWrapper .section.grid-row-section.cards .grid-rows { margin: 0; } body.news #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row { } body.news #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text h2 { text-align: right; font-size: clamp(64px,var(--fs-64),300px); font-family: var(--font-2); letter-spacing: -1.28px; } body.news #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text > .wrapped { text-align: right; margin-inline: 0; } body.clients-lobby #GridTop { display: none; } body.clients-lobby #SiteGrid { padding-top: var(--gap-250); background: var(--black); } body.clients-lobby #ContentGridShortModule { } body.clients-lobby #ContentGridShortModule #pageview { } body.clients-lobby #ContentGridShortModule #pageview #headline { font-size: unset; margin-bottom: var(--gap-200); } body.clients-lobby #ContentGridShortModule #pageview #headline h1 { color: white; letter-spacing: -6.72px; line-height: 1; margin-bottom: var(--gap-32); } body.clients-lobby #ContentGridShortModule #pageview #headline p { color: white; width: 35%; margin-inline: auto; font-size: clamp(18px,var(--fs-20),300px); margin-bottom: var(--gap-40); } body.clients-lobby #ContentGridShortModule #pageview #headline .input-wrapper { width: fit-content; margin-inline: auto; display: flex; justify-content: center; gap: var(--gap-24); align-items: center; position: relative; } body.clients-lobby #ContentGridShortModule #pageview #headline .input-wrapper input#searchBar { background: none; border: none; border-bottom: 1px solid white; width: var(--gap-300); padding-block: var(--gap-12); color: white; } body.clients-lobby #ContentGridShortModule #pageview #headline .input-wrapper input#searchBar:focus { outline: none; } body.clients-lobby #ContentGridShortModule #pageview #headline .input-wrapper button { width: var(--gap-40); height: auto; max-height: var(--gap-40); aspect-ratio: 1; border-radius: 50%; border: none; background: var(--yellow); position: absolute; left: 0; top: 0; } body.clients-lobby #ContentGridShortModule #pageview #headline .input-wrapper button:after { content: ""; background-image: url("https://media.getmood.io/warehouse/dynamic/690152.svg"); position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; background-repeat: no-repeat; background-position: center; background-size: auto; } body.clients-lobby #ContentGridShortModule #pageview #grid-view { display: grid; grid-template-columns: repeat(5,1fr); gap: var(--gap-20); padding-inline: var(--gap-20); padding-bottom: var(--gap-120); } body.clients-lobby #ContentGridShortModule #pageview #grid-view .grid-box { display: none; opacity: 0; transition: 0.3s ease all; filter: grayscale(1); } body.clients-lobby #ContentGridShortModule #pageview #grid-view .grid-box:hover { filter: unset; } body.clients-lobby #ContentGridShortModule #pageview #grid-view .grid-box.active { display: block; opacity: 1; } body.clients-lobby #ContentGridShortModule #pageview #grid-view .grid-box .grid-short-box { margin: 0; } body.clients-lobby #ContentGridShortModule #pageview #grid-view .grid-box .grid-short-box .grid-short-box-image { padding: 0; } body.clients-lobby #ContentGridShortModule #pageview #grid-view .grid-box .grid-short-box .grid-short-box-image a { position: static; d\: 100%; display: block; } body.clients-lobby #ContentGridShortModule #pageview #grid-view .grid-box .grid-short-box .grid-short-box-image a img.cube-bg { position: static; transform: unset; width: 100%; } body.clients-lobby #ContentGridShortModule #pageview #grid-view .grid-box .grid-short-box .grid-short-box-image a img.logo { object-fit: contain; height: unset; } body.selected-work { } body.selected-work main#SiteGrid { background: var(--black); padding-top: var(--gap-250); } body.selected-work main#SiteGrid section#GridTop { display: none; } body.selected-work main#SiteGrid #lobbyview { margin-bottom: var(--gap-200); } body.selected-work main#SiteGrid #lobbyview #headline { font-size: unset; margin-bottom: var(--gap-32); } body.selected-work main#SiteGrid #lobbyview #headline h1 { color: white; } body.selected-work main#SiteGrid #lobbyview #headline h2 { } body.selected-work main#SiteGrid #lobbyview h2 { margin: 0; font-size: clamp(18px,var(--fs-20),300px); color: white; width: 20%; line-height: 1.3; margin-inline: auto; } body.selected-work #allSectionsWrapper { } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes { padding-bottom: var(--gap-120); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container { } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes { padding-inline: var(--gap-20); flex-direction: column; gap: var(--gap-156); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) { width: 100%; display: flex; flex-direction: row; gap: var(--gap-20); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div { width: fit-content; overflow: hidden; height: fit-content; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes .:is(.f-row,.s-row) > div .boxes-images-outer-image { padding: 0; height: auto; aspect-ratio: 1; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div .boxes-images-outer-image .image-link-container { /* position: static; */ display: none; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div:first-child .boxes-images-outer-image { width: 43.49vw; padding: 0; height: auto; aspect-ratio: 1; overflow: hidden; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div:nth-child(2) { width: 18.75vw; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div:nth-child(3) { width: 23.646vw; margin-inline-start: auto; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes .s-row { direction: ltr; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div .boxes-images-outer-image:after { content: ""; position: absolute; width: 100%; height: auto; aspect-ratio: 1; top: 0; left: 0; transition: 0.3s ease all; z-index: 200; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div:first-child .boxes-images-outer-image:after { background: var(--yellow); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes .f-row > div:nth-child(2) .boxes-images-outer-image::after { background: var(--pink); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div .boxes-images-outer-image { padding: 0; height: auto; aspect-ratio: 1; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes .f-row > div:nth-child(3) .boxes-images-outer-image:after { background: var(--green); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes .s-row > div:nth-child(2) .boxes-images-outer-image::after { background: var(--green); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes .s-row > div:nth-child(3) .boxes-images-outer-image:after { background: var(--pink); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div .image-link-container a.image-link-content .p-vert .image-link-outer :is(h4,p) { color: var(--white); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div:first-child .boxes-images-outer-image:has(.contemp-active) { background-image: none !important; } @media(min-width: 1026px) { #home-gallery { height: calc(100vh - var(--gap-60)) !important; } body.home-page #allSectionsWrapper .section.grid-contents.circle .section-title h2 { font-size: clamp(100px, var(--fs-140), 300px); } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box:hover { filter: unset; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div.content-section-Btn { top: 75vh; width: var(--gap-160); left: 50%; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:not(:first-child) { margin-top: 100vh; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div .boxes-images-outer-image.shown:after { transform: translateY(-100%); } } @media(max-width: 1025px) { #home-gallery { height: calc(100dvh - 60px) !important; } #home-gallery .slides { display: none; } #home-gallery .gallery-caption { position: static; transform: unset; } #home-gallery .gallery-caption .gallery-text { padding-inline: 0; white-space: normal; } #home-gallery .gallery-caption .gallery-text h1 { font-size: 50px; letter-spacing: -2px; line-height: 0.9; /* text-wrap: balance; */ display: block; text-align: center; padding-inline: 36px; } #home-gallery section.section.grid-content-section.stories { margin-block: calc(var(--headerHeight) + 10px) 52px; } #allSectionsWrapper .section.grid-gallery-section:not(.sliding-gallery) .gallery-container .gallery-cubes div:has(> .boxes-images-outer-image.shown) .boxes-images-outer-image { width: 100%; } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container .gallery-cubes > div { width: 105px; } #allSectionsWrapper .section.grid-gallery-section.logos .gallery-container .gallery-cubes { animation-duration: 102s; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes { padding-block: 80px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title { position: static; min-height: unset; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title h2 { font-size: 50px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .section-title .content-section-Btn { margin-top: 72px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container { padding-bottom: 0; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes { flex-direction: column; padding-inline: 20px; height: fit-content; gap: var(--gap-72); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div { position: relative; top: unset !important; right: unset !important; bottom: unset !important; left: unset !important; transform: unset !important; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(2) { width: 100%; margin-inline: auto; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:nth-child(3) { width: 208px; margin-inline-start: auto; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes > div:last-child { width: 253px; } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .content-section-Btn { position: relative; z-index: 100; margin-top: var(--gap-72); } body.home-page #allSectionsWrapper .section.grid-gallery-section.colored-boxes .content-section-Btn a { display: block; width: fit-content; margin-inline: auto; color: var(--black); background: var(--yellow); height: var(--gap-56); padding-inline: var(--gap-32); align-content: center; border-radius: 50px; } body.home-page #allSectionsWrapper .section.grid-contents.circle { display: flex; flex-direction: column; gap: var(--gap-40); min-height: fit-content; padding-block: 0 var(--gap-80); } body.home-page #allSectionsWrapper .section.grid-contents.circle .section-title { height: fit-content; flex-direction: column; position: static; } body.home-page #allSectionsWrapper .section.grid-contents.circle .section-title h2 { position: static; transform: unset; } body.home-page #allSectionsWrapper .section.grid-contents.circle .section-title .content-section-Btn { position: static; transform: unset; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content { height: fit-content; gap: 12px; padding-inline: 16px; overflow-x: auto; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div { position: static; min-width: 150px; padding: 0; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box { position: static; transform: unset; margin: 0; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-image { } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-image a { } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-image a img { width: 100%; } body.home-page #allSectionsWrapper .section.grid-contents.circle .grid-boxes.grid-boxes-content > div .grid-short-box .grid-short-box-image a img.logo { object-fit: contain; width: 67%; } body.home-page #allSectionsWrapper .section.grid-contents.circle .content-section-Btn { position: static; transform: unset; } body.home-page #allSectionsWrapper .section.grid-contents.circle .content-section-Btn a { min-width: 140px; margin-inline: auto; white-space: normal; display: inline-block; } body.clients-lobby #SiteGrid { padding-top: 144px; } body.clients-lobby #ContentGridShortModule #pageview #headline { padding-inline: 20px; margin-bottom: 80px; } body.clients-lobby #ContentGridShortModule #pageview #headline h1 { letter-spacing: -2px; line-height: 0.95; /* font-size: 50px; */ margin-bottom: 20px; } body.clients-lobby #ContentGridShortModule #pageview #headline p { width: 100%; font-size: 18px; letter-spacing: -0.18px; line-height: 1.35; margin-bottom: 24px; } body.clients-lobby #ContentGridShortModule #pageview #headline .input-wrapper { width: 100%; gap: 12px; } body.clients-lobby #ContentGridShortModule #pageview #headline .input-wrapper input#searchBar { flex: 1; font-family: var(--font-1) !important; font-size: 18px !important; } body.clients-lobby #ContentGridShortModule #pageview #headline .input-wrapper button { width: 48px; max-height: 48px; position: relative; } body.clients-lobby #ContentGridShortModule #pageview #grid-view { grid-template-columns: 1fr; } body.about .grid-top-container { height: fit-content; } body.about .grid-top-container section#GridTop { width: 100%; height: 45px; position: static; transform: unset; margin-top: 168px; } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box { position: static; } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box:not(:nth-child(2)) { display: none; } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box:nth-child(2) { width: 157px; height: 220px; } body.about .grid-top-container .section.grid-content-section .grid-boxes .grid-box .grid-box-image .grid-box-image-container a img { object-fit: cover; } body.about .grid-top-container .section.grid-content-section .grid-boxes { min-height: unset; height: fit-content; justify-content: center; } body.about .grid-top-container .section.grid-content-section { min-height: unset; padding-block: 80px; } body.about.work .grid-top-container section#GridTop .top-caption { width: 100%; gap: 24px; } body.about.work .grid-top-container section#GridTop .top-caption span { font-size: 55px; letter-spacing: -2.2px; line-height: 0.95; } body.about.work .grid-top-container section#GridTop .top-caption .top-caption-subtitle { width: 100%; padding-inline: 20px; font-size: 18px; } body.about.work #allSectionsWrapper .section.grid-text-section .section-title h2 { font-size: 50px; } body.about.work #allSectionsWrapper .section.grid-text-section .section-title { width: 100%; margin-bottom: 20px; } body.contentInnerPage main#SiteGrid { padding-top: 144px; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes { padding: 0; padding-bottom: 80px; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes { gap: 80px; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) { flex-direction: column; direction: rtl; gap: 80px; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div:first-child { width: 100%; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div:first-child .boxes-images-outer-image { width: 100%; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div:nth-child(2) { width: 208px; margin-inline-start: auto; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div:nth-child(3) { width: 253px; margin: 0; } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div .image-link-container a.image-link-content .p-vert .image-link-outer :is(h4,p) { color: var(--black); } body:is(.selected-work, .clients-lobby.contentInnerPage) #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row,.s-row) > div .boxes-images-outer-image.shown:after { transform: translateY(-100%); } body.selected-work main#SiteGrid { padding-top: 144px; } body.selected-work main#SiteGrid #lobbyview { margin-bottom: 80px; padding-inline: 28px; } body.selected-work main#SiteGrid #lobbyview #headline { margin-bottom: 20px; } body.selected-work main#SiteGrid #lobbyview h2 { width: 100%; line-height: 1.35; letter-spacing: 0.18px; font-size: 18px; } body.news #SiteGrid { padding-top: 144px; } body.news #headline { margin-bottom: 80px; } body.news #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text { padding-bottom: 24px; } body.news #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text { gap: 60px; } body.news #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text h2 { text-align: center; font-size: 32px; } body.news #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text > .wrapped { text-align: center; } body.news #allSectionsWrapper .section.grid-row-section.cards .grid-rows .grid-row .grid-row-cell.flexslider-box { padding-inline: 16px; padding-bottom: 16px; } } /*------------------------------------------/* INNER CONTENT PAGE /*------------------------------------------*/ #ContentRegularModule { } #ContentRegularModule #contentModuleNav { display: none; } #ContentRegularModule #GridTop { height: fit-content; width: 75%; margin-inline: auto; margin-bottom: var(--gap-200); } #ContentRegularModule #GridTop h2 { font-size: clamp(100px,var(--fs-140),300px); color: var(--black); font-family: var(--font-3); line-height: 0.91; letter-spacing: -5.6px; } body.contentInnerPage main#SiteGrid { padding-top: var(--gap-250); } body.contentInnerPage main#SiteGrid > section#GridTop { display: none; } body.contentInnerPage #allSectionsWrapper { } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper { display: flex; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .text-side.right { padding-inline: var(--gap-210) var(--gap-200); width: 100%; padding-bottom: var(--gap-120); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .text-side.right p { text-align: right; margin-bottom: var(--gap-20); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .text-side.right p strong { display: block; text-align: right; margin-bottom: var(--gap-20); font-size: clamp(20px,var(--fs-26),300px); color: var(--black); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .text-side.right p:has(img) { display: flex; margin-top: var(--gap-40); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .text-side.right ul { text-align: right; padding-inline-start: 2%; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .text-side.right :is(p,ul) { font-size: clamp(16px,var(--fs-20),300px); color: var(--black); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .text-side.right :is(p,ul) a { display: inline-flex; align-items: center; gap: 12px; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left { position: relative; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section { padding-inline-end: var(--gap-20); height: 100vh; padding-block: var(--gap-20); position: sticky; top: 0; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide { position: sticky; top: 0; height: 100%; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject { padding: 0; display: flex; flex-direction: column; border: none; padding: var(--gap-96) var(--gap-150); background: var(--yellow); height: 100%; justify-content: center; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectTitleAndText { width: 100%; padding: 0; margin-bottom: var(--gap-12); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectTitleAndText h3.dynamicFormObjectTitle { font-size: clamp(36px,var(--fs-48),300px); line-height: 0.98; font-family: var(--font-2); letter-spacing: -0.96px; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields { width: 100%; padding: 0; margin: 0; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectTitleAndText::after { display: none; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields .top-form { font-size: clamp(16px,var(--fs-20),300px); line-height: 1.35; margin-bottom: var(--gap-48); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form { } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset { } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField { width: 100%; padding: 0; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper { } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input.form-control { width: 100%; border: none; border-bottom: 1px solid var(--black); border-radius: 0; box-shadow: none; color: var(--dgray); padding-block: var(--gap-10); margin: 0; height: var(--gap-50); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input.form-control:focus { border: none !important; border-bottom: 1px solid var(--black) !important; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper::before { right: 0; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input.form-control::placeholder { color: var(--black) !important; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input.fileUploadTrigger { width: 100%; border: none; border-bottom: 1px solid var(--black); border-radius: 0; height: var(--gap-50); margin: 0; color: var(--black) !important; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input.fileUploadTrigger:focus { border: unset !important; border-bottom: 1px solid var(--black); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .textarea-wrapper { } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .textarea-wrapper textarea { border: none; border-bottom: 1px solid var(--black); border-radius: 0; border-color: var(--black); padding-top: var(--gap-10); padding-inline-start: var(--gap-12); margin: 0; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .textarea-wrapper::before { right: 0; top: 8%; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject::after { display: none; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit { width: 100%; padding: 0; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit button.form-submit { margin-top: var(--gap-32); background: var(--black); font-family: var(--font-1); font-size: clamp(18px,var(--fs-18),300px); width: fit-content; padding-inline: var(--gap-32); border-radius: 50px; height: var(--gap-50); min-width: var(--gap-140); /* color:white; */ } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit button.form-submit:before, body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit button.form-submit:after { background: unset; color: white; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input.form-control::placeholder { color: var(--dgray) !important; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input.fileUploadTrigger::placeholder { color: var(--dgray) !important; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .textarea-wrapper textarea::placeholder { color: var(--dgray) !important; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField.FileUploaderField::after { left: 0; content: url("https://media.getmood.io/warehouse/dynamic/704805.svg"); } body.clients-lobby.contentInnerPage #ContentGridShortModule section.logo-wrapper { text-align: center; width: 720px; height: fit-content; margin-inline: auto; margin-bottom: var(--gap-200); } body.clients-lobby.contentInnerPage #ContentGridShortModule section.logo-wrapper img.logo { width: 100%; /* height: var(--gap-60); */ object-fit: cover; margin-bottom: var(--gap-40); } body.clients-lobby.contentInnerPage #ContentGridShortModule section.logo-wrapper p { color: white; } body.clients-lobby.contentInnerPage #allSectionsWrapper .section.grid-gallery-section.colored-boxes .gallery-container .gallery-cubes :is(.f-row, .s-row) > div:after { background: var(--yellow) !important; } @media(max-width: 1025px) { body.clients-lobby.contentInnerPage #SiteGrid { background: white; padding-top: 144px; } body.clients-lobby.contentInnerPage #ContentGridShortModule section.logo-wrapper { width: 100%; padding-bottom: 80px; margin: 0; padding-inline: 16px; filter: invert(1); } body.clients-lobby.contentInnerPage #ContentGridShortModule section.logo-wrapper p { font-family: var(--font-1); } body.clients-lobby.contentInnerPage #ContentGridShortModule section.logo-wrapper img.logo { margin-bottom: 20px; height: 90px; width: 80%; object-fit: contain; } #ContentRegularModule #GridTop { width: 100%; margin-bottom: 80px; padding-inline: 16px; } #ContentRegularModule #GridTop h2 { font-size: 50px; } body.contentInnerPage main#SiteGrid { padding-top: 144px; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper { flex-direction: column; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .text-side.right { padding-inline: 20px; padding-block: 24px; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .text-side.right p strong { margin-bottom: 12px; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section { padding: 16px; height: fit-content; position: static; min-height: unset; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject { margin: 0; width: 100%; max-width: 100%; min-width: 100%; padding: 40px 24px; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide { position: static; height: unset; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .input-wrapper input::placeholder { font-size: 20px; color: var(--dgray); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectField .textarea-wrapper textarea::placeholder { font-size: 20px; color: var(--dgray); } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit button.form-submit { color: white; } } @media(min-width: 1026px) { body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit input.form-submit:hover { color: white; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit input.form-submit, .normal-form input[type="submit"] { margin-top: 0; color: var(--black); transition: none; z-index: 1; } body.contentInnerPage #allSectionsWrapper section.text-form-wrapper .form-side.left .section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields form fieldset .dynamicFormObjectSubmit .yellow-btn-wrap { margin-top: var(--gap-32); width: fit-content; margin-inline: auto; position: relative; overflow: hidden; cursor: pointer; } .yellow-btn-wrap::before, .yellow-btn-wrap::after { content: attr(data-text); position: absolute; left: 0; /* transform: translate(-50%,-50%); */ /* bottom: 0; */ width: 100%; height: 100%; text-align: center; transition: transform 0.3s ease; align-content: center; color: white; z-index: 2; } .yellow-btn-wrap::before { top: 0; transform: translateY(0); } .yellow-btn-wrap::after { top: 100%; transform: translateY(0); } .yellow-btn-wrap:hover::before { transform: translateY(-100%); } .yellow-btn-wrap:hover::after { transform: translateY(-100%); } } /*------------------------------------------/* CASE STUDY /*------------------------------------------*/ #caseStudy { padding-inline: var(--gap-20); text-align: center; color: var(--black); } #caseStudy h1 { font-size: clamp(88px,var(--fs-88),300px); font-family: var(--font-2); text-align: center; letter-spacing: -1.76px; line-height: 0.9; margin-bottom: var(--gap-32); } #caseStudy section.hero-section { width: 40%; margin-inline: auto; margin-bottom: var(--gap-200); } #caseStudy section.hero-section ul.custom-field-checks { display: flex; padding: 0; text-align: center; justify-content: center; list-style: none; font-family: var(--font-2); font-size: clamp(20px,var(--fs-20),300px); margin-bottom: var(--gap-12); gap: var(--gap-6); } #caseStudy section.hero-section ul.custom-field-checks li { line-height: 1; display: flex; align-items: center; gap: var(--gap-6); } #caseStudy section.hero-section ul.custom-field-checks li:not(:last-child):after { content: ""; width: 6px; height: auto; aspect-ratio: 1; display: inline-block; background: var(--black); border-radius: 50%; } #caseStudy section.content { } #caseStudy section.content .img-wrapper { } #caseStudy section.content .img-wrapper img { width: 100%; } #caseStudy section.content .two-imgs-wrapper { display: flex; width: 100%; gap: var(--gap-20); } #caseStudy section.content .two-imgs-wrapper img { width: 100%; height: auto; aspect-ratio: 1; } #caseStudy section.content .text-wrapper { width: 40%; text-align: right; padding-block: var(--gap-120); margin-inline: auto; font-size: clamp(20px,var(--fs-20),300px); } #caseStudy section.content .text-wrapper h3 { font-family: var(--font-2); margin-bottom: var(--gap-20); font-size: clamp(26px,var(--fs-26),300px); } #caseStudy section.content .text-wrapper h3:nth-child(3) { margin-top: var(--gap-20) } @media(max-width: 1025px) { #caseStudy section.hero-section { width: 100%; margin-bottom: 80px; } #caseStudy section.hero-section h1 { font-size: 48px; margin-bottom: 20px; } #caseStudy section.content .text-wrapper { width: 100%; padding-block: 24px; } #caseStudy section.content .two-imgs-wrapper { flex-direction: column; } } /*------------------------------------------/* ACCESSABILITY PAGE /*------------------------------------------*/ .accessabilityMainPage #GridTop { display: none; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) { max-width: 40.5vw; margin: 0 auto var(--gap-120); display: flex; flex-direction: column; text-align: start !important; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) #headline { font-size: 100%; margin: 0; text-align: start; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) #headline h1 { margin-block: var(--gap-120) var(--gap-20); text-align: end; font-family: var(--font-2); font-size: 88px; letter-spacing: -1.76px; line-height: 0.9; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) #subheadline h2 { text-align: right; margin-bottom: var(--gap-36); } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) { max-width: 100%; display: grid; text-align: right; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) :is(h2, h3) { margin-bottom: var(--gap-24); margin-top: var(--gap-66); font-size: clamp(18px,var(--fs-20),300px); letter-spacing: unset; font-family: var(--font-2); } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) :is(h2, h3):first-child { margin-top: 0; font-size: clamp(24px,var(--fs-26),300px); letter-spacing: unset; font-family: var(--font-2); } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) :is(ul,ol) { padding-inline-start: var(--gap-20); margin: 0; display: flex; flex-direction: column; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) :is(ul,ol) :is(ul,ol) { padding-inline-start: 0; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) :is(ul,ol):has(+ p, + ul, + ol), .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) :is(p, ul,ol):has(+ ul, + ol) { margin-bottom: var(--gap-24); } @media(min-width: 1025px) { } @media(max-width: 1025px) { .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) { max-width: 100%; margin: 0 auto var(--gap-64); padding-inline: 15px; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) #headline h1 { font-size: 40px; margin: 0 0 var(--gap-12); } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) :is(h2, h3) { font-size: 18px; margin-bottom: 10px; } } /*------------------------------------------/* FOOTER /*------------------------------------------*/ #allSectionsWrapper .section.grid-text-section.footer-top-grid { background: var(--black); } #allSectionsWrapper .section.grid-text-section.footer-top-grid .section-title { width: 85%; position: static; } #allSectionsWrapper .section.grid-text-section.footer-top-grid .section-title h2 { color: white; position: static; font-size: clamp(100px,var(--fs-140),300px); } #allSectionsWrapper .section.grid-text-section.footer-top-grid .section-title h2 div { /* position: absolute; */ width: 11.979vw; height: 6.667vw; display: inline-block; position: static; } #allSectionsWrapper .section.grid-text-section.footer-top-grid .section-title h2 div img { width: 100%; } #allSectionsWrapper .section.grid-text-section.footer-top-grid .grid-text .gridTextImgContainer { } #allSectionsWrapper .section.grid-text-section.footer-top-grid .grid-text .gridTextImgContainer img { height: auto; aspect-ratio: 1; object-fit: cover; transform: scale(0.8); transition: 0.5s ease all; } #allSectionsWrapper .section.grid-text-section.footer-top-grid.shown .grid-text .gridTextImgContainer img { transform: unset; } #allSectionsWrapper .section.grid-text-section.footer-top-grid .section-title h2 div img { position: absolute; left: 0; bottom: 0; } #SiteFooter .footer-text-divided { padding: 0; display: flex; flex-direction: column; align-items: center; text-align: center; background: var(--yellow); color: var(--black); padding-top: var(--gap-96); } #SiteFooter .footer-text-divided .footer-text-right { width: 100%; padding: 0; text-align: center; order: 3; } #SiteFooter .footer-text-divided .footer-text-right p { font-family: var(--font-3); font-size: clamp(300px,25.521vw,1000px); letter-spacing: calc(0px - 0.636vw); display: flex; overflow: hidden; line-height: 0.8; padding-top: var(--gap-24); justify-content: end; } #SiteFooter .footer-text-divided .footer-text-middle { width: 100%; padding: 0; order: 2; padding-block: var(--gap-60); } #SiteFooter .footer-text-divided .footer-text-middle p { display: flex; justify-content: center; gap: var(--gap-12); } #SiteFooter .footer-text-divided .footer-text-middle p img { } #SiteFooter .footer-text-divided .footer-text-left { width: 100%; padding: 0; order: 1; text-align: center; } #SiteFooter .footer-text-divided .footer-text-left ul { margin: 0; list-style: none; padding: 0; } #SiteFooter .footer-text-divided .footer-text-left ul li { padding-block: var(--gap-8); height: var(--gap-56); display: flex; align-items: center; justify-content: center; border-bottom: 1px solid var(--black); transition: 0.3s ease all; } #SiteFooter .footer-text-divided .footer-text-left ul li:first-child { border-top: 1px solid var(--black); } #SiteFooter .footer-text-divided .footer-text-left ul li:hover { color: white; background: var(--black); } #SiteFooter .footer-text-divided .footer-text-left ul li a { width: 100%; height: 100%; display: block; align-content: center; } #SiteFooter .footer-text-divided .footer-text-left ul li a:after { content: url("https://media.getmood.io/warehouse/dynamic/690152.svg"); position: absolute; left: 1%; } #SiteFooter .footer-text-divided .footer-text-left ul li:hover a::after { filter: invert(1); } #SiteFooter .site-credit.alternative { padding: 0; } #SiteFooter .site-credit.alternative > * { float: none; } @media(max-width: 1025px) { #allSectionsWrapper .section.grid-text-section.footer-top-grid { min-height: unset; padding: 0; padding-bottom: 80px; display: flex; flex-direction: column-reverse; } #allSectionsWrapper .section.grid-text-section.footer-top-grid .section-title { width: 100%; margin: 0; padding-top: 80px; } #allSectionsWrapper .section.grid-text-section.footer-top-grid .section-title h2 { font-size: 50px; } #allSectionsWrapper .section.grid-text-section.footer-top-grid .section-title h2 div { width: 81px; height: 46px; margin-inline: 12px; display: none; } #allSectionsWrapper .section.grid-text-section.footer-top-grid .section-title h2 div img { position: static; } #SiteFooter { padding: 0; } #SiteFooter .footer-text-divided { padding: 0; } #SiteFooter .footer-text-divided .footer-text-left { display: block; } #SiteFooter .footer-text-divided .footer-text-left ul li a:after { left: 20px; } #SiteFooter .footer-text-divided .footer-text-right { display: block; } #SiteFooter .footer-text-divided .footer-text-right p { font-size: 91px; letter-spacing: -2.73px; line-height: 1; padding: 0; display: block; } #SiteFooter .footer-text-divided .footer-text-middle { padding-block: 120px; } } /*-------------------------------------------/* MOUSE HOVER EFFECT /*------------------------------------------*/ div[data-cursor-img], div[data-cursor-img] * { cursor: pointer; } body .mf-cursor { z-index: 1000; top: -1%; left: -1%; } body .mf-cursor:before { left: calc(var(--gap-60) * -1); top: calc(var(--gap-60) * -1); width: var(--gap-120); height: var(--gap-120); opacity: 1 !important; transform: scale(0); background: transparent; border-radius: 50%; backdrop-filter: blur(22px); } body .mf-cursor.-hidden:before { transform: scale(0) !important; } body .mf-cursor.-media:before { transform: scale(1); } body .mf-cursor .mf-cursor-media { width: var(--gap-20); height: var(--gap-20); margin: calc(var(--gap-10) * -1) 0 0 calc(var(--gap-10) * -1); background: var(--yellow); transition: 0.3s ease all; border-radius: 50%; } body .mf-cursor.-media .mf-cursor-media { width: var(--gap-120); height: var(--gap-120); margin: calc(var(--gap-60) * -1) 0 0 calc(var(--gap-60) * -1); } body .mf-cursor .mf-cursor-media .mf-cursor-media-box { display: flex; padding: 0; align-items: center; justify-content: center; } body .mf-cursor.-media .mf-cursor-media .mf-cursor-media-box { transform: scale(1) !important; } body .mf-cursor.-hidden .mf-cursor-media .mf-cursor-media-box { transform: scale(0) !important; } body .mf-cursor .mf-cursor-media .mf-cursor-media-box img { width: 100%; height: 100%; transform: unset; border-radius: unset; position: relative; top: unset; left: unset; } /*-------------------------------------------/* ANIMATIONS /*------------------------------------------*/ @keyframes scroll-bg { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } } @keyframes scrollText { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } }