/*** The new CSS reset - version 1.9 (last updated 19.6.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) */ *:where( :not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *) ) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: initial; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable="false"])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable="true"]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; } :root { --layoutWidth: calc(100vw - 32px); --paddingNormal: 16px; --paddingxLarge: 128px; --borderRadius: 10px; --gap-sm: 6px; --gap-md: 16px; --gap-lg: 42px; --section-gap-lg: 42px; --max-width: 1080px; --pad-lg: 32px; --pad-md: var(--gap-md); --pad-sm: var(--gap-sm); --pad-xs: 3px; --radius: 12px; --radius-sm: 6px; --aiblack: rgb(26, 27, 28); --orange: hsl(34, 100%, 69%); --grey: hsl(0, 0%, 96%); --dark-grey: hsl(0deg 0% 86%); --greytxt: hsl(0, 0%, 54%); --alert: hsl(44, 100%, 92%); --alert-dark: hsl(44deg 98% 80%); --alert-red: hsl(338, 100%, 95%); --alert-red-dark: hsl(338, 100%, 78%); --border-color: hsl(0, 0%, 74%); --desktopnav: none; --logodesktop: none; font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; } @media (min-width: 768px) { :root { --gap-lg: 64px; --pad-lg: 64px; --section-gap-lg: 64px; --desktopnav: flex; --logodesktop: block; } } @media (min-width: 1112px) { :root { --layoutWidth: 1080px; } } ::marker { content: ""; } ::placeholder { color: #cccccc; } html { -webkit-text-size-adjust: 100%; line-height: 1.15; overflow-x: hidden; } body { color: var(--aiblack); margin: 0; /* overflow-x: hidden; */ /* padding-bottom: var(--mobFooter); */ min-height: 100vh; position: relative; } .container { display: flex; justify-content: center; } .lcontainer { width: 100%; max-width: var(--layoutWidth); margin: 0 var(--paddingNormal); padding: var(--sectionPaddingTop) 0 var(--sectionPaddingBottom); } .relative { position: relative; } .absolute { position: absolute; } /* Chrome, Safari, Edge, Opera */ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ input[type="number"] { -moz-appearance: textfield; } .preload * { -webkit-transition: none !important; -moz-transition: none !important; -ms-transition: none !important; -o-transition: none !important; transition: none !important; } h1, .title { font-size: clamp(28px, 2.2vw, 34px); font-weight: 700; letter-spacing: -0.025em; line-height: 1; } h2 { font-size: clamp(18px, 1.4vw, 24px); font-weight: 600; letter-spacing: -0.025em; line-height: 1; } h3 { font-size: clamp(16px, 1.2vw, 20px); font-weight: 500; line-height: 1.4; } .fs-12 { font-size: 12px; } .fs-13 { font-size: 13px; } .fs-10 { font-size: 10px; } .fw-600 { font-weight: 600; } .fw-700 { font-weight: 700; } .placeholder { font-size: 12px; color: var(--grey-txt); } .flex { display: flex; } .grid { display: grid; } .flex-column { flex-direction: column; } .flex-wrap { flex-wrap: wrap; } .gc-2, .gc-3 { grid-template-columns: 1fr; } .gc-4 { grid-template-columns: repeat(2, 1fr); } @media (min-width: 768px) { .gc-2 { grid-template-columns: repeat(2, 1fr); } .gc-3 { grid-template-columns: repeat(3, 1fr); } .gc-4 { grid-template-columns: repeat(4, 1fr); } } .gap-sm { gap: var(--gap-sm); } .gap-md { gap: var(--gap-md); } .gap-header { gap: 40px; } .gap-lg { gap: var(--gap-lg); } .section-gap-lg { gap: var(--section-gap-lg); } .pad-t-64 { padding-top: 64px; } .pad-t-48 { padding-top: 48px; } .mar-t-48 { margin-top: 48px; } .pad-tb-sm { padding: var(--pad-sm) 0; } .pad-tb-lg { padding: var(--pad-lg) 0; } .pad-md { padding: var(--pad-md); } .pad-sm { padding: var(--pad-sm); } .pad-xs { padding: var(--pad-xs) var(--pad-sm); } .space-between { justify-content: space-between; } .space-around { justify-content: space-around; } .items-center { place-items: center; } .align-center { align-items: center; } .content-center { place-content: center; } .content-end { place-content: end; } .items-end { place-items: end; } .cursor-pointer { cursor: pointer; } .cursor-notallowed { cursor: not-allowed; } .of { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .of-hidden { overflow: hidden; } .ul { text-decoration: underline; } ol { display: inline-flex; font-weight: 600; list-style: none; font-size: 13px; } @media (min-width: 375px) { ol { font-size: 16px; } } ol li { padding-left: 6px; } ol li:after { content: "›"; padding-left: 6px; } ol li:nth-child(1):before { content: ""; padding: 0; } ol li:last-child:after { content: ""; } em { font-style: italic; } strong { font-weight: 600; } table { width: 100%; } th { background-color: hsl(0, 0%, 80%); } tr, td, th { border: 1px solid; } td, th { padding: 6px 12px; max-width: 100%; white-space: nowrap; } select:not([size]) { /* padding: 4px 8px; */ appearance: auto; } .header { padding: 12px var(--paddingNormal); } .header-border { border-bottom: 1px solid var(--dark-grey); } .topmenu { display: grid; grid: auto / 1fr max-content; gap: 16px; align-items: center; justify-content: center; font-size: 14px; } /* Show/hide based on element content */ /* Hide when the target element is empty */ .show-if-not-empty { display: none; } /* Show when the target element has content */ .show-if-not-empty:has(#valid_from_date:not(:empty)) { display: block; } /* hamb*/ .hamb { cursor: pointer; justify-self: end; } @media (min-width: 768px) { .hamb { display: none; } nav { max-height: 100%; } } .hamb-line { background: #000; display: block; height: 2.89px; position: relative; width: 24px; } .hamb-line::before, .hamb-line::after { background: #000; content: ""; display: block; height: 100%; position: absolute; transition: all 0.2s ease-out; width: 100%; } .hamb-line::before { top: 6px; } .hamb-line::after { top: -6px; } .side-menu { display: none; } /* Toggle menu icon */ .side-menu:checked ~ .mobile-menu { /* max-height: 280px; height: 280px; */ display: flex; } .side-menu:checked ~ .hamb .hamb-line { background: transparent; } .side-menu:checked ~ .hamb .hamb-line::before { transform: rotate(-45deg); top: 0; } .side-menu:checked ~ .hamb .hamb-line::after { transform: rotate(45deg); top: 0; } .desktop-menu { display: var(--desktopnav); align-items: center; margin: 0; padding: 0; list-style: none; font-weight: 600; } .mobile-menu { display: none; place-items: center; padding: 16px; margin: 0; position: absolute; top: 70px; left: 0; width: 100vw; font-weight: 600; flex-direction: column; transition: ease-out 250ms; z-index: 1; background-color: #fff; } @media (min-width: 768px) { .mob-only { display: none; } } .logo { font-weight: 600; font-size: 20px; } .logo-cont { justify-self: start; } @media (min-width: 768px) { .header { padding: 12px var(--paddingNormal); } .topmenu { grid: auto / max-content 1fr max-content; } } .menu { display: grid; place-items: center; padding: 0; margin: 0; gap: 40px; } @media (min-width: 768px) { .menu { flex-direction: row; grid-auto-flow: column; } } .bg-grey { background-color: var(--grey); } .br-grey { border: 1px solid var(--dark-grey); } .sh-grey { box-shadow: inset 0 -1px hsl(220, 23%, 92%); } .br-top { border-top: 1px solid var(--dark-grey); } .br-top-light { border-top: 1px solid var(--grey); } .w-100 { width: 100%; } .vh-100 { height: 100vh; } .text-center { text-align: center; } .text-right { text-align: right; } .border { border: 1px solid var(--dark-grey); border-radius: var(--borderRadius); } .br-round { border-radius: var(--borderRadius); } .bg-alert { background-color: var(--alert); } .bg-alert-red { background-color: var(--alert-red); } .bg-alert-fill { background-color: var(--alert-dark); border-radius: 50%; padding: 2px; place-content: center; place-items: center; display: flex; } .bg-alert-fill-grey { background-color: var(--dark-grey); } .bg-alert-fill-red { background-color: var(--alert-red-dark); } .c-pointer { cursor: pointer; } input, select { padding: 8px 12px; line-height: 1.4; width: 100%; border: 1px solid var(--border-color); border-radius: var(--borderRadius); /* display: flex; place-items: center; */ height: 42px; } input:focus-visible, input:focus { border-color: var(--aiblack); box-shadow: 0 0 0 1px var(--aiblack); } .scroll { overflow-x: scroll; overflow-y: hidden; white-space: nowrap; } .scroll::-webkit-scrollbar { display: none; } .inp-div { padding: 8px 12px; line-height: 1.5; width: 100%; border: 1px solid var(--border-color); border-radius: var(--borderRadius); cursor: pointer; } .badge { text-transform: uppercase; background-color: #edeef0; color: #111; font-size: 11px; font-weight: 600; border-radius: 9999px; padding: 3px 8px 4px; } .badge-cont { display: flex; flex-wrap: wrap; gap: 4px; } .alert-badge { background: #ffc2d8; justify-content: center; padding: 6px 12px; border-radius: 9999px; text-transform: initial; font-size: 16px; } .hero { max-width: 600px; margin: 0 auto; } .sub { max-width: 460px; margin: 0 auto; } .mkt-gradient { background-image: linear-gradient( 241deg, rgb(142, 197, 252) 0%, rgb(224, 195, 252) 100% ); border-radius: var(--borderRadius); } .mkt-img-map { max-height: 260px; width: 100%; object-fit: cover; box-shadow: 9px 12px 19px 4px rgb(0 0 0 / 23%), 4px 8px 10px -6px rgb(0 0 0 / 23%); } .mkt-img-txt { position: absolute; bottom: 0; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); background: rgba(2, 19, 54, 0.9); } .mkt-gradient .flag { position: absolute; right: -12px; top: 0; width: 60px; height: 35px; border-radius: 6px; transform: rotate(16deg); } .mkt-grid { grid-template-columns: 1fr; font-weight: 600; color: #301d49; padding: 16px; } @media (min-width: 768px) { .mkt-img-map { max-height: 400px; width: 400px; } .mkt-grid { grid-template-columns: 1fr max-content; font-size: 26px; padding: 16px 86px; } } .mini-cta { color: #fff; background-color: #301d49; border-radius: var(--borderRadius); font-weight: 600; font-size: 18px; padding: 8px 16px; margin-top: 32px; } .bg-p { background-color: hsl(213, 78%, 91%); border-bottom: 3px solid hsl(213, 78%, 82%); } .mh { min-height: calc(100vh); } .svg-icon { width: 24px; height: 24px; user-select: none; } .btn { color: #fff; background-color: var(--aiblack); border-radius: var(--borderRadius); height: 48px; width: 100%; font-weight: 600; text-align: center; cursor: pointer; display: flex; justify-content: center; align-items: center; } .select-btn { background-color: rgba(20, 97, 255, 1); color: #fff; font-size: 13px; width: 100%; text-align: center; } .btn-disabled { cursor: not-allowed; background-color: var(--dark-grey); } .top-btn { color: #fff; background-color: var(--aiblack); border-radius: var(--borderRadius); font-weight: 600; padding: 8px 12px; text-align: center; } /* faq */ .faq-container { display: grid; gap: var(--gap-md); font-size: 16px; width: 100%; max-width: 720px; } .faq-item { border: 2px solid var(--border-color); border-radius: 12px; width: 100%; background: #fff; } .faq-head { font-weight: 700; letter-spacing: 1.2px; font-size: 18px; line-height: 1.6; padding: 8px 16px; user-select: none; cursor: pointer; } .faq-item[open] > summary { border-bottom: 2px dashed var(--border-color); } .faq-item[open] > summary .svg-icon { transform: rotate(180deg); } .faq-text { line-height: 1.6; padding: 16px; } @media (min-width: 768px) { .faq-container { font-size: 18px; } .faq-item { min-width: calc(var(--layoutWidth) / 3); } } .faq-text dl { background: #f0f0f0; border-radius: var(--radius); display: grid; /* grid-template-columns: repeat(2, 1fr); */ padding: 10px; gap: 0 var(--gap-sm); } .faq-text dl div { display: grid; gap: var(--gap-sm); padding: var(--pad-sm); align-content: baseline; } .faq-text dl div:not(:last-child)::after { content: ""; border-bottom: 1px solid hsl(0 0% 87% / 1); margin: 0 -16px; } .faq-text dt { text-transform: uppercase; font-weight: 600; font-size: 11px; } .faq-text dd { font-size: 14px; } /* //faq */ /*calendar*/ .calendar-container { gap: 12px; display: grid; width: 0; height: 0; outline: 0; opacity: 0; visibility: hidden; border: 1px solid var(--grey); background-color: #fff; border-radius: 0.5rem; box-shadow: 0 4px 14px 0 rgba(37, 32, 31, 0.25); padding: var(--pad-md); position: absolute; transition: opacity 0.2s ease-in-out; /* top: calc(100% + 10px); left: calc(-50%); */ } .triangle { width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #fff; position: absolute; top: -10px; left: calc(50% - 5px); } .calendar-navigation { display: flex; } .calendar-navigation span:last-child { margin-right: -10px; } .calendar-body ul { list-style: none; flex-wrap: wrap; display: flex; text-align: center; } .calendar-weekdays { box-shadow: 0 1px 0 0 var(--grey); padding: var(--gap-sm); } .calendar-dates { padding-top: var(--gap-md); gap: 12px 0; padding: var(--gap-sm); } .calendar-body .calendar-dates li { display: flex; align-items: center; justify-content: center; } .calendar-body li { width: calc(100% / 7); font-size: 1.07rem; color: #414141; } .calendar-body .calendar-weekdays li { cursor: default; font-weight: 600; } .date-btn { position: relative; z-index: 1; cursor: pointer; font-weight: 600; height: 44px; width: 44px; padding: 0; border: none; border-radius: 50%; display: flex; justify-content: center; align-items: center; flex-direction: column; } .daily-price-sm { font-size: 10px; font-weight: 500; } .calendar-dates .date-btn.inactive { color: rgba(0, 0, 0, 0.2); cursor: not-allowed; text-decoration: line-through; } .calendar-dates .date-btn.active { color: #fff; } .calendar-dates .date-btn.active { background: #0062e3; } .calendar-dates .date-btn:not(.active):hover { background: #eff1f2; } .calendar-selectmenu { display: inline-block; width: 100%; padding: 8px 12px; border: solid 0.0625rem #c2c9cd; border-radius: 0.25rem; background-size: 1.125rem; color: #161616; line-height: 1.375rem; font-size: 14px; } @media (min-width: 768px) { .calendar-selectmenu { font-size: initial; } } /*//calendar*/ /*helpbuoy*/ .utm-help { position: fixed; right: 32px; bottom: 24px; opacity: 0; animation: spin 0.964s cubic-bezier(0.39, 0.66, 0.21, 0.92) 1.964s forwards; } .utm-help svg { transition: transform 100ms linear; } .utm-help svg:hover { transform: scale(1.1); } @media (min-width: 768px) { .utm-help { right: 48px; bottom: 48px; } } @keyframes spin { 0% { transform: translateX(calc(100% + 42px)) rotate(0deg); opacity: 1; } 100% { transform: translateX(0) rotate(-360deg); opacity: 1; } } #utm-lang-dialog, #utm-help-dialog { border: none; padding: 0; max-width: 650px; } #utm-lang-dialog[open]::backdrop, #utm-help-dialog[open]::backdrop { background-color: rgb(0 0 0 / 25%); } body:has(.cookie) .utm-help { bottom: 232px; } body:has(.mobile-cta) .utm-help { bottom: 80px; } @media (min-width: 768px) { body:has(.mobile-cta) .utm-help { bottom: 48px; } } /*//helpbuoy*/ .gradient-bg { --s: 6px; background-image: linear-gradient( 90deg, rgba(246, 182, 13, 1) 0%, rgba(246, 182, 13, 1) 25%, rgba(252, 108, 84, 1) 25%, rgba(252, 108, 84, 1) 45%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 55%, rgba(0, 25, 255, 1) 55%, rgba(0, 25, 255, 1) 75%, rgba(20, 97, 255, 1) 75%, rgba(20, 97, 255, 1) 100% ); background-size: 100% var(--s); background-position: bottom; background-repeat: no-repeat; position: relative; /* width: 100%; height: 6px; */ } .gradient-bg::after { content: ""; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='100%25' height='100%25' viewBox='0 0 42 42' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3e%3cpath id='skyblue' d='M0.105,23.1c1.079,10.731 10.11,18.9 20.895,18.9c10.785,0 19.816,-8.169 20.895,-18.9l-41.79,0Z' style='fill:%231461ff;'/%3e%3cpath id='deepblue' d='M2.813,31.5c3.752,6.497 10.684,10.5 18.187,10.5c7.503,0 14.435,-4.003 18.187,-10.5l-36.374,0Z' style='fill:%230019ff;'/%3e%3cpath id='white' d='M41.895,23.1c0.07,-0.698 0.105,-1.399 0.105,-2.1c0,-0.701 -0.035,-1.402 -0.105,-2.1l-41.79,0c-0.07,0.698 -0.105,1.399 -0.105,2.1c-0,0.701 0.035,1.402 0.105,2.1l41.79,-0Z' style='fill:%23fff;'/%3e%3cpath id='orange' d='M41.895,18.9c-1.079,-10.731 -10.11,-18.9 -20.895,-18.9c-10.785,-0 -19.816,8.169 -20.895,18.9l41.79,-0Z' style='fill:%23fc6c54;'/%3e%3cpath id='yellow' d='M39.187,10.5c-3.752,-6.497 -10.684,-10.5 -18.187,-10.5c-7.503,-0 -14.435,4.003 -18.187,10.5l36.374,-0Z' style='fill:%23f6b60d;'/%3e%3cg id='nap'%3e%3ccircle cx='21' cy='18.9' r='3.5' style='fill:%23fff;'/%3e%3cpath d='M11.746,10.577c-0.293,-0.293 -0.768,-0.293 -1.061,-0l-1.061,1.06c-0.292,0.293 -0.292,0.768 0,1.061l3.359,3.359c0.586,0.585 1.536,0.585 2.122,-0c0.585,-0.585 0.585,-1.536 -0,-2.121l-3.359,-3.359Z' style='fill:%23fff;'/%3e%3cpath d='M22.5,7.75c0,-0.414 -0.336,-0.75 -0.75,-0.75l-1.5,0c-0.414,0 -0.75,0.336 -0.75,0.75l0,4.75c0,0.828 0.672,1.5 1.5,1.5c0.828,0 1.5,-0.672 1.5,-1.5l0,-4.75Z' style='fill:%23fff;'/%3e%3cpath d='M32.376,12.791c0.292,-0.293 0.292,-0.768 -0,-1.061l-1.061,-1.06c-0.293,-0.293 -0.768,-0.293 -1.061,-0l-3.359,3.358c-0.585,0.586 -0.585,1.536 0,2.122c0.586,0.585 1.536,0.585 2.122,-0l3.359,-3.359Z' style='fill:%23fff;'/%3e%3c/g%3e%3c/svg%3e"); background-position: bottom; background-repeat: no-repeat; position: absolute; --w: 36px; bottom: calc(-1 * calc(var(--w) / 2) + calc(var(--s) / 2)); left: calc(50% - calc(var(--w) / 2)); width: var(--w); height: var(--w); } .spinloader { animation: spinloader 2s infinite linear; display: none; } @keyframes spinloader { from { transform: rotate(-360deg); } to { transform: rotate(360deg); } } /*card*/ .card { position: relative; display: grid; height: 100%; width: 180px; } @media (min-width: 768px) { .card { width: 240px; } } .card__content { display: flex; flex-direction: column; justify-content: flex-start; margin-left: 8px; } .card__thumb, .card__content, .card__tag { grid-area: 1/-1; } .card__tag { align-self: start; justify-self: start; margin-left: 8px; margin-top: 8px; } .card__salebadge { padding: 3px 4px; background-color: var(--aiblack); width: fit-content; color: #fff; border-radius: 4px; font-size: 12px; font-weight: 600; height: 20px; } .hotel-cont .pad-md { padding: 8px; } @media (min-width: 768px) { .hotel-cont .pad-md { padding: 16px; } } /*//card*/ /* LANG*/ .language-selector { position: relative; } .lang-dropdown-toggle { display: flex; align-items: center; gap: 0.25rem; cursor: pointer; padding: 0.5rem; border-radius: 4px; transition: background-color 0.2s; } .lang-dropdown-toggle:hover { background-color: rgba(0, 0, 0, 0.05); } .current-lang { font-weight: 600; } .lang-dropdown-menu { position: absolute; top: 100%; right: 0; background: white; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); border-radius: 4px; min-width: 150px; z-index: 100; display: none; overflow: hidden; } .language-selector:hover .lang-dropdown-menu, .language-selector:focus-within .lang-dropdown-menu { display: block; } .lang-option { display: flex; align-items: center; gap: 4px; padding: 8px 12px; text-decoration: none; color: inherit; transition: background-color 0.2s; } .lang-option:hover { background-color: rgba(0, 0, 0, 0.05); } .lang-option.active { background-color: rgba(0, 0, 0, 0.08); } .lang-option svg { border: 1px solid rgba(0, 0, 0, 0.1); } /* //LANG*/ .footer { margin-top: var(--paddingxLarge); padding: 32px 16px 90px; } .footer-menu { align-items: start; font-weight: 600; grid-template-columns: 1fr; row-gap: 16px; } @media (min-width: 768px) { .footer-menu { grid-template-columns: repeat(4, 1fr); } }