/* Sasa-Setton */ /**RESET BOOTSTRAP*/ .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { padding: 0; } .row { margin: 0; } /*------RESET--------*/ .grid-boxes .grid-box-title h3 a { color: inherit; } .section, footer, .grid-boxes .grid-box-title h3, .grid-text p, #GridPage, .sections .grid-content-section, #lobbyview .grid-boxes, #LobbyModule .grid-boxes, #lobbyview .grid-boxes .grid-box-image, #LobbyModule .grid-boxes .grid-box-image, #lobbyview .grid-box, #LobbyModule .grid-box, #headline, #SiteGrid.layout-bottom #GridPromo, #DynamicFormObject .dynamicFormObjectField, .form-container-wide #DynamicFormObject, .form-container-wide #DynamicFormObject .dynamicFormObjectFields, .form-container-wide #DynamicFormObject .dynamicFormObjectTitleAndText, ul, ol, .form-container-wide #DynamicFormObject .dynamicFormObjectFields .top-form, .form-container-wide #DynamicFormObject .dynamicFormObjectField, .form-container-wide #DynamicFormObject .dynamicFormObjectSubmit, .normal-form textarea, .normal-form input, .grid-faq-section, .panel-group .panel, .panel-group, .faq-headline, .faq-body > div, .section-title h2, .section-title h1, .section-title, .grid-rows .grid-row-text h2, .grid-short-box .grid-short-box-label, #header2 .menu-nav, #header2 ul.menu li, .grid-short-box, .lobby-grid #GridPage .max-width, .categories-strip ul li, #text1 p:last-child, .grid-text .grid-text-content .gridText1, .grid-text .grid-text-content, .grid-text .grid-text-content .gridText2, .grid-rows .grid-row-text h3, .blog-grid #TagView #headline, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .grid-boxes .section-animation-item, .grid-boxes .grid-box-image, .GridBottomGallery { margin: 0; padding: 0; } .form-container-wide #DynamicFormObject .dynamicFormObjectTitleAndText:after { display: none; } #header2, .grid-boxes .grid-box-subtitle, #header2 ul.menu li, #DynamicFormObject { color: inherit; } #header2 #header-container { display: flex; align-items: center; } #header2 ul.menu > li:before { display: none; } #header2 ul.menu li a:focus { opacity: 1 } .grid-boxes .grid-box-subtitle, #LobbyModule .grid-boxes .grid-box-title h3, .grid-boxes .grid-box-title h3, #lobbyview .grid-box, #LobbyModule .grid-box { font-size: inherit } @media(max-width:991px) { .grid-text-section .section-title { margin-bottom: 0; } .col-xs-10 { width: 100%; } #LobbyModule .grid-boxes:before { display: none; } #DynamicFormObject { max-width: 100% !important; } .normal-form input { max-width: 100%; } #SiteFooter { padding-bottom: 0; } .mobileFiltersBtns { margin-bottom: 0; } } #DynamicFormObject:after { display: none; } #DynamicFormObject { border: none; } .normal-form textarea, .normal-form input { width: 100%; } .normal-form select { width: 100%; margin: 0; } .cartSubTotal .totalSumItems.totalPrice, .cartSubTotal .totalSumItems span:first-child, .shopLayout.checkoutPage .DeliveryDetails form#checkout-form .checkoutFormWrapper.commentDetailsWrapper .checkoutInputsWrapper .textareaBoxWrapper label, .shopLayout.checkoutPage .DeliveryDetails form#checkout-form .checkoutFormWrapper.personalDetailsWrapper .checkoutInputsWrapper > div label, .registerFormWrapper fieldset label, label, #CatalogModule #CatalogItemView span.custom-field-title { font-weight: normal; } #LobbyModule .grid-boxes, #PageBreadCrumps, .grid-form-section, .grid-content-section, #GridPage .max-width, #galleryview { max-width: 100%; } .grid-boxes { display: flex; margin: 0; } .grid-boxes .grid-box-image-container { position: unset; } #grid-view .grid-short-box-text { font-size: inherit; } #header2.fixedMenu { transition: var(--general-transition); } .col-xs-10 { width: 100%; } input[type=radio], input[type=checkbox], label { margin: 0; } .grid-rows .grid-row { display: flex; align-items: center; background-color: transparent; } a:hover, a:focus { color: inherit; } .row:before, .row:after, .gallery-cubes:before, .gallery-cubes:after, .grid-boxes:before, .grid-boxes:after, .itemsList:after, .itemsList:before { display: none; } #DynamicFormObject .dynamicFormObjectFields { margin-bottom: 0 } .grid-boxes .box-image-animation:hover img { transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; } .grid-row li.slider-item { padding-bottom: 0; } .grid-row .grid-row-image-container { position: unset; } @media(min-width:767px) { .form-container-wide #DynamicFormObject .dynamicFormObjectFields .top-form { font-size: inherit; } } @media(max-width:991px) { .grid-rows .grid-row-text { padding: 0; width: 100%; margin: 0; } #GridPage .max-width { width: 100%; } .visible-xs-block { display: none !important; } .mobile-strip { display: none; } .grid-rows .grid-row-text p, #lobbyview .grid-boxes .grid-box-title h3 { font-size: inherit; } .grid-boxes .grid-box .grid-box-title h3 { margin: 0; font-size: inherit; } .section-title h2, .section-title h1 { max-width: 100%; } } strong { font-family: var(--font-2); } body.modal-open { padding-inline: 0 !important; } /*------END RESET--------*/ :root { --font-1: 'googlesans-regular'; --font-2: 'googlesans-bold'; --font-3: 'pinghebrew-heavy'; --black: #030012; --dark-grey: #413C41; --blue: #03B0CE; --yellow: #F7DD2B; --orange: #FF8B16; --red: #E95A56; --green: #32B775; --green-hover: #2C9360; --beig: #F3F3F0; --text: #5C5C5C; --stroke: #D9DADB; --white: #fff; --fs-14: clamp(12px, 0.729vw, 300px); --fs-16: clamp(14px, 0.833vw, 300px); --fs-18: clamp(16px, 0.937vw, 300px); --fs-20: clamp(18px, 1.042vw, 300px); --fs-24: clamp(22px, 1.25vw, 300px); --fs-32: clamp(28px, 1.667vw, 300px); --fs-36: clamp(34px, 1.874vw, 300)); --fs-36: clamp(30px, 1.874vw, 300px); --fs-68: clamp(60px, 3.542vw, 300px); --fs-88: clamp(75px, 4.583vw, 300px); --fs-108: clamp(95px, 5.625vw, 300px); --fs-120: clamp(100px, 6.25vw, 300px); --fs-180: clamp(140px, 9.375vw, 300px); --gap-4: 0.209vw; --gap-5: 0.260vw; --gap-6: 0.3095vw; --gap-8: 0.41vw; --gap-10: 0.521vw; --gap-12: 0.626vw; --gap-14: 0.730vw; --gap-16: 0.834vw; --gap-20: 1.043vw; --gap-24: 1.251vw; --gap-28: 1.460vw; --gap-32: 1.668vw; --gap-38: 1.981vw; --gap-40: 2.085vw; --gap-42: 2.19vw; /* או 2.1895vw לדיוק מרבי */ --gap-44: 2.294vw; --gap-45: 2.346vw; --gap-48: 2.502vw; --gap-50: 2.606vw; --gap-54: 2.815vw; --gap-56: 2.919vw; --gap-60: 3.128vw; --gap-64: 3.336vw; --gap-68: 3.545vw; --gap-70: 3.649vw; --gap-72: 3.753vw; --gap-80: 4.170vw; --gap-88: 4.587vw; --gap-90: 4.691vw; --gap-96: 5.004vw; --gap-100: 5.213vw; --gap-106: 5.525vw; --gap-120: 6.255vw; --gap-140: 7.298vw; --gap-146: 7.611vw; --gap-160: 8.340vw; --gap-175: 9.122vw; --gap-180: 9.383vw; --gap-200: 10.42vw; --gap-280: 14.583vw; --gap-560: 29.191vw; --site-gap: var(--gap-175); --general-transition: all 0.3s ease-in-out; --box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.02), 0 4px 68px 0 rgba(0, 0, 0, 0.04); --desktop-corner-radius---big: var(); --desktop-corner-radius---big: var(--gap-10); --desktop-corner-radius---small: var(--gap-6); } body { opacity: 0; zoom: 1 !important; background: var(--beig); color: var(--dark-grey); font-family: var(--font-1) !important; font-size: var(--fs-18); line-height: 1.5; letter-spacing: 0.18px; } body.loaded { opacity: 1; } @media (max-width: 1560px) and (min-width: 991px) { :root { } } @media (max-width: 991px) { :root { } body { } } #GridTop.noTopImage, .GridTop.noTopImage { display: none; } .rolling-button { overflow: hidden; transition: var(--general-transition); color: var(--white); height: fit-content; } .rolling-button:hover { color: var(--white); } .rolling-button .button-content-wrapper { position: relative; overflow: hidden; display: flex; flex-direction: column; height: var(--gap-24); } .rolling-button .button-content-wrapper > * { transition: var(--general-transition); } .rolling-button .button-content-wrapper:hover { } .rolling-button .button-hover-text { } .rolling-button:hover .button-first-text { transform: translateY(-100%); } .rolling-button.done .button-first-text { position: absolute; } .rolling-button:hover .button-content-wrapper { } .rolling-button:hover .button-hover-text { \: translateY(0%); transform: translateY(-100%); } .extraArrow { display: flex; align-items: center; justify-content: center; width: var(--gap-50); height: var(--gap-50); background-color: var(--yellow); border-radius: 50%; transition: var(--general-transition); overflow: hidden; } .extraArrow svg { position: relative; transition: var(--general-transition); } .extraArrow svg.after-arrow { transform: translateX(var(--gap-40)); right: var(--gap-4); } .extraArrow svg.before-arrow { right: -4px; } .hover .extraArrow svg.after-arrow { transform: translateX(0); } .hover .extraArrow svg.before-arrow { transform: translateX(calc(var(--gap-40) * -1)); } .swiper-buttons { position: relative; } #lobbyview:has(h2, .lobbyTextContainer) #headline { max-width: 49.1%; margin-inline: auto; margin-bottom: var(--gap-32); } #lobbyview .lobbyTextContainer { max-width: 44.1%; margin-inline: auto; } /*------ GENERIC STUFF --------*/ /*h-numbers 180px*/ .home-page .sliding-cards .grid-box-title, .h-numbers { font-family: var(--font-3); font-size: var(--fs-180); letter-spacing: -7.2px; line-height: 0.8; color: var(--black); } /*h1 120px*/ .h1, .gallery-text h1 { font-family: var(--font-3); font-size: var(--fs-120); letter-spacing: -1.2px; line-height: 0.9; color: var(--black); } /*h2 68px*/ #DynamicFormObject .dynamicFormObjectTitleAndText h3.dynamicFormObjectTitle, #headline h1, .h2 { font-family: var(--font-3); font-size: var(--fs-88); letter-spacing: -0.88px; line-height: 0.9; color: var(--black); } /*h3 68px*/ #SiteContainer .blog-related-posts.row > h2, .grid-rows .grid-row-text h2, .section-title h2, #CatalogModule .relatedItems .relatedItemsTitle h2, .h3, .gallery-text span, .grid-multi-rows-section .grid-row-text h2 { font-family: var(--font-3); font-size: var(--fs-68); line-height: 0.9; color: var(--black); font-family: var(--font-3); } /*h4 48px*/ .contentInnerPage #SiteContainer .blog-view #headline h1, .FooterForm.form-container-wide #DynamicFormObject h3.dynamicFormObjectTitle, .h4 { font-family: var(--font-3); font-size: var(--fs-48); line-height: 0.9; color: var(--black); } /*h5 32px*/ .h5, .big-image-content .big-image-name, .team-page .grid-text-section .section-title h2, .activities-section a.box-image-animation .grid-box-title, .sticky-boxes .grid-boxes .grid-box-image .grid-box-content h3 { font-family: var(--font-3); font-size: var(--fs-32); letter-spacing: 0.32px; line-height: 1; color: var(--black); } /*h6 24px*/ .h6 { font-family: var(--font-3); font-size: var(--fs-24); letter-spacing: 0.24px; line-height: 1; color: var(--black); } /*h7 20px*/ .ContentRegularPage h2, #SiteContainer #text2 h3, .blog-post .blog-post-content .blog-post-title a, .h7, .faq-headline, :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-title h3 a, .educational-spaces-section .grid-box-title, #multi-content-modal.textInPop #PopUpData h3, .team-page .grid-boxes .grid-box-title h3 a, #SiteFooter .footer-text-left .dropdown-item h3, .home-page .sliding-cards .grid-boxes .grid-box-subtitle, .gallery-text span span { font-family: var(--font-3); font-size: var(--fs-20); letter-spacing: 0.2px; line-height: 1; color: var(--black); } /*h8 - 36px*/ .ContentRegularPage h3, :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box .new-wrapper-inner .grid-box-title h3 a { font-family: var(--font-3); font-size: var(--fs-36); letter-spacing: 0.36px; line-height: 1; color: var(--black); } /*text-bold-24 */ .text-bold-24 { font-family: var(--font-2); font-size: var(--fs-24); line-height: 1.2; color: var(--black); } /*text-bold-18 */ .page-404 #GridPage #GridContent #subheadline h2, .FormResultPage #GridPage #GridContent #text1 p, #BlogView h2, #SiteGridContainer .blog-grid #GridPage #GridWrap #GridWrapInner #GridHeader .blogmain-header #subheadline h2, .grid-single-row-section .grid-rows h3, #lobbyview h2, .grid-multi-rows-section .grid-row-text h3, .about-top-section h2, .sliding-cards .section-title h3, .text-bold-18 { font-family: var(--font-2); font-size: var(--fs-18); letter-spacing: 0.18px; line-height: 1.5; color: var(--black); } /*text-bold-16*/ big-image-content .big-image-description, .educational-spaces-section .grid-box .rolling-button, .advantage-section .grid-boxes .grid-box .grid-box-title, #SiteFooter .footer-text-middle ul li, #SiteFooter .footer-text-left ul li a, .text-bold-16, .sticky-boxes .grid-boxes .grid-box-image .grid-box-content .grid-box-subtitle { font-family: var(--font-2); font-size: var(--fs-16); letter-spacing: 0.16px; line-height: 1.4; color: var(--black); } /*text*/ .text { font-family: var(--font-1); font-size: var(--fs-18); letter-spacing: 0.18px; line-height: 1.5; color: var(--dark-grey); } /*text-16*/ big-image-content .big-image-full-text, .grid-form-section #DynamicFormObject .checkboxField label, .grid-form-section .normal-form .dynamicFormObjectField .form-control, :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-subtitle, .team-page .grid-text-section .grid-text-content h2, :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box .new-wrapper-inner .grid-box-fulltext, #PageBreadCrumps, .team-page .grid-boxes .grid-box-subtitle, #multi-content-modal.textInPop #PopUpData h4, .text-16, .sticky-boxes .grid-boxes .grid-box-image .grid-box-content .grid-box-fulltext { font-family: var(--font-1); font-size: var(--fs-16); letter-spacing: 0.16px; line-height: 1.4; color: var(--dark-grey); } /*text-14*/ .colored-grid-text .grid-text h2, #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .checkboxField label, .sections .activities-section .section-title h3, .sticky-boxes .section-title h3, .text-14, .sliding-section h3, .colored-grid-text .section-title h3, .grid-faq-section .section-title h3 { font-family: var(--font-1); font-size: var(--fs-16); letter-spacing: 0.14px; line-height: 1.36; color: var(--dark-grey); } /**TITLE WITH ICON **/ .sticky-boxes .section-title, .activities-section .section-title, .sliding-section .section-title, :is(body, #LobbyModule) .colored-grid-text .section-title, .grid-faq-section .section-title { display: flex; flex-direction: column-reverse; gap: var(--gap-8); align-items: center; } .sticky-boxes .section-title h3, .sections .activities-section .section-title h3, .sliding-section h3, .colored-grid-text .section-title h3, .grid-faq-section .section-title h3 { display: flex; gap: var(--gap-8); } .sticky-boxes .section-title h3:before, .sections .activities-section .section-title h3:before, .sliding-section h3:before, .colored-grid-text .section-title h3:before, .grid-faq-section .section-title h3:before { content: ""; display: block; background-image: url(https://media.getmood.io/warehouse/dynamic/737117.svg); width: var(--gap-14); height: var(--gap-16); } /** BUTTON **/ .blog-tags-list ul li.blog-tag a, .grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectSubmit .form-submit, #lobbyText p a, .headerShop.side-cart .cartItemsNavSubTotal .totalSunAndBottomText .totalSumItems a.goToCheckout.shopBtn, .FormResultPage #GridPage #GridContent #text1 a, .page-404 #GridPage #GridContent #text1, .SingleItemPage .catalogItemSingleView #checkout-form .normal-form-submit input, .SingleItemPage .catalogItemSingleView button.add-to-cart, .shopBtn, .SingleItemPage #CatalogModule #CatalogItemView .itemContentWrapper button#addToCartBtn, .general-button, .home-top-section a.gallery-text-btn.photoCaptionLink, .grid-rows .grid-row-text a.grid-row-button, .grid-text .sec-button, .sec-button, #DynamicFormObject input[type="submit"], .headerShopLogin .userLogin .newUser a.registerUser { height: var(--gap-50); display: inline-flex; min-width: var(--gap-140); padding-inline: var(--gap-24); justify-content: center; align-items: center; font-size: var(--fs-16); letter-spacing: 0.16px; line-height: 140%; transition: var(--general-transition); border: none; position: relative; margin: 0; overflow: hidden; background: var(--green); border-radius: var(--desktop-corner-radius---small); font-family: var(--font-2); } /**Button Hover & Focus*/ .home-top-section .gallery-text { } .grid-rows .grid-row { } .grid-rows .grid-row-text p { } .grid-rows .grid-row-text a.grid-row-button { } .grid-rows .grid-row-text { } .grid-row .grid-row-image-container { } .modal-backdrop.in { opacity: 1; background: rgba(0, 0, 0, 0.24); } .lobby-grid #PageBreadCrumps { max-width: 100%; padding-inline: var(--gap-20); } .GridTop:after { } #GridTop, .GridTop { } .top-caption { } .top-caption h1, .top-caption-subtitle { } .top-caption h2 { } .categoryView-cutomFields { } .categories-strip { } .categories-strip ul, .blog-grid #GridPage #GridWrap .blog-tags-list ul { } .categories-strip .menu-tags-list, .blog-grid #GridPage #GridWrap .blog-tags-list { } .categories-strip ul li a, .blog-grid #GridPage #GridWrap .blog-tags-list ul li a { color: var(--white); } .categories-strip ul li:not(.active) a:hover, .blog-grid #GridPage #GridWrap .blog-tags-list ul li:not(.active) a:hover { } .categories-strip ul li.active a, .blog-grid #GridPage #GridWrap .blog-tags-list ul li.active a { background: var(--green-hover);; } .categories-strip ul li.active { } .blog-tags { padding: 0; margin-block: var(--gap-40) var(--gap-140); } .blog-tags-list ul li.blog-tag { margin-left: var(--gap-8); } #SiteGrid:has(.GridTop:not(.noTopImage)) #PageBreadCrumps { } #PageBreadCrumps { height: var(--gap-70); display: flex; align-items: center; padding-inline: var(--gap-16); gap: var(--gap-10); margin-top: var(--header-height); margin-bottom: var(--gap-64); } #PageBreadCrumps span:after { background: var(--blue); width: var(--gap-4); height: var(--gap-4); display: inline-block; font-size: 0; border-radius: 50%; margin-right: var(--gap-10); } #PageBreadCrumps span:last-child:after { opacity: 0 } #SiteGridContainer { } #SiteGridContainer:after { } .subOpen #SiteGridContainer:after, body:has(#main-header.open) #SiteGridContainer:after { } .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active { } .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { } .swiper-buttons .swiper-button { } .swiper-buttons .swiper-button-next:after, .swiper-buttons .swiper-button-prev:after { background-image: url(https://media.getmood.io/warehouse/dynamic/737129.svg); content: ""; background-size: auto; background-position: center; background-repeat: no-repeat; width: 100%; display: block; height: 100%; } .swiper-buttons .swiper-button-next:after { } .swiper-buttons .swiper-button-prev:after { transform: scale(-1); } @media(max-width:1024px) { #allSectionsWrapper { } } /*** HOME */ .home-page #SiteGridContainer { } .home-top-section { } .home-top-section .section-content-side { } .home-top-section h1 { } .home-page .data-draw-scroll-wrap { position: absolute; top: 25vh; right: calc(var(--gap-160) * (-1)); } #home-gallery { height: calc(var(--app-height) - var(--header-height)) !important; display: flex; align-items: flex-start; margin-top: var(--header-height); flex-direction: row-reverse; } #home-gallery .slides .slider-item { display: block; height: auto; } #home-gallery .slides .slider-item { display: block; height: auto; position: absolute; } #home-gallery img { height: auto; min-width: unset; width: -webkit-fill-available; border-radius: var(--desktop-corner-radius---big); } #home-gallery .slides .slider-item:nth-child(1) { width: 50.22%; top: 50%; left: 50%; transform: translate(-50%, -50%); } #home-gallery .slides .slider-item:nth-child(2) { width: 21.9%; left: var(--gap-60); top: var(--gap-56); } #home-gallery .slides .slider-item:nth-child(3) { width: 35.1%; bottom: var(--gap-24); right: var(--gap-16); } #home-gallery .slides { display: flex; width: 50%; height: auto; position: relative; height: 100%; } #home-gallery .gallery-text { width: 50%; padding-inline-start: var(--site-gap); display: flex; flex-direction: column; gap: var(--gap-16); padding-top: var(--gap-160); } #home-gallery .gallery-text span { display: flex; flex-direction: column; color: var(--dark-grey); gap: var(--gap-56); } #home-gallery .gallery-text span span { color: var(--black); max-width: 250px; } #home-gallery .TopVideoWrapper { } #home-gallery .TopVideo { } #home-gallery .TopVideo iframe { } #home-gallery.video-slider .opacity-layer { } #home-gallery .scroll-down { background: url(https://media.getmood.io/warehouse/dynamic/737171.svg) center no-repeat var(--blue); width: var(--gap-50); height: var(--gap-50); border-radius: 50%; inset-inline-start: var(--site-gap); } #home-gallery .scroll-down svg { opacity: 0; width: 100%; height: 100%; } #home-gallery .slider-item:nth-child(2) img { border: var(--gap-10) solid var(--blue); transform-origin: bottom left; } #home-gallery .slider-item:nth-child(3) img { border-radius: var(--desktop-corner-radius---big); border: var(--gap-10) solid var(--orange); transform-origin: top left; } @media(min-width:1025px) { svg[data-draw-scroll-mobile] { display: none; } } @media(max-width:1024px) { svg[data-draw-scroll-desktop] { display: none; } } .grid-blog { } .grid-blog .section-title { } .grid-blog .section-title h2 { } .grid-blog .section-title .sec-button { } @media(max-width:1024px) { } .grid-form-section { padding-inline: var(--site-gap); } .grid-form-section .normal-form fieldset { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: var(--gap-16); margin-top: var(--gap-40); } .grid-form-section .gridFormWithImg { display: flex; flex-direction: row-reverse; background: var(--white); border-radius: var(--desktop-corner-radius---small); overflow: hidden; } .grid-form-section .gridFormImgContainer .dynamicFormObjectTitle { } .grid-form-section .gridFormWithImg .gridFormImgContainer { padding: var(--gap-16); padding-inline-end: 0; width: 39.8%; } .grid-form-section .gridFormWithImg #DynamicFormObject { padding: var(--gap-64) var(--gap-80); width: 60.02%; } .grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields .top-form { text-align: start; margin-top: var(--gap-16); } .grid-form-section .gridFormWithImg .gridFormImgContainer img { border-radius: var(--desktop-corner-radius---small); overflow: hidden; height: 100%; object-fit: cover; } .grid-form-section .form-container-wide.gridFormWithImg #DynamicFormObject .dynamicFormObjectTitleAndText { text-align: start; } .grid-form-section .form-container-wide.gridFormWithImg #DynamicFormObject .dynamicFormObjectField.textareaField, .grid-form-section .form-container-wide.gridFormWithImg #DynamicFormObject .dynamicFormObjectSubmit, .grid-form-section .form-container-wide.gridFormWithImg #DynamicFormObject .dynamicFormObjectField.checkboxField { grid-column: 1 / -1; width: 100%; text-align: start; } .grid-form-section .form-container-wide.gridFormWithImg #DynamicFormObject .dynamicFormObjectField.textareaField { margin-top: var(--gap-40); } .grid-form-section .normal-form .dynamicFormObjectField:not(.textareaField) .form-control { height: var(--gap-50); } .grid-form-section .normal-form .dynamicFormObjectField .form-control { border: none; box-shadow: none; border-bottom: 1px solid var(--black); padding-inline: var(--gap-16); } .grid-form-section .must:before { inset-inline-start: 0; top: var(--gap-10); display: inline-flex; } .grid-form-section .normal-form .dynamicFormObjectField.textareaField .form-control { height: var(--gap-100); padding-top: var(--gap-8); } .grid-form-section .form-container-wide.gridFormWithImg #DynamicFormObject .dynamicFormObjectField.checkboxField { margin-top: var(--gap-16); } .grid-form-section .normal-form textarea::placeholder, .grid-form-section .normal-form input::placeholder { color: var(--dark-grey) } button.form-submit { } @media(max-width:1024px) { } .shop-form .form-control:not([type=checkbox]):not([type=submit]):not([type=button]):not([type=radio]), .normal-form input, .normal-form select { } .normal-form textarea::placeholder, .normal-form input::placeholder { } .normal-form textarea::-moz-placeholder, .normal-form input::-moz-placeholder { } .normal-form textarea:-ms-placeholder, .normal-form input:-ms-input-placeholder { } .normal-form textarea:-webkit-input-placeholder, .normal-form input::-webkit-input-placeholder { } .normal-form fieldset { } .normal-form .textareaField, .normal-form .checkboxField { } select, form.shop-form .form-control:not([type=checkbox]):not([type=submit]):not([type=button]):not([type=radio]), .normal-form .form-control, .normal-form input { border-radius: 0; } .select-wrapper:after { } .normal-form textarea.form-control { } .grid-form-section #DynamicFormObject .checkboxField label { } .normal-form .checkboxField { } #DynamicFormObject input[type="submit"] { } .grid-form-section .form-container-wide.gridFormWithImg #DynamicFormObject .dynamicFormObjectSubmit { margin-top: var(--gap-40); } .grid-form-section .form-container-wide.gridFormWithImg #DynamicFormObject .dynamicFormObjectField { width: 100%; } .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectField.input-email .must:before { right: 0px; top: var(--gap-4); } #DynamicFormObject .dynamicFormObjectField .input-wrapper { } form.shop-form .form-control:not([type=checkbox]):not([type=submit]):not([type=button]):not([type=radio]) { } @media(max-width:1024px) { } /*--------/* BLOG /*--------*/ /* ============================================= BLOG GRID - TOP SECTION ============================================= */ #SiteGridContainer .blog-grid .GridTop.blog { } /* ============================================= BLOG GRID - PAGE WRAPPER ============================================= */ #SiteGridContainer .blog-grid #GridPage #GridWrap { max-width: 100%; } #SiteGridContainer .blog-grid #GridPage #GridWrap #PageBreadCrumps { } #SiteGridContainer .blog-grid #GridPage #GridWrap #BlogModule { } /* ============================================= BLOG GRID - HEADER ============================================= */ #SiteGridContainer .blog-grid #GridPage #GridWrap #GridWrapInner #GridHeader { } #SiteGridContainer .blog-grid #GridPage #GridWrap #GridWrapInner #GridHeader .blog-tags { } #SiteGridContainer .blog-grid #GridPage #GridWrap #GridWrapInner #GridHeader .blogmain-header #headline { max-width: 49.1%; margin-inline: auto; margin-bottom: var(--gap-32); } #SiteGridContainer .blog-grid #GridPage #GridWrap #GridWrapInner #GridHeader .blogmain-header #subheadline { max-width: 49.1%; margin-inline: auto; margin-bottom: var(--gap-8); text-align: center; } #SiteGridContainer .blog-grid #GridPage #GridWrap #GridWrapInner #GridHeader .blogmain-header #subheadline h2 { margin: 0; } #SiteGridContainer .blog-grid #GridPage #GridWrap #GridWrapInner #GridHeader .blogmain-header #text1 { max-width: 44.1%; margin-inline: auto; } #SiteGridContainer .blog-grid #GridPage #GridWrap #GridWrapInner:has(#TagView) #GridHeader { } #SiteGridContainer .blog-grid #TagView #headline { } @media (max-width: 1024px) { } /* ============================================= BLOG GRID - TAGS LIST ============================================= */ /* ============================================= BLOG GRID - POSTS ============================================= */ .blog-posts, .grid-boxes-blog { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap-16); padding-inline: var(--site-gap); width: 100%; } .blog-post { background: var(--white); box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.02), 0 4px 68px 0 rgba(0, 0, 0, 0.04); Modes; border-radius: var(--desktop-corner-radius---big, 10px); overflow: hidden; width: 100%; } .blog-post .blog-post-image { aspect-ratio: 1/0.95; width: 100%; overflow: hidden; } .blog-post .blog-post-image a { width: 100%; height: 100%; display: block; } .blog-post .blog-post-image img { height: 100%; object-fit: cover; } .blog-post .blog-post-content { padding: var(--gap-24); } .blog-post .blog-post-content h2.blog-post-title, #BlogView .blog-related-posts h2.blog-post-title { padding: 0; margin: 0; line-height: 1; } .blog-post .blog-post-content .blog-post-title a { display: block; } .blog-post .blog-post-content .blog-post-title a::after { } .blog-post .blog-post-content .blog-post-text { display: none; } .blog-post .blog-post-content .blog-post-icons { display: none; } .blog-post-icons i, .blog-post-icons svg { } .blog-post-icons span { } .blog-post .blog-post-content .blog-post-icons .blog-post-writer, .blog-post .blog-post-content .blog-post-Time-container, #BlogView .blog-post-Time-container { } .blog-post .blog-post-icons { } @media(min-width:1025px) { } @media(max-width:1024px) { } /* ============================================= BLOG GRID - PAGINATION ============================================= */ /* ============================================= BLOG INNER PAGE ============================================= */ .blog-view, #BlogView #text2 { max-width: 47.2%; margin: 0 auto; } #BlogView #text2 { margin-top: var(--gap-140); display: flex; flex-direction: column; gap: var(--gap-40); } #BlogView #text2 ol { padding-inline: var(--gap-20); } #BlogView #text2 ol img { } .blog-view #headline { margin-bottom: var(); } .blog-view h2 { text-align: center; margin-top: var(--gap-32); } .blog-view .blog-post-icons { display: none; } .blog-view .blog-post-icons span { } .blog-view .blog-post-icons > *:not(:last-child)::after { } .blog-view .blog-post-icons svg { } .blog-view .blog-post-icons .blog-post-Time-container { } /* ============================================= BLOG INNER PAGE - SHARE STRIP ============================================= */ #SiteGridContainer .blog-grid #GridPage #GridWrap #GridWrapInner #GridHeader { } #SiteGridContainer .blog-grid .GridTop.blog { } #SiteContainer .blog-view .share-strip { display: none; } #SiteContainer .blog-view .share-strip:before, #SiteContainer .blog-view .share-strip:after { } #SiteContainer .blog-view .share-strip span { } #SiteContainer .blog-view .share-strip i { } #SiteContainer .blog-view .share-strip i { } #SiteContainer .blog-view #text1 { max-width: 100%; text-align: center; margin: 0; } #SiteContainer .blog-view #text1 p.big-pic { } #SiteContainer .blog-view #text1 p.big-pic img { } #SiteContainer .blog-view #text1 > *:not(.big-pic) { } #SiteContainer .blog-view #text1 h3 { } #SiteContainer .blog-related-posts.row .share-strip { max-width: 47.2%; margin-inline: auto; float: none; text-align: start; direction: inherit; display: flex; align-items: center; gap: var(--gap-12); margin-block: var(--gap-64) 0; } #BlogView .share-strip a.share-icon { margin: 0; width: var(--gap-56); aspect-ratio: 1; border-radius: 999px; border: 1px solid var(--stroke, #D9DADB); background: var(--white, #FFF); display: flex; align-items: center; justify-content: center; } #BlogView .share-strip:before { display: none; } #BlogView .share-strip:after { position: unset; display: block; margin-inline-start: var(--gap-28); width: auto; flex-grow: 1; } #BlogView .share-strip a.share-icon .fab { font-size: 0; width: var(--gap-20); aspect-ratio: 1; } #BlogView .share-strip a.share-icon .fa-facebook { background-image: url(https://media.getmood.io/warehouse/dynamic/737360.svg); } #BlogView .share-strip a.share-icon .fa-twitter { background-image: url(https://media.getmood.io/warehouse/dynamic/737359.svg); } #BlogView .share-strip a.share-icon .fa-linkedin { background-image: url(https://media.getmood.io/warehouse/dynamic/737357.svg); } #BlogView .share-strip a.share-icon .fa-whatsapp { background-image: url(https://media.getmood.io/warehouse/dynamic/737358.svg); } # #SiteContainer #text2 { } #SiteContainer #text2 > * { } #SiteContainer .blog-related-posts.row > h2 { text-align: center; width: 100%; margin-block: var(--gap-140) var(--gap-48); } #SiteContainer .blog-related-posts.row { } @media (max-width: 1024px) { } @media (max-width: 1024px) { } /*--------/* HEADER /*--------*/ #header2 { position: fixed; background-color: var(--beig); border-bottom: 1px solid var(--stroke, #D9DADB); height: var(--gap-90); top: 0; } #header2 .header-top-right { display: none; } #header2 .mobile-middle-kdm { display: block; } .header-shop-icons { } .header-shop-icons .navShopBtn { } .header-shop-icons .navShopBtn svg { } .header-shop-icons .navShopBtn a, .header-shop-icons .navShopBtn button, .searchSubmitWrapper input#searchFormSubmit { } .header-shop-icons .cartBtn button { } .header-shop-icons .userBtn > button { } .header-shop-icons .wishlistBtn a { } .headerShopLoginUserLoggedIn h4 { } .headerShopLoginUserLoggedIn { } .headerShopLoginUserLoggedIn:after { } #SiteGridContainer.cart-active:After, #SiteGridContainer.profile-active:After { } .headerShopLoginUserLoggedIn .userLogin { } .headerShopLoginUserLoggedIn a.userAction:after, #header2 .header-top-left a.userAction:after { } .header-shop-icons .navShopBtn a svg { } .header-shop-icons .navShopBtn .loggedInUser a { } .header-shop-icons .navShopBtn .loggedInUser svg { } .header-shop-icons .navShopBtn .loggedInUser a:last-child { } .cartItemsCounter { } .cartItemsCounter span.CartItems { } #quick-search-container #SearchResultContainer .finalResultItem { } #quick-search-container #SearchResultContainer .finalResultItem:before { } #quick-search-container #SearchResultContainer .resultItem .resultContent > a b, #quick-search-container #SearchResultContainer .resultItem .resultContent > a strong { } #quick-search-container #SearchResultContainer .resultItem .resultContent img { } @media (min-width: 1025px) { .header-shop-icons { } .header-shop-icons .navShopBtn { } .header-shop-icons .navShopBtn svg { } .header-shop-icons .navShopBtn a, .header-shop-icons .navShopBtn button, .header-shop-icons .cartBtn button { } .header-shop-icons .userBtn > button { } .header-shop-icons .wishlistBtn a { } .headerShopLoginUserLoggedIn h4 { } .headerShopLoginUserLoggedIn { } .headerShopLoginUserLoggedIn:after { } #SiteGridContainer.cart-active:After, #SiteGridContainer.profile-active:After { } .headerShopLoginUserLoggedIn .userLogin { } .headerShopLoginUserLoggedIn a.userAction:after, #header2 .header-top-left a.userAction:after { } .header-shop-icons .navShopBtn a svg { } .header-shop-icons .navShopBtn .loggedInUser a { } .header-shop-icons .navShopBtn .loggedInUser svg { } .header-shop-icons .navShopBtn .loggedInUser a:last-child { } .cartItemsCounter { } .cartItemsCounter span.CartItems { } #quick-search-container #SearchResultContainer .finalResultItem { } #quick-search-container #SearchResultContainer .finalResultItem:before { } #quick-search-container #SearchResultContainer .resultItem .resultContent > a b, #quick-search-container #SearchResultContainer .resultItem .resultContent > a strong { } #quick-search-container #SearchResultContainer .resultItem .resultContent img { } } @media (max-width: 1024px) { .header-shop-icons { } .header-shop-icons .navShopBtn { } .header-shop-icons .navShopBtn svg { } .header-shop-icons .navShopBtn a, .header-shop-icons .navShopBtn button, .header-shop-icons .cartBtn button { } .header-shop-icons .userBtn > button { } .header-shop-icons .wishlistBtn a { } .headerShopLoginUserLoggedIn h4 { } .headerShopLoginUserLoggedIn { } .headerShopLoginUserLoggedIn:after { } #SiteGridContainer.cart-active:After, #SiteGridContainer.profile-active:After { } .headerShopLoginUserLoggedIn .userLogin { } .headerShopLoginUserLoggedIn a.userAction:after, #header2 .header-top-left a.userAction:after { } .header-shop-icons .navShopBtn a svg { } .header-shop-icons .navShopBtn .loggedInUser a { } .header-shop-icons .navShopBtn .loggedInUser svg { } .header-shop-icons .navShopBtn .loggedInUser a:last-child { } .cartItemsCounter { } .cartItemsCounter span.CartItems { } #quick-search-container #SearchResultContainer .finalResultItem { } #quick-search-container #SearchResultContainer .finalResultItem:before { } #quick-search-container #SearchResultContainer .resultItem .resultContent > a b, #quick-search-container #SearchResultContainer .resultItem .resultContent > a strong { } #quick-search-container #SearchResultContainer .resultItem .resultContent img { } } /*--------/* PAGE 404 /*--------*/ .page-404 #GridPage #GridWrap #GridWrapInner { } .page-404 #GridPage #GridContent { } .page-404 #GridPage #GridContent #subheadline h2 { } .page-404 #PageBreadCrumps { } .page-404 #GridPage #GridContent #text1:hover { } .page-404 #GridPage #GridContent #text1 p { } @media(max-width:1024px) { .page-404 #GridPage #GridWrap #GridWrapInner { } .page-404 #GridPage #GridContent #subheadline h2 { } } /*----------------------/* FORMS THANKS PAGE /*----------------------*/ .FormResultPage #GridPage #GridWrap #GridWrapInner { } .FormResultPage #GridPage #GridContent { } .FormResultPage #GridPage #GridContent #text1 a { } .FormResultPage #GridPage #GridContent #text1 a:hover { } .FormResultPage #GridPage #GridContent #text1 p { } @media(max-width:1024px) { .FormResultPage #GridPage #GridWrap #GridWrapInner { } .FormResultPage #GridPage #GridContent #text1 p { } } /*----------------------/* ACCESSABILITY PAGE /*----------------------*/ .ContentRegularPage #headline h1 { text-align: center; margin-bottom: var(--gap-140); } .ContentRegularPage #pageview { width: 100%; max-width: 900px; margin-inline: auto; } .ContentRegularPage #pageview .container-fluid { padding: 0; } .ContentRegularPage #pageview #text1 { margin: 0; text-align: start; } .ContentRegularPage #pageview #text1 ul, .ContentRegularPage #pageview #text1 ol { padding: 0 var(--gap-20); } .ContentRegularPage #pageview #text1 ul li::marker { color: var(--blue); } .ContentRegularPage h2 { } @media(max-width:1024px) { .ContentRegularPage #pageview { margin-bottom: var(--gap-30); padding: var(--site-gap); } .ContentRegularPage #pageview #text1 ul { padding-inline: var(--site-gap); } } /* Prev / Next Buttons */ /*----------------------/* PAGINATION /*----------------------*/ #SiteGridContainer .pagination li a#NextLink, #SiteGridContainer .pagination li a#PrevLink, #CatalogModule .CatalogNav #NextPage, #CatalogModule .CatalogNav #PrevPage { } #SiteGridContainer .pagination li > a#PrevLink { } #SiteGridContainer .pagination li a span { } #SiteGridContainer .pagination { } #SiteGridContainer .pagination li a, #CatalogModule .CatalogNav .navigationItems a { } #SiteGridContainer .pagination li.active a, #CatalogModule .CatalogNav .navigationItems a.active { } #SiteGridContainer .pagination > li > a:not(#NextLink, #PrevLink):hover, #CatalogModule .CatalogNav .navigationItems a:not(#NextLink, #PrevLink):hover { } #CatalogModule .CatalogNav { } #CatalogModule .CatalogNav #NextPage, #CatalogModule .CatalogNav #PrevPage { } #CatalogModule .CatalogNav span#NextPage a span, #CatalogModule .CatalogNav span#PrevPage a span { } @media(max-width:1024px) { #SiteGridContainer .pagination li a#NextLink, #SiteGridContainer .pagination li a#PrevLink, #CatalogModule .CatalogNav #NextPage, #CatalogModule .CatalogNav #PrevPage { } #SiteGridContainer .pagination { } #CatalogModule .CatalogNav { } } /*----------------------/* SEARCH RESULTS /*----------------------*/ #SearchResultPage { } #SearchResultPage .container-fluid { } #SearchResultPage #text1 { } .about-page #SearchResultPage #headline { } #SearchResultPage .itemsList .catalogItemBox { } #SearchResultPage .itemsList { } .resultItem { } .resultItems .resultItem > a { } .resultItems .resultItem .resultContent { } .resultItems .resultItem .resultContent .resultCategory { } .resultItems, .resultItemsHasImgs { } .search-arrow { } .resultItems .resultItem { } #SearchResultPage #text1 ul .resultItemsHasImgs li.resultItem { } .resultItemsHasImgs li.resultItem .search-arrow { } .resultItemsHasImgs .resultItem a img { } .searchResultsList { } .resultItemsHasImgs .resultItem .resultCategory { } .searchResultsList .resultItem.hasImg .resultContent { } .searchResultsList .resultItem.hasImg .resultContent a { } @media(max-width:1024px) { .about-page #SearchResultPage #headline { } #SearchResultPage .itemsList { } .resultItems .resultItem > a { } .resultItems .resultItem .resultContent { } .resultItems, .resultItemsHasImgs { } .search-arrow { } #SearchResultPage #text1 .resultItems .resultItem { } #SearchResultPage #text1 ul .resultItemsHasImgs li.resultItem { } .resultItemsHasImgs li.resultItem .search-arrow { } .resultItemsHasImgs .resultItem a img { } .searchResultsList { } .searchResultsList .resultItem.hasImg .resultContent { } .searchResultsList .resultItem.hasImg .resultContent a { } } .sticky-boxes.grid-content-section { display: flex; align-items: flex-start; } .sticky-boxes .section-title { align-items: flex-start; } .sticky-boxes .grid-boxes { flex-direction: column; width: 50.4%; padding: var(--gap-16); padding-inline-start: 0; gap: var(--gap-16); } .sticky-boxes .sticky-boxes-text { position: sticky; top: var(--header-height); padding-top: var(--gap-160); padding-bottom: var(--gap-100); padding-inline: 12.15%; width: 49.6%; display: flex; flex-direction: column; gap: var(--gap-24); align-items: flex-start; text-align: start; } .sticky-boxes .grid-box { width: 100%; } .sticky-boxes .grid-boxes .grid-box-image { padding: 0; aspect-ratio: 1/0.678; border-radius: var(--desktop-corner-radius---big); display: flex; align-items: flex-end; padding: var(--gap-16); } .sticky-boxes .grid-boxes .grid-box-image .grid-box-image-container { position: absolute; inset: 0; } .sticky-boxes .grid-boxes .grid-box-image .grid-box-content { position: relative; border-radius: var(--desktop-corner-radius---big); background: var(--white); padding: var(--gap-24); padding-inline-end: var(--gap-200); text-align: start; display: flex; flex-direction: column; gap: var(--gap-8); } :is(body, #LobbyModule) .sliding-cards .section-title { text-align: center; width: 50%; margin-inline: auto; display: flex; flex-direction: column; gap: var(--gap-24); padding-top: var(--gap-140); } :is(body, #LobbyModule) .big-photo-section + .pin-spacer .sliding-cards .section-title { padding-top: 0; } :is(body, #LobbyModule) .sliding-cards .section-topText { max-width: 33.6%; margin: var(--gap-24) auto; } :is(body, #LobbyModule) .sliding-cards .grid-boxes { max-width: 68.471%; gap: var(--gap-28); gap: 0; margin-inline: auto; padding-inline: var(--gap-146); justify-content: center; } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box { background-color: transparent; border-radius: var(--desktop-corner-radius---big, 10px); padding-block: var(--gap-56); } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box:nth-child(1) { z-index: 3 } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box:nth-child(2) { z-index: 2 } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box:nth-child(1) .new-wrapper-inner { transform: rotate(4deg); } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box:nth-child(2) .new-wrapper-inner { transform: rotate(-6deg); margin-top: var(--gap-24); } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box:nth-child(3) .new-wrapper-inner { transform: rotate(8deg); } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box .grid-box-image img { height: var(--gap-32); } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box .grid-box-image { margin-bottom: var(--gap-42); } :is(body, #LobbyModule) .sliding-cards .visible-xs-block { display: block !important; height: var(--gap-60); } :is(body, #LobbyModule) .sliding-cards .sec-button { background: var(--white); color: var(--black); } :is(body, #LobbyModule) .sliding-card .section-title h2 { } :is(body, #LobbyModule) .sliding-cards .section-title h3 { } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box .new-wrapper-inner { aspect-ratio: 1; display: flex; align-items: center; justify-content: center; flex-direction: column; border-radius: var(--desktop-corner-radius---big); padding-inline: var(--gap-40); gap: var(--gap-8); } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box .new-wrapper-inner .grid-box-title { } :is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box .new-wrapper-inner .grid-box-subtitle { position: absolute; bottom: var(--gap-40); } .home-page .pin-spacer:has(.sliding-cards) { background-color: var(--green); } .home-page .sliding-cards .section-title { padding-bottom: var(--gap-80); } .home-page:is(body, #LobbyModule) .sliding-cards .grid-boxes .grid-box { background-color: var(--white); } .home-page:is(body, #LobbyModule) .sliding-cards .grid-boxes { gap: var(--gap-28); } .home-page:is(body, #LobbyModule) .sliding-cards .grid-boxes { max-width: 73.071%; } .sections .activities-section { padding-top: var(--gap-140); background: var(--beig); } .activities-section .section-title { padding-bottom: var(--gap-88); padding-inline: var(--site-gap); } .activities-section .grid-box { transition: var(--general-transition); height: var(--gap-560); overflow: hidden; } .activities-section .grid-box .grid-box-image, .activities-section .grid-box-image-container { height: 100%; } .activities-section .grid-box .extraArrow { width: var(--gap-44); height: var(--gap-44); background-color: var(--black); } .activities-section .grid-box .extraArrow svg path { stroke: var(--white); } .activities-section .grid-box.hover .extraArrow { background-color: var(--yellow); } .activities-section .grid-box.hover .extraArrow svg path { stroke: var(--black); } .activities-section .grid-box.hover { width: 50%; } .activities-section a.box-image-animation:after { background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.60) 100%); content: ""; display: block; position: absolute; inset: 50% 0 0 0; z-index: 1; } .activities-section a.box-image-animation { position: relative; } .activities-section a.box-image-animation img { position: relative; z-index: 0; height: 100%; object-fit: cover; } .activities-section a.box-image-animation .grid-box-title { position: absolute; z-index: 2; color: var(--white); bottom: var(--gap-12); width: 100%; left: 0; display: flex; justify-content: space-between; padding-inline-start: var(--gap-24); padding-inline-end: var(--gap-12); } .sections .sliding-section { display: flex; flex-direction: column; gap: var(--gap-48); padding-block: var(--gap-100) var(--gap-64); overflow: hidden; background-color: var(--white); } .slide-wrapper { display: flex; width: 100%; gap: var(--gap-16); flex-direction: row; } :is(body, #LobbyModule) .slide-wrapper .grid-boxes { gap: var(--gap-16); display: flex; width: max-content; animation: scrollText 40s linear infinite; max-width: unset; } .slide-wrapper .grid-boxes .grid-box { backdrop-filter: blur(40px); min-width: var(--gap-280); height: var(--gap-180); pointer-events: none; } /*--------/* FOOTER /*--------*/ #SiteFooter .footerFormContainer { background: transparent; } #SiteFooter { background: var(--black); color: var(--white); padding: var(--gap-96) var(--site-gap) 0; margin-top: var(--gap-140); } body:has(#GridBottom .GridBottomGallery) #SiteFooter, .home-page #SiteFooter { margin-top: 0; } #SiteFooter .footer-text-divided { display: flex; flex-wrap: wrap; row-gap: var(--gap-96); justify-content: space-between; } #SiteFooter .footer-text-divided .FooterForm { order: 0; width: 20.48%; padding: 0; } #SiteFooter .footer-text-right { } #SiteFooter .footer-text-left { display: flex; padding: 0; width: 100%; flex-direction: row; } #SiteFooter .footer-text-left-wrapper { display: flex; order: 1; padding: 0; width: 73.6%; } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectTitleAndText { width: 100%; flex-basis: 100%; text-align: start; padding: 0; margin-bottom: var(--gap-24); } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectField.input-email { width: 77.1%; order: 0; } #SiteFooter .FooterForm.form-container-wide .normal-form input { color: #fff; border-bottom: 1px solid var(--white); padding-inline: var(--gap-10); } #SiteFooter .FooterForm.form-container-wide .normal-form input::placeholder { color: var(--white, #FFF); } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectFields fieldset { display: flex; flex-wrap: wrap; justify-content: space-between; column-gap: var(--gap-16); } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectField.checkboxField { width: 100%; order: 2; flex-basis: 100%; text-align: start; display: flex; align-items: flex-start; gap: var(--gap-8); margin-top: var(--gap-16); } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectFields { width: 100%; padding: 0; } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectSubmit .rolling-button { background: var(--yellow); } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectSubmit button { background: transparent; border: none; padding: 0; } #SiteFooter .dropdown-item { flex: 1; display: flex; flex-direction: column; gap: var(--gap-16); } #SiteFooter .footer-text-middle { order: 2; flex-basis: 100%; width: 100%; display: flex; justify-content: space-between; border-top: 1px solid rgb(243 243 240 / 24%); padding: var(--gap-40) 0; } #SiteFooter .footer-text-middle .footer-social a { font-size: 0; } #SiteFooter .footer-text-middle ul { list-style: none; display: flex; gap: var(--gap-24); } #SiteFooter .footer-text-middle ul li { display: flex; align-items: center; gap: var(--gap-8); color: inherit; } #SiteFooter .footer-text-left ul { list-style: none; display: flex; flex-direction: column; gap: var(--gap-4); } #SiteFooter .footer-text-left .dropdown-item h3 { color: inherit; } #SiteFooter .dropdown-item ul li:hover { } #SiteFooter .site-credit { } #SiteFooter .site-credit.alternative.row { } #SiteFooter .site-credit.alternative .text-center { } #SiteFooter .footer-address.text-center { display: none; } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject { padding: 0; width: 100%; max-width: 100%; display: flex; flex-wrap: wrap; } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject h3.dynamicFormObjectTitle { color: inherit; } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .checkboxField label { margin: 0; color: inherit; } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectSubmit { width: auto; } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .checkboxField label { } #SiteFooter .form-container-wide #DynamicFormObject .dynamicFormObjectFields:after { display: none; } #SiteFooter .FooterForm.form-container-wide #DynamicFormObject .dynamicFormObjectField.input-email span.error { left: 0; font-size: var(--fs-14); top: auto; } #SiteFooter .FooterForm.form-container-wide .normal-form .checkboxField input { margin-top: var(--gap-4); } #SiteFooter .footer-text-middle .footer-social { display: flex; align-items: center; gap: var(--gap-20); } #SiteFooter .footer-text-middle .footer-social img, #SiteFooter .footer-text-middle .footer-social svg { height: var(--gap-20); } @media(min-width:1025px) { } @media(max-width: 1024px) { #SiteFooter { } #SiteFooter .footer-text-divided { } #SiteFooter .footer-text-divided { } #SiteFooter .footer-text-right { } #SiteFooter .footer-text-left { } #SiteFooter .footer-text-middle { } #SiteFooter .footer-text-middle ul { } #SiteFooter .footer-text-middle ul:first-of-type li:not(:last-child)::after { } #SiteFooter .footer-text-middle ul:nth-of-type(2) { } #SiteFooter .footer-text-right ul { } #SiteFooter .footer-text-right .dropdown-item h4 { } #SiteFooter .dropdown-item ul li:hover { } #SiteFooter .site-credit { } #SiteFooter .site-credit.alternative.row { } #SiteFooter .site-credit.alternative .text-center { } footer { } } @keyframes scrollText { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } } /*------------------------------------------/* LOADER /*------------------------------------------*/ body.loaded .loader { position: fixed; width: 100vw; height: 100vh; z-index: 100; transition: 0.1s ease all; transition-delay: 1.3s; } body.loaded .loader > div { position: absolute; width: 100%; height: 100%; transition: 0.6s ease all; } body.loaded .loader > .strip-1 { background: var(--red); transition-delay: 0.4s; transition-duration: 1s; } body.loaded .loader > .strip-2 { background: var(--green); transition-delay: 0.3s; } body.loaded .loader > .strip-3 { background: var(--blue); transition-delay: 0.2s; } body.loaded .loader > .strip-4 { background: var(--yellow); transition-delay: 0.1s; } body.loaded .loader > .white-bg { background: var(--beig); } body.loaded .loader .logo { width: 276px; height: 187px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(1.3); background-image: url("https://media.getmood.io/warehouse/dynamic/740265.svg"); background-position: center; background-repeat: no-repeat; background-size: contain; opacity: 0; transition: 0.3s ease all; } body.loaded .loader .logo.shown { opacity: 1; transform: translate(-50%, -50%) scale(1); } body.loaded .loader.shown .logo.shown { opacity: 0; } body.loaded .loader.shown { transform: translateY(-100%); } body.loaded .loader.shown > div:not(.logo) { transform: translateY(-100%); } @media(max-width: 1024px) { body.loaded .loader { bottom: 0; } body.loaded .loader .logo { width: 275px; } #home-gallery .opacity-layer { display: block !important; } } .about-page #PageBreadCrumps { margin-bottom: 0; } .about-top-section { display: flex; height: 40.1vw; align-items: center; justify-content: center; } .about-top-section .about-section-image-1 { width: 19.5vw; position: absolute; inset-inline-start: 2vw; bottom: var(--gap-120); } .about-top-section .about-section-image-2 { order: 1; width: 12.45vw; position: absolute; inset-inline-end: 6vw; top: 0; } .about-top-section .about-section-image-1 img, .about-top-section .about-section-image-2 img { width: 100%; border: var(--gap-10) solid var(--blue); border-radius: var(--desktop-corner-radius---big); } .about-top-section .about-section-image-2 img { border-color: var(--yellow); } .about-top-section .titleAndText { max-width: 49.1vw; display: flex; flex-direction: column; align-items: center; margin-top: calc(var(--gap-70) *(-1)); } .about-top-section h2 { margin-top: var(--gap-32); } .about-top-section .text1 { max-width: 61.8%; margin-top: var(--gap-8); } .grid-multi-rows-section { background: var(--green); } .grid-multi-rows-section .grid-rows { display: flex; flex-direction: row-reverse; } .grid-multi-rows-section .grid-row-cell-text { padding-inline: var(--site-gap); display: flex !important; align-items: center; width: 100%; height: var(--app-height); } .grid-multi-rows-section .grid-row-text { width: 100%; display: flex; flex-direction: column; gap: var(--gap-24); } .grid-multi-rows-section .flexslider-box { height: var(--app-height); width: 100%; position: sticky; top: 0; padding-top: var(--gap-106); padding-inline-end: var(--gap-16); overflow: hidden; } .grid-multi-rows-section .flexslider-box .slides { border-radius: var(--desktop-corner-radius---big); overflow: hidden; } .grid-multi-rows-section .grid-row-cell-texts, .grid-multi-rows-section .flexslider-boxes { display: flex; flex-direction: column; width: 50%; } .grid-multi-rows-section .grid-rows .grid-row-text p { color: var(--black); } .gallery-cubes { padding: var(--gap-16); display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap-16); } .gallery-cubes > div { width: 100%; border-radius: var(--desktop-corner-radius---big); Modes; overflow: hidden; } .gallery-cubes .plus-sign { background-image: url(https://media.getmood.io/warehouse/dynamic/740593.svg); width: var(--gap-24); height: var(--gap-24); font-size: 0; } .gallery-cubes .image-link-inner { background-color: var(--yellow); width: var(--gap-50); height: var(--gap-50); translate: 0px var(--gap-24); transition: var(--general-transition); } .gallery-cubes .boxes-images-outer-image:hover .image-link-container, .gallery-cubes .boxes-images-outer-image:focus .image-link-container { background: rgba(0, 0, 0, 0.26); } .gallery-cubes .boxes-images-outer-image:hover .image-link-inner, .gallery-cubes .boxes-images-outer-image:focus .image-link-inner { translate: 0px 0; } .team-page #allSectionsWrapper { padding-inline: var(--site-gap); margin-top: var(--gap-140); } .team-page .grid-text-section { display: flex; flex-direction: row-reverse; gap: var(--gap-16); } .team-page .grid-text.gridTextWithImg { border-radius: var(--desktop-corner-radius---big, 10px); overflow: hidden; } .team-page .grid-text-full-text { width: 74.9%; border-radius: var(--desktop-corner-radius---big); background: var(--white); box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.02), 0 4px 68px 0 rgba(0, 0, 0, 0.04); padding-inline: var(--gap-120); text-align: start; display: flex; flex-direction: column; justify-content: center; } .team-page .grid-text-section .section-title h2 { } .team-page .grid-text-section .grid-text-content h2 { margin-top: var(--gap-8); } .team-page .grid-text-section .grid-text-content p { margin-top: var(--gap-45); } .team-page .grid-text-full-text:before { content: ""; background-image: url(https://media.getmood.io/warehouse/dynamic/737116.svg); width: 135px; height: 36px; position: absolute; top: var(--gap-40); inset-inline-end: var(--gap-40); } .team-page #LobbyModule .grid-boxes { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap-56) var(--gap-16); margin-top: var(--gap-56); } .team-page .grid-boxes .grid-box { width: 100%; } .team-page .grid-boxes .grid-box .grid-box-image { border-radius: var(--desktop-corner-radius---big, 10px); box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.02), 0 4px 68px 0 rgba(0, 0, 0, 0.04); } .team-page .grid-boxes .grid-box-title { width: 100%; padding: var(--gap-20) var(--gap-20) 0 var(--gap-20); } .team-page .grid-boxes .grid-box-title h3 a { } .team-page .grid-boxes .grid-box-subtitle { width: 100%; padding-inline: var(--gap-20); margin-top: var( --gap-4); } .team-page .grid-boxes .grid-box-image-container:after { content: ""; position: absolute; width: var(--gap-48); aspect-ratio: 1; background-color: var(--white); z-index: 5; bottom: var(--gap-16); inset-inline-start: var(--gap-16); background-image: url(https://media.getmood.io/warehouse/dynamic/737412.svg); background-size: auto; background-position: center; background-repeat: no-repeat; border-radius: 50%; box-shadow: 0 4px 68px rgba(0, 0, 0, 0.04), 0 4px 68px rgba(0, 0, 0, 0.04); pointer-events: none; transition: var(--general-transition); } .team-page .grid-boxes .grid-box.hover .grid-box-image-container:after { background-color: var(--yellow); transform: rotate(22deg); } .team-page .grid-boxes .grid-box-image-container a { height: 100%; display: block; width: 100%; } #multi-content-modal { padding-inline: 0 !important; } #multi-content-modal.textInPop .modal-content { max-width: none; margin: 0; padding: var(--gap-64); /* padding-bottom: 0; */ overflow-y: auto; height: 100%; border-radius: var(--desktop-corner-radius---big, 10px); border-bottom-right-radius: 0; border-bottom-left-radius: 0; inset-inline-start: var(--gap-16); } #multi-content-modal.modal .modal-dialog { width: 100%; display: flex; margin: 0; max-width: 22.5%; padding-top: var(--gap-16); height: var(--app-height); transform: translateX(100%); } #multi-content-modal.modal.in .modal-dialog { transform: translateX(0%); } #multi-content-modal.textInPop #PopUpData { max-height: none; padding: 0; overflow: unset; width: 100%; } #multi-content-modal.textInPop #PopUpData img { max-width: 100%; border-radius: var(--desktop-corner-radius---small, 6px); } #multi-content-modal.textInPop #PopUpData h3 { margin-top: var(--gap-24); } #multi-content-modal.textInPop #PopUpData h4 { margin-top: var(--gap-8); } #multi-content-modal.textInPop #PopUpData h4 + p, #multi-content-modal.textInPop #PopUpData h3 + p, #multi-content-modal.textInPop #PopUpData img + p { margin-top: var(--gap-40); } #multi-content-modal.modal .close { top: var(--gap-14); inset-inline-start: var(--gap-14); background-image: url( https://media.getmood.io/warehouse/dynamic/737413.svg); width: var( --gap-28); aspect-ratio: 1; } #multi-content-modal.modal .close svg { display: none; } :is(body, #LobbyModule) .advantage-section { margin-bottom: var(--gap-140); } :is(body, #LobbyModule) .advantage-section .grid-boxes { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap-24) var(--gap-16); margin-top: var(--gap-72); max-width: 28.555%; margin-inline: auto; } :is(body, #LobbyModule) .advantage-section .grid-boxes .grid-box { width: 100%; display: flex; flex-direction: column; align-items: center; gap: var(--gap-8); } :is(body, #LobbyModule) .advantage-section .grid-boxes .grid-box .grid-box-image { border-radius: 50%; border: 1px solid; padding: 2px; box-sizing: border-box; max-width: var(--gap-100); } :is(body, #LobbyModule) .advantage-section .grid-boxes .grid-box .grid-box-image .grid-box-image-container { border-radius: 50%; border: 1px solid; overflow: hidden; border: none; } :is(body, #LobbyModule) .big-photo-section { padding-inline: var(--site-gap); margin-top: var(--gap-140); height: auto; margin-bottom: var(--gap-140); } :is(body, #LobbyModule) .big-photo-section .image-section-data .image-section-Btn a { color: var(--black); display: inline-flex; height: var(--gap-50); } :is(body, #LobbyModule) .big-photo-section .image-section-data .image-section-Btn a:hover, :is(body, #LobbyModule) .big-photo-section .image-section-data .image-section-Btn a:focus { background: var(--white); } :is(body, #LobbyModule) .big-photo-section-second { margin-bottom: var(--gap-140); } :is(body, #LobbyModule) .big-photo-section .section-title { margin-bottom: var(--gap-48); } :is(body, #LobbyModule) .big-photo-section .image-section-data { height: auto; border-radius: var(--desktop-corner-radius---big, 10px); position: relative; } :is(body, #LobbyModule) .big-photo-section .image-section-data img { margin: 0 !important; } :is(body, #LobbyModule) .big-photo-section .image-section-data .image-section-Btn { top: calc(50% + var(--gap-50)); opacity: 0; transition: var(--general-transition); } :is(body, #LobbyModule) .big-photo-section:hover .image-section-data .image-section-Btn { opacity: 1; top: 50%; font-size: 100%; } .children-education-page .colored-grid-text { margin-top: var(--gap-16) } :is(body, #LobbyModule) .colored-grid-text { background-color: var(--blue); padding-block: var(--gap-160); color: var(--black); } :is(body, #LobbyModule) .colored-grid-text p { max-width: 33.6%; margin: var(--gap-24) auto; } :is(body, #LobbyModule) .colored-grid-text .grid-text-content { display: flex; flex-direction: column; align-items: center; } :is(body, #LobbyModule) .colored-grid-text .grid-text h2 { order: 0; } :is(body, #LobbyModule) .colored-grid-text .section-title { flex-direction: column; } :is(body, #LobbyModule) .colored-grid-text .section-title h3 { } :is(body, #LobbyModule) .colored-grid-text .rolling-button { background: var(--white); color: inherit; } :is(body, #LobbyModule) .educational-spaces-section { } :is(body, #LobbyModule) .educational-spaces-section .grid-boxes { padding-inline: var(--site-gap); } :is(body, #LobbyModule) .educational-spaces-section .grid-boxes { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--gap-16); } :is(body, #LobbyModule) .educational-spaces-section .grid-box { display: flex; width: 50%; background: var(--white); border-radius: var(--desktop-corner-radius---big); overflow: hidden; } :is(body, #LobbyModule) .educational-spaces-section .grid-box { width: 100%; } :is(body, #LobbyModule) .educational-spaces-section .grid-box .grid-box-image { width: 50%; padding: var(--gap-8); } :is(body, #LobbyModule) .educational-spaces-section .grid-box .grid-box-content { width: 50%; display: flex; flex-direction: column; text-align: start; padding: var(--gap-40); } :is(body, #LobbyModule) .educational-spaces-section .grid-box .grid-box-subtitle { margin-top: auto; } :is(body, #LobbyModule) .educational-spaces-section .grid-box .button-content-wrapper { border-bottom: 2px solid var(--orange, #FF8B16); } :is(body, #LobbyModule) .educational-spaces-section .grid-box .grid-box-fulltext { margin-top: var(--gap-16); } :is(body, #LobbyModule) .educational-spaces-section .grid-box .grid-box-image-container { border-radius: var(--desktop-corner-radius---small); overflow: hidden; } :is(body, #LobbyModule) .educational-spaces-section .grid-box .rolling-button { display: flex; } .section-title:has(.swiper-buttons) { display: flex; padding-inline: var(--site-gap); justify-content: space-between; margin-bottom: var(--gap-40); align-items: flex-end; } .section-title .swiper-buttons { display: flex; gap: var(--gap-8); flex-direction: row-reverse; } .section-title .swiper-buttons .swiper-button { position: unset; margin: 0; width: var(--gap-50); height: var(--gap-50); aspect-ratio: 1; border-radius: 50%; border: 1px solid var(--stroke, #D9DADB); background: var(--white, #FFF); } .children-education-page:is(body, #LobbyModule) .educational-spaces-section { padding-top: var(--gap-140); } .children-education-page:is(body, #LobbyModule) .educational-spaces-section .grid-boxes { display: block; } .children-education-page:is(body, #LobbyModule) .educational-spaces-section .grid-box { width: 44.5%; } :is(body, #LobbyModule) #allSectionsWrapper section:has(.swiper-wrapper) .grid-boxes { padding-inline: var(--site-gap); } .grid-single-row-section .grid-row { background-color: var(--white); } .grid-single-row-section { background-color: var(--white); padding: var(--gap-140) var(--site-gap); } .grid-single-row-section .grid-rows .grid-row-cell { border-radius: var(--desktop-corner-radius---big); overflow: hidden; } .grid-single-row-section .grid-rows .grid-row-text { width: 86%; padding-inline-start: var(--site-gap); display: flex; flex-direction: column; gap: var(--gap-24); } .testimonials-section .grid-box { width: 28.6%; } :is(body, #LobbyModule) .testimonials-section { padding-block: var(--gap-140) } :is(body,#LobbyModule) .testimonials-section .grid-box { border-radius: var(--desktop-corner-radius---big, 10px); background: var(--white, #FFF); box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.02), 0 4px 68px 0 rgba(0, 0, 0, 0.04); padding: var(--gap-48); text-align: start; width: 35%; aspect-ratio: 1 / 0.646; display: flex; flex-direction: column; } :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-subtitle:not(.button) { margin-top: var(--gap-8); } :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-fulltext { margin-top: var(--gap-40); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; align-self: stretch; overflow: hidden; } :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-subtitle .rolling-button:after { content: ""; display: block; width: var(--gap-48); aspect-ratio: 1; background-image: url(https://media.getmood.io/warehouse/dynamic/737398.svg); background-position: center; background-repeat: no-repeat; border: 1px solid var(--stroke); border-radius: 50%; transition: var(--general-transition); } :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-subtitle .rolling-button:hover:after, :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-subtitle .rolling-button:focus:after { background-color: var(--blue); background-image: url(https://media.getmood.io/warehouse/dynamic/737399.svg); } :is(body,#LobbyModule) .testimonials-section .grid-boxes .rolling-button { color: inherit; } :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-subtitle .rolling-button { display: flex; align-items: center; gap: var(--gap-10); } :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-subtitle.button { margin-top: auto; display: flex; flex-direction: row-reverse; } :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-subtitle .rolling-button:hover .button-first-text { transform: translateY(0%); } :is(body,#LobbyModule) .testimonials-section .grid-boxes .grid-box-subtitle .rolling-button:hover .button-hover-text { transform: translateY(-0%); } .grid-faq-section { display: flex; padding-block: var(--gap-120) var(--gap-140); padding-inline: var(--site-gap); align-items: flex-start; justify-content: space-between; } .grid-faq-section .section-title h3 { } .grid-faq-section .grid-faq { max-width: 100%; margin: 0; width: 50.5%; margin-top: var(--gap-20); } .grid-faq-section { } .grid-faq-section .section-title { display: flex; align-items: flex-start; padding-block: var(--gap-140); margin: 0; } .panel-group { display: flex; flex-direction: column; gap: var(--gap-10); } .panel-group .panel.faq-item { margin-bottom: 0 !important; margin-top: 0; background: transparent; border: none; padding-inline-start: var(--gap-24); padding-inline-end: var(--gap-32); padding-bottom: var(--gap-10); border-radius: var(--desktop-corner-radius---big, 10px); box-shadow: none; position: relative; transition: var(--general-transition); } .panel-group .panel.faq-item:after { content: ""; display: block; height: 1px; background: var(--stroke); position: absolute; right: var(--gap-24); left: var(--gap-32); bottom: 0; transition: var(--general-transition); } .panel-group .panel.faq-item:has(.open) { background-color: var(--white); padding-bottom: var(--gap-28); margin-bottom: var(--gap-5) !important; } .panel-group .panel.faq-item:has(.open):after { bottom: calc(var(--gap-10) * (-1)); } .faq-headline .button-open:before { background-image: url(https://media.getmood.io/warehouse/dynamic/737400.svg); background-position: center; background-repeat: no-repeat; width: 100%; display: block; height: 100%; content: ""; transition: var(--general-transition); } .faq-headline.open .button-open:before { transform: rotate(135deg); } .faq-headline, .faq-headline.open { height: var(--gap-100); display: flex; align-items: center; background: transparent; } .faq-body .faq-body-inner { } .faq-headline .button-open { left: 0; width: var(--gap-32); aspect-ratio: 1; } .faq-headline::after { } .faq-headline.open::after { } .faq-body { background: transparent; } @media(max-width:1024px) { .panel-group { } .panel-group .panel.faq-item { } .faq-headline, .faq-headline.open { } .faq-body .faq-body-inner { } .faq-headline .button-open { } .faq-headline::after { } .faq-headline.open::after { } .faq-body { } } :is(body, #LobbyModule) .general-text-section { padding-block: var(--gap-140); display: flex; flex-direction: column; align-items: center; gap: var(--gap-24); } :is(body, #LobbyModule) .sec-button { margin-top: var(--gap-24) } :is(body, #LobbyModule) .general-text-section > * { max-width: 33.6%; } /*--------/* PAGE 404 /*--------*/ .page-404 #GridPage #GridWrap #GridWrapInner { display: flex; align-items: center; min-height: calc(var(--app-height) - var(--header-height) - var(--header-height)); } .page-404 #GridPage #GridContent { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; } .page-404 #GridPage #GridContent #subheadline h2 { margin: var(--gap-32) 0; color: var(--dark-grey); } .page-404 #PageBreadCrumps { display: none; } .page-404 #GridPage #GridContent #text1:hover { background-color: var(--blue-hover); } .page-404 #GridPage #GridContent #text1 p { color: var(--white); } @media(max-width:1024px) { .page-404 #GridPage #GridWrap #GridWrapInner { justify-content: center; } .page-404 #GridPage #GridContent #subheadline h2 { margin-block: var(--gap-10); } } /*----------------------/* FORMS THANKS PAGE /*----------------------*/ .FormResultPage #GridPage #GridWrap #GridWrapInner { display: flex; align-items: center; min-height: calc(var(--app-height) - var(--header-height) - var(--header-height)); } .FormResultPage #GridPage #GridContent { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; } .FormResultPage #GridPage #GridContent #text1 a { display: inline-flex !important; margin-top: 0 !important; } .FormResultPage #GridPage #GridContent #text1 a:hover { background-color: var(--blue-hover); } .FormResultPage #GridPage #GridContent #text1 p { margin: var(--gap-32) 0 var(--gap-32) 0; color: var(--dark-grey); } @media(max-width:1024px) { .FormResultPage #GridPage #GridWrap #GridWrapInner { justify-content: center; } .FormResultPage #GridPage #GridContent #text1 p { margin-block: var(--gap-10); } } /*#canvas { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 1; pointer-events: none; } .col.col-lg-9 { flex: 75%; max-width: 75%; } .work-content__wrap.is--work__page { width: 100%; min-height: 100vh; padding-top: 5em; display: none; } .full-w { width: 100%; } .three-col { grid-column-gap: .5rem; grid-row-gap: .5rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr; grid-auto-columns: 1fr; width: 100%; display: grid; } .work-grid__item { width: 100%; height: 100%; } .w-inline-block { max-width: 100%; display: inline-block; } .project-item { filter: saturate(); width: 100%; transition: filter .4s cubic-bezier(.42, 0, .04, 1); position: relative; overflow: hidden; } .project-item.is--square { width: 100%; height: 26em; overflow: visible; } .project-item { filter: saturate(); width: 100%; transition: filter .4s cubic-bezier(.42, 0, .04, 1); position: relative; overflow: hidden; } .project-item.is--square { width: 100%; height: 26em; overflow: visible; } .cover-img { object-fit: cover; width: 100%; max-width: none; height: 100%; } .project-item__info { z-index: 2; flex-direction: column; justify-content: center; align-items: flex-start; width: 100%; height: 3rem; padding-top: .25rem; display: flex; position: absolute; inset: auto 0% 0%; } .item-info__clip { height: 1.5rem; padding-right: .25em; overflow: hidden; } .p-med { font-family: Tartuffo, sans-serif; font-size: 1.25rem; font-weight: 300; line-height: 1; } .project-item .p-med { transform: translate3d(0px, 250%, 0px); transition: transform 0.6s cubic-bezier(0.42, 0, 0.04, 1); transition-delay: 0ms; } .u--clip { overflow: hidden; } .eyebrow { letter-spacing: 0; text-transform: uppercase; font-size: .6875rem; font-weight: 400; line-height: 1.1; } .o--70 { opacity: .7; } .eyebrow.is--caps { letter-spacing: .01em; text-transform: uppercase; } .project-item .eyebrow { transform: translate3d(0px, 125%, 0px); transition: transform 0.6s cubic-bezier(0.42, 0, 0.04, 1); transition-delay: 0ms; } .item-info__bg { z-index: -1; background-color: var(--white); transform-origin: 50% 100%; transform-style: preserve-3d; width: 100%; height: 100%; transition: transform .6s cubic-bezier(.42, 0, .04, 1); position: absolute; inset: auto 0% 0%; transform: scaleY(0); } .thumb-wrap__icons { pointer-events: none; justify-content: space-between; align-items: center; width: 5.25rem; display: flex; position: fixed; top: 45vh; right: .4rem; transform: translateY(1.8rem); } .thumb-wrap__plus { justify-content: center; align-items: center; width: .5rem; height: .5rem; display: flex; } svg:not(:root) { overflow: hidden; } .work-list__wrap { grid-column-gap: .5rem; grid-row-gap: .5rem; color: var(--white); flex-flow: column; width: 50em; padding-top: 5.5em; } .work-list__wrap.is--work__page { padding-top: 4.5em; } .work-list__wrap.is--work__page.swiper { display: flex; } .work-list { grid-column-gap: .5rem; grid-row-gap: .5rem; flex-flow: column; display: flex; } .swiper-wrapper { transition-timing-function: cubic-bezier(0.47, 0, 0, 1) !important; } .work-list__item { aspect-ratio: 1 / 1.15; background-color: var(--grey); text-align: center; flex-flow: column; justify-content: flex-end; align-items: center; width: 100%; padding-bottom: 1rem; display: flex; position: relative; overflow: hidden; } .w-inline-block { max-width: 100%; display: inline-block; } .work-list__item-link { z-index: 5; text-align: center; justify-content: center; align-items: flex-end; width: 100%; height: 100%; padding-bottom: 0; display: flex; position: absolute; inset: 0%; } .parallax-img { z-index: 0; object-fit: cover; width: 100%; max-width: none; height: 110%; position: absolute; top: 0; } .cover-overlay { z-index: 1; background-color: var(--black); opacity: .5; pointer-events: none; position: absolute; inset: 0%; } .cover-overlay.o--40 { opacity: .4; } .work-list__title { z-index: 2; grid-column-gap: 1rem; grid-row-gap: 1rem; flex-flow: column; flex: none; justify-content: flex-start; align-items: center; width: 100%; max-width: 27em; display: flex; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .u--clip { overflow: hidden; } .eyebrow { letter-spacing: 0; text-transform: uppercase; font-size: .6875rem; font-weight: 400; line-height: 1.1; } .work-list__item-h { letter-spacing: -.02em; font-family: Tartuffo, sans-serif; font-size: 3.5em; font-weight: 300; line-height: 1; } .work-list__item-h .line { overflow-y: clip; padding-bottom: 0.15em; margin-top: -0.15em; } .work-list__item-c { z-index: 3; grid-column-gap: .5rem; grid-row-gap: .5rem; flex-flow: column; justify-content: flex-end; align-items: center; max-width: 42em; display: flex; position: relative; } .artist-list { flex-wrap: wrap; justify-content: center; width: 100%; max-width: 52.8125rem; display: flex; } .artist-item { grid-column-gap: .3125rem; grid-row-gap: .3125rem; flex-direction: row; justify-content: flex-start; align-items: flex-end; padding: .2rem; transition: opacity .2s cubic-bezier(.32, -.01, .67, .99); display: flex; } .w-dyn-hide, .w-dyn-bind-empty, .w-condition-invisible { display: none !important; } .work-list__item .eyebrow.is--caps, .slide .eyebrow.is--caps { font-size: 0.625rem; } .p-large { margin-bottom: 0; font-family: Tartuffo, sans-serif; font-size: 1.5rem; font-weight: 300; line-height: 1; } .work-list__item .p-large, .slide .p-large { font-size: 0.875rem; text-transform: uppercase; } .work-list__item-sub { max-width: 25rem; } .work-list__item-vid { z-index: 3; aspect-ratio: 2; justify-content: center; align-items: center; width: 17.5em; display: flex; position: absolute; bottom: 12em; } .list-vid__wrap { justify-content: center; align-items: center; width: 100%; height: 0%; display: flex; overflow: hidden; } .bg-vid { object-fit: cover; width: 100%; height: 100%; padding-bottom: 0; padding-right: 0; } .u--hide { display: none; }*/ .images-warpper { display: flex; align-items: flex-start; } .big-images { margin-inline: auto; } .big-images-wrapper { display: flex; flex-direction: column; gap: var(--gap-24); } .big-image { border-radius: var(--desktop-corner-radius---big, 10px); overflow: hidden; position: relative; } .big-image img { max-width: 48.8vw; } .big-image-content { position: absolute; z-index: 2; bottom: 0; padding: var(--gap-16); transition: var(--general-transition); opacity: 0; } .big-image.hover .big-image-content { opacity: 1; } .big-image-content-inner { background: var(--white); display: flex; flex-direction: column; gap: var(--gap-16); align-items: flex-start; text-align: start; padding-block: var(--gap-24); padding-inline-start: var(--gap-24); padding-inline-end: var(--gap-200); border-radius: var(--desktop-corner-radius---big, 10px); /* shadow */ box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.02), 0 4px 68px 0 rgba(0, 0, 0, 0.04); } .big-image-content .big-image-name { } .big-image-content .big-image-full-text { } .big-image-content .big-image-description { } .small-images { /* width: 64px; */ position: sticky; inset-inline: var(--gap-16); top: calc(var(--header-height) + var(--gap-16)); display: flex; align-items: stretch; gap: var(--gap-8); display: flex; align-items: stretch; gap: var(--gap-8); /* הוסף את זה כדי שנוכל למקם את הפוינטר יחסית אליו */ position: sticky; } .small-images-wrapper { width: 100%; display: flex; flex-direction: column; gap: var(--gap-12); } .small-image { width: 100%; } .small-image img { width: 100%; transform: scale(0.8); filter: grayscale(100%); transition: filter 0.3s ease; border-radius: 3px; } .big-image.hover:before { opacity: 1; } .big-image:before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0, 0.4); opacity: 0; transition: var(--general-transition); } .images-pointer-wrapper { width: var(--gap-6); top: 0; bottom: 0; height: 100%; } .images-pointer { position: absolute; top: 0; width: var(--gap-6); height: var(--gap-6); background: var(--red); border-radius: 50%; inset-inline-end: 0; transition: top 0.1s linear; transition: none !important; will-change: top; } .small-images { /* חובה להגדיר גובה קבוע שבו הסמן יהיה במרכז */ position: sticky; top: calc( 50% + var(--header-height)); /* ממקם את כל הקונטיינר במרכז המסך */ transform: translateY(-50%); display: flex; align-items: center; /* כדי שהתמונות הקטנות ייעלמו כשהן נגללות */ } .small-images-wrapper { width: 100%; display: flex; flex-direction: column; gap: var(--gap-12); /* חשוב: נקודת ההתחלה צריכה להיות כשהתמונה הראשונה במרכז הסמן */ padding-block: 150px; width: 64px; } .images-pointer-wrapper { /* שומר את הסמן במרכז הדיב */ } .images-pointer { width: var(--gap-6); height: var(--gap-6); background: var(--red); border-radius: 50%; position: relative; /* ביטול ה-top:0 הקודם */ }