/* HOUSE OF DALLAL */ :root { --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-24: 1.25vw; --gap-28: 1.458vw; --gap-30: 1.563vw; --gap-32: 1.667vw; --gap-36: 1.875vw; --gap-40: 2.083vw; --gap-48: 2.5vw; --gap-52: 2.708vw; --gap-56: 2.917vw; --gap-60: 3.125vw; --gap-64: 3.333vw; --gap-72: 3.75vw; --gap-80: 4.17vw; --gap-90: 4.688vw; --gap-96: 5vw; --gap-100: 5.208vw; --gap-120: 6.25vw; --gap-140: 7.292vw; --gap-160: 8.333vw; --gap-180: 9.375vw; --gap-200: 10.417vw; --gap-240: 12.5vw; --fs-12: 0.625vw; --fs-14: 0.729vw; --fs-15: 0.781vw; --fs-16: 0.833vw; --fs-17: 0.885vw; --fs-18: 0.938vw; --fs-20: 1.042vw; --fs-24: 1.25vw; --fs-28: 1.458vw; --fs-32: 1.667vw;; --fs-48: 2.5vw; --fs-60: 3.125vw; --fs-64: 3.333vw; --fs-82: 4.271vw; --fs-90: 4.688vw; --fs-96: 5vw; --black: #1B1A19; --lblack: #3F3B38; --text: #565656; --gray: #B8B8B8; --lgray: #F4F4F4; --white: #fff; --font-1: 'NotoSansHebrew-Regular', Arial; --font-2: 'FbJabutinskiHebEng-ConBold'; --font-3: 'bodoni'; } /*------------------------------------------/* GENERAL /*------------------------------------------*/ html { font-size: 62.5%; overflow-x: clip; } body { 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; } body:has(#SiteContainer.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, h2, .section-title h1, .section-title h2, .section-title .h2, .grid-text h2, .grid-text .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-2); color: var(--black); line-height: 1; } .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(1.2rem, var(--fs-17), 1000rem); position: relative; line-height: 1.1; color: var(--text); letter-spacing: 0.18px; } .section-title, .grid-text-section .section-title { margin: 0; } #SiteContainer { position: relative; } body:not(.home-page) #SiteGrid { overflow-x: clip; } #SiteGridContainer { /* position: sticky; */ /* top: 0; */ } #GridWrapInner { max-width: var(--app-width); display: flex; flex-direction: column; } #allSectionsWrapper { z-index: 1; } .sections .section, section.section { margin-bottom: 0; background: transparent; padding: 0; max-width: var(--app-width); width: 100%; } .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-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: inherit; outline: none !important; } #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; } #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 { object-fit: cover; } #GridPromo { width: 100%; margin: 0; padding: 0; } #CatalogModule { padding: 0; } .itemContentWrapper { margin: 0; } .catalogContainer.container { width: 100%; padding: 0; margin: 0; } .row { margin: 0; } #GridTop.noTopImage, .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; } .grid-iframe-holder iframe { height: auto; aspect-ratio: 1; } .player .vp-video-wrapper object, .player .vp-video-wrapper video { object-fit: cover; } .player.hide-controls-mode { max-width: 100% !important; height: 100% !important; } #home-gallery .scroll-down { display: none; } .owl-carousel .owl-item .item { padding: 0; } body:is(.business, .bakery, .marina) #headline { display: none; } :is(#lobbyview, #pageview) #headline h1 { font-size: clamp(2rem, var(--fs-64), 1000rem); letter-spacing: -0.64px; line-height: 0.8; } .section-animation-item { opacity: 1; margin-top: 0; } .popup-click { cursor: pointer; } main#SiteGrid { margin-top: var(--headerHeight); } .owl-controls { display: block; position: absolute; width: 70px; height: 36px; z-index: 1; bottom: 0; left: 50%; transform: translateX(-50%); } .owl-controls .owl-dots { } .owl-controls .owl-dots .owl-dot.active { background: var(--black); } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .owl-carousel .owl-item .item { pointer-events: none; } #GridTop:has(#top-gallery) { display: block !important; } #top-gallery { z-index:1;} #top-gallery button.controlSlider { display: block; bottom: 20px; } #top-gallery.stop button.controlSlider:after { content: "\f04b"; } @media(min-width: 1024px) { #GridTop, .GridTop { height: 600px; } #GridTop:has(#top-gallery) { height: 600px; } } @media(max-width: 1023px) { :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-48: 48px; --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-24: 24px; --fs-28: 28px; --fs-32: 32px; --fs-36: 36px; --fs-40: 40px; --fs-44: 44px; --fs-48: 48px; --fs-60: 60px; --fs-64: 64px; --fs-90: 90px; } #GridTop, .GridTop { height: 250px; background-size: cover; } #GridTop:has(#top-gallery) { height: 250px; } .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: var(--fs-15); line-height: 1.4; } #whatAppButton { opacity: 0; } } /*------------------------------------------/* PAGES /*------------------------------------------*/ /*-----------------------/* HOME-PAGE /*-----------------------*/ .home-page :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes { gap: var(--gap-20); padding-inline: var( --gap-20); } .home-page :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box { max-width: unset; flex: 1; } .home-page :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box:hover .grid-box-text { height: calc(var(--full-text-height) + 4.833vw); padding: var(--gap-56)var(--gap-120); } .home-page :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box:hover .grid-box-text .grid-box-title h3 { padding-top: 0; } .home-page :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-subtitle.button { padding-bottom: 0; } .home-page .grid-image-section .image-section-data { height: 100%; } .home-page .grid-image-section .image-section-data img.stellar-bg { object-fit: cover; object-position: top; } .home-page #allSectionsWrapper .grid-text-section.big-text .section-title { margin: 0; } .home-page #allSectionsWrapper > :last-child { margin: 0; } .home-page #home-gallery ul.slides li.slider-item img { position: absolute; top: 0; z-index: -1; transition: all 0.3s ease; } .home-page #home-gallery .gallery-caption { display: none; } .home-page #home-gallery .grid-boxes.row { position: absolute; top: 60%; z-index: 9; justify-content: space-between; width: 95%; left: 50%; transform: translate(-50%, -50%); } @media(min-width: 1024px) { .home-page #home-gallery { /* margin-top: 300px; */ } .home-page .grid-image-section .image-section-data img.stellar-bg { height: 680px; } /*.home-page #home-gallery .slides .grid-content-section { z-index: 3; position: absolute;*/ /* top: 70%; */ /*height: 100%; display: flex; } .home-page #home-gallery .slides .grid-content-section .grid-boxes.row { } .home-page #home-gallery .slides .grid-content-section .grid-boxes.row .grid-box { width: 25%; height: 20px; } .home-page #home-gallery .slides .grid-content-section .grid-boxes.row .grid-box .grid-box-image { width: fit-content; position: absolute; width: 100vw; height: 100vh; left: 0; top: 0; } .home-page #home-gallery .slides .grid-content-section .grid-boxes.row .grid-box .grid-box-image .grid-box-image-container { position: static; } .home-page #home-gallery .slides .grid-content-section .grid-boxes.row .grid-box .grid-box-image .grid-box-image-container a { width: 100%; position: static; } .home-page #home-gallery .slides .grid-content-section .grid-boxes.row .grid-box .grid-box-image .grid-box-image-container a img { display: none; } .home-page #home-gallery .slides .grid-content-section .grid-boxes.row .grid-box:hover .grid-box-image .grid-box-image-container a img {*/ /* position: absolute; */ /*width: 100%; height: 100%; top: 50%; left: 50%; display: block; } .home-page #home-gallery .slides .grid-content-section .grid-boxes.row .grid-box .grid-box-title { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }*/ .home-page #home-gallery .grid-boxes.row .grid-box { width: fit-content; opacity: 1; } .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title { } .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title h3, .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title .h3 { font-size: unset; } .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title h3 a, .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title .h3 a{ color: rgba(255, 255, 255, 0.65); font-size: var(--fs-82); font-weight: 700; font-family: var(--font-2); } .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title h3 a:hover { color: var(--white); } } @media(max-width: 1023px) { .home-page #home-gallery .slides { z-index: 1; position: relative; } .home-page #home-gallery:before { content: ""; width: 100%; height: 100%; position: absolute; z-index: 2; background: var(--black); opacity: 0.25; } .home-page #home-gallery .grid-boxes.row { flex-direction: column; gap: var(--gap-32); top: 55%; z-index: 3; } .home-page #home-gallery .grid-boxes.row .grid-box { } .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-image { display: none; } .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title { } .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title h3, .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title .h3 { font-size: unset; margin: 0; } .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title h3 a, .home-page #home-gallery .grid-boxes.row .grid-box .grid-box-title .h3 a { font-family: var(--font-2); font-size: 35px; color: var(--white); } .home-page .grid-image-section .image-section-data img.stellar-bg { height: 522px; object-fit: cover; } .home-page #allSectionsWrapper > :last-child .image-section-data { margin: 0; } } /**/ /*-----------------------/* RESTAURANT /*-----------------------*/ body.restaurant { } body.restaurant #headline { display: none; } /*TEMPURARY*/ body.restaurant .section.grid-image-section { position: absolute; top: -600px; /* display: none; */ } @media(min-width: 1024px) { } @media(max-width: 1023px) { } /**/ /*-----------------------/* VILLA /*-----------------------*/ .villa #headline { display: none; } @media(min-width: 1024px) { } @media(max-width: 1023px) { } /**/ /*-----------------------/* MARINA /*-----------------------*/ .marina #allSectionsWrapper > .grid-image-section { margin-bottom: 0; height: auto; } @media(min-width: 1024px) { } @media(max-width: 1023px) { } /**/ /*------------------------------------------/* SECTIONS /*------------------------------------------*/ #allSectionsWrapper > * { margin-bottom: var(--gap-160); } #allSectionsWrapper > section:first-child { margin-top: var(--gap-120); } @media(min-width: 1024px) { } @media(max-width: 1023px) { #allSectionsWrapper > * { margin-bottom: var(--gap-64); } #allSectionsWrapper > section:first-child { margin-top: 64px; } } /**/ /*-----------------------/* GRID TEXT SECTION /*-----------------------*/ #allSectionsWrapper .grid-text-section { } #allSectionsWrapper .grid-text-section .section-title { } #allSectionsWrapper .grid-text-section .section-title h2, #allSectionsWrapper .grid-text-section .section-title .h2 { font-family: var(--font-3); font-size: var(--fs-20); margin-bottom: var(--gap-20); margin-top:0;} #allSectionsWrapper .grid-text-section .grid-text { } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content { } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content h2, #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .h2 { margin-bottom: var(--gap-32); fo; font-size: clamp(90px,var(--fs-90),300px); margin-top:0px} #allSectionsWrapper .grid-text-section .grid-text .grid-text-content p { font-size: clamp(16px, var(--gap-16),300px); line-height: 1.6; } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .custom-container { display: flex; justify-content: center; gap: var(--gap-12); margin-bottom: var(--gap-40); } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .btns-custom-container { display: flex; justify-content: center; gap: var(--gap-12); } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .btns-custom-container a.tiny-btn { background: var(--black); display: inline-block; color: var(--white); padding: 0.633vw 1.25vw; min-width: 7.292vw; border-radius: 50px; border: 1px solid var(--black); font-size: clamp(14px, var(--gap-16), 300px); } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .btns-custom-container p { width: fit-content; } @media(min-width: 1024px) { #allSectionsWrapper .grid-text-section { width: max(34%, 740px); margin-inline: auto; } } @media(max-width: 1023px) { #allSectionsWrapper .grid-text-section .section-title h2, #allSectionsWrapper .grid-text-section .section-title .h2 { font-size: 18px; } #allSectionsWrapper .grid-text-section .section-title { } #allSectionsWrapper .grid-text-section .grid-text { } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content { padding-inline: var(--gap-16); } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content h2, #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .h2 { font-size: var(--fs-32); } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .custom-container { flex-wrap: wrap; flex-direction: column; } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .custom-container p { font-size: 15px; } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content p { font-size: 16px; line-height: 1.6; } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .custom-container p:nth-child(2) { width: 100%; order: 1; } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .custom-container p { order: 2; } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content > p { margin-bottom: 32px; } } /**/ /*--------/* WITH-BTNS /*--------*/ #allSectionsWrapper .grid-text-section.with-btns { } #allSectionsWrapper .grid-text-section.with-btns .section-title { } #allSectionsWrapper .grid-text-section.with-btns .grid-text { } #allSectionsWrapper .grid-text-section.with-btns .grid-text .grid-text-content { } #allSectionsWrapper .grid-text-section.with-btns .grid-text .grid-text-content h2 { font-size: clamp(90px,var(--gap-90),300px); } @media(min-width: 1024px) { } @media(max-width: 1023px) { #allSectionsWrapper .grid-text-section.with-btns .grid-text .grid-text-content h2 { font-size: 32px; } } /**/ /*--------------------------/* GRID TEXT SECTION BIG-TEXT /*--------------------------*/ #allSectionsWrapper .grid-text-section.big-text { width: 100%; line-height: 1; } #allSectionsWrapper .grid-text-section.big-text .section-title { margin-bottom: var(--gap-80); } #allSectionsWrapper .grid-text-section.big-text .grid-text { } #allSectionsWrapper .grid-text-section.big-text .grid-text .grid-text-content { } @media(min-width: 1024px) { #allSectionsWrapper .grid-text-section.big-text .grid-text .grid-text-content p { width: max(9ch,40%); margin-inline: auto; line-height: 1.3; } #allSectionsWrapper .grid-text-section.big-text .section-title h2, #allSectionsWrapper .grid-text-section.big-text .section-title .h2 { font-size: 7.917vw; margin: 0; } } @media(max-width: 1023px) { #allSectionsWrapper .grid-text-section.big-text .section-title { margin-bottom: var(--gap-32); } #allSectionsWrapper .grid-text-section.big-text .section-title h2, #allSectionsWrapper .grid-text-section.big-text .section-title .h2 { font-size: 45px; padding-inline: var(--gap-16); } #allSectionsWrapper .grid-text-section.big-text .grid-text .grid-text-content p { line-height: 1.6; } } /**/ /*---------------------------/* GRID-GALLERY-SECTION-SLIDE /*---------------------------*/ #allSectionsWrapper .slide-wrapper .controlSlider { display: block; bottom: 0; } #allSectionsWrapper .slide-wrapper button.controlSlider:after { color: #000; } #allSectionsWrapper .slide-wrapper.stop button.controlSlider:after { content: "\f04b"; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) { } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container { width: 100%; overflow: hidden; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .slide-wrapper { display: flex; width: 100%; gap: 20px; position: relative; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes { display: flex; width: max-content; animation: slideRight 100s linear infinite; opacity: 1; gap: var(--gap-20); } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .stop .gallery-cubes { animation-play-state: paused; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes > * { width: max-content; pointer-events: none; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes div .boxes-images-outer-image { padding: 0; height: 533px; width: 27.76vw; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes .boxes-images-outer-image .image-link-container { position: static; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes > :nth-child(3n+1) .boxes-images-outer-image { width: 16.302vw; height: 20.833vw; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes > :nth-child(3n+2) .boxes-images-outer-image { width: 23.438vw; height: 30.208vw; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes > :nth-child(3n+3) .boxes-images-outer-image { width: 31.25vw; height: 39.583vw; } @media(min-width: 1024px) { } @media(max-width: 1023px) { #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes { animation-duration: 150s; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes > :nth-child(3n+1) .boxes-images-outer-image { width: 200px; height: 250.833px; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes > :nth-child(3n+2) .boxes-images-outer-image { width: 150px; height: 200px; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .gallery-cubes > :nth-child(3n+3) .boxes-images-outer-image { width: 31.25vw; height: 39.583vw; } } /**/ /*---------------------------/* GRID-GALLERY-SECTION-NO-SLIDE /*---------------------------*/ #allSectionsWrapper > .section.grid-gallery-section.no-slide { } #allSectionsWrapper > .section.grid-gallery-section.no-slide .gallery-container { } #allSectionsWrapper > .section.grid-gallery-section.no-slide .gallery-container .owl-carousel { } #allSectionsWrapper > .section.grid-gallery-section.no-slide .gallery-container .owl-carousel .owl-controls { } #allSectionsWrapper > .section.grid-gallery-section.no-slide .gallery-container .owl-carousel .owl-controls .owl-nav { display: none; } #allSectionsWrapper > .section.grid-gallery-section.no-slide .gallery-container .owl-carousel .owl-stage-outer { } #allSectionsWrapper > .section.grid-gallery-section.no-slide .gallery-container .owl-carousel .owl-stage-outer .owl-stage { } #allSectionsWrapper > .section.grid-gallery-section.no-slide .gallery-container .owl-carousel .owl-stage-outer .owl-stage .owl-item { pointer-events: none; } #allSectionsWrapper > .section.grid-gallery-section.no-slide .gallery-container .owl-carousel .owl-stage-outer .owl-stage .owl-item .item { padding: 0; } @media(min-width: 1024px) { } @media(max-width: 1023px) { #allSectionsWrapper .grid-gallery-section:not(.no-slide) { } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .owl-carousel { } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .owl-carousel .owl-stage-outer { } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .owl-carousel .owl-stage-outer .owl-stage { } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .owl-carousel .owl-stage-outer .owl-stage .owl-item { } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .owl-carousel .owl-stage-outer .owl-stage .owl-item .item { padding: 0; } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .topImg { } #allSectionsWrapper .grid-gallery-section:not(.no-slide) .gallery-container .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .topImg img { object-fit: cover; height: 400px; } } /**/ /*--------------------------/* IMAGE-TEXT-GRID /*--------------------------*/ .grid-row.image-text-grid { background: var(--black); color: var(--white); display: flex; flex-direction: row; align-items: center; } .grid-row.image-text-grid.inverted { flex-direction: row-reverse; } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text { } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text { width: 100%; text-align: center; padding-inline: var(--gap-140); color: var(--white); } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text p { font-size: clamp(14px,var(--fs-18),300px); /* font-weight: 400; */ font-family: var(--reg); line-height: 1.5; letter-spacing: 0.36px; color: var(--gray); } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text h2, .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text .h2 { margin-bottom: var(--gap-32); margin-top: 0; color: var(--white); font-family: var(--font-3); font-size: var(--fs-20); letter-spacing: 0; line-height: 1; } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text h3, .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text .h3 { font-family: var(--font-2); font-size: var(--fs-48); margin-bottom: var(--gap-24); margin-top: 0; } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text a.grid-row-button { background: var(--white); display: inline-block; color: var(--black); padding: 0.833vw 1.25vw; min-width: 7.292vw; border-radius: 50px; border: 1px solid var(--black); font-size: var(--fs-16); margin-top: var(--gap-40); } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text a.grid-row-button:hover { color: black; border-radius: 50px; transition: 0.3s ease all; } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text p strong { color: var(--white); font-size: clamp(24px, var(--fs-24),300px); } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text p:has(strong) { margin-bottom: var(--gap-32); } @media(max-width: 1023px) { .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text { padding-inline: var(--gap-16); padding-bottom: var(--gap-64); } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text h2, .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text .h2 { font-family: var(--font-3); font-size: 18px; margin-bottom: 20px; } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text h3, .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text .h3 { font-size: 32px; margin-bottom: 32px; } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text a.grid-row-button { max-height: 45px; padding-block: 10px; } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text p { font-size: var(--fs-16); } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text p strong { font-size: 18px; } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text p:has(strong) { margin: 0; } } @media(min-width: 1024px) { .grid-row.image-text-grid .flexslider-box * { width: 100%; } .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text a.grid-row-button:hover { background: #e2e1df; } } /**/ /*---------------------------/* GRID-IMAGE-SECTION /*---------------------------*/ .grid-image-section .image-section-data { height: 270px; } .grid-image-section .image-section-data img.stellar-bg { height: 250px; margin: 0 !important; } @media(max-width: 1023px) { .grid-image-section .image-section-data { height: auto; margin-bottom: 32px; } .grid-image-section .image-section-data img.stellar-bg { height: 150px; } } @media(min-width: 1024px) { } /**/ /*--------------------------/* INFO-BOXES-SEC /*--------------------------*/ :is(div, #LobbyModule) .section.info-boxes-sec { margin-bottom: var(--gap-160); } :is(div, #LobbyModule) .section.info-boxes-sec .section-title { margin: 0 0 var(--gap-32); padding: 0 var(--gap-32); position: relative; max-width: min(calc(100% - var(--gap-32)), 31.2vw); text-align: start; } :is(div, #LobbyModule) .section.info-boxes-sec .section-title h2 { font-size: clamp(2rem, var(--fs-64), 1000rem); width: max-content; letter-spacing: -0.64px; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gap-64) var(--gap-20); margin: 0 auto; max-width: 100%; padding: 0 var(--gap-32); } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box { width: 100%; flex-grow: 1; max-width: 31.15vw; overflow: hidden; height: fit-content; display: flex; flex-direction: column; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-image { transition: 0.4s all ease; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text { background: var(--black); padding: 0 var(--gap-120); transition: 0.4s all ease; height: var(--title-height); overflow: hidden; z-index: 1; position: absolute; bottom: 0; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-title h3 { margin: 0 auto; font-size: clamp(1.2rem, var(--fs-48), 1000rem); color: var(--white); line-height: 0.95; font-family: var(--font-2); padding: var(--gap-32) 0 var(--gap-24); transition: all 0.3s ease; } /*:is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box:hover .grid-box-text .grid-box-title h3 { padding-top: 0; }*/ :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-fulltext:has(+ .grid-box-subtitle.button) { padding-bottom: var(--gap-32); width: 75%; margin-inline: auto; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-fulltext * { color: var(--gray); line-height: 1.6; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-subtitle.button { padding-bottom: var(--gap-40); } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-subtitle.button a { background-color: var(--white); height: 2.6vw; display: inline-flex; font-size: clamp(1.2rem, var(--fs-17), 1000rem); transition: 0.3s all ease; letter-spacing: 0.54px; padding: 0 var(--gap-24); align-items: center; justify-content: center; border: unset; color: var(--black); border-radius: var(--gap-48); } @media(max-width: 1023px) { :is(div, #LobbyModule) .section.info-boxes-sec { margin-bottom: var(--gap-64); } :is(div, #LobbyModule) .section.info-boxes-sec .section-title { margin: 0 auto var(--gap-24); max-width: unset; padding: 0 var(--gap-16); } :is(div, #LobbyModule) .section.info-boxes-sec .section-title h2 { font-size: var(--fs-32); letter-spacing: 0.96px; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes { gap: var(--gap-24); padding: 0 var(--gap-16); flex-wrap: nowrap; flex-direction: column; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box { max-width: unset; pointer-events: none; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-image { background: var(--black); } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-image img { height: 74vw; padding: var(--gap-18); } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text { height: auto; position: relative; bottom: unset; padding: var(--gap-20) var(--gap-16); text-align: -webkit-auto; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-title h3 { padding: 0 0 var(--gap-24); font-size: var(--fs-32); } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-fulltext p { font-size: 16px; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-fulltext:has(+ .grid-box-subtitle.button) { padding-bottom: var(--gap-24); width: 100%; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-subtitle.button { padding: 0; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-subtitle.button a { height: auto; font-size: var(--fs-15); letter-spacing: 0.15px; padding: var(--gap-8); min-width: 0; line-height: 1.1; /* background: url("https://media.getmood.io/warehouse/dynamic/629845.svg"); */ /* width: 20px; */ /* height: 20px; */ /* padding: 0; */ } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-subtitle.button a:after { content: url("https://media.getmood.io/warehouse/dynamic/629845.svg"); display: flex; align-items: center; text-align: center; justify-content: center; margin-left: 2px; } :is(div, #LobbyModule) .section.grid-content-section.info-boxes-sec .grid-iframe-holder { display: flex; justify-content: center; } :is(div, #LobbyModule) .section.grid-content-section.info-boxes-sec .grid-iframe-holder iframe { /* aspect-ratio: unset; */ /* height: unset; */ } :is(div, #LobbyModule) .section.grid-content-section.info-boxes-sec .grid-iframe-holder iframe { min-width: 144vw; aspect-ratio: 1; } :is(div, #LobbyModule) .section.grid-content-section.info-boxes-sec .grid-iframe-holder { padding-top: var(--gap-24); } } @media(min-width: 1024px) { :is(div, #LobbyModule) .section.info-boxes-sec .grid-iframe-holder iframe { aspect-ratio: 1080/1920; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box { max-height: 41.458vw; } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes:has(> .grid-box:nth-child(3)) { display: grid; grid-template-columns: repeat(3, 1fr); } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box:hover .grid-box-image, :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box.focused .grid-box-image { filter: grayscale(1); } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box:hover .grid-box-text, :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box.focused .grid-box-text { height: calc(var(--full-text-height) + 3vw); } :is(div, #LobbyModule) .section.info-boxes-sec .grid-boxes .grid-box .grid-box-text .grid-box-subtitle.button a:is(:hover, :focus) { background: var(--lblack); color: var(--white); } } /**/ /*--------------------------/* GRID-FAQ-SECTION /*--------------------------*/ .faq-headline .button-open { display: none; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .section-title { margin-bottom: var(--gap-40); } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .section-title h2 { font-family: var(--font-3); font-size: var(--fs-20); } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .section-title h3 { font-family: var(--font-2); font-size: var(--fs-48); margin-bottom: 0; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq { } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group { } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item { margin: 0 !important; box-shadow: none; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-headline { background: none; width: fit-content; margin-inline: auto; padding: 0; padding-bottom: var(--gap-8); } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-headline span.faq-headline-title { font-size: var(--fs-18); } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-headline i.fa.fa-angle-down { display: none; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-headline:before { content: "+"; font-family: var(--font-3); vertical-align: middle; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-headline.open { } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-headline.open::before { content: "-"; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-body { background: none; text-align: center; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-body .faq-body-inner { max-width: unset; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-body .faq-body-inner .faq-item-text { } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-body .faq-body-inner .faq-item-text > * { font-size: var(--fs-17); line-height: 1.5; color: var(--text); } @media(max-width: 1023px) { :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-headline span.faq-headline-title { font-size: 14px; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-headline { width: max-content; } :is(div,#LobbyModule) #allSectionsWrapper > section.grid-faq-section .grid-faq .panel-group .faq-item .faq-body .faq-body-inner .faq-item-text > * { font-size: 14px; } } @media(min-width: 1024px) { } /**/ /*--------------------------/* GRID-TEXT-SECTION ABOVE-FORM /*--------------------------*/ #allSectionsWrapper .grid-text-section.above-form .grid-text .grid-text-content h2 { font-size: clamp(90px,var(--fs-90),300px); } @media(max-width: 1023px) { #allSectionsWrapper .grid-text-section.above-form .grid-text .grid-text-content h2 { font-size: 48px; margin-bottom: 32px; } } @media(min-width: 1024px) { } /**/ /*--------------------------/* GRID-FORM-SECTION /*--------------------------*/ #allSectionsWrapper > section.grid-text-section.no-margin { margin-bottom: 0; } #allSectionsWrapper > .grid-form-section { } #allSectionsWrapper > .grid-form-section .form-container-wide { } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form { border: none; margin-inline: auto; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form::after { display: none; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form :is(.dynamicFormObjectTitleAndText,dynamicFormEndText) { display: none; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row { width: 100%; padding: 0; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row .top-form { display: none; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form { } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset { display: flex; flex-direction: column; justify-content: center; align-items: center; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper { display: flex; padding: 0; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField { } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .input-wrapper { /* border: none; */ } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .input-wrapper input { border: none; border-bottom: 1px solid var(--black); border-radius: 0; font-size: clamp(14px, var(--fs-16), 300px); box-shadow: none; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .input-wrapper input::placeholder { color: var(--text); } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .select-wrapper { } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .select-wrapper select { border: none; border-bottom: 1px solid var(--black); font-size: clamp(14px, var(--fs-16), 300px); box-shadow: none; border-radius: 0; color: var(--text); } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .select-wrapper select:focus { border: 1px solid #000; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .select-wrapper::before { right: 15px; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField { } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField .radio-group.input-wrapper { } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField .radio-group.input-wrapper::before { display: none; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField .radio-group.input-wrapper .radio-group-inputs { display: flex; align-items: center; justify-content: center; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField .radio-group.input-wrapper .radio-group-inputs input[type="radio"] { width: fit-content; margin: 0; margin-left: 0.521vw; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField .radio-group.input-wrapper .radio-group-inputs label { margin-left: var(--gap-16); font-family: var(--reg); font-weight: 100; color: var(--text); font-size: clamp(14px, var(--gap-16), 300px); } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField .radio-group.input-wrapper .radio-group-inputs input[type="radio"] { appearance: none; -webkit-appearance: none; width: 20px; height: 20px; border: 2px solid #444; border-radius: 2px; background-color: white; cursor: pointer; position: relative; display: inline-block; vertical-align: middle; outline: none; /* removes blue focus box */ box-shadow: none; /* removes any inner glow or box */ } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField .radio-group.input-wrapper .radio-group-inputs input[type="radio"]:checked::before { content: "✔"; /* or "✓" or "v" */ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 14px; color: #000; line-height: 1; pointer-events: none; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .dynamicFormObjectSubmit { width: fit-content; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .dynamicFormObjectSubmit input.form-submit { font-size: var(--fs-16); font-family: var(--reg); background: var(--black); height: 50px; min-width: 150px; border-radius: 50px; margin-top: var(--gap-32); } label.error, span.error { font-size: 12px; } @media(max-width: 1023px) { #allSectionsWrapper > section.grid-text-section.no-margin { margin-top: var(--gap-64); } #allSectionsWrapper > .grid-form-section { margin-bottom: var(--gap-64); } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form { padding-inline: 0; padding: 0; width: 90%; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row { margin: 0; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form { width: 100%; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper { flex-direction: column; width: 100%; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField { padding: 0; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .input-wrapper { width: 100%; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .input-wrapper.must::before { right: 8px; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .custom-wrapper .dynamicFormObjectField .select-wrapper::before { right: 8px; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField { padding: 0; } #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset > .dynamicFormObjectField .radio-group.input-wrapper .radio-group-inputs { justify-content: flex-start; } } @media(min-width: 1024px) { #allSectionsWrapper > .grid-form-section .form-container-wide .normal-form .dynamicFormObjectFields.row form fieldset .dynamicFormObjectSubmit input.form-submit:is(:hover, :focus) { color: var(--white); background: #3F3B38; } } /**/ /*------------------------/* ABOUT-SECTION /*------------------------*/ #allSectionsWrapper > .section.about { margin-bottom: 0; } #allSectionsWrapper > .section.about .grid-boxes.row { height: 1600px; position: relative; } #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper { max-width: 30.729vw; height: fit-content; position: sticky; top: 30%; transform: translateY(-30%); order: 2; } #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper .section-title { margin-bottom: var(--gap-32); } #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper .section-title.section-animation-item.up.shown h2, #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper .section-title.section-animation-item.up.shown p { font-size: var(--fs-20); font-family: var(--font-3); } #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper .section-title.section-animation-item.up.shown h3, #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper .section-title.section-animation-item.up.shown h1 { font-family: var(--font-2); font-size: var(--fs-90); margin: 0; } #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper .section-topText { } #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper .section-topText p { font-size: clamp(16px,var(--fs-16),100px); line-height: 1.6; text-wrap: balance; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:first-child { order: 1; display: block; align-content: flex-end; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box.lastItem { order: 3; display: block; align-content: center; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:first-child .grid-box-image { margin-bottom: var(--gap-160); width: 60%; margin-inline-start: auto; } @media(max-width: 1023px) { #allSectionsWrapper > .section.about .grid-boxes.row { display: flex; flex-direction: column; height: 1800px; } #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper { position: static; top: 20%; max-width: unset; display: block; width: 100%; transform: unset; order: 1; padding-inline: var(--gap-18); z-index: -1; } #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper .section-title h2 { font-family: var(--font-3); font-size: 18px; } #allSectionsWrapper > .section.about .grid-boxes.row .about-header-wrapper .section-title h3 { font-family: var(--font-2); font-size: 32px; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box { position: absolute; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:first-child { order: 2; top: 23%; width: 78%; left: 0; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:first-child .grid-box-image .grid-box-image-container { } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:first-child .grid-box-image .grid-box-image-container a { } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:first-child .grid-box-image .grid-box-image-container a img { height: 367px; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(2) { width: 161px; right: 3%; top: 48%; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(2) .grid-box-image { } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(2) .grid-box-image .grid-box-image-container { } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(2) .grid-box-image .grid-box-image-container a { } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(2) .grid-box-image .grid-box-image-container a img { height: 180px; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(3) { top: 56%; wi; width: 27%; left: 4%; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(3) .grid-box-image { width: 100%; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(3) .grid-box-image .grid-box-image-container { } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(3) .grid-box-image .grid-box-image-container a { } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(3) .grid-box-image .grid-box-image-container a img { height: 125px; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(4) { top: 66%; width: 79%; left: 0; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(4) .grid-box-image { width: 100%; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(4) .grid-box-image .grid-box-image-container { } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(4) .grid-box-image .grid-box-image-container a { } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(4) .grid-box-image .grid-box-image-container a img { /* aspect-ratio: 1; */ } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:nth-child(5) { bottom: 0%; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:first-child .grid-box-image { display: block; width: 100%; left: 0; /* margin: 0; */ } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:last-child { top: 30%; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box.lastItem .grid-box-image { width: 38%; right: 3%; top: -180%; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box:is(:nth-child(3)) .grid-box-image { width: 100%; } #allSectionsWrapper > .section.about .grid-boxes.row .grid-box.lastItem .grid-box-image img { height: 174px; } } @media(min-width: 1024px) { #allSectionsWrapper > .section.grid-content-section.random-boxes { height: 62.5vw; } #allSectionsWrapper > .section.grid-content-section.random-boxes .grid-boxes.row { height: 100%; position: relative; } #allSectionsWrapper > .section.grid-content-section.random-boxes .grid-boxes.row .grid-box:first-child { position: absolute; width: 20%; z-index: 3; left: 20%; top: -5%; } #allSectionsWrapper > .section.grid-content-section.random-boxes .grid-boxes.row .grid-box:nth-child(2) { position: absolute; z-index: 3; right: 10%; top: 15%; width: 40%; } #allSectionsWrapper > .section.grid-content-section.random-boxes .grid-boxes.row .grid-box.lastItem { position: absolute; z-index: 3; left: 1%; bottom: 0; width: 25%; } } /**/ /*------------------------/* CONTACT /*------------------------*/ body.contact #SiteGrid { display: flex; } body.contact #SiteGrid > * { width: 50%; } body.contact #SiteGrid #GridPage { padding-block: var(--gap-120); } body.contact #SiteGrid #GridPage #GridContent { } body.contact #SiteGrid #GridBottom { display: none; } body.contact :is(div,#LobbyModule) { } body.contact :is(div,#LobbyModule) #headline { } body.contact :is(div,#LobbyModule) #headline h1 { font-size: var(--fs-24); font-family: var(--font-2); } body.contact :is(div,#LobbyModule) h2 { font-family: var(--font-3); font-size: 7.917vw; } body.contact :is(div,#LobbyModule) #allSectionsWrapper { } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section:first-child { margin-block: var(--gap-80); } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section { margin: 0; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide { } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject { border: none; width: 100%; padding-block: 0; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject:after { display: none; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject :is(.dynamicFormObjectTitleAndText, .dynamicFormEndText) { display: none; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row { width: 75%; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row .top-form { font-size: var(--fs-16); width: 9ch; line-height: 1.6; color: var(--black); margin-inline: auto; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form { width: 75%; margin-inline: auto; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset { display: flex; flex-direction: column; justify-content: center; align-items: center; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField { width: 100%; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .input-wrapper { } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .input-wrapper:before { right: 7px; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .input-wrapper input { border: none; border-bottom: 1px solid var(--black); border-radius: 0; font-size: var(--fs-16); box-shadow: none; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .input-wrapper input::placeholder { color: var(--text); } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .textarea-wrapper { } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .textarea-wrapper textarea { border: none; border-bottom: 1px solid var(--black); border-radius: 0; font-size: var(--fs-16); box-shadow: none; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .textarea-wrapper textarea::placeholder { color: var(--text); } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectSubmit { width: fit-content; margin-top: var(--gap-32); } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectSubmit input.form-submit { background: var(--black); font-size: var(--fs-16); min-width: 150px; height: 50px; border-radius: 50px; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .select-wrapper { } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .select-wrapper select { border: none; border-bottom: 1px solid var(--black); border-radius: 0; font-size: var(--fs-16); color: var(--text); padding-inline: var(--gap-16); box-shadow: none; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .select-wrapper select:focus { border: 1px solid #000 !important; } body.contact .requiredNotice { margin-top: 30px; } @media(min-width: 1024px) { body.contact #SiteGrid #GridTop { height: 930px; position: sticky; z-index: -1; top: var(--headerHeight); /* right: 0; */ } body.contact #SiteGrid #GridTop.reached { position: absolute; bottom: 0; right: 0; } body.contact #SiteGrid #GridPage { margin-inline-start: auto; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField :is(.input-wrapper, .select-wrapper).must::before { right: 1.146vw; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField.cv :is(.input-wrapper, .select-wrapper).must::before { opacity:0; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectSubmit input.form-submit:is(:hover, :focus) { background: #3F3B38; } } @media(max-width: 1023px) { body.contact #SiteGrid { flex-direction: column; } body.contact #SiteGrid > * { width: 100%; background-position: inherit; } body.contact #SiteGrid #GridPage { padding-block: var(--gap-64) 0; } body.contact :is(div,#LobbyModule) #headline { } body.contact :is(div,#LobbyModule) #headline h1 { font-family: var(--font-2); font-size: 18px; } body.contact :is(div,#LobbyModule) h2 { font-size: 45px; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section { margin-block: var(--gap-64); } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row { width: 100%; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form { width: 101%; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .input-wrapper input { box-shadow: none; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .select-wrapper select { box-shadow: none; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .select-wrapper:before { right: 6px; } body.contact :is(div,#LobbyModule) #allSectionsWrapper > section.grid-form-section .form-container-wide #DynamicFormObject .dynamicFormObjectFields.row form fieldset .dynamicFormObjectField .textarea-wrapper textarea { box-shadow: none; } } /**/ /*------------------------/* REVIEW /*------------------------*/ #allSectionsWrapper > .section.grid-content-section.reviews .section-title { margin-bottom: var(--gap-120); } #allSectionsWrapper > .section.grid-content-section.reviews .section-title h2 { font-family: var(--font-3); font-size: clamp(18px,var(--fs-20),300px); } #allSectionsWrapper > .section.grid-content-section.reviews .section-title h3 { font-size: clamp(46px,var(--fs-48),300px); font-family: var(--font-2); } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes.row .grid-box { text-align: right; min-width: 20.833vw; display: flex; flex-direction: column; gap: var(--gap-40); } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes.row .grid-box .grid-box-image { width: 20px; } #allSectionsWrapper > .section.grid-content-section.reviews { } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes { width: 100%; } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes .grid-boxes-wrapper { display: flex; justify-content: flex-start; padding-inline: var(--gap-140); } @media(min-width: 1024px) { } @media(max-width: 1023px) { #allSectionsWrapper > .section.grid-content-section.reviews .section-title { } #allSectionsWrapper > .section.grid-content-section.reviews .section-title h2 { font-family: var(--font-3); font-size: 20px; } #allSectionsWrapper > .section.grid-content-section.reviews .section-title h3 { font-family: var(--font-2); font-size: 48px; } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes.row { padding-inline-start: var(--gap-16); gap: var(--gap-16); padding-block: var(--gap-64) 0; overflow-y: hidden; } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes.row .grid-box { min-width: 80%; gap: var(--gap-24); } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes.row .grid-box .grid-box-fulltext { } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes.row .grid-box .grid-box-fulltext p { font-size: 15px; line-height: 1.6; } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes.row .grid-box .grid-box-subtitle { } #allSectionsWrapper > .section.grid-content-section.reviews .grid-boxes.row .grid-box .grid-box-subtitle span { font-size: 15px; color: var(--text); } } /**/ /*------------------------/* MENU /*------------------------*/ #MenuModule .menuModuleNav { display: flex; justify-content: center; gap: var(--gap-12); margin-top: var(--gap-40); padding: 0; } #MenuModule .menuModuleNav a { font-size: clamp(16px,var(--fs-16),300px); font-family: var(--font-1); margin: 0; color: #565656; } #MenuModule .menuModuleNav a.selected { color: var(--black); border-bottom: 1px solid; border-radius: 0; } :is(div, #MenuModule) .grid-rows { } :is(div, #MenuModule) div#headline { font-size: unset; } :is(div, #MenuModule) div#headline h1 { font-size: var(--fs-20); font-family: var(--font-3); } :is(div, #MenuModule) #subheadline { } :is(div, #MenuModule) #subheadline h2 { font-size: var(--fs-90); margin-bottom: var(--gap-40); } :is(div, #MenuModule) .menuModuleContent { margin-top: var(--gap-160); } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart { border: none; padding: 0; } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart:after { display: none; } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li { display: grid; grid-template-columns: 1fr 1fr; width: 90%; float: none; margin-inline: auto; margin-bottom: var(--gap-56); gap: var(--gap-148); } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li .menuModuleTextItemPart { width: 88%; padding-top: var(--gap-24); border-top: 1px solid; padding-inline: 0; } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li .menuModuleTextItemPart:after { display: none; } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li .menuModuleTextItemPart h3.menuModuleTextItemTitle { font-size: clamp(20px,var(--fs-20),200px); font-family: var(--font-3), var(--font-1); } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li .menuModuleTextItemPart .menuModuleTextItemPrice { /* float: unset; */ width: fit-content; display: inline-block; margin-right: var(--gap-12); } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li .menuModuleTextItemPart .menuModuleTextItemDescription { margin-top: var(--gap-12); font-size: clamp(16px,var(--fs-16),300px); } @media(min-width: 1024px) { #MenuModule { padding: var(--gap-120) var(--gap-160); } #main-header .menu-nav #nav-toggle span, #main-header .menu-nav #nav-toggle span:before, #main-header .menu-nav #nav-toggle span:after { transition: unset; width: var(--gap-40); background: var(--black); } #main-header .menu-nav.open #nav-toggle span { background: none; } header .header-right .menu-nav #nav-toggle { width: 41px; } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li.menuModuleTextItemSubject { position: relative; margin-bottom: var(--gap-100); } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li.menuModuleTextItemSubject h2.menuModuleTextItemSubjectTitle { position: absolute; left: 50%; width: fit-content; font-size: var(--fs-32); } } @media(max-width: 1023px) { :is(div, #MenuModule) div#headline { margin-top: 64px; } :is(div, #MenuModule) #subheadline h2 { font-size: 32px; margin-bottom: 32px; } :is(div, #MenuModule) .menuModuleContent { margin-top: 64px; } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li { grid-template-columns: 1fr; margin-bottom: var(--gap-32); } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li .menuModuleTextItemPart { width: 100%; } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li .menuModuleTextItemPart:not(.test2) { margin-bottom: 32px; } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li .menuModuleTextItemPart .menuModuleTextItemPrice { font-size: 16px; } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li .menuModuleTextItemPart h3.menuModuleTextItemTitle { font-size: 16px; margin: 0; padding-top: 3px; /* display: flex; */ } :is(div, #MenuModule) .menuModuleContent ul.menuModuleContentPart li { grid-template-columns: 1fr; margin-bottom: var(--gap-32); } } /**/ /*------------------------------------------/* FORM THANK YOU PAGE /*------------------------------------------*/ .FormResultPage #SiteGrid { display: flex; flex-direction: column; justify-content: center; } .FormResultPage #GridTop, .FormResultPage #GridWrapInner #GridHeader { display: none; } .FormResultPage #GridWrapInner { padding: 0; min-height: calc(var(--app-height) - var(--headerHeight)); display: grid; place-content: center; } .FormResultPage #SiteGrid #PageBreadCrumps { position: absolute; } .FormResultPage #pageview .container-fluid { width: 100%; } .FormResultPage #pageview #headline { font-size: 100%; position: relative; margin: 0; } .FormResultPage #pageview #headline h1 { font-size: clamp(2rem, var(--fs-64), 1000rem); margin: 0 0 var(--gap-24); letter-spacing: 0.64px; font-family: var(--font-2); } .FormResultPage #pageview #text1 { display: grid; max-width: unset; justify-items: center; } .FormResultPage #pageview #text1 p { font-size: clamp(1.2rem, var(--fs-17), 1000rem); margin: 0; letter-spacing: 0.18px; line-height: 1.3; font-family: var(--font-1); } .FormResultPage #pageview #text1 a.FormResultPageButton { display: inline-flex !important; margin: var(--gap-28) auto 0 !important; background-color: var(--black); height: var(--gap-52); border-radius: var(--gap-56); font-size: clamp(1.2rem, var(--fs-17), 1000rem); transition: 0.3s all ease; padding: 0 var(--gap-32); align-items: center; justify-content: center; border: unset; color: var(--white); line-height: 1; } @media(min-width: 1024px) { .FormResultPage #pageview #text1 a.FormResultPageButton:is(:hover, :focus) { background-color: var(--lblack); } } @media(max-width: 1023px) { .FormResultPage #GridWrapInner { padding: 0 var(--gap-16); border: unset; margin: 0; } .FormResultPage #pageview #headline h1 { font-size: var(--fs-32); margin-bottom: var(--gap-16); } .FormResultPage #pageview #text1 p { font-size: var(--fs-15); } .FormResultPage #pageview #text1 a.FormResultPageButton { font-size: var(--fs-15); padding: var(--gap-16) var(--gap-24); height: auto; } } /*------------------------------------------/* PAGE 404 /*------------------------------------------*/ .page-404 #SiteGrid { display: flex; align-items: center; flex-direction: column; } .page-404 #SiteGrid #GridTop, .page-404 #SiteGrid #GridWrapInner #GridHeader { display: none; } .page-404 #SiteGrid #GridPage { width: 100%; height: 100%; padding: 0; } .page-404 #SiteGrid #GridWrap { display: flex; flex-direction: column; max-width: unset; } .page-404 #SiteGrid #GridWrapInner { padding: 0; min-height: calc(var(--app-height) - var(--headerHeight)); display: grid; place-content: center; } .page-404 #SiteGrid #PageBreadCrumps { position: absolute; } .page-404 #SiteGrid #GridPage .page-not-found { display: flex; flex-direction: column; position: relative; align-items: center; } .page-404 #SiteGrid #GridPage .page-not-found #headline { margin: 0; } .page-404 #SiteGrid #GridPage .page-not-found #headline h1 { font-size: clamp(2rem, var(--fs-64), 1000rem); margin: 0 0 var(--gap-24); letter-spacing: 0.64px; font-family: var(--font-2); } .page-404 #SiteGrid #GridPage .page-not-found #text1 { max-width: unset; } .page-404 #SiteGrid #GridPage .page-not-found #subheadline h2 { font-size: clamp(1.2rem, var(--fs-17), 1000rem); margin: 0; letter-spacing: 0.18px; line-height: 1.3; font-family: var(--font-1); } .page-404 #SiteGrid #GridPage .page-not-found a { margin: var(--gap-28) auto 0; background-color: var(--black); height: var(--gap-52); border-radius: var(--gap-56); display: inline-flex; font-size: clamp(1.2rem, var(--fs-17), 1000rem); transition: 0.3s all ease; padding: 0 var(--gap-32); align-items: center; justify-content: center; border: unset; color: var(--white); line-height: 1; } @media(min-width: 1024px) { .page-404 #SiteGrid #GridPage .page-not-found #text1 a:is(:hover, :focus) { background-color: var(--lblack); } } @media(max-width: 1023px) { .page-404 #SiteGrid #GridWrapInner { padding: 0 var(--gap-16); border: unset; margin: 0; } .page-404 #SiteGrid #GridPage .page-not-found #headline h1 { font-size: var(--fs-32); margin-bottom: var(--gap-16); } .page-404 #SiteGrid #GridPage .page-not-found #subheadline h2 { font-size: var(--fs-15); } .page-404 #SiteGrid #GridPage .page-not-found #text1 a { font-size: var(--fs-15); padding: var(--gap-16) var(--gap-24); height: auto; } } /*------------------------------------------/* ACCESSABILITY PAGE /*------------------------------------------*/ .accessabilityMainPage #GridTop { display: none; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) { max-width: 40.5vw; margin: var(--gap-64) auto var(--gap-160); 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: 0 0 var(--gap-80); font-family: var(--font-2); font-size: var(--fs-64); } .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: var(--gap-24) 0 var(--gap-4); font-size: clamp(1.2rem, var(--fs-28), 1000rem); letter-spacing: 0.28px; line-height: 1.3; } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) :is(h2, h3):first-child { margin-top: 0; } .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: 1024px) { } @media(max-width: 1023px) { .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) { max-width: 100%; margin: 0 auto var(--gap-64); padding: var(--gap-18); } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) #headline h1 { font-size: var(--fs-32); margin: 0 0 var(--gap-48); } .accessabilityMainPage :is(.MainContent, #pageview .container-fluid) :is(#text1, #text2) :is(h2, h3) { font-size: var(--fs-24); } } /*------------------------------------------/* HEADER /*------------------------------------------*/ #main-header { } #main-header.bg { background: var(--white); } #main-header .header-container { padding-inline: var(--gap-32); padding-block: var(--gap-24); } #main-header:is(.header-hamburger.open) .header-container:after { content: ""; width: 100%; height: 100%; position: absolute; display: block; background: var(--black); z-index: 1; opacity: 0.3; } #main-header .header-container .header-left { position: absolute; left: 50%; transform: translateX(-50%); } #main-header .header-container .header-center { z-index: 2; } #main-header .header-container .header-center .header-buttons { display: flex; gap: var(--gap-24); } #main-header .header-container .header-center .header-buttons a { font-size: clamp(18px,var(--fs-18),300px); cursor: pointer; } #main-header .header-container .header-center .header-buttons a:is(:hover, :focus) { text-decoration: underline; } #main-header .header-container .header-center .header-buttons a:last-child { display: block; } #main-header .header-container .header-right { gap: var(--gap-10); z-index: 2; } #main-header .header-container .header-right .header-right-content .header-social-icons { display: none; } #main-header .header-container .header-right .menu-nav.open ul#menu li.social-mobile a.social_icon_instagram { background: url("https://media.getmood.io/warehouse/dynamic/628471.svg"); width: 21px; display: block; height: 21px; background-repeat: no-repeat; background-size: contain; } #main-header .header-container .header-right .menu-nav.open ul#menu li.social-mobile a.social_icon_instagram svg { display: none; } #main-header.header-hamburger .menu-sub { list-style: none; margin-block: var(--gap-10); } .header-social-icons { display: none; } @media(min-width: 1024px) { } @media(max-width: 1023px) { #main-header .header-container { padding-inline: var(--gap-12); } #main-header .header-container .header-center .header-buttons a { display: none; } #main-header .header-container .header-left { z-index: 3; } #main-header .header-container .header-left a.logoHeader { text-align: center; } #main-header .header-container .header-left a.logoHeader img { width: 100%; } #main-header .header-container .header-right .menu-nav ul#menu .moved-buttons a { line-height: 1.4; } #main-header .header-container .header-right .menu-nav ul#menu > li > a { font-size: 20px; } #main-header .header-container .header-right .menu-nav.open ul#menu li.social-mobile { justify-content: center; gap: 12px; } #main-header .header-container .header-center .header-buttons { display: none; } } /**/ /*------------------------------------------/* HOME-PAGE HEADER /*------------------------------------------*/ @media(min-width: 1024px) { .home-page #main-header .header-container .header-left { width: 100%; background: var(--white); top: 100%; padding-top: 60px; padding-bottom: var(--gap-48); justify-content: center; transition: all 0.8s ease; z-index: 1; } .home-page #main-header .header-container .header-left a.logoHeader { } .home-page #main-header .header-container .header-left a.logoHeader img { width: 95vw; margin-inline: auto; transition: 0.8s ease all; } .home-page #main-header .header-container .header-left.scrolled { width: 100%; padding: 0; top: 50%; transform: translate(-50%, -50%); } .home-page #main-header .header-container .header-left.scrolled a.logoHeader { } .home-page #main-header .header-container .header-left.scrolled a.logoHeader img { width: 12vw; } } @media(max-width: 1023px) { } /**/ /*------------------------------------------/* SUB-MENU /*------------------------------------------*/ #SiteContainer::before { content: ''; position: absolute; left: 0; top: 0; height: 100%; width: 100%; background: #000; z-index: 1000; opacity: 0; transition: 0.3s all ease; pointer-events: none; } body:has(#main-header.open) #SiteContainer::before { opacity: 0.4; } #main-header .menu-nav #nav-toggle { width: var(--gap-40); } /*#main-header .header-container .header-right .menu-nav.open { } #main-header .header-container .header-right .menu-nav.open ul#menu { width: 20.833vw; padding-inline: var(--gap-32); list-style: none; gap: var(--gap-12); } #main-header .header-container .header-right .menu-nav.open ul#menu li { position:relative; } #main-header .header-container .header-right .menu-nav.open ul#menu li.social-mobile { margin-top: auto; margin-bottom: 20px; padding-top: 20px; display: inline-flex; align-items: center; flex-direction: row-reverse; } #main-header .header-container .header-right .menu-nav.open ul#menu li a { font-size: clamp(18px,var(--fs-18),22px); }*/ #main-header .header-container .header-right .menu-nav.open ul#menu li i.opensub { display: block; position: absolute; top: 0; right: 0; width: 40%; text-align: left; } #main-header .header-container .header-right { gap: var(--gap-20); } #main-header .header-container .header-right .header-social-icons { display: none; } #main-header .header-container .header-right .menu-nav ul#menu { width: 20.8vw; background: var(--white); padding: calc(var(--headerHeight) + var(--gap-32)) var(--gap-32) var(--gap-20); height: 100svh; margin: 0; transition: 0.4s all ease; bottom: unset; top: 0; list-style: none; gap: var(--gap-20); } #main-header .header-container .header-right .menu-nav ul#menu > li { position: relative; font-size: clamp(1.2rem, var(--fs-17), 1000rem); letter-spacing: 0.18px; font-family: var(--font-1); color: var(--black); line-height: 1.3; padding: 0; transition: 0.4s all ease; text-decoration: unset; } #main-header .header-container .header-right .menu-nav ul#menu > li > a { display: inline-flex; transition: 0.4s all ease; } #main-header .header-container .header-right .menu-nav ul#menu > li.social-mobile { margin-top: auto; border-top: 1px solid #1B1A191F; padding-top: var(--gap-24); display: flex; justify-content: flex-end; gap: var(--gap-4); } #main-header .header-container .header-right .menu-nav ul#menu > li.social-mobile a { width: var(--gap-18); height: auto; aspect-ratio: 1; background-repeat: no-repeat; background-position: center; background-image: url(/warehouse/dynamic/625984.svg); } #main-header .header-container .header-right .menu-nav ul#menu > li.social-mobile a svg { display: none; } #main-header .header-container .header-right .menu-nav ul#menu > li.social-mobile a.social_icon_instagram { background-image: url(/warehouse/dynamic/625985.svg); } #main-header .header-container .header-right .menu-nav ul#menu > li.social-mobile a:first-child { background: none; width: 100%; aspect-ratio: unset; } @media(min-width: 1024px) { #main-header:is(.header-hamburger.open) .header-container .header-left:after { content: ""; width: 100%; height: 100%; position: absolute; display: block; top: 0; background: var(--black); opacity: 0.3; transition: 1s ease all; } #main-header:is(.header-hamburger.open) .header-container .header-left.scrolled:after { opacity: 0; } #main-header.header-hamburger .menu-sub li:not(:last-child) { margin-bottom: var(--gap-4); } #main-header .menu-nav.open #nav-toggle span, #main-header .menu-nav.open #nav-toggle span:before, #main-header .menu-nav.open #nav-toggle span:after { width: var(--gap-28); } } @media(max-width: 1023px) { #main-header .header-container .header-right .menu-nav ul#menu { width: 100%; text-align: center; padding-inline: 0; padding-top: var(--gap-72); border-top: 1px solid #e0e0e0; gap: 8px; } #main-header .header-container .header-right .menu-nav ul#menu > li { font-size: clamp(1.7rem, var(--fs-17), 1000rem); } #main-header .header-container .header-right .menu-nav ul#menu .moved-buttons { display: flex; flex-direction: column; gap: 8px; padding-block: var(--gap-24) 0; border-top: 1px solid #e0e0e0; /* margin-bottom: var(--gap-32); */ } #main-header .header-container .header-right .menu-nav ul#menu > li.social-mobile a:first-child { margin-inline-start: var(--gap-8); } #main-header .header-container .header-right .menu-nav.open ul#menu li i.opensub { left: 27%; top: 2%; right: unset; } #main-header .menu-sub { margin-block: var(--gap-24); } #main-header .menu-sub li { color: var(--text); } #main-header .menu-sub li:not(:last-child) { margin-bottom: 8px; /* color: var(--text); */ } } /**/ /*------------------------------------------/* CATEGORIES STRIP /*------------------------------------------*/ .categories-strip { background: none; color: var(--black); } .categories-strip nav.menu-tags-list { } .categories-strip nav.menu-tags-list ul { display: flex; justify-content: center; gap: var(--gap-12); } .categories-strip nav.menu-tags-list ul li { border: 1px solid; border-radius: 50px; display: flex; padding-block: 12px; } .categories-strip nav.menu-tags-list ul li:first-child { display: none; } .categories-strip nav.menu-tags-list ul li.active { color: var(--white); } .categories-strip nav.menu-tags-list ul li a { font-size: clamp(16px,var(--fs-16),300px); } @media(min-width: 1024px) { } @media(max-width: 1023px) { :is(div, #MenuModule) .categories-strip .top-mobile-strip .select-wrapper { display: block !important; width: 100vw; padding-inline: var(--gap-12); } :is(div, #MenuModule) .categories-strip nav.menu-tags-list { } :is(div, #MenuModule) .categories-strip nav.menu-tags-list .mobile-strip { padding-inline: 0; } :is(div, #MenuModule) .categories-strip nav.menu-tags-list .mobile-strip .top-mobile-strip { } :is(div, #MenuModule) .categories-strip nav.menu-tags-list .mobile-strip .top-mobile-strip span { display: none; } :is(div, #MenuModule) .categories-strip nav.menu-tags-list .mobile-strip:after { display: none; } :is(div, #MenuModule) .categories-strip nav.menu-tags-list ul { overflow: auto; width: 100%; justify-content: flex-start; } :is(div, #MenuModule) .categories-strip nav.menu-tags-list ul li.strip-item { color: var(--black); text-align: center; display: flex; justify-content: center; min-width: 150px; padding-block: var(--gap-16); } } /**/ /*------------------------------------------/* LOGO /*------------------------------------------*/ #GridTop.GridTop .section.grid-image-section.logo { top: 40%; transform: translateY(-50%); } #GridTop.GridTop .section.grid-image-section.logo .image-section-data { height: 100%; display: flex; align-items: center; } @media(min-width: 1024px) { #GridTop.GridTop .section.grid-image-section.logo { padding-top: var(--gap-90); } } @media(max-width: 1023px) { } /**/ /*------------------------------------------/* FOOTER /*------------------------------------------*/ footer { padding: 0; display: flex; } #SiteFooter { padding: 0; display: flex; flex-wrap: wrap; flex-direction: row-reverse; justify-content: center; align-items: center; overflow: hidden; } #SiteFooter .footer-text-divided { padding: var(--gap-20) var(--gap-20) var(--gap-90); background: var(--black); color: var(--white); display: flex; } #SiteFooter .footer-text-divided .footer-text-left { padding: 0; width: auto; display: inline-flex; justify-content: flex-end; height: max-content; } #SiteFooter .footer-text-divided .footer-text-left p:first-child { display: none; } #SiteFooter .footer-text-divided .footer-text-left .footerSocialIcons { display: flex; gap: var(--gap-14); flex-direction: row-reverse; align-items: center; } #SiteFooter .footer-text-divided .footer-text-left .footerSocialIcons a svg { width: var(--gap-24); height: auto; aspect-ratio: 1; } #SiteFooter .footer-text-divided .footer-text-left .footerSocialIcons a.social_icon_instagram { background-image: url("https://media.getmood.io/warehouse/dynamic/627424.svg"); width: 21px; display: block; height: 21px; } #SiteFooter .footer-text-divided .footer-text-left .footerSocialIcons a.social_icon_instagram svg { display: none; } #SiteFooter .footer-text-divided .footer-text-right { width: auto; padding: 0; display: flex; flex-grow: 1; gap: var(--gap-56); } #SiteFooter .footer-text-divided .footer-text-right h4 { margin: 0 0 var(--gap-12); font-size: clamp(1.2rem, var(--fs-28), 1000rem); line-height: 0.9; font-family: var(--font-2); letter-spacing: 0.28px; } #SiteFooter .footer-text-divided .footer-text-right ul { margin: 0; padding: 0; list-style: none; } #SiteFooter .footer-text-divided .footer-text-right ul li { position: relative; width: max-content; font-size: clamp(1.2rem, var(--fs-17), 1000rem); color: var(--white); line-height: 1.3; letter-spacing: 0.18px; } #SiteFooter .footer-text-divided .footer-text-right ul li:not(:last-child) { margin-bottom: var(--gap-8); } #SiteFooter .site-credit.alternative { padding: var(--gap-4) 0; z-index: 1; width: 100%; display: flex; order: 3; } #SiteFooter .site-credit.alternative svg path.st0 { fill: var(--white); } #SiteFooter a.AccessabilityLink { z-index: 1; font-size: clamp(1rem, var(--fs-14), 1000rem); } #SiteFooter a.AccessabilityLink:hover { color: var(--white); } #SiteFooter p.creditWrapper svg { fill: var(--white); } @media(min-width: 1024px) { #SiteFooter .footer-text-divided .footer-text-right ul li:is(:hover, :focus) { text-decoration: underline; } } @media(max-width: 1023px) { #SiteFooter .footer-text-divided { flex-direction: column; padding: var(--gap-64) var(--gap-16); gap: var(--gap-40); } #SiteFooter .footer-text-divided .footer-text-left { justify-content: center; } #SiteFooter .footer-text-divided .footer-text-right { flex-direction: column; gap: 0; } #SiteFooter .footer-text-divided .footer-text-right .dropdown-item { border-top: 1px solid rgba(229, 228, 228, 0.20); } #SiteFooter .footer-text-divided .footer-text-right .dropdown-item h4 { margin: 0; position: relative; padding: var(--gap-24) 0; letter-spacing: 0.18px; font-size: var(--fs-18); font-family: var(--font-1); } #SiteFooter .footer-text-divided .footer-text-right .dropdown-item h4::before { background-image: url(/warehouse/dynamic/567960.svg); background-repeat: no-repeat; background-size: 100%; background-position: center; width: var(--gap-14); height: var(--gap-14); transition: 0.3s all ease; content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); filter: invert(1); } #SiteFooter .footer-text-divided .footer-text-right .dropdown-item:not(.open) h4::before { background-image: url(/warehouse/dynamic/567959.svg); } #SiteFooter .footer-text-divided .footer-text-right .dropdown-item > ul { padding-bottom: var(--gap-16); } #SiteFooter .footer-text-divided .footer-text-right .dropdown-item ul > li { padding: 0; margin: 0 !important; } #SiteFooter .footer-text-divided .footer-text-right .dropdown-item ul > li:not(:last-child) { padding: 0 0 var(--gap-8); } #SiteFooter .footer-text-divided .footer-text-right .dropdown-item ul li { width: 100%; font-size: var(--fs-15); } #SiteFooter a.AccessabilityLink { font-size: var(--fs-14); } } /*--------------------/* BUTTON /*--------------------*/ @media(min-width: 1024px) { #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .btns-custom-container a.tiny-btn:hover { background: var(--text); } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .btns-custom-container > p:nth-child(2) a.tiny-btn { background: var(--white); color: var(--black); } #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .btns-custom-container > p:nth-child(2) a.tiny-btn:hover { background: #E2E1DF; } } @media(max-width: 1023px) { #allSectionsWrapper .grid-text-section .grid-text .grid-text-content .btns-custom-container a.tiny-btn, .grid-row.image-text-grid .grid-row-cell.grid-row-cell-text .grid-row-text a.grid-row-button { min-width: 150px; padding-block: 12px; max-height: unset; } } /**/ /*--------------------/* KDM-STRIP /*--------------------*/ #allSectionsWrapper > .section.kdm-strip { } #allSectionsWrapper > .section.kdm-strip .section-title { display: flex; align-items: center; margin-inline-end: auto; opacity: 1; } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row { position: fixed; bottom: 6%; width: max(30%, 560px); background: var(--white); left: 50%; transform: translateX(-50%); justify-content: flex-end; padding-inline: var(--gap-48) var(--gap-2); padding-block: var(--gap-6); border-radius: 50px; border: 1px solid #ededed; box-shadow: 0px 6px 20px -5px rgba(0, 0, 0, 0.12); z-index: 99; } #allSectionsWrapper > .section.kdm-strip .section-title h2 { font-family: var(--font-1); font-size: clamp(14px, var(--fs-16),300px); } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box { display: flex; align-items: center; justify-content: center; border: 1px solid; width: fit-content; min-width: 150px; margin-inline-end: 6px; padding-block: var(--gap-12); border-radius: 50px; } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box .grid-box-image { width: 20px; } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box .grid-box-title { } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box .grid-box-title h3 { display: flex; } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box .grid-box-title h3 a { font-size: clamp(14px,var(--fs-16),300px); } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box .grid-box-title h3 a:focus { text-decoration: underline; } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box.lastItem { background: var(--black); color: var(--white); border: 1px solid var(--black); } @media(min-width: 1024px) { } @media(max-width: 1023px) { #allSectionsWrapper > .section.kdm-strip .section-title { width: 199px; border: 1px solid; border-radius: 50px; background: var(--black); } #allSectionsWrapper > .section.kdm-strip .section-title h2 { color: var(--white); font-size: 14px; } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row { width: fit-content; background: none; box-shadow: none; border: none; padding-inline: var(--gap-20); gap: 12px; } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box { min-width: 54px; margin: 0; gap: 12px; background: var(--white); border: 1px solid; } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box.lastItem { background: var(--white); } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box.lastItem:before { content: url("https://media.getmood.io/warehouse/dynamic/629387.svg"); } #allSectionsWrapper > .section.kdm-strip .grid-boxes.row .grid-box .grid-box-title { display: none; } } /**/ /*--------------------/* POPUP /*--------------------*/ .modal .close { position: absolute; z-index: 100; width: fit-content; background: var(--black); padding: 20px; margin: 0; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row { display: flex; flex-direction: column; width: 34%; margin-inline: auto; background: var(--white); text-align: center; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row#grid-row1 { display: none; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row.bakery h1 { border: none; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row h1 { font-size: clamp(48px,var(--fs-48),300px); padding-block: var(--gap-20) var(--gap-28); border-bottom: 2px solid #E0E0E0; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text { text-align: center; padding: var(--gap-32); margin: 0; } .modal:not(#bakery-modal) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text:first-child { border-left: 1px solid #E0E0E0; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text h2 { font-size: clamp(24px,var(--fs-24),300px); margin-bottom: var(--gap-32); } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text .text-wrapper.text1 { } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text .text-wrapper.text1 p { line-height: 1.4; font-size: clamp(16px,var(--fs-16),300px); width: 55%; margin-inline: auto; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text button.text-wrapper.text2 { margin-top: var(--gap-32); min-width: 150px; padding-block: var(--gap-16); border-radius: 50px; border: none; background: var( --black); color: var( --white); font-size: clamp(16px,var( --fs-16),300px); } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row.bakery .grid-row-cell.grid-row-cell-text .grid-row-text { width: 100%; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row.bakery .grid-row-cell.grid-row-cell-text .grid-row-text .text-wrapper.text1 p { width: 100%; } @media(min-width: 1024px) { .modal .close svg { width: 1.302vw; height: 1.302vw; } } @media(max-width: 1023px) { .modal-content { height: 100%; background: var(--white); } .modal .close { background: var(--white); padding-inline: 12px; padding-top: var(--gap-24); } .modal .close svg { fill: var(--black); width: 22px; height: 22px; } .modal:not(#bakery-modal) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text:first-child { margin: 0; padding-block: var(--gap-32); padding-inline: 0; border-left: none; border-bottom: 1px solid #e0e0e0; width: 100%; } .modal.fade { overflow-y: auto; } .modal.fade .modal-dialog { overflow: auto; } #popup-modal .close span::before { color: var(--black); } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row { width: 100%; overflow: auto; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row h1 { font-size: 32px; padding-block: var(--gap-64); } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.flexslider-box { display: none !important; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text { float: none !important; margin-inline: auto; display: block !important; } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text { padding: var(--gap-32) var(--gap-24); } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text .buttons-wrapper { display: flex; justify-content: center; gap: var(--gap-12); } :is(div, #MenuModule) #PopUpData .grid-rows .grid-row .grid-row-cell.grid-row-cell-text .grid-row-text button.text-wrapper.text2 { font-size: 15px; padding-block: var(--gap-12); } } /**/ /*--------------------/* ANIMATION /*--------------------*/ @keyframes slideRight { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } } .requiredNotice { text-align: right; display: block; margin-bottom: var(--gap-30); font-size: clamp(1.2rem, var(--fs-14), 1000rem); color: var(--text); padding-inline: 15px; }