@import url(https://fonts.googleapis.com/css2?family=Sofia+Sans+Semi+Condensed:ital,wght@0,1..1000;1,1..1000&display=swap); .mybutton { background: #ddd url(../shared/image/button.gif) repeat-x 0 0; border: 1px solid #bbb; border-radius: 3px; cursor: pointer; padding: 3px 8px; text-align: center; line-height: normal } .mybutton:hover, .mybutton:focus { background-position: 0 -6px; border-color: #999 } .mybutton:active { background-image: none } #stats { position: absolute; top: 5px; right: 0; padding: 5px; background: #fff; color: #000; z-index: 99 } input.error, textarea.error, select.error { background: #f8dbdb !important; border-color: #e77776 !important; color: #000 !important } .validator-summary { font-size: 14px; font-weight: bold; color: #f00; padding: 5px 5px 5px 20px } .validator-summary li { list-style-type: square } .validator { color: #f00; margin-left: 10px } .cf:before, .cf:after { content: " "; display: table } .cf:after { clear: both } .video-container { position: relative; padding-top: 30px; padding-bottom: 56.25%; height: 0; overflow: hidden } .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100% } #popup-content { display: none } .filednd { position: relative } .filednd input { position: absolute; cursor: pointer; left: 0px; top: 0px; padding: 0; bottom: 0; opacity: 0; height: 100%; width: 100% } .lock-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.8); border-radius: 5px; animation: lock-overlay-opacity 0.2s ease-in-out normal } .lock-overlay>* { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); min-width: 30%; padding: 10px; text-align: center; border: 5px solid #333; background: #fff; border-radius: 5px; text-decoration: none; color: #000 } @keyframes lock-overlay-opacity { 0% { opacity: 0 } 100% { opacity: 1 } } #responsive-state { z-index: 10 } @media only screen and (max-width: 767px) { #responsive-state { z-index: 3 } } #popup-content { display: none } #swal2-content { font-size: 16px } .gm-ui-hover-effect { display: none !important } .gm-style-iw-t.red .gm-style-iw, .gm-style-iw-t.red .gm-style-iw-tc::after { background: #f0592b !important } #simple-popup { position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 101 } .simple-popup-content { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); max-height: 80%; max-width: 100%; z-index: 102; padding: 30px 40px; overflow: auto } .simple-popup-content .close { position: absolute; right: 0; top: 0 } .simple-popup-content .close::before { display: inline-block; text-align: center; content: "\00d7"; font-size: 40px; color: lightgrey; width: 40px; line-height: 40px } .simple-popup-content .close:hover { cursor: hand; cursor: pointer } .simple-popup-content .close:hover::before { color: grey } #simple-popup-backdrop, .simple-popup-backdrop-content { position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 100 } #simple-popup, #simple-popup-backdrop, #simple-popup.hide-it, #simple-popup-backdrop.hide-it { -webkit-transition-property: opacity; -moz-transition-property: opacity; -ms-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity } #simple-popup.hide-it, #simple-popup-backdrop.hide-it { opacity: 0 } #simple-popup, #simple-popup-backdrop { opacity: 1 } .simple-popup-content { width: auto; height: auto; background: transparent } .simple-popup-backdrop-content { opacity: 0.9; background: #000 } #simple-popup, #simple-popup-backdrop { -webkit-transition-timing-function: ease; -moz-transition-timing-function: ease; -ms-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -ms-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s } #simple-popup.hide-it, #simple-popup-backdrop.hide-it { -webkit-transition-timing-function: ease; -moz-transition-timing-function: ease; -ms-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -ms-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s } a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline } html { line-height: 1 } ol, ul { list-style: none } table { border-collapse: collapse; border-spacing: 0 } caption, td, th { text-align: left; font-weight: 400; vertical-align: middle } blockquote, q { quotes: none } blockquote::after, blockquote:before, q::after, q:before { content: ""; content: none } a img { border: none } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block } .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0 } .slick-list:focus { outline: none } .slick-list.dragging { cursor: pointer; cursor: hand } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } .slick-track { position: relative; left: 0; top: 0; display: block } .slick-track::before, .slick-track::after { content: ""; display: table } .slick-track::after { clear: both } .slick-loading .slick-track { visibility: hidden } .slick-slide { float: left; height: 100%; min-height: 1px; display: none } [dir="rtl"] .slick-slide { float: right } .slick-slide img { display: block } .slick-slide.slick-loading img { display: none } .slick-slide.dragging img { pointer-events: none } .slick-initialized .slick-slide { display: block } .slick-loading .slick-slide { visibility: hidden } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent } .slick-arrow.slick-hidden { display: none } .vbox-overlay { --vbox-tools-color: #fff; --vbox-title-background: #101010; --vbox-title-width: 'auto'; --vbox-title-radius: 0; --vbox-share-background: #101010; --vbox-share-width: 'auto'; --vbox-share-radius: 0; --vbox-padding: 0 } .vbox-overlay *, .vbox-overlay :after, .vbox-overlay :before { -webkit-backface-visibility: hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .vbox-overlay * { -webkit-backface-visibility: visible; backface-visibility: visible } .vbox-overlay { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; position: fixed; left: 0; top: 0; bottom: 0; right: 0; z-index: 999999 } .vbox-share, .vbox-title { line-height: 1; position: fixed; z-index: 98; text-align: center; margin: 0 auto; color: var(--vbox-tools-color) } .vbox-title { font-size: 12px; background-color: var(--vbox-title-background); width: var(--vbox-title-width); border-radius: var(--vbox-title-radius); padding: 12px 54px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block } .vbox-share { font-size: 24px; padding: 0 0.35em; background-color: var(--vbox-share-background); width: var(--vbox-share-width); border-radius: var(--vbox-share-radius) } .vbox-link-btn, button.vbox-link-btn, button.vbox-link-btn:active, button.vbox-link-btn:focus, button.vbox-link-btn:hover { border: none !important; background: 0 0 !important; box-shadow: none !important; color: inherit !important; padding: 6px 12px; outline: 0; display: inline-block; cursor: pointer } .vbox-share a { color: inherit !important; padding: 6px 12px; display: inline-block } .vbox-share svg { z-index: 10; vertical-align: middle } .vbox-close { cursor: pointer; position: fixed; top: 0; right: 0; z-index: 99; padding: 6px 15px; color: #000; color: var(--vbox-tools-color); border: 0; font-size: 24px; display: flex; align-items: center; opacity: 0.8; transition: opacity 0.2s } .vbox-close:hover { opacity: 1 } .vbox-left-corner { cursor: pointer; position: fixed; left: 0; top: 0; overflow: hidden; line-height: 1; font-size: 12px; z-index: 99; display: flex; align-items: center; color: var(--vbox-tools-color) } .vbox-num { display: inline-block; padding: 12px 15px } .vbox-left { left: 0 } .vbox-right { right: 0 } .vbox-top { top: 0 } .vbox-bottom { bottom: 0 } .vbox-next, .vbox-prev { position: fixed; top: 50%; margin-top: -15px; overflow: hidden; cursor: pointer; display: block; width: 45px; height: 45px; z-index: 99; opacity: 0.8; transition: opacity 0.2s } .vbox-next:hover, .vbox-prev:hover { opacity: 1 } .vbox-next span, .vbox-prev span { position: relative; width: 20px; height: 20px; border: 2px solid transparent; border-top-color: var(--vbox-tools-color); border-right-color: var(--vbox-tools-color); text-indent: -100px; position: absolute; top: 8px; display: block } .vbox-prev { left: 15px } .vbox-next { right: 15px } .vbox-prev span { left: 10px; -ms-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); transform: rotate(-135deg) } .vbox-next span { -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); right: 10px } .vbox-inline, .venoratio { position: relative; width: 100%; margin: 0 auto } .venoratio::before { display: block; padding-top: var(--vb-aspect-ratio); content: "" } .venoratio>* { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: var(--vbox-padding) } .venoratio-1x1 { --vb-aspect-ratio: 100% } .venoratio-4x3 { --vb-aspect-ratio: calc(3 / 4 * 100%) } .venoratio-16x9 { --vb-aspect-ratio: calc(9 / 16 * 100%) } .venoratio-21x9 { --vb-aspect-ratio: calc(9 / 21 * 100%) } .venoratio-full { --vb-aspect-ratio: calc(100vh - 100px) } .vbox-child.vbox-inline, .vbox-child.venoratio { max-width: 100% } .vbox-open { overflow: hidden } .vbox-container { position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow-x: hidden; overflow-y: scroll; overflow-scrolling: touch; -webkit-overflow-scrolling: touch; z-index: 20; max-height: 100%; padding: 30px 0 } .vbox-content { opacity: 0 } .vbox-content { text-align: center; width: 100%; position: relative; overflow: hidden; padding: 20px 4%; display: flex; align-items: center; justify-content: center; min-height: 100% } .vbox-container img { max-width: 100%; height: auto } .vbox-child { box-shadow: 0 0 12px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); max-width: 100%; text-align: initial; padding: var(--vbox-padding) } .vbox-child img { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; display: block } .vbox-grab .vbox-child img { cursor: grab } .vbox-child>iframe { border: none !important } .vbox-content.swipe-left { margin-left: -200px !important } .vbox-content.swipe-right { margin-left: 200px !important } .vbox-preloader { -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0) } .vbox-preloader .vbox-preloader-inner { opacity: 1; transition: opacity 0.2s } .vbox-hidden { display: none } .vbox-preloader.vbox-hidden .vbox-preloader-inner { opacity: 0 } .vbox-backdrop { position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: translateZ(-1px); -moz-transform: translateZ(-1px); -o-transform: translateZ(-1px); transform: translateZ(-1px); z-index: 0 } .vbox-tooltip { position: relative; display: inline-block } .vbox-tooltip .vbox-tooltip-text { visibility: hidden; color: #fff; text-align: center; padding: 0; position: absolute; z-index: 1; bottom: 100%; left: 0; opacity: 0; transition: opacity 0.3s; margin-bottom: 2px; font-family: sans-serif } .vbox-top .vbox-tooltip .vbox-tooltip-text { bottom: auto; top: 100%; margin-bottom: 0; margin-top: 2px } .vbox-tooltip-inner { padding: 5px 10px; background-color: rgba(0, 0, 0, 0.9); border-radius: 6px; font-size: 10px } .vbox-tooltip:hover .vbox-tooltip-text { visibility: visible; opacity: 1 } .vbox-overlay { --sk-size: 40px; --sk-color: #333 } .sk-center { margin: auto } .sk-plane { width: var(--sk-size); height: var(--sk-size); background-color: var(--sk-color); animation: sk-plane 1.2s infinite ease-in-out } @keyframes sk-plane { 0% { transform: perspective(120px) rotateX(0) rotateY(0) } 50% { transform: perspective(120px) rotateX(-180.1deg) rotateY(0) } 100% { transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg) } } .sk-chase { width: var(--sk-size); height: var(--sk-size); position: relative; animation: sk-chase 2.5s infinite linear both } .sk-chase-dot { width: 100%; height: 100%; position: absolute; left: 0; top: 0; animation: sk-chase-dot 2s infinite ease-in-out both } .sk-chase-dot:before { content: ''; display: block; width: 25%; height: 25%; background-color: var(--sk-color); border-radius: 100%; animation: sk-chase-dot-before 2s infinite ease-in-out both } .sk-chase-dot:nth-child(1) { animation-delay: -1.1s } .sk-chase-dot:nth-child(2) { animation-delay: -1s } .sk-chase-dot:nth-child(3) { animation-delay: -0.9s } .sk-chase-dot:nth-child(4) { animation-delay: -0.8s } .sk-chase-dot:nth-child(5) { animation-delay: -0.7s } .sk-chase-dot:nth-child(6) { animation-delay: -0.6s } .sk-chase-dot:nth-child(1):before { animation-delay: -1.1s } .sk-chase-dot:nth-child(2):before { animation-delay: -1s } .sk-chase-dot:nth-child(3):before { animation-delay: -0.9s } .sk-chase-dot:nth-child(4):before { animation-delay: -0.8s } .sk-chase-dot:nth-child(5):before { animation-delay: -0.7s } .sk-chase-dot:nth-child(6):before { animation-delay: -0.6s } @keyframes sk-chase { 100% { transform: rotate(360deg) } } @keyframes sk-chase-dot { 100%, 80% { transform: rotate(360deg) } } @keyframes sk-chase-dot-before { 50% { transform: scale(0.4) } 0%, 100% { transform: scale(1) } } .sk-bounce { width: var(--sk-size); height: var(--sk-size); position: relative } .sk-bounce-dot { width: 100%; height: 100%; border-radius: 50%; background-color: var(--sk-color); opacity: 0.6; position: absolute; top: 0; left: 0; animation: sk-bounce 2s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955) } .sk-bounce-dot:nth-child(2) { animation-delay: -1s } @keyframes sk-bounce { 0%, 100% { transform: scale(0) } 45%, 55% { transform: scale(1) } } .sk-wave { width: var(--sk-size); height: var(--sk-size); display: flex; justify-content: space-between } .sk-wave-rect { background-color: var(--sk-color); height: 100%; width: 15%; animation: sk-wave 1.2s infinite ease-in-out } .sk-wave-rect:nth-child(1) { animation-delay: -1.2s } .sk-wave-rect:nth-child(2) { animation-delay: -1.1s } .sk-wave-rect:nth-child(3) { animation-delay: -1s } .sk-wave-rect:nth-child(4) { animation-delay: -0.9s } .sk-wave-rect:nth-child(5) { animation-delay: -0.8s } @keyframes sk-wave { 0%, 100%, 40% { transform: scaleY(0.4) } 20% { transform: scaleY(1) } } .sk-pulse { width: var(--sk-size); height: var(--sk-size); background-color: var(--sk-color); border-radius: 100%; animation: sk-pulse 1.2s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955) } @keyframes sk-pulse { 0% { transform: scale(0) } 100% { transform: scale(1); opacity: 0 } } .sk-flow { width: calc(var(--sk-size) * 1.3); height: calc(var(--sk-size) * 1.3); display: flex; justify-content: space-between } .sk-flow-dot { width: 25%; height: 25%; background-color: var(--sk-color); border-radius: 50%; animation: sk-flow 1.4s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s infinite both } .sk-flow-dot:nth-child(1) { animation-delay: -0.3s } .sk-flow-dot:nth-child(2) { animation-delay: -0.15s } @keyframes sk-flow { 0%, 100%, 80% { transform: scale(0.3) } 40% { transform: scale(1) } } .sk-swing { width: var(--sk-size); height: var(--sk-size); position: relative; animation: sk-swing 1.8s infinite linear } .sk-swing-dot { width: 45%; height: 45%; position: absolute; top: 0; left: 0; right: 0; margin: auto; background-color: var(--sk-color); border-radius: 100%; animation: sk-swing-dot 2s infinite ease-in-out } .sk-swing-dot:nth-child(2) { top: auto; bottom: 0; animation-delay: -1s } @keyframes sk-swing { 100% { transform: rotate(360deg) } } @keyframes sk-swing-dot { 0%, 100% { transform: scale(0.2) } 50% { transform: scale(1) } } .sk-circle { width: var(--sk-size); height: var(--sk-size); position: relative } .sk-circle-dot { width: 100%; height: 100%; position: absolute; left: 0; top: 0 } .sk-circle-dot:before { content: ''; display: block; width: 15%; height: 15%; background-color: var(--sk-color); border-radius: 100%; animation: sk-circle 1.2s infinite ease-in-out both } .sk-circle-dot:nth-child(1) { transform: rotate(30deg) } .sk-circle-dot:nth-child(2) { transform: rotate(60deg) } .sk-circle-dot:nth-child(3) { transform: rotate(90deg) } .sk-circle-dot:nth-child(4) { transform: rotate(120deg) } .sk-circle-dot:nth-child(5) { transform: rotate(150deg) } .sk-circle-dot:nth-child(6) { transform: rotate(180deg) } .sk-circle-dot:nth-child(7) { transform: rotate(210deg) } .sk-circle-dot:nth-child(8) { transform: rotate(240deg) } .sk-circle-dot:nth-child(9) { transform: rotate(270deg) } .sk-circle-dot:nth-child(10) { transform: rotate(300deg) } .sk-circle-dot:nth-child(11) { transform: rotate(330deg) } .sk-circle-dot:nth-child(1):before { animation-delay: -1.1s } .sk-circle-dot:nth-child(2):before { animation-delay: -1s } .sk-circle-dot:nth-child(3):before { animation-delay: -0.9s } .sk-circle-dot:nth-child(4):before { animation-delay: -0.8s } .sk-circle-dot:nth-child(5):before { animation-delay: -0.7s } .sk-circle-dot:nth-child(6):before { animation-delay: -0.6s } .sk-circle-dot:nth-child(7):before { animation-delay: -0.5s } .sk-circle-dot:nth-child(8):before { animation-delay: -0.4s } .sk-circle-dot:nth-child(9):before { animation-delay: -0.3s } .sk-circle-dot:nth-child(10):before { animation-delay: -0.2s } .sk-circle-dot:nth-child(11):before { animation-delay: -0.1s } @keyframes sk-circle { 0%, 100%, 80% { transform: scale(0) } 40% { transform: scale(1) } } .sk-circle-fade { width: var(--sk-size); height: var(--sk-size); position: relative } .sk-circle-fade-dot { width: 100%; height: 100%; position: absolute; left: 0; top: 0 } .sk-circle-fade-dot:before { content: ''; display: block; width: 15%; height: 15%; background-color: var(--sk-color); border-radius: 100%; animation: sk-circle-fade 1.2s infinite ease-in-out both } .sk-circle-fade-dot:nth-child(1) { transform: rotate(30deg) } .sk-circle-fade-dot:nth-child(2) { transform: rotate(60deg) } .sk-circle-fade-dot:nth-child(3) { transform: rotate(90deg) } .sk-circle-fade-dot:nth-child(4) { transform: rotate(120deg) } .sk-circle-fade-dot:nth-child(5) { transform: rotate(150deg) } .sk-circle-fade-dot:nth-child(6) { transform: rotate(180deg) } .sk-circle-fade-dot:nth-child(7) { transform: rotate(210deg) } .sk-circle-fade-dot:nth-child(8) { transform: rotate(240deg) } .sk-circle-fade-dot:nth-child(9) { transform: rotate(270deg) } .sk-circle-fade-dot:nth-child(10) { transform: rotate(300deg) } .sk-circle-fade-dot:nth-child(11) { transform: rotate(330deg) } .sk-circle-fade-dot:nth-child(1):before { animation-delay: -1.1s } .sk-circle-fade-dot:nth-child(2):before { animation-delay: -1s } .sk-circle-fade-dot:nth-child(3):before { animation-delay: -0.9s } .sk-circle-fade-dot:nth-child(4):before { animation-delay: -0.8s } .sk-circle-fade-dot:nth-child(5):before { animation-delay: -0.7s } .sk-circle-fade-dot:nth-child(6):before { animation-delay: -0.6s } .sk-circle-fade-dot:nth-child(7):before { animation-delay: -0.5s } .sk-circle-fade-dot:nth-child(8):before { animation-delay: -0.4s } .sk-circle-fade-dot:nth-child(9):before { animation-delay: -0.3s } .sk-circle-fade-dot:nth-child(10):before { animation-delay: -0.2s } .sk-circle-fade-dot:nth-child(11):before { animation-delay: -0.1s } @keyframes sk-circle-fade { 0%, 100%, 39% { opacity: 0; transform: scale(0.6) } 40% { opacity: 1; transform: scale(1) } } .sk-grid { width: var(--sk-size); height: var(--sk-size) } .sk-grid-cube { width: 33.33%; height: 33.33%; background-color: var(--sk-color); float: left; animation: sk-grid 1.3s infinite ease-in-out } .sk-grid-cube:nth-child(1) { animation-delay: 0.2s } .sk-grid-cube:nth-child(2) { animation-delay: 0.3s } .sk-grid-cube:nth-child(3) { animation-delay: 0.4s } .sk-grid-cube:nth-child(4) { animation-delay: 0.1s } .sk-grid-cube:nth-child(5) { animation-delay: 0.2s } .sk-grid-cube:nth-child(6) { animation-delay: 0.3s } .sk-grid-cube:nth-child(7) { animation-delay: 0s } .sk-grid-cube:nth-child(8) { animation-delay: 0.1s } .sk-grid-cube:nth-child(9) { animation-delay: 0.2s } @keyframes sk-grid { 0%, 100%, 70% { transform: scale3D(1, 1, 1) } 35% { transform: scale3D(0, 0, 1) } } .sk-fold { width: var(--sk-size); height: var(--sk-size); position: relative; transform: rotateZ(45deg) } .sk-fold-cube { float: left; width: 50%; height: 50%; position: relative; transform: scale(1.1) } .sk-fold-cube:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--sk-color); animation: sk-fold 2.4s infinite linear both; transform-origin: 100% 100% } .sk-fold-cube:nth-child(2) { transform: scale(1.1) rotateZ(90deg) } .sk-fold-cube:nth-child(4) { transform: scale(1.1) rotateZ(180deg) } .sk-fold-cube:nth-child(3) { transform: scale(1.1) rotateZ(270deg) } .sk-fold-cube:nth-child(2):before { animation-delay: 0.3s } .sk-fold-cube:nth-child(4):before { animation-delay: 0.6s } .sk-fold-cube:nth-child(3):before { animation-delay: 0.9s } @keyframes sk-fold { 0%, 10% { transform: perspective(140px) rotateX(-180deg); opacity: 0 } 25%, 75% { transform: perspective(140px) rotateX(0); opacity: 1 } 100%, 90% { transform: perspective(140px) rotateY(180deg); opacity: 0 } } .sk-wander { width: var(--sk-size); height: var(--sk-size); position: relative } .sk-wander-cube { background-color: var(--sk-color); width: 20%; height: 20%; position: absolute; top: 0; left: 0; --sk-wander-distance: calc(var(--sk-size) * 0.75); animation: sk-wander 2s ease-in-out -2s infinite both } .sk-wander-cube:nth-child(2) { animation-delay: -0.5s } .sk-wander-cube:nth-child(3) { animation-delay: -1s } @keyframes sk-wander { 0% { transform: rotate(0) } 25% { transform: translateX(var(--sk-wander-distance)) rotate(-90deg) scale(0.6) } 50% { transform: translateX(var(--sk-wander-distance)) translateY(var(--sk-wander-distance)) rotate(-179deg) } 50.1% { transform: translateX(var(--sk-wander-distance)) translateY(var(--sk-wander-distance)) rotate(-180deg) } 75% { transform: translateX(0) translateY(var(--sk-wander-distance)) rotate(-270deg) scale(0.6) } 100% { transform: rotate(-360deg) } } .irs { position: relative; display: block; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: 12px; font-family: Arial, sans-serif } .irs-line { position: relative; display: block; overflow: hidden; outline: none !important } .irs-bar { position: absolute; display: block; left: 0; width: 0 } .irs-shadow { position: absolute; display: none; left: 0; width: 0 } .irs-handle { position: absolute; display: block; box-sizing: border-box; cursor: default; z-index: 1 } .irs-handle.type_last { z-index: 2 } .irs-min, .irs-max { position: absolute; display: block; cursor: default } .irs-min { left: 0 } .irs-max { right: 0 } .irs-from, .irs-to, .irs-single { position: absolute; display: block; top: 0; left: 0; cursor: default; white-space: nowrap } .irs-grid { position: absolute; display: none; bottom: 0; left: 0; width: 100%; height: 20px } .irs-with-grid .irs-grid { display: block } .irs-grid-pol { position: absolute; top: 0; left: 0; width: 1px; height: 8px; background: #000 } .irs-grid-pol.small { height: 4px } .irs-grid-text { position: absolute; bottom: 0; left: 0; white-space: nowrap; text-align: center; font-size: 9px; line-height: 9px; padding: 0 3px; color: #000 } .irs-disable-mask { position: absolute; display: block; top: 0; left: -1%; width: 102%; height: 100%; cursor: default; background: rgba(0, 0, 0, 0); z-index: 2 } .lt-ie9 .irs-disable-mask { background: #000; filter: alpha(opacity=0); cursor: not-allowed } .irs-disabled { opacity: 0.4 } .irs-hidden-input { position: absolute !important; display: block !important; top: 0 !important; left: 0 !important; width: 0 !important; height: 0 !important; font-size: 0 !important; line-height: 0 !important; padding: 0 !important; margin: 0 !important; overflow: hidden; outline: none !important; z-index: -9999 !important; background: none !important; border-style: solid !important; border-color: transparent !important } .irs--flat { height: 40px } .irs--flat.irs-with-grid { height: 60px } .irs--flat .irs-line { top: 25px; height: 12px; background-color: #e1e4e9; border-radius: 4px } .irs--flat .irs-bar { top: 25px; height: 12px; background-color: #ed5565 } .irs--flat .irs-bar--single { border-radius: 4px 0 0 4px } .irs--flat .irs-shadow { height: 1px; bottom: 16px; background-color: #e1e4e9 } .irs--flat .irs-handle { top: 22px; width: 16px; height: 18px; background-color: transparent } .irs--flat .irs-handle>i:first-child { position: absolute; display: block; top: 0; left: 50%; width: 2px; height: 100%; margin-left: -1px; background-color: #da4453 } .irs--flat .irs-handle.state_hover>i:first-child, .irs--flat .irs-handle:hover>i:first-child { background-color: #a43540 } .irs--flat .irs-min, .irs--flat .irs-max { top: 0; padding: 1px 3px; color: #999; font-size: 10px; line-height: 1.333; text-shadow: none; background-color: #e1e4e9; border-radius: 4px } .irs--flat .irs-from, .irs--flat .irs-to, .irs--flat .irs-single { color: white; font-size: 10px; line-height: 1.333; text-shadow: none; padding: 1px 5px; background-color: #ed5565; border-radius: 4px } .irs--flat .irs-from:before, .irs--flat .irs-to:before, .irs--flat .irs-single:before { position: absolute; display: block; content: ""; bottom: -6px; left: 50%; width: 0; height: 0; margin-left: -3px; overflow: hidden; border: 3px solid transparent; border-top-color: #ed5565 } .irs--flat .irs-grid-pol { background-color: #e1e4e9 } .irs--flat .irs-grid-text { color: #999 } .irs--big { height: 55px } .irs--big.irs-with-grid { height: 70px } .irs--big .irs-line { top: 33px; height: 12px; background-color: white; background: linear-gradient(to bottom, #ddd -50%, white 150%); border: 1px solid #ccc; border-radius: 12px } .irs--big .irs-bar { top: 33px; height: 12px; background-color: #92bce0; border: 1px solid #428bca; background: linear-gradient(to bottom, #fff 0%, #428bca 30%, #b9d4ec 100%); box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 0.5) } .irs--big .irs-bar--single { border-radius: 12px 0 0 12px } .irs--big .irs-shadow { height: 1px; bottom: 16px; background-color: rgba(66, 139, 202, 0.5) } .irs--big .irs-handle { top: 25px; width: 30px; height: 30px; border: 1px solid rgba(0, 0, 0, 0.3); background-color: #cbcfd5; background: linear-gradient(to bottom, white 0%, #b4b9be 30%, white 100%); box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2), inset 0 0 3px 1px white; border-radius: 30px } .irs--big .irs-handle.state_hover, .irs--big .irs-handle:hover { border-color: rgba(0, 0, 0, 0.45); background-color: #939ba7; background: linear-gradient(to bottom, white 0%, #919ba5 30%, white 100%) } .irs--big .irs-min, .irs--big .irs-max { top: 0; padding: 1px 5px; color: white; text-shadow: none; background-color: #9f9f9f; border-radius: 3px } .irs--big .irs-from, .irs--big .irs-to, .irs--big .irs-single { color: white; text-shadow: none; padding: 1px 5px; background-color: #428bca; background: linear-gradient(to bottom, #428bca 0%, #3071a9 100%); border-radius: 3px } .irs--big .irs-grid-pol { background-color: #428bca } .irs--big .irs-grid-text { color: #428bca } .irs--modern { height: 55px } .irs--modern.irs-with-grid { height: 55px } .irs--modern .irs-line { top: 25px; height: 5px; background-color: #d1d6e0; background: linear-gradient(to bottom, #e0e4ea 0%, #d1d6e0 100%); border: 1px solid #a3adc1; border-bottom-width: 0; border-radius: 5px } .irs--modern .irs-bar { top: 25px; height: 5px; background: #20b426; background: linear-gradient(to bottom, #20b426 0%, #18891d 100%) } .irs--modern .irs-bar--single { border-radius: 5px 0 0 5px } .irs--modern .irs-shadow { height: 1px; bottom: 21px; background-color: rgba(209, 214, 224, 0.5) } .irs--modern .irs-handle { top: 37px; width: 12px; height: 13px; border: 1px solid #a3adc1; border-top-width: 0; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); border-radius: 0 0 3px 3px } .irs--modern .irs-handle>i:nth-child(1) { position: absolute; display: block; top: -4px; left: 1px; width: 6px; height: 6px; border: 1px solid #a3adc1; background: white; transform: rotate(45deg) } .irs--modern .irs-handle>i:nth-child(2) { position: absolute; display: block; box-sizing: border-box; top: 0; left: 0; width: 10px; height: 12px; background: #e9e6e6; background: linear-gradient(to bottom, white 0%, #e9e6e6 100%); border-radius: 0 0 3px 3px } .irs--modern .irs-handle>i:nth-child(3) { position: absolute; display: block; box-sizing: border-box; top: 3px; left: 3px; width: 4px; height: 5px; border-left: 1px solid #a3adc1; border-right: 1px solid #a3adc1 } .irs--modern .irs-handle.state_hover, .irs--modern .irs-handle:hover { border-color: #7685a2; background: #c3c7cd; background: linear-gradient(to bottom, #fff 0%, #919ba5 30%, #fff 100%) } .irs--modern .irs-handle.state_hover>i:nth-child(1), .irs--modern .irs-handle:hover>i:nth-child(1) { border-color: #7685a2 } .irs--modern .irs-handle.state_hover>i:nth-child(3), .irs--modern .irs-handle:hover>i:nth-child(3) { border-color: #48536a } .irs--modern .irs-min, .irs--modern .irs-max { top: 0; font-size: 10px; line-height: 1.333; text-shadow: none; padding: 1px 5px; color: white; background-color: #d1d6e0; border-radius: 5px } .irs--modern .irs-from, .irs--modern .irs-to, .irs--modern .irs-single { font-size: 10px; line-height: 1.333; text-shadow: none; padding: 1px 5px; background-color: #20b426; color: white; border-radius: 5px } .irs--modern .irs-from:before, .irs--modern .irs-to:before, .irs--modern .irs-single:before { position: absolute; display: block; content: ""; bottom: -6px; left: 50%; width: 0; height: 0; margin-left: -3px; overflow: hidden; border: 3px solid transparent; border-top-color: #20b426 } .irs--modern .irs-grid { height: 25px } .irs--modern .irs-grid-pol { background-color: #dedede } .irs--modern .irs-grid-text { color: silver; font-size: 13px } .irs--sharp { height: 50px; font-size: 12px; line-height: 1 } .irs--sharp.irs-with-grid { height: 57px } .irs--sharp .irs-line { top: 30px; height: 2px; background-color: black; border-radius: 2px } .irs--sharp .irs-bar { top: 30px; height: 2px; background-color: #ee22fa } .irs--sharp .irs-bar--single { border-radius: 2px 0 0 2px } .irs--sharp .irs-shadow { height: 1px; bottom: 21px; background-color: rgba(0, 0, 0, 0.5) } .irs--sharp .irs-handle { top: 25px; width: 10px; height: 10px; background-color: #a804b2 } .irs--sharp .irs-handle>i:first-child { position: absolute; display: block; top: 100%; left: 0; width: 0; height: 0; border: 5px solid transparent; border-top-color: #a804b2 } .irs--sharp .irs-handle.state_hover, .irs--sharp .irs-handle:hover { background-color: black } .irs--sharp .irs-handle.state_hover>i:first-child, .irs--sharp .irs-handle:hover>i:first-child { border-top-color: black } .irs--sharp .irs-min, .irs--sharp .irs-max { color: white; font-size: 14px; line-height: 1; top: 0; padding: 3px 4px; opacity: 0.4; background-color: #a804b2; border-radius: 2px } .irs--sharp .irs-from, .irs--sharp .irs-to, .irs--sharp .irs-single { font-size: 14px; line-height: 1; text-shadow: none; padding: 3px 4px; background-color: #a804b2; color: white; border-radius: 2px } .irs--sharp .irs-from:before, .irs--sharp .irs-to:before, .irs--sharp .irs-single:before { position: absolute; display: block; content: ""; bottom: -6px; left: 50%; width: 0; height: 0; margin-left: -3px; overflow: hidden; border: 3px solid transparent; border-top-color: #a804b2 } .irs--sharp .irs-grid { height: 25px } .irs--sharp .irs-grid-pol { background-color: #dedede } .irs--sharp .irs-grid-text { color: silver; font-size: 13px } .irs--round { height: 50px } .irs--round.irs-with-grid { height: 65px } .irs--round .irs-line { top: 36px; height: 4px; background-color: #dee4ec; border-radius: 4px } .irs--round .irs-bar { top: 36px; height: 4px; background-color: #006cfa } .irs--round .irs-bar--single { border-radius: 4px 0 0 4px } .irs--round .irs-shadow { height: 4px; bottom: 21px; background-color: rgba(222, 228, 236, 0.5) } .irs--round .irs-handle { top: 26px; width: 24px; height: 24px; border: 4px solid #006cfa; background-color: white; border-radius: 24px; box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3) } .irs--round .irs-handle.state_hover, .irs--round .irs-handle:hover { background-color: #f0f6ff } .irs--round .irs-min, .irs--round .irs-max { color: #333; font-size: 14px; line-height: 1; top: 0; padding: 3px 5px; background-color: rgba(0, 0, 0, 0.1); border-radius: 4px } .irs--round .irs-from, .irs--round .irs-to, .irs--round .irs-single { font-size: 14px; line-height: 1; text-shadow: none; padding: 3px 5px; background-color: #006cfa; color: white; border-radius: 4px } .irs--round .irs-from:before, .irs--round .irs-to:before, .irs--round .irs-single:before { position: absolute; display: block; content: ""; bottom: -6px; left: 50%; width: 0; height: 0; margin-left: -3px; overflow: hidden; border: 3px solid transparent; border-top-color: #006cfa } .irs--round .irs-grid { height: 25px } .irs--round .irs-grid-pol { background-color: #dedede } .irs--round .irs-grid-text { color: silver; font-size: 13px } .irs--square { height: 50px } .irs--square.irs-with-grid { height: 60px } .irs--square .irs-line { top: 31px; height: 4px; background-color: #dedede } .irs--square .irs-bar { top: 31px; height: 4px; background-color: black } .irs--square .irs-shadow { height: 2px; bottom: 21px; background-color: #dedede } .irs--square .irs-handle { top: 25px; width: 16px; height: 16px; border: 3px solid black; background-color: white; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } .irs--square .irs-handle.state_hover, .irs--square .irs-handle:hover { background-color: #f0f6ff } .irs--square .irs-min, .irs--square .irs-max { color: #333; font-size: 14px; line-height: 1; top: 0; padding: 3px 5px; background-color: rgba(0, 0, 0, 0.1) } .irs--square .irs-from, .irs--square .irs-to, .irs--square .irs-single { font-size: 14px; line-height: 1; text-shadow: none; padding: 3px 5px; background-color: black; color: white } .irs--square .irs-grid { height: 25px } .irs--square .irs-grid-pol { background-color: #dedede } .irs--square .irs-grid-text { color: silver; font-size: 11px } .slick-arrow { transition: all 250ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; background-position: center; background-repeat: no-repeat; font-size: 0; opacity: 1; position: absolute; top: 50%; transform: translateY(-50%) scale(0.75); visibility: visible; border: 1px solid #000; background-color: #fff; z-index: 2 } .slick-arrow.slick-prev { background-image: url("../public/image/icon/arrow-left.svg"); height: 60px; width: 60px; left: -1rem } .slick-arrow.slick-next { background-image: url("../public/image/icon/arrow-right.svg"); height: 60px; width: 60px; right: -1rem } .slick-arrow.slick-disabled { opacity: 0; visibility: hidden } .slick-arrow.slick-hidden { display: none !important } @media only screen and (min-width: 1281px) { .slick-arrow { transform: translateY(-50%) } } .slick-dots { display: flex; justify-content: center; margin: 2rem 0 } .slick-dots li { line-height: 1px; margin: 0 0.5rem } .slick-dots button { transition: all 250ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; background-color: transparent; border: 1px solid black; border-radius: 0.5rem; font-size: 0; height: 1rem; width: 1rem } .slick-dots button:focus { outline: none } .slick-dots .slick-active button { background-color: black } .-venobox { overflow: hidden } .-venobox img { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out } .-venobox:hover img { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; scale: 1.1 } .vbox-close { display: block !important; top: 3rem; right: 3rem } .vbox-prev { left: 3rem } .vbox-next { right: 4rem } .vbox-content { width: 100%; height: 100vh; min-height: 400px } .vbox-left-corner { top: auto; bottom: 1rem; left: 50%; transform: translateX(-50%); font-size: clamp(1.7rem, 1.5vw, 2.7rem) } .vbox-content img { max-width: 100%; max-height: 80vh; min-height: 300px } .word { display: inline-block; white-space: nowrap } .letter { display: inline-block; opacity: 1 } .js-anim-text { opacity: 0 } .js-anim-block { opacity: 0 } .js-box { opacity: 0 } .scroll-container { overflow: hidden; white-space: nowrap; display: flex } .scroll-content { display: inline-flex; gap: 6rem; align-items: center; animation: scroll 50s linear infinite } @keyframes display { 0% { display: none; opacity: 0 } 1% { display: block; opacity: 0 } 100% { display: block; opacity: 1 } } @keyframes display-flex { 0% { display: none; opacity: 0 } 1% { display: flex; opacity: 0 } 100% { display: flex; opacity: 1 } } @keyframes scroll { from { transform: translateX(0%) } to { transform: translateX(-100%) } } @keyframes hithere { 30% { transform: scale(1.2) } 40%, 60% { transform: rotate(-20deg) scale(1.2) } 50% { transform: rotate(20deg) scale(1.2) } 70% { transform: rotate(0deg) scale(1.2) } 100% { transform: scale(1) } } .g-clearfix::after, .g-grid::after { clear: both; content: " "; display: block; font-size: 0; height: 0; visibility: hidden } * html .g-clearfix, * html .g-grid { zoom: 1 } *:first-child+html .g-clearfix, *:first-child+html .g-grid { zoom: 1 } * { box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } html, body { min-height: 100%; height: 100% } html { font-size: 62.5% } body, input, textarea, select, button { color: black; font-family: "Sofia Sans Semi Condensed", Arial, sans-serif; font-size: 1.6rem; line-height: 1.2em; font-weight: 300 } @media only screen and (min-width: 1025px) { body, input, textarea, select, button { font-size: 1.7rem; line-height: 1.2em } } body.-no-scroll { overflow: hidden } a { color: inherit; text-decoration: none } img { max-width: 100% } button { background: none; border: none; cursor: pointer; padding: 0 } button::-moz-focus-inner { padding: 0; border: 0 } sup { font-size: 50%; vertical-align: super } sub, small { font-size: 75%; line-height: 1em } small { vertical-align: text-bottom } .shelby_link { align-items: center; display: inline-flex; text-decoration: underline; text-underline-offset: 2px } .shelby_link:hover { text-decoration: none } .shelby_link .icon { position: relative; top: 1px } .shelby_link .icon:first-child:not(:last-child) { margin-right: 1rem } .shelby_link .icon:last-child:not(:first-child) { margin-left: 1rem } .shelby_img { display: block; width: 100% } .g-bg { background-color: white } .shelby-main-colour { background-color: #466365; } .shelby-main-colour-text { color: #466365; } .g-gray { color: gray } .shelby_white { color: white } .g-block { display: block } .g-overflow { overflow: hidden } .g-bold { font-weight: bold } .g-regular { font-weight: 400 } .g-uppercase { text-transform: uppercase } .g-left { text-align: left } .g-right { text-align: right } .g-bottom { align-items: flex-end } .g-hr { background-color: gray; border: none; display: block; height: 1px; margin-bottom: 30px; margin-top: 15px } @media only screen and (min-width: 1281px) { .g-hr { margin-bottom: 40px; margin-top: 20px } } .g-ontop { position: relative; z-index: 1 } .g-ontoper { position: relative; z-index: 3 !important } .g-relative { position: relative } .g-absolute { position: absolute } .g-no-pointer { pointer-events: none } .g-transition--xs { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out } .g-transition--sm { transition: all 250ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out } .g-transition--md { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out } .g-fullscreen { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .shelby-marginbottom-0 { margin-bottom: 0 !important } .shelby-marginbottom-5 { margin-bottom: 0.5rem !important } .shelby-marginbottom-10 { margin-bottom: 1rem !important } .shelby-marginbottom-15 { margin-bottom: 1.5rem !important } .shelby-marginbottom-20 { margin-bottom: 2rem !important } .shelby-marginbottom-25 { margin-bottom: 2.5rem !important } .shelby-marginbottom-30 { margin-bottom: 3rem !important } .shelby-marginbottom-40 { margin-bottom: 4rem !important } .shelby-margin-0 { margin-top: 0 !important } .shelby-margin-5 { margin-top: 0.5rem !important } .shelby-margin-10 { margin-top: 1rem !important } .shelby-margin-15 { margin-top: 1.5rem !important } .shelby-margin-20 { margin-top: 2rem !important } .shelby-margin-30 { margin-top: 3rem !important } .shelby-margin-40 { margin-top: 4rem !important } .g-ml-0 { margin-left: 0 !important } .g-ml-5 { margin-left: 0.5rem !important } .g-ml-10 { margin-left: 1rem !important } .g-ml-15 { margin-left: 1.5rem !important } .g-ml-20 { margin-left: 2rem !important } .g-ml-30 { margin-left: 3rem !important } .g-ml-40 { margin-left: 4rem !important } .g-mr-0 { margin-right: 0 !important } .g-mr-5 { margin-right: 0.5rem !important } .g-mr-10 { margin-right: 1rem !important } .g-mr-15 { margin-right: 1.5rem !important } .g-mr-20 { margin-right: 2rem !important } .g-mr-30 { margin-right: 3rem !important } .g-mr-40 { margin-right: 4rem !important } .g-vertical { align-items: center } .g-start { align-items: flex-start } @media only screen and (min-width: 481px) { .g-vertical-sm { align-items: center } } @media only screen and (min-width: 641px) { .g-vertical-md { align-items: center } } @media only screen and (min-width: 1025px) { .g-vertical-xm { align-items: center } } @media only screen and (min-width: 1281px) { .g-vertical-lg { align-items: center } } @media only screen and (min-width: 1601px) { .g-vertical-xl { align-items: center } } .g-vertical-self { align-self: center } .g-center { text-align: center } @media only screen and (min-width: 481px) { .g-center-sm { text-align: center } } @media only screen and (min-width: 641px) { .g-center-md { text-align: center } } @media only screen and (min-width: 1025px) { .g-center-xm { text-align: center } } @media only screen and (min-width: 1281px) { .g-center-lg { text-align: center } } @media only screen and (min-width: 1601px) { .g-center-xl { text-align: center } } .g-video { width: 30%; aspect-ratio: 0.7142857143; margin-left: 7vw; margin-top: -9vw; object-fit: cover } .shelby_img-box { position: relative; width: 100%; height: 100%; max-height: 70rem; min-height: 30rem } .shelby_img-box::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3) } .shelby_img-fit { display: block; width: 100%; height: 100%; min-height: 30rem; object-fit: cover } .max-960-shelby { max-width: 96rem } .shelby-l-blk { display: inline-flex; align-items: center; gap: 1rem; font-size: 1.6rem } .shelby-l-blk:hover { text-decoration: underline } .g-center-box { max-width: 86rem; padding: 4rem; background-color: #fff; margin: auto; transform: translateY(-50%) } .g-center-box__content { max-width: 51rem; margin: auto } .g-font-18 { font-size: 1.8rem } .g-editor { font-size: clamp(1.4rem, 2vw, 1.6rem); line-height: 1.55em } .g-editor--sm { font-size: 1.6rem; line-height: 1.4em } .g-editor--md { font-size: clamp(1.6rem, 2vw, 1.7rem); line-height: 1.5em } .g-editor--lg { font-size: clamp(1.6rem, 2vw, 2rem); font-weight: 300 } .g-editor h1, .g-editor h2, .g-editor h3, .g-editor h4, .g-editor h5, .g-editor h6 { line-height: 1.3em; margin-bottom: 2rem; margin-top: 4rem } .g-editor h1:first-child, .g-editor h2:first-child, .g-editor h3:first-child, .g-editor h4:first-child, .g-editor h5:first-child, .g-editor h6:first-child { margin-top: 0 } .g-editor h2 { font-size: clamp(3.7rem, 4vw, 4.8rem) } .g-editor h3, .g-editor h4 { font-size: clamp(1.7rem, 3vw, 3.7rem) } .g-editor h5, .g-editor h6 { font-size: 1.7rem; font-weight: 600; text-transform: uppercase } .g-editor a { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; text-decoration: underline; text-decoration-color: inherit; text-underline-offset: 2px } .g-editor a:hover { text-decoration: none } .g-editor p { margin-bottom: 1rem } .g-editor p:last-child, .g-editor p:first-child:last-child { margin-bottom: 0 } .g-editor strong { font-weight: bold } .g-editor em { font-style: italic } .g-editor ul { margin: 2rem; list-style: disc } .g-editor ul li { margin-bottom: 1.5rem; padding-left: 0 } .g-editor ul li:last-child { margin-bottom: 0 } .g-editor ol { list-style: decimal inside; margin: 2rem 0 } .g-editor ol li { line-height: 1.4em; margin-bottom: 1.5rem; padding-left: 2rem; position: relative } .g-editor img { display: block; margin-bottom: 2rem; margin-top: 1rem } .g-editor figure { margin: 2rem 0 } .g-editor figure img { display: block; margin-bottom: 0; width: 100% } .g-editor figure img+figcaption { color: gray; font-size: 1.4rem; line-height: 1.2em; margin-bottom: 3rem; padding: 1rem 0 } .g-editor table { border-spacing: 1px; border-collapse: separate; font-size: 1.4rem; table-layout: fixed } .g-editor th { background-color: black; border-right: 1px solid transparent; color: white; font-size: 1.4rem; font-weight: bold; padding: 1rem; text-align: center } .g-editor td { border-bottom: 1px solid #ddd; min-width: 20rem; padding: 1.5rem 1rem; vertical-align: top } .g-editor td ul, .g-editor td ol { margin-top: 0; margin-left: 0 } .g-editor tr:last-child td { border-bottom: none } @media only screen and (min-width: 1025px) { .g-editor {} .g-editor p { margin-bottom: 2rem } .g-editor figure { margin: 3rem 0 } .g-editor img { margin-bottom: 3rem; margin-top: 3rem } } @media only screen and (min-width: 1281px) { .g-editor--lg p { margin-bottom: 3rem } .g-editor ul, .g-editor ol { margin: 2rem 4rem } .g-editor ul li, .g-editor ol li { margin-bottom: 1.5rem; padding-left: 0; padding-top: 0 } } @media only screen and (min-width: 1601px) { .g-editor h1, .g-editor h2, .g-editor h3, .g-editor h4, .g-editor h5, .g-editor h6 { margin-bottom: 3rem; margin-top: 6rem } } .head_shelby { margin-bottom: 2rem } @media only screen and (min-width: 641px) { .head_shelby--spaced { margin-bottom: 3rem } } @media only screen and (min-width: 1025px) { .head_shelby { margin-bottom: 2rem } .head_shelby--spaced { margin-bottom: 4rem } } @media only screen and (min-width: 1281px) { .head_shelby { margin-bottom: 4rem } .head_shelby--spaced { margin-bottom: 6rem } } @media only screen and (min-width: 1601px) { .head_shelby { margin-bottom: 5rem } .head_shelby--spaced { margin-bottom: 8rem } } .is-hidden { display: none !important } @media only screen and (min-width: 481px) { .is-inline--sm { display: inline-block !important } .is-block--sm { display: block !important } .is-flex--sm { display: flex !important } .is-inline-flex--sm { display: flex !important } .is-hidden--sm { display: none !important } } @media only screen and (min-width: 641px) { .is-inline--md { display: inline-block !important } .is-block--md { display: block !important } .is-flex--md { display: flex !important } .is-inline-flex--md { display: flex !important } .is-hidden--md { display: none !important } } @media only screen and (max-width: 640px) { .is-hidden--md-down { display: none !important } } @media only screen and (min-width: 1025px) { .is-inline--xm { display: inline-block !important } .is-block--xm { display: block !important } .is-flex--xm { display: flex !important } .is-inline-flex--xm { display: inline-flex !important } .is-hidden--xm { display: none !important } } @media only screen and (max-width: 1024px) { .is-hidden--xm-down { display: none !important } } @media only screen and (min-width: 1281px) { .is-inline--lg { display: inline-block !important } .is-block--lg { display: block !important } .is-flex--lg { display: flex !important } .is-inline-flex--lg { display: inline-flex !important } .is-hidden--lg { display: none !important } } .shelby-pad-xl { padding-bottom: 7rem; padding-top: 7rem } .shelby-pad-lg { padding-bottom: 6rem; padding-top: 6rem } .shelby-pad-xm { padding-bottom: 5rem; padding-top: 5rem; position: relative } .shelby-pad-md { padding-bottom: 5rem; padding-top: 5rem; position: relative; z-index: 1 } .shelby-pad-sm { padding-bottom: 3rem; padding-top: 3rem; position: relative } .shelby-pad-no-top { padding-top: 0 !important } .shelby-pad-no-bottom { padding-bottom: 0 !important } .shelby-pad-header { padding-top: 6rem } @media only screen and (min-width: 1025px) { .shelby-pad-xl { padding-bottom: 15rem; padding-top: 15rem } .shelby-pad-lg { padding-bottom: 10rem; padding-top: 10rem } .shelby-pad-xm { padding-bottom: 8rem; padding-top: 8rem } .shelby-pad-md { padding-bottom: 6rem; padding-top: 6rem } .shelby-pad-sm { padding-bottom: 3rem; padding-top: 3rem } .shelby-pad-xs { padding-bottom: 2rem; padding-top: 2rem } .shelby-pad-header { padding-top: 9rem } } @media only screen and (min-width: 1281px) { .shelby-pad-xl { padding-bottom: 20rem; padding-top: 20rem } .shelby-pad-lg { padding-bottom: 15rem; padding-top: 15rem } .shelby-pad-xm { padding-bottom: 12rem; padding-top: 12rem } .shelby-pad-md { padding-bottom: 8rem; padding-top: 8rem } .shelby-pad-sm { padding-bottom: 5rem; padding-top: 5rem } .shelby-pad-xs { padding-bottom: 3rem; padding-top: 3rem } } /*! Pure v1.0.0 Copyright 2013 Yahoo! Licensed under the BSD License. https://github.com/yahoo/pure/blob/master/LICENSE.md */ .shelby-row { letter-spacing: -0.31em; *letter-spacing: normal; *word-spacing: -0.43em; max-width: 100%; text-rendering: optimizespeed; width: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-align-content: flex-start; -ms-flex-line-pack: start; align-content: flex-start } @media (-ms-high-contrast: none), (-ms-high-contrast: active) { table .shelby-row { display: block } } .opera-only :-o-prefocus, .shelby-row { word-spacing: -0.43em } .col { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto } .col-1, .col-1-1, .col-1-2, .col-1-3, .col-2-3, .col-1-4, .col-3-4, .col-1-5, .col-2-5, .col-3-5, .col-4-5, .col-5-5, .col-1-6, .col-5-6, .col-1-8, .col-3-8, .col-5-8, .col-7-8, .col-1-12, .col-5-12, .col-7-12, .col-11-12, .col-1-24, .col-2-24, .col-3-24, .col-4-24, .col-5-24, .col-6-24, .col-7-24, .col-8-24, .col-9-24, .col-10-24, .col-11-24, .col-12-24, .col-13-24, .col-14-24, .col-15-24, .col-16-24, .col-17-24, .col-18-24, .col-19-24, .col-20-24, .col-21-24, .col-22-24, .col-23-24, .col-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto } .col-1-24 { width: 4.1667%; *width: 4.1357% } .col-1-12, .col-2-24 { width: 8.3333%; *width: 8.3023% } .col-1-8, .col-3-24 { width: 12.5%; *width: 12.469% } .col-1-6, .col-4-24 { width: 16.6667%; *width: 16.6357% } .col-1-5 { width: 20%; *width: 19.969% } .col-5-24 { width: 20.8333%; *width: 20.8023% } .col-1-4, .col-6-24 { width: 25%; *width: 24.969% } .col-7-24 { width: 29.1667%; *width: 29.1357% } .col-1-3, .col-8-24 { width: 33.3333%; *width: 33.3023% } .col-3-8, .col-9-24 { width: 37.5%; *width: 37.469% } .col-2-5 { width: 40%; *width: 39.969% } .col-5-12, .col-10-24 { width: 41.6667%; *width: 41.6357% } .col-11-24 { width: 45.8333%; *width: 45.8023% } .col-1-2, .col-12-24 { width: 50%; *width: 49.969% } .col-13-24 { width: 54.1667%; *width: 54.1357% } .col-7-12, .col-14-24 { width: 58.3333%; *width: 58.3023% } .col-3-5 { width: 60%; *width: 59.969% } .col-5-8, .col-15-24 { width: 62.5%; *width: 62.469% } .col-2-3, .col-16-24 { width: 66.6667%; *width: 66.6357% } .col-17-24 { width: 70.8333%; *width: 70.8023% } .col-3-4, .col-18-24 { width: 75%; *width: 74.969% } .col-19-24 { width: 79.1667%; *width: 79.1357% } .col-4-5 { width: 80%; *width: 79.969% } .col-5-6, .col-20-24 { width: 83.3333%; *width: 83.3023% } .col-7-8, .col-21-24 { width: 87.5%; *width: 87.469% } .col-11-12, .col-22-24 { width: 91.6667%; *width: 91.6357% } .col-23-24 { width: 95.8333%; *width: 95.8023% } .col-1, .col-1-1, .col-5-5, .col-24-24 { width: 100% } @media only screen and (min-width: 321px) { .col-xs-1, .col-xs-1-1, .col-xs-1-2, .col-xs-1-3, .col-xs-2-3, .col-xs-1-4, .col-xs-3-4, .col-xs-1-5, .col-xs-2-5, .col-xs-3-5, .col-xs-4-5, .col-xs-5-5, .col-xs-1-6, .col-xs-5-6, .col-xs-1-8, .col-xs-3-8, .col-xs-5-8, .col-xs-7-8, .col-xs-1-12, .col-xs-5-12, .col-xs-7-12, .col-xs-11-12, .col-xs-1-24, .col-xs-2-24, .col-xs-3-24, .col-xs-4-24, .col-xs-5-24, .col-xs-6-24, .col-xs-7-24, .col-xs-8-24, .col-xs-9-24, .col-xs-10-24, .col-xs-11-24, .col-xs-12-24, .col-xs-13-24, .col-xs-14-24, .col-xs-15-24, .col-xs-16-24, .col-xs-17-24, .col-xs-18-24, .col-xs-19-24, .col-xs-20-24, .col-xs-21-24, .col-xs-22-24, .col-xs-23-24, .col-xs-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto } .col-xs-1-24 { width: 4.1667%; *width: 4.1357% } .col-xs-1-12, .col-xs-2-24 { width: 8.3333%; *width: 8.3023% } .col-xs-1-8, .col-xs-3-24 { width: 12.5%; *width: 12.469% } .col-xs-1-6, .col-xs-4-24 { width: 16.6667%; *width: 16.6357% } .col-xs-1-5 { width: 20%; *width: 19.969% } .col-xs-5-24 { width: 20.8333%; *width: 20.8023% } .col-xs-1-4, .col-xs-6-24 { width: 25%; *width: 24.969% } .col-xs-7-24 { width: 29.1667%; *width: 29.1357% } .col-xs-1-3, .col-xs-8-24 { width: 33.3333%; *width: 33.3023% } .col-xs-3-8, .col-xs-9-24 { width: 37.5%; *width: 37.469% } .col-xs-2-5 { width: 40%; *width: 39.969% } .col-xs-5-12, .col-xs-10-24 { width: 41.6667%; *width: 41.6357% } .col-xs-11-24 { width: 45.8333%; *width: 45.8023% } .col-xs-1-2, .col-xs-12-24 { width: 50%; *width: 49.969% } .col-xs-13-24 { width: 54.1667%; *width: 54.1357% } .col-xs-7-12, .col-xs-14-24 { width: 58.3333%; *width: 58.3023% } .col-xs-3-5 { width: 60%; *width: 59.969% } .col-xs-5-8, .col-xs-15-24 { width: 62.5%; *width: 62.469% } .col-xs-2-3, .col-xs-16-24 { width: 66.6667%; *width: 66.6357% } .col-xs-17-24 { width: 70.8333%; *width: 70.8023% } .col-xs-3-4, .col-xs-18-24 { width: 75%; *width: 74.969% } .col-xs-19-24 { width: 79.1667%; *width: 79.1357% } .col-xs-4-5 { width: 80%; *width: 79.969% } .col-xs-5-6, .col-xs-20-24 { width: 83.3333%; *width: 83.3023% } .col-xs-7-8, .col-xs-21-24 { width: 87.5%; *width: 87.469% } .col-xs-11-12, .col-xs-22-24 { width: 91.6667%; *width: 91.6357% } .col-xs-23-24 { width: 95.8333%; *width: 95.8023% } .col-xs-1, .col-xs-1-1, .col-xs-5-5, .col-xs-24-24 { width: 100% } } @media only screen and (min-width: 481px) { .col-sm-1, .col-sm-1-1, .col-sm-1-2, .col-sm-1-3, .col-sm-2-3, .col-sm-1-4, .col-sm-3-4, .col-sm-1-5, .col-sm-2-5, .col-sm-3-5, .col-sm-4-5, .col-sm-5-5, .col-sm-1-6, .col-sm-5-6, .col-sm-1-8, .col-sm-3-8, .col-sm-5-8, .col-sm-7-8, .col-sm-1-12, .col-sm-5-12, .col-sm-7-12, .col-sm-11-12, .col-sm-1-24, .col-sm-2-24, .col-sm-3-24, .col-sm-4-24, .col-sm-5-24, .col-sm-6-24, .col-sm-7-24, .col-sm-8-24, .col-sm-9-24, .col-sm-10-24, .col-sm-11-24, .col-sm-12-24, .col-sm-13-24, .col-sm-14-24, .col-sm-15-24, .col-sm-16-24, .col-sm-17-24, .col-sm-18-24, .col-sm-19-24, .col-sm-20-24, .col-sm-21-24, .col-sm-22-24, .col-sm-23-24, .col-sm-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto } .col-sm-1-24 { width: 4.1667%; *width: 4.1357% } .col-sm-1-12, .col-sm-2-24 { width: 8.3333%; *width: 8.3023% } .col-sm-1-8, .col-sm-3-24 { width: 12.5%; *width: 12.469% } .col-sm-1-6, .col-sm-4-24 { width: 16.6667%; *width: 16.6357% } .col-sm-1-5 { width: 20%; *width: 19.969% } .col-sm-5-24 { width: 20.8333%; *width: 20.8023% } .col-sm-1-4, .col-sm-6-24 { width: 25%; *width: 24.969% } .col-sm-7-24 { width: 29.1667%; *width: 29.1357% } .col-sm-1-3, .col-sm-8-24 { width: 33.3333%; *width: 33.3023% } .col-sm-3-8, .col-sm-9-24 { width: 37.5%; *width: 37.469% } .col-sm-2-5 { width: 40%; *width: 39.969% } .col-sm-5-12, .col-sm-10-24 { width: 41.6667%; *width: 41.6357% } .col-sm-11-24 { width: 45.8333%; *width: 45.8023% } .col-sm-1-2, .col-sm-12-24 { width: 50%; *width: 49.969% } .col-sm-13-24 { width: 54.1667%; *width: 54.1357% } .col-sm-7-12, .col-sm-14-24 { width: 58.3333%; *width: 58.3023% } .col-sm-3-5 { width: 60%; *width: 59.969% } .col-sm-5-8, .col-sm-15-24 { width: 62.5%; *width: 62.469% } .col-sm-2-3, .col-sm-16-24 { width: 66.6667%; *width: 66.6357% } .col-sm-17-24 { width: 70.8333%; *width: 70.8023% } .col-sm-3-4, .col-sm-18-24 { width: 75%; *width: 74.969% } .col-sm-19-24 { width: 79.1667%; *width: 79.1357% } .col-sm-4-5 { width: 80%; *width: 79.969% } .col-sm-5-6, .col-sm-20-24 { width: 83.3333%; *width: 83.3023% } .col-sm-7-8, .col-sm-21-24 { width: 87.5%; *width: 87.469% } .col-sm-11-12, .col-sm-22-24 { width: 91.6667%; *width: 91.6357% } .col-sm-23-24 { width: 95.8333%; *width: 95.8023% } .col-sm-1, .col-sm-1-1, .col-sm-5-5, .col-sm-24-24 { width: 100% } } @media only screen and (min-width: 641px) { .col-md-1, .col-md-1-1, .col-md-1-2, .col-md-1-3, .col-md-2-3, .col-md-1-4, .col-md-3-4, .col-md-1-5, .col-md-2-5, .col-md-3-5, .col-md-4-5, .col-md-5-5, .col-md-1-6, .col-md-5-6, .col-md-1-8, .col-md-3-8, .col-md-5-8, .col-md-7-8, .col-md-1-12, .col-md-5-12, .col-md-7-12, .col-md-11-12, .col-md-1-24, .col-md-2-24, .col-md-3-24, .col-md-4-24, .col-md-5-24, .col-md-6-24, .col-md-7-24, .col-md-8-24, .col-md-9-24, .col-md-10-24, .col-md-11-24, .col-md-12-24, .col-md-13-24, .col-md-14-24, .col-md-15-24, .col-md-16-24, .col-md-17-24, .col-md-18-24, .col-md-19-24, .col-md-20-24, .col-md-21-24, .col-md-22-24, .col-md-23-24, .col-md-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto } .col-md-1-24 { width: 4.1667%; *width: 4.1357% } .col-md-1-12, .col-md-2-24 { width: 8.3333%; *width: 8.3023% } .col-md-1-8, .col-md-3-24 { width: 12.5%; *width: 12.469% } .col-md-1-6, .col-md-4-24 { width: 16.6667%; *width: 16.6357% } .col-md-1-5 { width: 20%; *width: 19.969% } .col-md-5-24 { width: 20.8333%; *width: 20.8023% } .col-md-1-4, .col-md-6-24 { width: 25%; *width: 24.969% } .col-md-7-24 { width: 29.1667%; *width: 29.1357% } .col-md-1-3, .col-md-8-24 { width: 33.3333%; *width: 33.3023% } .col-md-3-8, .col-md-9-24 { width: 37.5%; *width: 37.469% } .col-md-2-5 { width: 40%; *width: 39.969% } .col-md-5-12, .col-md-10-24 { width: 41.6667%; *width: 41.6357% } .col-md-11-24 { width: 45.8333%; *width: 45.8023% } .col-md-1-2, .col-md-12-24 { width: 50%; *width: 49.969% } .col-md-13-24 { width: 54.1667%; *width: 54.1357% } .col-md-7-12, .col-md-14-24 { width: 58.3333%; *width: 58.3023% } .col-md-3-5 { width: 60%; *width: 59.969% } .col-md-5-8, .col-md-15-24 { width: 62.5%; *width: 62.469% } .col-md-2-3, .col-md-16-24 { width: 66.6667%; *width: 66.6357% } .col-md-17-24 { width: 70.8333%; *width: 70.8023% } .col-md-3-4, .col-md-18-24 { width: 75%; *width: 74.969% } .col-md-19-24 { width: 79.1667%; *width: 79.1357% } .col-md-4-5 { width: 80%; *width: 79.969% } .col-md-5-6, .col-md-20-24 { width: 83.3333%; *width: 83.3023% } .col-md-7-8, .col-md-21-24 { width: 87.5%; *width: 87.469% } .col-md-11-12, .col-md-22-24 { width: 91.6667%; *width: 91.6357% } .col-md-23-24 { width: 95.8333%; *width: 95.8023% } .col-md-1, .col-md-1-1, .col-md-5-5, .col-md-24-24 { width: 100% } } @media only screen and (min-width: 1025px) { .col-xm-1, .col-xm-1-1, .col-xm-1-2, .col-xm-1-3, .col-xm-2-3, .col-xm-1-4, .col-xm-3-4, .col-xm-1-5, .col-xm-2-5, .col-xm-3-5, .col-xm-4-5, .col-xm-5-5, .col-xm-1-6, .col-xm-5-6, .col-xm-1-8, .col-xm-3-8, .col-xm-5-8, .col-xm-7-8, .col-xm-1-12, .col-xm-5-12, .col-xm-7-12, .col-xm-11-12, .col-xm-1-24, .col-xm-2-24, .col-xm-3-24, .col-xm-4-24, .col-xm-5-24, .col-xm-6-24, .col-xm-7-24, .col-xm-8-24, .col-xm-9-24, .col-xm-10-24, .col-xm-11-24, .col-xm-12-24, .col-xm-13-24, .col-xm-14-24, .col-xm-15-24, .col-xm-16-24, .col-xm-17-24, .col-xm-18-24, .col-xm-19-24, .col-xm-20-24, .col-xm-21-24, .col-xm-22-24, .col-xm-23-24, .col-xm-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto } .col-xm-1-24 { width: 4.1667%; *width: 4.1357% } .col-xm-1-12, .col-xm-2-24 { width: 8.3333%; *width: 8.3023% } .col-xm-1-8, .col-xm-3-24 { width: 12.5%; *width: 12.469% } .col-xm-1-6, .col-xm-4-24 { width: 16.6667%; *width: 16.6357% } .col-xm-1-5 { width: 20%; *width: 19.969% } .col-xm-5-24 { width: 20.8333%; *width: 20.8023% } .col-xm-1-4, .col-xm-6-24 { width: 25%; *width: 24.969% } .col-xm-7-24 { width: 29.1667%; *width: 29.1357% } .col-xm-1-3, .col-xm-8-24 { width: 33.3333%; *width: 33.3023% } .col-xm-3-8, .col-xm-9-24 { width: 37.5%; *width: 37.469% } .col-xm-2-5 { width: 40%; *width: 39.969% } .col-xm-5-12, .col-xm-10-24 { width: 41.6667%; *width: 41.6357% } .col-xm-11-24 { width: 45.8333%; *width: 45.8023% } .col-xm-1-2, .col-xm-12-24 { width: 50%; *width: 49.969% } .col-xm-13-24 { width: 54.1667%; *width: 54.1357% } .col-xm-7-12, .col-xm-14-24 { width: 58.3333%; *width: 58.3023% } .col-xm-3-5 { width: 60%; *width: 59.969% } .col-xm-5-8, .col-xm-15-24 { width: 62.5%; *width: 62.469% } .col-xm-2-3, .col-xm-16-24 { width: 66.6667%; *width: 66.6357% } .col-xm-17-24 { width: 70.8333%; *width: 70.8023% } .col-xm-3-4, .col-xm-18-24 { width: 75%; *width: 74.969% } .col-xm-19-24 { width: 79.1667%; *width: 79.1357% } .col-xm-4-5 { width: 80%; *width: 79.969% } .col-xm-5-6, .col-xm-20-24 { width: 83.3333%; *width: 83.3023% } .col-xm-7-8, .col-xm-21-24 { width: 87.5%; *width: 87.469% } .col-xm-11-12, .col-xm-22-24 { width: 91.6667%; *width: 91.6357% } .col-xm-23-24 { width: 95.8333%; *width: 95.8023% } .col-xm-1, .col-xm-1-1, .col-xm-5-5, .col-xm-24-24 { width: 100% } } @media only screen and (min-width: 1281px) { .col-lg-1, .col-lg-1-1, .col-lg-1-2, .col-lg-1-3, .col-lg-2-3, .col-lg-1-4, .col-lg-3-4, .col-lg-1-5, .col-lg-2-5, .col-lg-3-5, .col-lg-4-5, .col-lg-5-5, .col-lg-1-6, .col-lg-5-6, .col-lg-1-8, .col-lg-3-8, .col-lg-5-8, .col-lg-7-8, .col-lg-1-12, .col-lg-5-12, .col-lg-7-12, .col-lg-11-12, .col-lg-1-24, .col-lg-2-24, .col-lg-3-24, .col-lg-4-24, .col-lg-5-24, .col-lg-6-24, .col-lg-7-24, .col-lg-8-24, .col-lg-9-24, .col-lg-10-24, .col-lg-11-24, .col-lg-12-24, .col-lg-13-24, .col-lg-14-24, .col-lg-15-24, .col-lg-16-24, .col-lg-17-24, .col-lg-18-24, .col-lg-19-24, .col-lg-20-24, .col-lg-21-24, .col-lg-22-24, .col-lg-23-24, .col-lg-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto } .col-lg-1-24 { width: 4.1667%; *width: 4.1357% } .col-lg-1-12, .col-lg-2-24 { width: 8.3333%; *width: 8.3023% } .col-lg-1-8, .col-lg-3-24 { width: 12.5%; *width: 12.469% } .col-lg-1-6, .col-lg-4-24 { width: 16.6667%; *width: 16.6357% } .col-lg-1-5 { width: 20%; *width: 19.969% } .col-lg-5-24 { width: 20.8333%; *width: 20.8023% } .col-lg-1-4, .col-lg-6-24 { width: 25%; *width: 24.969% } .col-lg-7-24 { width: 29.1667%; *width: 29.1357% } .col-lg-1-3, .col-lg-8-24 { width: 33.3333%; *width: 33.3023% } .col-lg-3-8, .col-lg-9-24 { width: 37.5%; *width: 37.469% } .col-lg-2-5 { width: 40%; *width: 39.969% } .col-lg-5-12, .col-lg-10-24 { width: 41.6667%; *width: 41.6357% } .col-lg-11-24 { width: 45.8333%; *width: 45.8023% } .col-lg-1-2, .col-lg-12-24 { width: 50%; *width: 49.969% } .col-lg-13-24 { width: 54.1667%; *width: 54.1357% } .col-lg-7-12, .col-lg-14-24 { width: 58.3333%; *width: 58.3023% } .col-lg-3-5 { width: 60%; *width: 59.969% } .col-lg-5-8, .col-lg-15-24 { width: 62.5%; *width: 62.469% } .col-lg-2-3, .col-lg-16-24 { width: 66.6667%; *width: 66.6357% } .col-lg-17-24 { width: 70.8333%; *width: 70.8023% } .col-lg-3-4, .col-lg-18-24 { width: 75%; *width: 74.969% } .col-lg-19-24 { width: 79.1667%; *width: 79.1357% } .col-lg-4-5 { width: 80%; *width: 79.969% } .col-lg-5-6, .col-lg-20-24 { width: 83.3333%; *width: 83.3023% } .col-lg-7-8, .col-lg-21-24 { width: 87.5%; *width: 87.469% } .col-lg-11-12, .col-lg-22-24 { width: 91.6667%; *width: 91.6357% } .col-lg-23-24 { width: 95.8333%; *width: 95.8023% } .col-lg-1, .col-lg-1-1, .col-lg-5-5, .col-lg-24-24 { width: 100% } } @media only screen and (min-width: 1601px) { .col-xl-1, .col-xl-1-1, .col-xl-1-2, .col-xl-1-3, .col-xl-2-3, .col-xl-1-4, .col-xl-3-4, .col-xl-1-5, .col-xl-2-5, .col-xl-3-5, .col-xl-4-5, .col-xl-5-5, .col-xl-1-6, .col-xl-5-6, .col-xl-1-8, .col-xl-3-8, .col-xl-5-8, .col-xl-7-8, .col-xl-1-12, .col-xl-5-12, .col-xl-7-12, .col-xl-11-12, .col-xl-1-24, .col-xl-2-24, .col-xl-3-24, .col-xl-4-24, .col-xl-5-24, .col-xl-6-24, .col-xl-7-24, .col-xl-8-24, .col-xl-9-24, .col-xl-10-24, .col-xl-11-24, .col-xl-12-24, .col-xl-13-24, .col-xl-14-24, .col-xl-15-24, .col-xl-16-24, .col-xl-17-24, .col-xl-18-24, .col-xl-19-24, .col-xl-20-24, .col-xl-21-24, .col-xl-22-24, .col-xl-23-24, .col-xl-24-24 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto } .col-xl-1-24 { width: 4.1667%; *width: 4.1357% } .col-xl-1-12, .col-xl-2-24 { width: 8.3333%; *width: 8.3023% } .col-xl-1-8, .col-xl-3-24 { width: 12.5%; *width: 12.469% } .col-xl-1-6, .col-xl-4-24 { width: 16.6667%; *width: 16.6357% } .col-xl-1-5 { width: 20%; *width: 19.969% } .col-xl-5-24 { width: 20.8333%; *width: 20.8023% } .col-xl-1-4, .col-xl-6-24 { width: 25%; *width: 24.969% } .col-xl-7-24 { width: 29.1667%; *width: 29.1357% } .col-xl-1-3, .col-xl-8-24 { width: 33.3333%; *width: 33.3023% } .col-xl-3-8, .col-xl-9-24 { width: 37.5%; *width: 37.469% } .col-xl-2-5 { width: 40%; *width: 39.969% } .col-xl-5-12, .col-xl-10-24 { width: 41.6667%; *width: 41.6357% } .col-xl-11-24 { width: 45.8333%; *width: 45.8023% } .col-xl-1-2, .col-xl-12-24 { width: 50%; *width: 49.969% } .col-xl-13-24 { width: 54.1667%; *width: 54.1357% } .col-xl-7-12, .col-xl-14-24 { width: 58.3333%; *width: 58.3023% } .col-xl-3-5 { width: 60%; *width: 59.969% } .col-xl-5-8, .col-xl-15-24 { width: 62.5%; *width: 62.469% } .col-xl-2-3, .col-xl-16-24 { width: 66.6667%; *width: 66.6357% } .col-xl-17-24 { width: 70.8333%; *width: 70.8023% } .col-xl-3-4, .col-xl-18-24 { width: 75%; *width: 74.969% } .col-xl-19-24 { width: 79.1667%; *width: 79.1357% } .col-xl-4-5 { width: 80%; *width: 79.969% } .col-xl-5-6, .col-xl-20-24 { width: 83.3333%; *width: 83.3023% } .col-xl-7-8, .col-xl-21-24 { width: 87.5%; *width: 87.469% } .col-xl-11-12, .col-xl-22-24 { width: 91.6667%; *width: 91.6357% } .col-xl-23-24 { width: 95.8333%; *width: 95.8023% } .col-xl-1, .col-xl-1-1, .col-xl-5-5, .col-xl-24-24 { width: 100% } } .g-gap-0 { margin-left: -0vw; margin-right: -0vw; max-width: none; width: auto } .g-gap-0>[class^="col-"], .g-gap-0>[class*=" col-"] { padding-left: 0vw; padding-right: 0vw } .shelby_gap_1 { margin-left: -1vw; margin-right: -1vw; max-width: none; width: auto } .shelby_gap_1>[class^="col-"], .shelby_gap_1>[class*=" col-"] { padding-left: 1vw; padding-right: 1vw } .g-gap-2 { margin-left: -2vw; margin-right: -2vw; max-width: none; width: auto } .g-gap-2>[class^="col-"], .g-gap-2>[class*=" col-"] { padding-left: 2vw; padding-right: 2vw } .g-gap-3 { margin-left: -3vw; margin-right: -3vw; max-width: none; width: auto } .g-gap-3>[class^="col-"], .g-gap-3>[class*=" col-"] { padding-left: 3vw; padding-right: 3vw } .g-gap-4 { margin-left: -4vw; margin-right: -4vw; max-width: none; width: auto } .g-gap-4>[class^="col-"], .g-gap-4>[class*=" col-"] { padding-left: 4vw; padding-right: 4vw } .g-gap-5 { margin-left: -5vw; margin-right: -5vw; max-width: none; width: auto } .g-gap-5>[class^="col-"], .g-gap-5>[class*=" col-"] { padding-left: 5vw; padding-right: 5vw } .g-gap-v-0>[class^="col-"], .g-gap-v-0>[class*=" col-"] { margin-bottom: 0rem } .g-gap-v-0>[class^="col-"]:last-child, .g-gap-v-0>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-1>[class^="col-"], .g-gap-v-1>[class*=" col-"] { margin-bottom: 2rem } .g-gap-v-1>[class^="col-"]:last-child, .g-gap-v-1>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-2>[class^="col-"], .g-gap-v-2>[class*=" col-"] { margin-bottom: 4rem } .g-gap-v-2>[class^="col-"]:last-child, .g-gap-v-2>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-3>[class^="col-"], .g-gap-v-3>[class*=" col-"] { margin-bottom: 6rem } .g-gap-v-3>[class^="col-"]:last-child, .g-gap-v-3>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-4>[class^="col-"], .g-gap-v-4>[class*=" col-"] { margin-bottom: 8rem } .g-gap-v-4>[class^="col-"]:last-child, .g-gap-v-4>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-5>[class^="col-"], .g-gap-v-5>[class*=" col-"] { margin-bottom: 10rem } .g-gap-v-5>[class^="col-"]:last-child, .g-gap-v-5>[class*=" col-"]:last-child { margin-bottom: 0 } @media only screen and (min-width: 321px) { .g-gap-xs-0 { margin-left: -0vw; margin-right: -0vw; max-width: none; width: auto } .g-gap-xs-0>[class^="col-"], .g-gap-xs-0>[class*=" col-"] { padding-left: 0vw; padding-right: 0vw } .g-gap-xs-1 { margin-left: -1vw; margin-right: -1vw; max-width: none; width: auto } .g-gap-xs-1>[class^="col-"], .g-gap-xs-1>[class*=" col-"] { padding-left: 1vw; padding-right: 1vw } .g-gap-xs-2 { margin-left: -2vw; margin-right: -2vw; max-width: none; width: auto } .g-gap-xs-2>[class^="col-"], .g-gap-xs-2>[class*=" col-"] { padding-left: 2vw; padding-right: 2vw } .g-gap-xs-3 { margin-left: -3vw; margin-right: -3vw; max-width: none; width: auto } .g-gap-xs-3>[class^="col-"], .g-gap-xs-3>[class*=" col-"] { padding-left: 3vw; padding-right: 3vw } .g-gap-xs-4 { margin-left: -4vw; margin-right: -4vw; max-width: none; width: auto } .g-gap-xs-4>[class^="col-"], .g-gap-xs-4>[class*=" col-"] { padding-left: 4vw; padding-right: 4vw } .g-gap-xs-5 { margin-left: -5vw; margin-right: -5vw; max-width: none; width: auto } .g-gap-xs-5>[class^="col-"], .g-gap-xs-5>[class*=" col-"] { padding-left: 5vw; padding-right: 5vw } .g-gap-v-xs-0>[class^="col-"], .g-gap-v-xs-0>[class*=" col-"] { margin-bottom: 0rem } .g-gap-v-xs-0>[class^="col-"]:last-child, .g-gap-v-xs-0>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xs-1>[class^="col-"], .g-gap-v-xs-1>[class*=" col-"] { margin-bottom: 2rem } .g-gap-v-xs-1>[class^="col-"]:last-child, .g-gap-v-xs-1>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xs-2>[class^="col-"], .g-gap-v-xs-2>[class*=" col-"] { margin-bottom: 4rem } .g-gap-v-xs-2>[class^="col-"]:last-child, .g-gap-v-xs-2>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xs-3>[class^="col-"], .g-gap-v-xs-3>[class*=" col-"] { margin-bottom: 6rem } .g-gap-v-xs-3>[class^="col-"]:last-child, .g-gap-v-xs-3>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xs-4>[class^="col-"], .g-gap-v-xs-4>[class*=" col-"] { margin-bottom: 8rem } .g-gap-v-xs-4>[class^="col-"]:last-child, .g-gap-v-xs-4>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xs-5>[class^="col-"], .g-gap-v-xs-5>[class*=" col-"] { margin-bottom: 10rem } .g-gap-v-xs-5>[class^="col-"]:last-child, .g-gap-v-xs-5>[class*=" col-"]:last-child { margin-bottom: 0 } } @media only screen and (min-width: 481px) { .g-gap-sm-0 { margin-left: -0vw; margin-right: -0vw; max-width: none; width: auto } .g-gap-sm-0>[class^="col-"], .g-gap-sm-0>[class*=" col-"] { padding-left: 0vw; padding-right: 0vw } .g-gap-sm-1 { margin-left: -1vw; margin-right: -1vw; max-width: none; width: auto } .g-gap-sm-1>[class^="col-"], .g-gap-sm-1>[class*=" col-"] { padding-left: 1vw; padding-right: 1vw } .g-gap-sm-2 { margin-left: -2vw; margin-right: -2vw; max-width: none; width: auto } .g-gap-sm-2>[class^="col-"], .g-gap-sm-2>[class*=" col-"] { padding-left: 2vw; padding-right: 2vw } .g-gap-sm-3 { margin-left: -3vw; margin-right: -3vw; max-width: none; width: auto } .g-gap-sm-3>[class^="col-"], .g-gap-sm-3>[class*=" col-"] { padding-left: 3vw; padding-right: 3vw } .g-gap-sm-4 { margin-left: -4vw; margin-right: -4vw; max-width: none; width: auto } .g-gap-sm-4>[class^="col-"], .g-gap-sm-4>[class*=" col-"] { padding-left: 4vw; padding-right: 4vw } .g-gap-sm-5 { margin-left: -5vw; margin-right: -5vw; max-width: none; width: auto } .g-gap-sm-5>[class^="col-"], .g-gap-sm-5>[class*=" col-"] { padding-left: 5vw; padding-right: 5vw } .g-gap-v-sm-0>[class^="col-"], .g-gap-v-sm-0>[class*=" col-"] { margin-bottom: 0rem } .g-gap-v-sm-0>[class^="col-"]:last-child, .g-gap-v-sm-0>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-sm-1>[class^="col-"], .g-gap-v-sm-1>[class*=" col-"] { margin-bottom: 2rem } .g-gap-v-sm-1>[class^="col-"]:last-child, .g-gap-v-sm-1>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-sm-2>[class^="col-"], .g-gap-v-sm-2>[class*=" col-"] { margin-bottom: 4rem } .g-gap-v-sm-2>[class^="col-"]:last-child, .g-gap-v-sm-2>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-sm-3>[class^="col-"], .g-gap-v-sm-3>[class*=" col-"] { margin-bottom: 6rem } .g-gap-v-sm-3>[class^="col-"]:last-child, .g-gap-v-sm-3>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-sm-4>[class^="col-"], .g-gap-v-sm-4>[class*=" col-"] { margin-bottom: 8rem } .g-gap-v-sm-4>[class^="col-"]:last-child, .g-gap-v-sm-4>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-sm-5>[class^="col-"], .g-gap-v-sm-5>[class*=" col-"] { margin-bottom: 10rem } .g-gap-v-sm-5>[class^="col-"]:last-child, .g-gap-v-sm-5>[class*=" col-"]:last-child { margin-bottom: 0 } } @media only screen and (min-width: 641px) { .g-gap-md-0 { margin-left: -0vw; margin-right: -0vw; max-width: none; width: auto } .g-gap-md-0>[class^="col-"], .g-gap-md-0>[class*=" col-"] { padding-left: 0vw; padding-right: 0vw } .g-gap-md-1 { margin-left: -1vw; margin-right: -1vw; max-width: none; width: auto } .g-gap-md-1>[class^="col-"], .g-gap-md-1>[class*=" col-"] { padding-left: 1vw; padding-right: 1vw } .g-gap-md-2 { margin-left: -2vw; margin-right: -2vw; max-width: none; width: auto } .g-gap-md-2>[class^="col-"], .g-gap-md-2>[class*=" col-"] { padding-left: 2vw; padding-right: 2vw } .g-gap-md-3 { margin-left: -3vw; margin-right: -3vw; max-width: none; width: auto } .g-gap-md-3>[class^="col-"], .g-gap-md-3>[class*=" col-"] { padding-left: 3vw; padding-right: 3vw } .g-gap-md-4 { margin-left: -4vw; margin-right: -4vw; max-width: none; width: auto } .g-gap-md-4>[class^="col-"], .g-gap-md-4>[class*=" col-"] { padding-left: 4vw; padding-right: 4vw } .g-gap-md-5 { margin-left: -5vw; margin-right: -5vw; max-width: none; width: auto } .g-gap-md-5>[class^="col-"], .g-gap-md-5>[class*=" col-"] { padding-left: 5vw; padding-right: 5vw } .g-gap-v-md-0>[class^="col-"], .g-gap-v-md-0>[class*=" col-"] { margin-bottom: 0rem } .g-gap-v-md-0>[class^="col-"]:last-child, .g-gap-v-md-0>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-md-1>[class^="col-"], .g-gap-v-md-1>[class*=" col-"] { margin-bottom: 2rem } .g-gap-v-md-1>[class^="col-"]:last-child, .g-gap-v-md-1>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-md-2>[class^="col-"], .g-gap-v-md-2>[class*=" col-"] { margin-bottom: 4rem } .g-gap-v-md-2>[class^="col-"]:last-child, .g-gap-v-md-2>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-md-3>[class^="col-"], .g-gap-v-md-3>[class*=" col-"] { margin-bottom: 6rem } .g-gap-v-md-3>[class^="col-"]:last-child, .g-gap-v-md-3>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-md-4>[class^="col-"], .g-gap-v-md-4>[class*=" col-"] { margin-bottom: 8rem } .g-gap-v-md-4>[class^="col-"]:last-child, .g-gap-v-md-4>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-md-5>[class^="col-"], .g-gap-v-md-5>[class*=" col-"] { margin-bottom: 10rem } .g-gap-v-md-5>[class^="col-"]:last-child, .g-gap-v-md-5>[class*=" col-"]:last-child { margin-bottom: 0 } } @media only screen and (min-width: 1025px) { .g-gap-xm-0 { margin-left: -0vw; margin-right: -0vw; max-width: none; width: auto } .g-gap-xm-0>[class^="col-"], .g-gap-xm-0>[class*=" col-"] { padding-left: 0vw; padding-right: 0vw } .g-gap-xm-1 { margin-left: -1vw; margin-right: -1vw; max-width: none; width: auto } .g-gap-xm-1>[class^="col-"], .g-gap-xm-1>[class*=" col-"] { padding-left: 1vw; padding-right: 1vw } .g-gap-xm-2 { margin-left: -2vw; margin-right: -2vw; max-width: none; width: auto } .g-gap-xm-2>[class^="col-"], .g-gap-xm-2>[class*=" col-"] { padding-left: 2vw; padding-right: 2vw } .g-gap-xm-3 { margin-left: -3vw; margin-right: -3vw; max-width: none; width: auto } .g-gap-xm-3>[class^="col-"], .g-gap-xm-3>[class*=" col-"] { padding-left: 3vw; padding-right: 3vw } .g-gap-xm-4 { margin-left: -4vw; margin-right: -4vw; max-width: none; width: auto } .g-gap-xm-4>[class^="col-"], .g-gap-xm-4>[class*=" col-"] { padding-left: 4vw; padding-right: 4vw } .g-gap-xm-5 { margin-left: -5vw; margin-right: -5vw; max-width: none; width: auto } .g-gap-xm-5>[class^="col-"], .g-gap-xm-5>[class*=" col-"] { padding-left: 5vw; padding-right: 5vw } .g-gap-v-xm-0>[class^="col-"], .g-gap-v-xm-0>[class*=" col-"] { margin-bottom: 0rem } .g-gap-v-xm-0>[class^="col-"]:last-child, .g-gap-v-xm-0>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xm-1>[class^="col-"], .g-gap-v-xm-1>[class*=" col-"] { margin-bottom: 2rem } .g-gap-v-xm-1>[class^="col-"]:last-child, .g-gap-v-xm-1>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xm-2>[class^="col-"], .g-gap-v-xm-2>[class*=" col-"] { margin-bottom: 4rem } .g-gap-v-xm-2>[class^="col-"]:last-child, .g-gap-v-xm-2>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xm-3>[class^="col-"], .g-gap-v-xm-3>[class*=" col-"] { margin-bottom: 6rem } .g-gap-v-xm-3>[class^="col-"]:last-child, .g-gap-v-xm-3>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xm-4>[class^="col-"], .g-gap-v-xm-4>[class*=" col-"] { margin-bottom: 8rem } .g-gap-v-xm-4>[class^="col-"]:last-child, .g-gap-v-xm-4>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xm-5>[class^="col-"], .g-gap-v-xm-5>[class*=" col-"] { margin-bottom: 10rem } .g-gap-v-xm-5>[class^="col-"]:last-child, .g-gap-v-xm-5>[class*=" col-"]:last-child { margin-bottom: 0 } } @media only screen and (min-width: 1281px) { .g-gap-lg-0 { margin-left: -0vw; margin-right: -0vw; max-width: none; width: auto } .g-gap-lg-0>[class^="col-"], .g-gap-lg-0>[class*=" col-"] { padding-left: 0vw; padding-right: 0vw } .g-gap-lg-1 { margin-left: -1vw; margin-right: -1vw; max-width: none; width: auto } .g-gap-lg-1>[class^="col-"], .g-gap-lg-1>[class*=" col-"] { padding-left: 1vw; padding-right: 1vw } .g-gap-lg-2 { margin-left: -2vw; margin-right: -2vw; max-width: none; width: auto } .g-gap-lg-2>[class^="col-"], .g-gap-lg-2>[class*=" col-"] { padding-left: 2vw; padding-right: 2vw } .g-gap-lg-3 { margin-left: -3vw; margin-right: -3vw; max-width: none; width: auto } .g-gap-lg-3>[class^="col-"], .g-gap-lg-3>[class*=" col-"] { padding-left: 3vw; padding-right: 3vw } .g-gap-lg-4 { margin-left: -4vw; margin-right: -4vw; max-width: none; width: auto } .g-gap-lg-4>[class^="col-"], .g-gap-lg-4>[class*=" col-"] { padding-left: 4vw; padding-right: 4vw } .g-gap-lg-5 { margin-left: -5vw; margin-right: -5vw; max-width: none; width: auto } .g-gap-lg-5>[class^="col-"], .g-gap-lg-5>[class*=" col-"] { padding-left: 5vw; padding-right: 5vw } .g-gap-v-lg-0>[class^="col-"], .g-gap-v-lg-0>[class*=" col-"] { margin-bottom: 0rem } .g-gap-v-lg-0>[class^="col-"]:last-child, .g-gap-v-lg-0>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-lg-1>[class^="col-"], .g-gap-v-lg-1>[class*=" col-"] { margin-bottom: 2rem } .g-gap-v-lg-1>[class^="col-"]:last-child, .g-gap-v-lg-1>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-lg-2>[class^="col-"], .g-gap-v-lg-2>[class*=" col-"] { margin-bottom: 4rem } .g-gap-v-lg-2>[class^="col-"]:last-child, .g-gap-v-lg-2>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-lg-3>[class^="col-"], .g-gap-v-lg-3>[class*=" col-"] { margin-bottom: 6rem } .g-gap-v-lg-3>[class^="col-"]:last-child, .g-gap-v-lg-3>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-lg-4>[class^="col-"], .g-gap-v-lg-4>[class*=" col-"] { margin-bottom: 8rem } .g-gap-v-lg-4>[class^="col-"]:last-child, .g-gap-v-lg-4>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-lg-5>[class^="col-"], .g-gap-v-lg-5>[class*=" col-"] { margin-bottom: 10rem } .g-gap-v-lg-5>[class^="col-"]:last-child, .g-gap-v-lg-5>[class*=" col-"]:last-child { margin-bottom: 0 } } @media only screen and (min-width: 1601px) { .g-gap-xl-0 { margin-left: -0vw; margin-right: -0vw; max-width: none; width: auto } .g-gap-xl-0>[class^="col-"], .g-gap-xl-0>[class*=" col-"] { padding-left: 0vw; padding-right: 0vw } .g-gap-xl-1 { margin-left: -1vw; margin-right: -1vw; max-width: none; width: auto } .g-gap-xl-1>[class^="col-"], .g-gap-xl-1>[class*=" col-"] { padding-left: 1vw; padding-right: 1vw } .g-gap-xl-2 { margin-left: -2vw; margin-right: -2vw; max-width: none; width: auto } .g-gap-xl-2>[class^="col-"], .g-gap-xl-2>[class*=" col-"] { padding-left: 2vw; padding-right: 2vw } .g-gap-xl-3 { margin-left: -3vw; margin-right: -3vw; max-width: none; width: auto } .g-gap-xl-3>[class^="col-"], .g-gap-xl-3>[class*=" col-"] { padding-left: 3vw; padding-right: 3vw } .g-gap-xl-4 { margin-left: -4vw; margin-right: -4vw; max-width: none; width: auto } .g-gap-xl-4>[class^="col-"], .g-gap-xl-4>[class*=" col-"] { padding-left: 4vw; padding-right: 4vw } .g-gap-xl-5 { margin-left: -5vw; margin-right: -5vw; max-width: none; width: auto } .g-gap-xl-5>[class^="col-"], .g-gap-xl-5>[class*=" col-"] { padding-left: 5vw; padding-right: 5vw } .g-gap-v-xl-0>[class^="col-"], .g-gap-v-xl-0>[class*=" col-"] { margin-bottom: 0rem } .g-gap-v-xl-0>[class^="col-"]:last-child, .g-gap-v-xl-0>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xl-1>[class^="col-"], .g-gap-v-xl-1>[class*=" col-"] { margin-bottom: 2rem } .g-gap-v-xl-1>[class^="col-"]:last-child, .g-gap-v-xl-1>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xl-2>[class^="col-"], .g-gap-v-xl-2>[class*=" col-"] { margin-bottom: 4rem } .g-gap-v-xl-2>[class^="col-"]:last-child, .g-gap-v-xl-2>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xl-3>[class^="col-"], .g-gap-v-xl-3>[class*=" col-"] { margin-bottom: 6rem } .g-gap-v-xl-3>[class^="col-"]:last-child, .g-gap-v-xl-3>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xl-4>[class^="col-"], .g-gap-v-xl-4>[class*=" col-"] { margin-bottom: 8rem } .g-gap-v-xl-4>[class^="col-"]:last-child, .g-gap-v-xl-4>[class*=" col-"]:last-child { margin-bottom: 0 } .g-gap-v-xl-5>[class^="col-"], .g-gap-v-xl-5>[class*=" col-"] { margin-bottom: 10rem } .g-gap-v-xl-5>[class^="col-"]:last-child, .g-gap-v-xl-5>[class*=" col-"]:last-child { margin-bottom: 0 } } .g-gap--keep { margin-left: 0; margin-right: 0 } .g-invert, .g-invert-sm, .g-invert-md, .g-invert-xm, .g-invert-lg, .g-invert-xl { flex-direction: column-reverse } @media only screen and (min-width: 481px) { .g-invert-sm { flex-direction: row } } @media only screen and (min-width: 641px) { .g-invert-md { flex-direction: row } } @media only screen and (min-width: 1025px) { .g-invert-xm { flex-direction: row } } @media only screen and (min-width: 1281px) { .g-invert-lg { flex-direction: row } } @media only screen and (min-width: 1601px) { .g-invert-xl { flex-direction: row } } .g-section--xl { margin-bottom: 7rem; margin-top: 7rem } .g-section--lg { margin-bottom: 6rem; margin-top: 6rem } .g-section--xm { margin-bottom: 5rem; margin-top: 5rem; position: relative } .g-section--md { margin-bottom: 4rem; margin-top: 4rem; position: relative; z-index: 1 } .g-section--sm { margin-bottom: 3rem; margin-top: 3rem; position: relative } .g-section--xs { margin-bottom: 1.5rem; margin-top: 1.5rem; position: relative } .g-section--no-top { margin-top: 0 !important } .g-section--no-bottom { margin-bottom: 0 !important } @media only screen and (min-width: 1025px) { .g-section--xl { margin-bottom: 15rem; margin-top: 15rem } .g-section--lg { margin-bottom: 10rem; margin-top: 10rem } .g-section--xm { margin-bottom: 8rem; margin-top: 8rem } .g-section--md { margin-bottom: 6rem; margin-top: 6rem } .g-section--sm { margin-bottom: 3rem; margin-top: 3rem } .g-section--xs { margin-bottom: 2rem; margin-top: 2rem } } @media only screen and (min-width: 1281px) { .g-section--xl { margin-bottom: 20rem; margin-top: 20rem } .g-section--lg { margin-bottom: 15rem; margin-top: 15rem } .g-section--xm { margin-bottom: 12rem; margin-top: 12rem } .g-section--md { margin-bottom: 8rem; margin-top: 8rem } .g-section--sm { margin-bottom: 5rem; margin-top: 5rem } .g-section--xs { margin-bottom: 3rem; margin-top: 3rem } } .shelby_title { display: block; line-height: 1.2em; margin-bottom: 2rem } .shelby_title-xl { font-size: clamp(4.5rem, 6vw, 9.6rem) } .shelby-title-lg { font-size: clamp(4.5rem, 5vw, 7rem) } .shelby_title-xm { font-size: clamp(2.7rem, 3.6vw, 5.7rem) } .shelby_title--md { font-size: clamp(2rem, 3vw, 4.8rem) } .shelby_title--sm { font-size: clamp(2rem, 2vw, 3.7rem); line-height: 1.4em } .shelby_title--xs { font-size: clamp(1.7rem, 1.5vw, 2.7rem); line-height: 1.4em } .shelby_title--inline { display: inline-block } .shelby_title--center { align-items: center; text-align: center } .shelby_title--no-bottom { margin-bottom: 0 !important } @media only screen and (min-width: 1025px) { .shelby_title { margin-bottom: 3rem } } .shleby-wrap { margin-left: auto; margin-right: auto; max-width: 1530px; padding-left: 20px; padding-right: 20px; width: 100% } .shelby-w-main { clear: both; min-height: 100%; overflow: hidden; position: relative; z-index: 3 } .shleby-wrap-spaced { padding-left: 20px; padding-right: 20px } .shleby-wrap-xl { max-width: 160rem } .shelby-w-lg, .shelby-w-lg-left, .shelby-w-lg-right { padding-left: 2rem; padding-right: 2rem } .shleby-wrap-xm { max-width: 1160 } .shleby-wrap-md { max-width: 90rem } .shleby-wrap-sm { max-width: 64rem } @media only screen and (min-width: 641px) { .shleby-wrap { padding-left: 30px; padding-right: 30px } } @media only screen and (min-width: 1025px) { .shelby-w-lg { padding-left: clamp(3rem, 2vw, 8rem); padding-right: clamp(3rem, 2vw, 8rem) } .shelby-w-lg-left { padding-left: clamp(3rem, 2vw, 8rem); padding-right: 0 } .shelby-w-lg-right { padding-left: 0; padding-right: clamp(3rem, 2vw, 8rem) } } @media only screen and (min-width: 1601px) { .shelby-w-lg { padding-left: clamp(3rem, 10vw, 13rem); padding-right: clamp(3rem, 10vw, 13rem) } .shelby-w-lg-left { padding-left: clamp(3rem, 10vw, 13rem); padding-right: 0 !important } .shelby-w-lg-right { padding-left: 0; padding-right: clamp(3rem, 10vw, 13rem) } .shleby-wrap-spaced { padding: 0 8rem } } .btn { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; align-items: center; display: inline-flex; cursor: pointer; background: none; border: none; justify-content: center; line-height: 1.5em; pointer-events: all; position: relative; white-space: nowrap; font-size: 1.6rem } .btn:focus { outline: none } .btn--md { min-width: 12rem; padding: 1rem 1.5rem } .btn--lg { padding: 1.5rem 2rem } .btn--full { width: 100% } .btn--white { background-color: #fff; color: #000; border: 1px solid #fff } .btn--white:hover { background-color: transparent; color: #fff } .btn--black { background-color: #000; color: #fff; border: 1px solid #000 } .btn--black:hover { background-color: transparent; color: #000 } .btn--white-border { background-color: transparent; color: #fff; border: 1px solid #fff } .btn--white-border:hover { background-color: #fff; color: #000 } .btn--black-border { background-color: transparent; color: #000; border: 1px solid #000 } .btn--black-border:hover { background-color: #000; color: #fff } .btn--search { padding: 1.3rem } .btn--white-search { background-color: #fff; color: #000 } .btn--white-search:hover { background-color: black; color: #fff } .btn--white-search:hover .icon { filter: invert(1) } .btn--grey { background-color: #d9d9d9; color: #000 } .btn--grey:hover { background-color: black; color: #fff } .btn--grey:hover .icon { filter: invert(1) } .btn .icon, .btn__icon { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; display: inline-block } .btn .icon:first-child, .btn__icon:first-child { margin-right: 1rem } .btn .icon:last-child, .btn__icon:last-child { margin-left: 1rem } .btn__wrap { align-items: center; display: flex; flex-direction: column; justify-content: center } .btn__wrap .btn { margin-bottom: 1rem } @media only screen and (max-width: 1024px) { .btn--lg { padding: 1rem 1.5rem } } .icon { background-position: center; background-repeat: no-repeat; background-size: contain; display: inline-block; flex-shrink: 0 } .icon--spaced { vertical-align: middle } .icon--spaced:first-child:not(:last-child) { margin-right: 1rem } .icon--spaced:last-child:not(:first-child) { margin-left: 1rem } .icon--arrow-left { background-image: url("../public/image/icon/arrow-left.svg"); height: 15px; width: 22px } .icon--arrow-right { background-image: url("../public/image/icon/arrow-right.svg"); height: 15px; width: 22px } .icon--arrow-left-p { background-image: url("../public/image/icon/arrow-left-p.svg"); height: 14px; width: 7px } .icon--arrow-right-p { background-image: url("../public/image/icon/arrow-right-p.svg"); height: 14px; width: 7px } .icon--caret { background-image: url("../public/image/icon/caret.svg"); height: 6px; width: 12px } .icon--check-sm { background-image: url("../public/image/icon/check-sm.svg"); height: 10px; width: 12px } .icon--check-sm-black { background-image: url("../public/image/icon/check-sm-black.svg"); height: 16px; width: 16px } .icon--nav-open { background-image: url("../public/image/icon/nav-open.svg"); height: 15px; width: 32px } .icon--nav-close { background-image: url("../public/image/icon/nav-close.svg"); height: 24px; width: 24px } .icon--num-minus { background-image: url("../public/image/icon/num-minus.svg"); height: 3px; width: 11px } .icon--num-plus { background-image: url("../public/image/icon/num-plus.svg"); height: 11px; width: 11px } .icon--phone { background-image: url("../public/image/icon/phone.svg"); height: 18px; width: 18px } .icon--download { background-image: url("../public/image/icon/download.svg"); height: 20px; width: 20px } .icon--arrow-exit { background-image: url("../public/image/icon/arrow-exit.svg"); height: 20px; width: 20px } .icon--car { background-image: url("../public/image/icon/car.svg"); height: 20px; width: 20px } .icon--list { background-image: url("../public/image/icon/list.svg"); height: 20px; width: 20px } .icon--facade { background-image: url("../public/image/icon/building.svg"); height: 20px; width: 20px } .icon--back { background-image: url("../public/image/icon/arrow-back.svg"); height: 20px; width: 20px } .icon--walk { background-image: url("../public/image/icon/walk.svg"); height: 15px; width: 12px } .checkbox { margin-bottom: 0.5rem; min-height: 2.5rem } .checkbox--dark .checkbox__label { color: black } .checkbox--dark .checkbox__label::before { border-color: black } .checkbox--dark .checkbox__label::after { background-color: black; background-image: url("../public/image/icon/check-sm-white.svg") } .checkbox--white .checkbox__label::before { border-color: white } .checkbox--white .checkbox__label::after { background-color: white } .checkbox__input { display: none } .checkbox__input:checked+.checkbox__label::before { border-color: gray } .checkbox__input:checked+.checkbox__label::after { opacity: 1; visibility: visible } .checkbox__label { cursor: pointer; display: inline-block; font-size: 1.4rem; line-height: 1.2em; padding-left: 2.5rem; position: relative; text-align: left } .checkbox__label::before, .checkbox__label::after { content: ''; display: inline-block; left: 0; position: absolute; top: 50%; transform: translateY(-50%) } .checkbox__label::before { border: 1px solid gray; height: 1.4rem; width: 1.4rem } .checkbox__label::after { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; background: url("../public/image/icon/check-sm-white.svg") no-repeat center; background-size: 50%; display: inline-block; height: 1.6rem; opacity: 0; visibility: hidden; width: 1.6rem } .checkbox__label--radio::before, .checkbox__label--radio::after { border-radius: 1rem } .checkbox__label::selection { background-color: none } .checkbox__label a { text-decoration: underline } .checkbox__label a:hover { opacity: 0.6 } .consent { transition: all 250ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; background-color: white; bottom: 0; color: black; font-size: 1.4rem; left: 0; position: fixed; text-align: center; transform: translateY(100%); width: 100%; z-index: 5 } .consent.-is-shown { transform: translateY(0) } .consent__inner { padding: 1rem 2rem } .consent__text a { text-decoration: underline } .consent__btn { margin-top: 1rem } @media only screen and (min-width: 641px) { .consent__inner { align-items: center; display: flex; justify-content: center } .consent__text { margin-right: 3rem } .consent__btn { margin-top: 0 } } .footer__end { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 3rem; font-size: 1.4rem; padding-bottom: 4rem } .footer__end-list { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem } .footer__end-item { line-height: 1.2em } .footer__end-link { display: block } .footer__end-link:hover { text-decoration: underline } .footer__end-logo { display: inline-block; margin-left: 0.5rem; vertical-align: -0.7rem } .footer__end-logo:hover { opacity: 0.7 } .form { text-align: left } .form__item { flex: 1 1 45%; position: relative; line-height: 1em; margin-bottom: 2rem } .form__row { display: flex; flex-wrap: wrap; gap: 2rem; margin-bottom: 1rem } .form__label { position: absolute; display: block; top: 2rem; left: 0 } .form__label--spaced { margin-bottom: 1.5rem } .form__input { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; background: none; border: none; border-bottom: 1px solid rgba(255, 255, 255, 0.5); color: #000; display: block; font-size: 1.6rem; padding: 2.3rem 0 1rem; width: 100% } .form__input--lg { padding-bottom: 1.5rem; padding-top: 1.5rem } .form__input--textarea { line-height: 1.3em; min-height: 5rem } .form__input::placeholder { color: #fff } .form__input:focus { outline: none } .form__submit { margin-top: 2rem } .form__checkbox-cont { display: flex; flex-wrap: wrap; gap: 1.5rem } @media only screen and (max-width: 640px) { .form__checkbox-cont { margin-bottom: 3rem } } .form__checkbox-label { display: inline-flex; justify-content: center; align-items: center; gap: 1rem; padding: 1.5rem 0; color: #fff; font-size: 1.6rem; line-height: 1.1em; cursor: pointer } .form__checkbox-label:hover { text-decoration: underline } .form__checkbox-input { display: none } .form__checkbox-input:checked+.form__checkbox-label { text-decoration: underline } @media only screen and (min-width: 481px) { .form__submit { width: 100% } } @media only screen and (min-width: 1025px) { .form__item { margin-bottom: 2.5rem } .form__label--spaced { margin-bottom: 2rem } } @media only screen and (max-width: 640px) { .form__row { flex-direction: column; gap: 0; margin-bottom: 0 } } input:focus+label, input:not(:placeholder-shown)+label, textarea:focus+label, textarea:not(:placeholder-shown)+label { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; top: -0.5rem; font-size: 16px } input:focus, input:not(:placeholder-shown), textarea:focus, textarea:not(:placeholder-shown) { padding: 2.3rem 0 1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.5); background-color: transparent; color: #fff } input:invalid+label { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; top: 1rem; font-size: 12px; color: red } .header { position: fixed; width: 100vw; height: 9rem; top: 0; left: 0; z-index: 10 } .header--inner .header__main { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; visibility: visible; opacity: 1 } .header.-active .header_menu-txt span:first-child { visibility: hidden; opacity: 0 } .header.-active .header_menu-txt span:last-child { visibility: visible; opacity: 1 } .header.-active .hamburger_header span:nth-child(1) { display: none } .header.-active .hamburger_header span:nth-child(2) { transform: rotate(135deg) translate(0.5rem, -0.5rem) } .header.-active .hamburger_header span:nth-child(3) { transform: rotate(-135deg) translate(0.5rem, 0.5rem); width: 100% } .header.-sticky .header__main { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; visibility: visible; opacity: 1 } .header.-sticky .header__start { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; visibility: hidden; opacity: 0 } .header__start { position: absolute; top: 0; left: 0; display: flex; align-items: center; width: 100%; height: 100% } .header__hs-logo { height: 2.5rem } .header_menu { transition: all 250ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; display: inline-flex; align-items: center; gap: 1rem; text-transform: uppercase; color: #fff } .hamburger_header { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; width: 2.6rem; height: 2.6rem; padding: 5px } .hamburger_header span { transition: all 250ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; width: 100%; height: 2px; background-color: #fff; border-radius: 25px } .hamburger_header span:last-child { width: 50% } .header_menu-txt { position: relative; width: 5vw; min-width: 5rem; height: 3rem } .header_menu-txt span { transition: all 250ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; position: absolute; top: 50%; left: 0; transform: translateY(-50%) } .header_menu-txt span:last-child { visibility: hidden; opacity: 0 } .header__main { display: flex; align-items: center; width: 100%; height: 100%; background-color: #466365; color: #fff; /* visibility: hidden; opacity: 0 */ } .header__wrap { display: flex; justify-content: space-between; align-items: center; width: 100%; gap: 3rem } .logo_header_box { width: 9rem } .header__col { display: flex; align-items: center } .header__col--left { gap: 4rem } .header__col--right { gap: 3.5vw } .header__link { position: relative; display: inline-flex; align-items: center; gap: 6px } .header__link::after { content: ''; position: absolute; left: 0; bottom: 0; background-color: currentColor } @media only screen and (max-width: 1024px) { .header { height: 6rem } .header__phone { display: inline-flex; justify-content: center; align-items: center; width: 3.7rem; height: 3.7rem; border: 1px solid #fff } .header_menu { display: inline-flex; justify-content: center; align-items: center; width: 3.7rem; height: 3.7rem; border: 1px solid #fff } .header_menu-txt { display: none } .header__col--right { padding-right: 1rem } } .hero {} .hero__badge { display: inline-block; padding: 1.5rem; background-color: rgba(0, 0, 0, 0.85); color: #fff; font-size: clamp(2rem, 1.5vw, 2.7rem); font-weight: 400 } .hero_cont { position: absolute; width: 100%; top: 10vh; left: 0; color: #fff } .hero_cont-wrap { display: flex; flex-direction: column; align-items: center; gap: 1.5rem } .hero__brochure { display: flex; background-color: #000; padding: 1rem } .hero__brochure:hover .hero__brochure-img { animation: hithere 1.2s ease infinite; animation-play-state: running } .hero__brochure:hover .hero__brochure-btn { background-color: #000; color: #fff } .hero__brochure-img-box { position: relative; width: 23% } .hero__brochure-img { position: absolute; width: 100%; left: 0; bottom: 0; font-size: clamp(1.4rem, 1.5vw, 1.6rem); z-index: 1 } .hero__brochure-btn { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; align-items: center; background-color: #fff; color: #000; display: flex; padding: 1.5rem; white-space: nowrap; border: 1px solid #fff } @media only screen and (max-width: 640px) { .hero__brochure { display: flex; flex-wrap: wrap; gap: 1rem } .hero__brochure-btn { display: inline-flex; justify-content: center; align-items: center; flex: 1 1 100% } .hero__brochure-img-box { width: 7rem } .hero__brochure-txt { width: 70% } } .table__table { width: 100% } .table__table th { color: #000; padding: 0 2rem 2rem; font-size: 1.6rem; text-align: center; font-weight: 400; border-bottom: 1px solid #000 } .table__table td { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; background-color: #fff; border-bottom: 1px solid #000; font-weight: 300; padding: 1.5rem 2rem; text-align: center; color: #000 } .table__table tbody tr { cursor: pointer; position: relative; font-size: clamp(1.7rem, 1.5vw, 2rem) } .table__table tbody tr .-cta { background-color: #fff } .table__table tbody tr .-cta__btn { display: inline-flex; justify-content: center; align-items: center; width: 6rem; height: 6rem; border: 1px solid #fff } .table__table tbody tr .-cta__btn i { filter: invert(1) } .table__table tbody tr:hover td { background-color: #000; color: #fff } .table__table tbody .-plan { width: 14rem } @media only screen and (max-width: 1024px) { .table__table thead { display: none } .table__table tr { background-color: #fff; display: flex; flex-wrap: wrap; margin-bottom: 2rem; padding: 1rem 0 1rem 13rem; position: relative } .table__table tr:last-child { margin-bottom: 0 } .table__table td { background-color: transparent; border-bottom: none; display: block; padding-left: 0; padding-right: 2.5rem; text-align: left } .table__table td::before { color: #000; content: attr(data-title); display: block; font-size: 1.3rem; text-transform: uppercase } .table__table tbody tr:hover td { background-color: #fff; color: black } .table__table tbody tr:hover .icon { filter: none } .table__table tbody .-cta { padding-right: 0; width: 100% } .table__table tbody .-cta::before { color: black; font-weight: bold; display: inline-block; margin-right: 1rem } } .underline { align-items: center; display: inline-flex; gap: 1rem; position: relative } .underline::after { background-color: currentColor; content: ''; bottom: -3px; height: 1px; left: 0; position: absolute; transform: scaleX(0); transform-origin: center bottom; transition: transform 0.2s; width: 100% } .underline:hover::after { transform: scaleX(1) } .underline--shown::after { transform: scaleX(1) } .underline--shown:hover::after { transform: scaleX(0.8) } .nav { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; position: fixed; width: 100%; height: 100vh; min-height: 57rem; color: #fff; background-color: #466365; padding-top: 9rem; z-index: 9; transform: translateY(-150%); overflow-y: scroll } .nav.-active { transform: translateY(0) } .navigation_container { display: flex; justify-content: space-between; padding-top: 9vh; padding-bottom: 9vh } .navigation_link { font-weight: 300; line-height: 1em } .navigation_link:hover { font-weight: 500 } .nav__contacts { display: flex; flex-direction: column; gap: 4vh; width: 43vw; min-width: 60rem } .nav__img-box { width: 100%; height: 32vh } .nav__img { display: block; width: 100%; height: 100%; object-fit: cover } .navigation_list { display: flex; height: 100%; flex-direction: column; gap: 2rem; font-size: clamp(2rem, 4vh, 3.7rem); /* justify-content: space-between */ } @media only screen and (max-width: 1024px) { .nav { max-width: 100vw; padding-top: 4rem } .navigation_container { flex-wrap: wrap; gap: 3.5rem } .navigation_menu { display: flex; flex-direction: column; gap: 2.5rem } .navigation_list { gap: 1rem } .nav__contacts { width: 100%; gap: 3.5rem; min-width: auto } } @media only screen and (max-width: 640px) { .nav { padding-top: 2rem } } .contacts { display: flex; gap: 4vw } .contacts__col { display: flex; flex-direction: column; gap: 3rem } .contacts__item { display: flex; flex-direction: column; gap: 1.5rem } .contacts__label { font-weight: 300 } .contacts__links { display: flex; flex-direction: column; font-weight: 550; line-height: 1em } .contacts__social { display: flex; gap: 2vw; font-weight: 550; line-height: 1em } @media only screen and (max-width: 640px) { .contacts { flex-direction: column; gap: 1.5rem } .contacts__col { gap: 1.5rem } } .stats { display: flex; flex-wrap: wrap; gap: 2.5rem; margin-bottom: 5rem } .stats__item { flex: 1 1 40%; display: flex; align-items: center; justify-content: center; padding: 3rem; border-bottom: 1px solid #fff; gap: 1rem } @media only screen and (max-width: 1024px) { .stats { gap: 1.5rem; margin-bottom: 2rem } .stats__item { padding: 1rem } } @media only screen and (max-width: 640px) { .stats { gap: 0.5rem } .stats__item { flex: 1 1 100%; padding: 0.5rem } } .advantages { display: flex; gap: 4.5vw } .advantages__item { position: relative; display: flex; flex-direction: column; gap: 2.5rem; flex: 1 1 20% } .advantages__item:not(:last-child):after { content: ''; position: absolute; top: 3.5rem; left: 0; height: 1px; width: 0; background-color: #d5a751; opacity: 0 } .advantages__item.-active:after { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; width: calc(100% + 4.5vw); opacity: 1 } .advantages__item.-active .advantages__icon-box::before { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; background-color: #fff } .advantages__item.-active .advantages__icon-box::after { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; opacity: 1 } .advantages__icon-box { position: relative; display: inline-flex; justify-content: center; align-items: center; width: 7rem; height: 7rem; min-width: 7rem; min-height: 7rem; border-radius: 50%; background-color: #efefef; z-index: 1 } .advantages__icon-box::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100%); height: calc(100%); border-radius: 50%; background-color: #efefef } .advantages__icon-box::after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 2px); height: calc(100% + 2px); border-radius: 50%; background-color: #d5a751; opacity: 0; z-index: -1 } .advantages__icon { position: relative; width: 50%; z-index: 3 } @media only screen and (max-width: 768px) { .advantages { flex-wrap: wrap } .advantages__item { flex: 1 1 40% } } .center-slider .slick-list { margin-right: -2rem } .center-slider__carousel { display: none; width: 100% } .center-slider__carousel.-visible { display: block } .center-slider__slide { display: flex !important; flex-direction: column; gap: 2rem; margin-right: 2rem } .center-slider__img-box { width: 100%; height: 44rem; min-height: 45rem } .center-slider__img { display: block; width: 100%; height: 100%; object-fit: cover } .center-slider__content { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 2rem } .center-slider__list { display: flex; align-items: center; gap: 1rem } .center-slider__item { display: inline-flex; align-items: center; gap: 5px } .properties { position: relative; margin-top: -14vw; z-index: 2 } .properties__list { display: flex; gap: 2rem; flex-wrap: wrap } .properties__list--list { flex-wrap: nowrap } .properties__header { display: flex; flex-direction: column; gap: 1.5rem; color: #fff } @media only screen and (max-width: 1024px) { .properties { margin-top: -20vw } .properties__list { flex-direction: column } } @media only screen and (max-width: 640px) { .properties { margin-top: 2rem } .properties__header { color: #000 } } .property { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; flex: 0 1 45%; display: flex; gap: 2vw; padding: 3rem 0 3rem 2vw; border: 1px solid #000; overflow: hidden; color: #000; background-color: #fff } .property__main { display: flex; flex-direction: column; gap: 2.5rem } .property__hs { width: 100%; overflow: hidden } .property__hs-cont { position: relative; display: flex; flex-wrap: nowrap; gap: 2.5rem; right: 0 } .property__hs-img { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; display: block; width: 64%; height: 20rem; object-fit: cover; opacity: 0 } .property__hs-img:first-child { opacity: 1 } .property__info { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 2rem; max-width: 44rem; padding-right: 2rem } .property__list { display: flex; flex-direction: column; gap: 1rem } .property__list--right .property__list-item { gap: 1.5vw } .property__list--right .property__list-item span { display: inline-flex; align-items: center; gap: 1rem } .property__list-item { display: flex; align-items: center; gap: 2.5vw } .property__list-label { width: 8rem; font-size: 1.5rem } .property__list-value { font-size: 1.8rem; text-transform: uppercase } .property__list-link { font-size: 1.6rem } @media only screen and (min-width: 1025px) { .property:hover { background-color: #000; color: #fff } .property:hover .property__hs-img { opacity: 1 } .property:hover .property__hs-cont { transform: translateX(-50%); transition: transform 3s ease-in-out } } @media only screen and (max-width: 640px) { .property { flex-wrap: wrap; gap: 0; padding: 3rem 2rem } .property__hs-img { display: none } .property__hs-img:first-child { display: block; width: 100% } .property__main { gap: 1.5rem } } .property-details { display: none } .property-details.-visible { display: block } .map { position: relative; width: 100% } .map__box { width: 100%; height: 70vh; min-height: 35rem } .map__map { display: block; width: 100%; height: 100% } .map__top { display: inline-block; background-color: #000; padding: 2rem 4vw 0 2.5vw } .map__top-icon { width: 4rem } .map__filter-header { padding-top: 2rem; padding-bottom: 2rem; padding-left: 2.5vw; background-color: #000; color: #fff } .map__filter-list { display: flex; flex-direction: column } .map__filter-link { display: flex; padding: 1rem 2rem; background-color: #000; color: #fff } .map__filter-txt { min-width: 10rem; margin-left: 2rem; margin-right: 4rem } .map__filter-checkbox { display: inline-flex; justify-content: center; align-items: center; width: 1.3rem; height: 1.3rem; border: 1px solid #fff } .map__filter-icon { width: 1.8rem } .map__filter-item { cursor: pointer } .map__filter-item:hover .map__filter-link, .map__filter-item.-current .map__filter-link { background-color: #fff; color: #000 } .map__filter-item:hover .map__filter-icon, .map__filter-item.-current .map__filter-icon { filter: invert(1) } @media only screen and (min-width: 641px) { .map__filter { position: absolute; right: 10vw; bottom: -5rem; max-width: 33rem; z-index: 2 } .map__filter-link { padding: 1rem 5vw 1rem 2.5vw } } @media only screen and (max-width: 1280px) { .map__filter { right: 2rem } } @media only screen and (max-width: 1024px) { .map__filter { right: 0rem } .map__filter-link { padding: 1rem } } .carousel { padding-left: 2rem; padding-right: 2rem } .carousel__list { display: none; width: 100% } .carousel__list.-visible { display: flex !important } .carousel__item { display: flex !important; position: relative; margin-left: 0.5rem; margin-right: 0.5rem; min-width: 25rem } .carousel__item--slide { flex-direction: column; gap: 1.5rem; font-size: clamp(1.7rem, 1.5vw, 2rem) } .carousel__item:hover .carousel__img { transform: scale(1.1) } .carousel__img-box { position: relative; width: 100%; aspect-ratio: 1 !important; overflow: hidden } .carousel__img-box:after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.3) } .carousel__img { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; display: block; width: 100%; height: 100%; object-fit: cover } .carousel__name { position: absolute; display: inline-flex; align-items: center; gap: 0.5rem; top: 2rem; right: 2rem; text-transform: uppercase; font-size: clamp(1.6rem, 1.5vw, 2rem); color: #fff } @media only screen and (min-width: 1025px) { .carousel__item { width: 20vw; max-width: 37rem } } .pin-anim { position: relative; display: flex; width: 100% } .pin-anim--building .pin-anim__img { max-width: 40rem; height: auto } .pin-anim--hero .pin-anim__col-right { position: absolute; width: 100%; height: 200vh; top: 0; left: 0 } .pin-anim--hero .pin-anim__img-box { width: 100%; height: 100% } .pin-anim--hero .pin-anim__img { width: 100%; height: 100%; object-fit: cover } .pin-anim__col-left { position: relative; display: flex; flex-direction: column; width: 50%; z-index: 1 } .pin-anim__slide { display: flex; flex-direction: column; justify-content: center; width: 100%; height: 44rem } .pin-anim__col-right { width: 50% } .pin-anim__img-box { position: relative; width: 100%; height: 44rem } .pin-anim__img { position: absolute; display: block; width: 100%; height: 100%; object-fit: cover; opacity: 1 } .pin-anim__txt { font-size: clamp(1.7rem, 1.5vw, 2.7rem); padding-bottom: 2rem; border-bottom: 2px solid #d5a751 } .pin-anim__heading { max-width: 45% } @media only screen and (min-width: 1025px) { .pin-anim__img-mobile { display: none } } @media only screen and (max-width: 1024px) { .pin-anim__heading { width: 100%; max-width: none; margin-bottom: 2rem } .pin-anim__col-left { width: 100% } .pin-anim__slide { padding-bottom: 2rem; gap: 1.5rem; height: auto } .pin-anim--building .pin-anim__col-right { position: absolute; opacity: 0.5; filter: blur(2px); left: 50%; transform: translateX(-50%); width: 80vw; top: 0; z-index: -1 } } .fs-slider {} .fs-slider--offer .homep-slider-bg { height: 60vh } .fs-slider--offer .homep-slider { height: 60vh } .fs-slider--offer .slide { height: 60vh !important } .fs-slider--offer .slide .background { height: 60vh } .homep-slider-bg { position: absolute; width: 100%; height: 100vh; top: 0; left: 0 } .homep-slider-bg.shadow-fs::after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0, 0, 0, 0.4) } .homep-slider-bg.shadow::after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 68.58%, rgba(0, 0, 0, 0.68) 81.32%, rgba(0, 0, 0, 0.8) 100%) } .homep-slider { display: block; width: 100%; height: 100vh; object-fit: cover } .fs-slider__bottom { position: absolute; left: 0; bottom: 0; width: 100%; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #fff; color: #fff; z-index: 2 } .fs-slider__bottom-left { display: flex; gap: 2.4rem; padding-left: 6.5vw } .fs-slider__bottom-left .shelby_link { font-size: clamp(2rem, 1.5vw, 2.2rem) } .fs-slider__bottom-right { display: flex; padding-right: 12.5vw } .fs-slider__bottom-item { width: 17vw; padding-top: 5rem; padding-bottom: 5rem; font-size: clamp(2rem, 3vw, 4.8rem); white-space: nowrap } .fs-slider__bottom-item:first-child { padding-right: 5vw; border-right: 1px solid #fff } .fs-slider__bottom-item:last-child { padding-left: 5vw } .fs-slider__accent { position: absolute; z-index: 3 } .fs-slider__accent--1 { width: 28vw; top: 10rem; left: 0 } .fs-slider__accent--2 { width: 40vw; right: 0; top: 0 } .fs-slider__accent--3 { width: 54vw; top: 0; right: 0 } @media only screen and (max-width: 640px) { .fs-slider__bottom { flex-direction: column; padding-top: 2rem } .fs-slider__bottom-item { width: 50% } .fs-slider__bottom-item:first-child { border-right: none } .fs-slider__bottom-item:first-child, .fs-slider__bottom-item:last-child { padding-left: 2rem; padding-right: 2rem } .fs-slider__bottom-right { padding-right: 0 } .fs-slider__bottom-left { padding-left: 0; gap: 1.5rem } } .slides { display: flex; flex-direction: column; width: 100%; position: relative; z-index: 1 } .slides .list { display: flex; flex-direction: column; width: 100% } .slides .slide { display: flex; width: 100vw; height: 100vh; position: relative; overflow: hidden } .slide .background { display: flex; align-items: center; justify-content: center; position: absolute; left: 0; top: 0; width: 100vw; height: 100vh; background-position: center; will-change: transform; background-size: cover } .tabs { display: flex; flex-wrap: wrap; margin-bottom: 2rem; font-size: clamp(1.7rem, 1.5vw, 2.7rem) } .tabs--offer { justify-content: center } .tabs--offer .tabs__link { font-size: clamp(2rem, 3vw, 4.8rem); line-height: 1em } .tabs--offer .tabs__link::after { display: none } .tabs__item { margin-bottom: 0.8rem; margin-right: 1.5rem } .tabs__item.-current .tabs__link { font-weight: 550 } .tabs__item.-current .tabs__link::after { opacity: 1; visibility: visible } .tabs__link { color: #000; font-weight: 300; display: block; padding-bottom: 0.5rem; position: relative } .tabs__link::after { content: ''; position: absolute; width: 100%; height: 1px; bottom: 0; left: 0; background-color: #000; opacity: 0; visibility: hidden } .tabs__link:hover { font-weight: 550 } @media only screen and (min-width: 481px) { .tabs { margin-bottom: 3rem } .tabs__item { margin-bottom: 1rem; margin-right: 2rem } .tabs__link { padding-bottom: 1rem } } @media only screen and (min-width: 1281px) { .tabs__item { margin-right: 3rem } .tabs__link { font-size: 2rem } } .related {} .related__main-slider { flex: 1 1 60% } .related__main-slider .related__img-box:after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.3) } .related__sec-slider { flex: 1 1 30% } .related__sec-slider .related__img-box { filter: blur(10px) } .related__sec-slider .related__txt, .related__sec-slider .related__video-box { display: none } .related__slide { position: relative; width: 100%; height: 70vh; min-height: 40rem } .related__container { position: absolute; display: flex; align-items: flex-end; gap: 2.5rem; left: 0; bottom: 0; padding: 3rem 6vw; color: #fff } .related__img-box { position: relative; width: 100%; height: 100% } .related__img { display: block; width: 100%; height: 100%; object-fit: cover } .related__content { display: flex; flex-direction: column; gap: 2rem; max-width: 48rem } .related__video-box { width: 16%; aspect-ratio: 0.8; min-width: 10rem } @media only screen and (max-width: 1024px) { .related__container { padding: 3rem 5rem 3rem 6vw } } .img-mask { position: relative; width: 100%; height: 36vw; min-height: 18rem } .img-mask__img-box { width: 100%; height: 100% } .img-mask__img { display: block; width: 100%; height: 100%; object-fit: cover } .img-mask__mask { position: absolute; display: block; height: 110%; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-origin: center; object-fit: cover; z-index: 1 } .img-mask__banner { position: relative; max-width: 56rem; color: #fff; margin: auto; z-index: 2 } @media only screen and (min-width: 1025px) { .img-mask__banner { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%) } } .timeline { position: relative; display: flex; padding-right: 3rem } .timeline:after { content: ''; position: absolute; width: 100%; height: 1px; background: #d5a751; left: 0; bottom: 5rem; z-index: -1 } .timeline__wrap { display: flex; flex-direction: column; gap: 4vw } .timeline__heading { display: flex; justify-content: space-between; align-items: center; gap: 3rem } .timeline__current-stage { font-size: clamp(1.7rem, 1.5vw, 2rem) } .timeline__info { position: relative; right: 0 !important; transform: translateX(50%); display: flex; flex-direction: column; justify-content: flex-end; align-items: center; height: 100%; gap: 2rem; max-width: 18rem; padding-left: 0.5rem; padding-right: 0.5rem; z-index: 2 } .timeline__item { position: relative; display: flex; justify-content: flex-end; width: 16% } .timeline__item.-complete::after { display: block } .timeline__item.-complete .timeline__stage-name { opacity: 1 } .timeline__item.-complete .timeline__vl { background: #000; padding: 5px } .timeline__item.-current::after { display: block } .timeline__item.-current .timeline__stage-name { opacity: 1 } .timeline__item.-current .timeline__vl { background: #efefef; transform: scale(2); border: 1px solid #d5a751 } .timeline__item.-current .timeline__vl:after { background: url("../public/image/icon/check-sm-gold.svg") no-repeat center } .timeline__item::after { display: none; content: ''; position: absolute; width: 100%; height: 0.9rem; left: 0; bottom: 5rem; transform: translateY(50%); background: #000; z-index: 1 } .timeline__vl { position: relative; width: 2rem; height: 2rem; min-width: 2rem; min-height: 2rem; border-radius: 50%; background: #d9d9d9; transform-origin: center; z-index: 2 } .timeline__vl:after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 1rem; height: 0.7rem; background: url("../public/image/icon/check-sm-white.svg") no-repeat center } .timeline__stage-name { line-height: 1em; opacity: 0.4 } .timeline__month { font-weight: 400 } @media only screen and (max-width: 1024px) { .timeline { flex-direction: column; padding-right: 0 } .timeline:after { width: 1px; height: 100%; bottom: auto; top: 0 } .timeline__wrap { flex-direction: row; gap: 8vw } .timeline__stage-name { text-align: center } .timeline__heading { flex-direction: column } .timeline__vl { position: absolute; width: 2rem; height: 2rem; left: -3rem; bottom: 0; transform: translate(-50%, 50%); transform-origin: center } .timeline__info { width: 100%; right: auto !important; transform: translateX(0); max-width: none; justify-content: center; gap: 1rem } .timeline__item { flex: 1 1 20%; width: 100%; justify-content: center; padding-left: 3rem } .timeline__item.-current .timeline__vl { left: -4rem } .timeline__item:not(:first-child) { padding-top: 3rem } .timeline__item:after { width: 1.2rem; height: 100%; bottom: auto; top: 0; transform: translateY(0); transform: translateX(-50%) } } .gallery__slider { display: none; position: relative; flex-wrap: nowrap; width: 100%; height: 43vw } .gallery__slider.-visible { display: flex !important } .gallery__slide { position: absolute; width: 86vw; min-width: 86vw; height: 43vw } .gallery__img-box { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; position: absolute; overflow: hidden } .gallery__img-box:hover .gallery__img { transform: scale(1.1) } .gallery__img-box--xl { height: 40vw; bottom: 0; left: 0 } .gallery__img-box--md { height: 23vw; top: 0; right: 0 } .gallery__img-box--sm { height: 17vw; bottom: 0; right: 0 } .gallery__img { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; display: block; width: 100%; height: 100% } .search { background-color: #000; color: #fff; padding-top: 2.5rem; padding-bottom: 2.5rem } .search__container { display: flex; flex-wrap: wrap; gap: 2.5vw; padding-bottom: 2rem } .search__item { display: flex; flex-direction: column; gap: 1.8rem } .search__inner-list { display: flex; flex-wrap: wrap; gap: 1rem } .search__inner-item { position: relative; display: flex; justify-content: center; align-items: center } .search__inner-item.-current .search__item-btn { background-color: #fff; color: #000 } .search__item-btn { display: inline-flex; justify-content: center; align-items: center; gap: 1.5rem; min-width: 4rem; max-height: 4rem; padding: 1.2rem 1.5rem; border: 1px solid #fff } .search__item-btn:hover { background-color: #fff; color: #000 } .search__floor { display: flex; flex-direction: column; margin: auto } @media only screen and (max-width: 1024px) { .search { padding-top: 0 } .search__container { gap: 2rem } .search__item--price { margin-bottom: 2rem } } @media only screen and (max-width: 640px) { .search__item { width: 100% } .search .range-slider { width: 100%; min-width: auto } } .range-slider { display: inline-block; position: relative; width: 30rem; min-width: 28rem } .range-slider--black .range-slider__values { color: #b4b4b4 } .range-slider .irs--flat .irs-line { background-color: #d9d9d9; height: 3px } .range-slider .irs--flat .irs-bar { background-color: #fff; height: 3px } .range-slider .irs--flat .irs-handle { top: 1.8rem; width: 5px; height: 15px; background-color: #fff } .range-slider .irs--flat .irs-handle i { background-color: #fff } .range-slider .state_hover { background-color: #fff !important; color: #fff } .range-slider__values { display: flex; position: absolute; justify-content: space-between; bottom: -2rem; left: 0; width: 100%; color: #fff } .range-slider__wrap { width: 100% } .tooltip {} .tooltip__tip { position: fixed; visibility: hidden; transition: opacity 0.3s, visibility 0.3s; pointer-events: none; opacity: 0; z-index: 100 } .tooltip__tip.-visible { opacity: 1; visibility: visible } .tooltip__box { display: flex; margin-bottom: 10px; background-color: #000; color: #fff; font-weight: 400 } .tooltip__box.-sold .tooltip__header { background-color: #b60000 } .tooltip__box.-sold .tooltip__list { background-color: #b60000 } .tooltip__box.-sold .tooltip__item { display: none } .tooltip__box.-sold .tooltip__item-sold { display: flex } .tooltip__box.-reserved .tooltip__header { background-color: #b4b4b4; color: #000 } .tooltip__box.-reserved .tooltip__list { background-color: #b4b4b4 } .tooltip__box.-reserved .tooltip__item { display: none } .tooltip__box.-reserved .tooltip__item-reserved { display: flex; color: #000 } .tooltip__box--floor .tooltip__item { flex-direction: row !important; flex-wrap: nowrap } .tooltip__box--floor .tooltip__value { font-size: 1.4rem; color: #494848 } .tooltip__box--floor .tooltip__key { font-size: 1.6rem; color: #fff } .tooltip__header { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 20px 30px; color: #fff; text-align: center; align-self: stretch } .tooltip__header::after { position: absolute; content: ''; width: 1px; height: 90%; right: 0; top: 50%; transform: translateY(-50%); background-color: #fff } .tooltip__num { margin-bottom: 0; font-size: clamp(4.5rem, 5vw, 7rem); line-height: 1em } .tooltip__label { font-size: clamp(1.7rem, 1.5vw, 2.7rem) } .tooltip__list { display: flex; flex-direction: column; justify-content: center; gap: 1.4rem; padding: 2.5rem 3.5rem } .tooltip__item { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 10px; white-space: nowrap } .tooltip__item-sold, .tooltip__item-reserved { display: none; color: #fff; white-space: nowrap; align-self: center; align-items: center } .tooltip__item-reserved { color: #000 } .tooltip__pair { display: flex; flex-direction: column; line-height: 1em; gap: 3px } .tooltip__key { font-size: 1.6rem; line-height: 1em; color: #494848 } .tooltip__count { font-size: 1.6rem; line-height: 1em } @media only screen and (max-width: 1024px) { .tooltip__container { display: flex; flex-direction: column } .tooltip__list { flex: 1 } } .building { position: relative } .building--apartment .building__direction--bottom { bottom: 4rem } .building--facade { left: 50%; transform: translateX(-50%); min-width: 45rem } .building__container { position: relative; padding-left: 9vw; padding-bottom: 12vw; padding-top: 3vw } .building__roads { position: absolute; display: block; width: 100%; height: 100%; bottom: 0; left: 0 } .building__svg { display: block; position: absolute; top: 0; left: 0; width: 100%; fill: transparent } .building__svg--floor [data-id]:hover { fill: rgba(0, 0, 0, 0.5) !important; opacity: 1 !important } .building__svg--floor [data-id].-sold { fill: rgba(182, 0, 0, 0.5) !important } .building__svg--parking [data-id]:hover, .building__svg--apartment [data-id]:hover { fill: rgba(0, 0, 0, 0.5) !important; opacity: 1 !important } .building__svg--parking [data-id].-sold, .building__svg--apartment [data-id].-sold { fill: rgba(182, 0, 0, 0.5) !important } .building__svg--parking [data-id].-reserved, .building__svg--apartment [data-id].-reserved { fill: rgba(180, 180, 180, 0.5) !important } .building__svg [data-id] { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; cursor: pointer; fill: transparent; opacity: 0 } .building__svg [data-id].-sold, .building__svg [data-id].-reserved, .building__svg [data-id]:hover { opacity: 1 } .building__svg [data-id].-highlight { fill: rgba(217, 217, 217, 0.8) !important; opacity: 1 } .building__direction { position: absolute; display: inline-flex; flex-direction: column; gap: 1rem; color: #000; font-size: clamp(1.5rem, 1.5vw, 1.7rem); z-index: 1 } .building__direction img { height: 2.7rem } .building__direction--top { top: 0; left: 50%; transform: translateX(-50%) } .building__direction--bottom { bottom: 0; left: 50%; transform: translate(-50%, 120%) } .building__direction--left { top: 50%; left: -7rem; transform: translateY(-50%) rotate(-90deg) } .building__direction--right { top: 50%; right: -10rem; transform: translateY(-50%) rotate(-90deg) } @media only screen and (max-width: 1024px) { .building--apartment .building__direction--bottom { bottom: 2rem } .building__direction { gap: 0.5rem } .building__direction--right { right: -6rem } .building__direction img { transform: scale(0.7) } } .property-card { display: flex !important; flex-direction: column; gap: 2rem; background-color: #f3f3f3; color: #000; padding: 6rem 4vw 4rem; margin-right: 2rem; border: 1px solid #000 } .property-card--list { display: flex; gap: 2rem; flex: 1 1 25%; min-width: 28rem; background-color: #fff } .property-card__heading { display: flex; flex-direction: column; gap: 1rem } .property-card__img-box { width: 100%; height: max-content; margin: auto } .property-card__img { display: block; width: 100%; height: 100% } .property-card__sub { font-size: 1.5rem; opacity: 0.5 } .property-card__info-list { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between } .property-card__value { font-size: clamp(1.7rem, 1.5vw, 2.7rem) } @media only screen and (max-width: 1024px) { .property-card { padding: 3rem 2rem 2rem } } .pager { position: relative; display: flex; justify-content: center; gap: 2rem } .pager__nav { display: flex; align-items: center; gap: 1rem; margin: 0 auto } .pager__list { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 1rem } .pager__list .pager__item.-current .pager__btn { font-weight: 400; border: 1px solid #000; padding: 1rem 2rem } .pager__list .pager__btn:hover { font-weight: 400 } .pager__dropdown { display: flex; align-items: center; gap: 1rem } .pager__btn { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; cursor: pointer } .pager__btn--arrow-left:hover { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; transform: translateX(-0.5rem) } .pager__btn--arrow-right:hover { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; transform: translateX(0.5rem) } @media only screen and (max-width: 1024px) { .pager__list .pager__item.-current .pager__btn { padding: 0.5rem 1rem } } .cselect { position: relative; margin-right: 0; cursor: pointer } .cselect:after { content: ''; position: absolute; background-image: url("../public/image/icon/caret.svg"); height: 6px; width: 12px; background-repeat: no-repeat; background-size: cover; top: 2rem; right: 5px } .cselect__input { position: relative; display: inline-flex; justify-content: center; align-items: center; text-decoration: underline; color: #000; border: none; border-radius: 0; width: 8rem; padding: 1rem 2rem; opacity: 1; cursor: pointer } .cselect__input::placeholder { color: #000 !important } .cselect__list { display: none; position: absolute; z-index: 999; left: 0; top: 100%; margin: 0; width: 100%; color: #000; text-align: center } .cselect__item { padding: 10px 5%; list-style: none } .cselect__item:hover { background: #fff; color: #000 } @media only screen and (max-width: 1024px) { .cselect:after { top: 1rem } .cselect__input { padding: 0.5rem 1rem; width: 6rem } } .apartment {} .apartment__container { display: flex } .apartment__left { width: 50%; display: flex; flex-direction: column; gap: 2rem; border: 1px solid #000; padding: 6rem 6vw 4rem } .apartment__left--offer { width: 100%; border: none; padding: 0 } .apartment__right { width: 50%; display: flex; flex-direction: column; justify-content: space-between; gap: 6rem; border: 1px solid #000; border-left: none; padding: 6rem 6vw } .apartment__info-list { display: flex; flex-direction: column; gap: 1.5rem } .apartment__info-row { display: flex; gap: 3rem; padding-bottom: 1.5rem; border-bottom: 1px solid rgba(0, 0, 0, 0.2) } .apartment__info-bottom { display: flex; justify-content: space-between; gap: 1.5rem; align-items: flex-end } .apartment__info-item { flex: 1 1 25%; display: flex; flex-direction: column; gap: 0.5rem } .apartment__slider { width: 100% } .apartment__tabs { display: flex; justify-content: center; align-items: center; gap: 0 } .apartment__tabs-btn { font-size: 1.6rem; padding: 2rem 2vw; text-decoration: underline; white-space: nowrap } .apartment__tabs-btn:hover { text-decoration: none } .apartment__tabs-item { display: inline-block } .apartment__tabs-item.-current .apartment__tabs-btn { text-decoration: none; border: 1px solid #000 } .apartment__info-label { color: rgba(0, 0, 0, 0.5) } .apartment__info-value { color: #000; font-weight: 400 } .apartment__status-dot { display: inline-block; width: 1.2rem; height: 1.2rem; min-width: 1.2rem; border-radius: 50%; margin-right: 1rem } .apartment__img-box { display: flex !important; justify-content: center; align-items: center; width: 100% } .apartment__img { display: block; max-width: 42rem; max-height: 35rem; text-align: center } @media only screen and (max-width: 1024px) { .apartment__container { flex-direction: column-reverse } .apartment__tabs-btn { padding: 1rem } .apartment__left { gap: 3rem; width: 100% } .apartment__right { gap: 3rem; width: 100%; border-left: 1px solid #000; border-bottom: none } } .banner { background-color: #000; color: #fff; padding: 3vw 7vw 5vw } .banner__container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 2rem; max-width: 96rem } .banner__content { max-width: 55rem } .banner__price { display: flex; flex-direction: column; align-items: flex-end } .banner__label { font-size: 1.6rem } .banner__label, .banner__price-old { color: rgba(255, 255, 255, 0.5) } .banner__price-old { text-decoration: line-through } .offer-slider { position: relative; width: 100% } .offer-slider .slick-arrow { top: calc(50% - 2.5rem) !important } .offer-slider__slider { width: 100% } .offer-slider__slider .slick-list { margin-right: -4vw } .offer-slider__slide { position: relative; display: flex !important; flex-direction: column; gap: 2.5rem; padding-bottom: 5rem; margin-right: 4vw } .offer-slider__slide.slick-center .offer-slider__img-box:after { opacity: 0; visibility: hidden } .offer-slider__slide.slick-center .offer-slider__type { bottom: 0 } .offer-slider__img-box { position: relative; display: flex !important; justify-content: center; align-items: center; width: 100%; height: 50vh; max-height: 46rem; border: 1px solid #000; padding: 3rem } .offer-slider__img-box:after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: #fff; z-index: 1 } .offer-slider__img { display: block; max-width: 100%; max-height: 100%; margin: auto } .offer-slider__type { position: absolute; bottom: 50%; left: 50%; transform: translate(-50%, -50%); color: #000; z-index: 2 } @media only screen and (min-width: 1025px) { .offer-slider__slide { width: 36vw !important } .offer-slider .slick-prev { left: 30.5vw } .offer-slider .slick-next { right: 26.5vw } } @media only screen and (max-width: 1024px) { .offer-slider__slide { width: 100% } .offer-slider__img-box { padding: 2rem } .offer-slider .slick-prev { left: 1rem } .offer-slider .slick-next { right: 1rem } } .dropdown {} .dropdown .checkbox__label { font-size: clamp(1.7rem, 1.5vw, 2rem) !important } .dropdown__control { color: #000 } .dropdown__panel { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; padding: 0 2vw; border-top: 1px solid #000; color: #000; visibility: hidden; height: 0; transform: scaleY(0); transform-origin: top } .dropdown__panel.-active { transition: all 500ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; visibility: visible; height: 100%; transform: scaleY(1); padding: 4rem 2vw 0; margin: 4rem 0 0 } @media only screen and (max-width: 1024px) { .dropdown__control { padding-bottom: 2.5rem } .dropdown__panel { padding-top: 2.5rem } } .modal { align-items: center; bottom: 0; display: inline-flex; justify-content: center; left: 0; opacity: 0; overflow: auto; padding: 20px 10px; position: fixed; right: 0; top: 0; transition: opacity 0.2s, visibility 0.2s; visibility: hidden; z-index: 10 } .modal.-open { opacity: 1; visibility: visible } .modal__overlay { background-color: rgba(0, 0, 0, 0.8); bottom: 0; cursor: pointer; left: 0; position: fixed; right: 0; top: 0; transition: background-color 0.3s } .modal__row { margin: auto; max-width: 100%; transform: translateY(10px); transition: transform 0.3s } .modal__container { display: flex; flex-direction: column; align-items: center; background-color: #fff; padding: 2rem; width: 100%; z-index: 2 } .modal__inner { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; max-width: 85rem } .modal__close { display: inline-flex; align-items: center; gap: 1rem; padding: 1rem; cursor: pointer; margin-top: 4rem; background-color: #000; color: #fff; text-align: center; z-index: 2 } .modal__close:hover { text-decoration: underline } .modal__close-label { display: inline-block; font-size: clamp(1.6rem, 1.5vw, 1.7rem); text-transform: uppercase; margin-right: 10px } .modal__desc, .modal__link { font-size: clamp(1.7rem, 1.5vw, 2rem) } .modal__list { font-size: clamp(1.2rem, 1vw, 1.4rem); list-style: disc; margin-left: 2rem; margin-top: 4rem; margin-bottom: 4rem } @media only screen and (min-width: 641px) { .modal__inner { align-items: center } .modal__list { margin-left: 4rem } .modal__container { width: 80vw } } @media only screen and (min-width: 1025px) { .modal__container { padding: 6vw; width: 60vw } } .modal .modal.-open .modal__row { transform: translateY(0) } .accordion { position: relative; width: 100%; list-style: none; z-index: 2 } .accordion--simple .accordion__item { border-bottom: 1px solid rgba(217, 217, 217, 1); padding: 1.5rem 0 !important; padding-left: 0 !important } .accordion--simple .accordion__control { display: flex; align-items: center; padding-bottom: 0; padding-top: 0; padding-right: 3rem; padding-left: 0; font-size: clamp(1.7rem, 1.5vw, 2.7rem); gap: 1.2rem; color: #000 } .accordion--simple .accordion__control.-active-control { width: 100%; font-weight: 700 !important } .accordion--simple .accordion__control.-active-control::after { content: "-"; transform: translateY(-50%) rotate(0deg) } .accordion--simple .accordion__control::after { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; content: "+"; position: absolute; width: 17px; height: 17px; top: 50%; right: 2.5vw; transform: translateY(-50%) rotate(0deg) } .accordion--simple .accordion__item-num { position: relative; display: flex; align-items: center; gap: 0.8rem } .accordion--simple .accordion__item-num:after { content: ''; width: 1px; height: 1.6rem; background-color: currentColor } .accordion--simple .accordion__panel { padding-top: 2rem; padding-bottom: 2rem; padding-left: 0; font-size: clamp(1.6rem, 1.5vw, 1.7rem) } .accordion__item { position: relative; display: flex; flex-direction: column; overflow: hidden; padding: 2rem } .accordion__item--1 { background-color: #f5f5f5 } .accordion__item--1 .accordion__control { color: #000 } .accordion__item--1 .accordion__control-open i { filter: invert(1) } .accordion__item--2 { background-color: #343434; color: #fff } .accordion__item--3 { background-color: #565656; color: #fff } .accordion__item--4 { background-color: #6c6c6c; color: #fff } .accordion__num { position: absolute; right: 3.5vw; bottom: 0; font-size: clamp(10rem, 7vw, 20rem); -webkit-text-fill-color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #fff; opacity: 0.5 } .accordion__control { transition: all 250ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; position: relative; display: flex; justify-content: space-between; align-items: center; padding: 3rem 3vw; font-size: clamp(2rem, 2vw, 2rem); color: #000; text-align: left; border: none; font-weight: 400 !important; color: #fff; cursor: pointer } .accordion__control-main { display: flex; align-items: center; gap: 7vw } .accordion__title { font-size: clamp(2rem, 2vw, 2.6rem); font-weight: 500 } .accordion__img-box { position: absolute; right: 0; top: 0; height: 100% } .accordion__img { display: block; height: 100% } .accordion__control-open, .accordion__control-close { align-items: center; gap: 1rem; padding: 1rem; font-size: 1.6rem } .accordion__control-open { display: flex } .accordion__control-close { display: none; background-color: #000; color: #fff } .accordion .-active-control { width: 100% } .accordion .-active-control .accordion__control-open { display: none } .accordion .-active-control .accordion__control-close { display: flex } .accordion .-active-control::after { transform: translateY(-50%) rotate(180deg) } .accordion__panel { display: none; width: 100%; padding: 0 3vw 5rem; line-height: 1.5em; font-size: clamp(2rem, 1.5vw, 2.7rem) } .accordion__container { width: 100%; display: flex; gap: 4rem 8rem; padding-left: 10rem } .accordion__col { max-width: 45rem } .accordion__list { margin-left: 2rem } .accordion__list-item { list-style: disc } .accordion__slider { width: 100% } .accordion__slide { max-width: 23rem; margin-right: 2rem } .accordion__slide-img-box { width: 100% } .accordion__slide-img { display: block; width: 100% } .accordion__slide-txt { font-size: 1.4rem; margin-top: 1rem; color: #888 } @media only screen and (min-width: 641px) { .accordion--simple .accordion__item { padding: 2rem 1.7rem 2rem 0 !important } } @media only screen and (max-width: 640px) { .accordion--methods .accordion__control { flex-direction: column; gap: 2rem; padding: 0; padding-bottom: 2rem } .accordion--methods .accordion__control-main { gap: 2rem; align-items: flex-start } .accordion--methods .accordion__panel { padding-left: 0; padding-right: 0 } } @media only screen and (min-width: 1025px) { .accordion__item { padding-left: 4vw; padding-right: 4vw } .accordion__panel { padding-left: 20vw; padding-right: 10vw } .accordion__control-main { gap: 15vw } } .cta { position: relative; display: block; background-color: #000; color: #fff !important } .cta__img-box { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; position: absolute; width: 53%; left: 0; bottom: 0 } .cta__img { display: block; width: 100% } .cta__btn { display: inline-flex; flex-wrap: nowrap; background-color: #fff; color: #000; font-size: 1.6rem; padding: 1.5rem 2.5rem; gap: 1.5rem; text-transform: uppercase } .cta__content { position: relative; margin: auto; text-align: center; padding-bottom: 6rem; z-index: 1 } @media only screen and (min-width: 1025px) { .cta:hover .cta__btn { visibility: visible; opacity: 1 } .cta__btn { transition: all 100ms cubic-bezier(0.75, 0, 0.5, 1) 0ms; transition-timing-function: ease-in-out; visibility: hidden; opacity: 0 } } @media only screen and (max-width: 640px) { .cta__content { padding-bottom: 2rem } .cta__btn { font-size: 1.4rem; padding: 1.2rem 2rem } .cta__title { font-size: 3rem !important } }