@font-face {
  font-family: 'Geometria';
  src: url('../fonts/geometria.woff') format('woff'),
       url('../fonts/geometria.woff2') format('woff2'),
       url('../fonts/geometria-light-webfont.woff') format('woff'),
       url('../fonts/geometria-light-webfont.woff2') format('woff2'),
       url('../fonts/geometria-medium.woff') format('woff'),
       url('../fonts/geometria-medium.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'lm roman';
  src: url('../fonts/lmroman10-regular-webfont.woff2') format('woff2'),
       url('../fonts/lmroman10-regular-webfont.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
    font-family: lm roman dunhill;
    src: url(assets/fonts/lmromandunh10-regular.woff2)format('woff2'), url(assets/fonts/lmromandunh10-regular.woff)format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: notera;
    src: url(assets/fonts/notera-webfont.woff2)format('woff2'), url(assets/fonts/notera-webfont.woff)format('woff');
    font-style: normal;
    font-display: swap;
    
}


body {
    color: #000000;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    background: #fff;
    cursor: default;
    overflow: hidden;
}

body::-webkit-scrollbar {
    display: none
}

body * {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none
}

body.exiting {
    opacity: 0;
    -webkit-transition: -webkit-transform 1e3ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1e3ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1)
}

a {
    text-decoration: none;
    color: #96201e;
}

p>a {
    text-decoration: underline
}

.relative {
    position: relative
}

.absolute {
    position: absolute
}

.above {
    z-index: 2;
    position: relative
}

.uppercase {
    text-transform: uppercase
}

.capitalize {
    text-transform: capitalize
}

.lowercase {
    text-transform: lowercase
}

.fit {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    will-change: transform
}

.fit.bottom {
    object-position: bottom
}

.fit.top {
    object-position: top
}

.fit.left {
    object-position: left
}

.fit.right {
    object-position: right
}

.no_events {
    pointer-events: none
}

.no_opacity {
    opacity: 0 !important;
    pointer-events: none
}

.invisible {
    visibility: hidden
}

.no_opacity.show,
.show .no_opacity {
    opacity: 1 !important;
    pointer-events: all
}

.no_transition {
    transition: none !important
}

.no_width {
    transform: scale(0, 1);
    pointer-events: none
}

.no_height {
    transform: scale(1, 0);
    pointer-events: none
}

.no_overflow {
    overflow: hidden
}

.top_hidden {
    -webkit-transform: translateY(101%);
    transform: translateY(101%)
}

.top_low {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
    opacity: 0
}

.top_ultralow {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    opacity: 0
}

.top_single {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0
}

.top_double {
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    opacity: 0
}

.left_single {
    -webkit-transform: translateX(25px);
    transform: translateX(25px);
    opacity: 0
}

.left_double {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0
}

.top_translated {
    -webkit-transform: translateY(25vw);
    transform: translateY(25vw)
}

.top_translated.less {
    -webkit-transform: translateY(10vw);
    transform: translateY(10vw)
}

.top_translated.full {
    -webkit-transform: translateY(100vh);
    transform: translateY(100vh)
}

.scaled {
    transform: scale(1.03)
}

.top_double.show,
.show .top_double,
.top_single.show,
.show .top_single,
.top_low.show,
.show .top_low,
.top_ultralow.show,
.show .top_ultralow,
.left_single.show,
.left_double.show,
.show .left_single,
.show .left_double,
.scaled.show,
.show .scaled {
    -webkit-transform: none;
    transform: none;
    opacity: 1
}

.top_hidden.show,
.top_translated.show,
.show .top_hidden,
.show .top_translated,
.no_width.show,
.show .no_width,
.no_height.show,
.show .no_height {
    -webkit-transform: none;
    transform: none;
    pointer-events: all
}

.t_container {
    transform: translateX(0);
    height: 100%
}

.t_container:nth-child(2) {
    transition-delay: 100ms
}

.mask_left {
    transform: translateX(50%);
    display: block
}

.mask_left.full {
    transform: translateX(-100%)
}

.mask_left .t_container {
    transform: translateX(-100%);
    display: block
}

.mask_left.full .t_container {
    transform: translateX(100%)
}

.t_container img {
    transform: scale(1.05)
}

.mask_right {
    transform: translateX(-50%)
}

.mask_right .t_container {
    transform: translateX(100%)
}

.mask_right.full {
    transform: translateX(100%)
}

.mask_right.full .t_container {
    transform: translateX(-100%)
}

.mask_top {
    transform: translateY(-50%)
}

.mask_top .t_container {
    transform: translateY(50%)
}

.mask_top.full {
    transform: translateY(-100%)
}

.mask_top .t_container {
    transform: translateY(100%)
}

.mask_bottom {
    transform: translateY(50%)
}

.mask_bottom .t_container {
    transform: translateY(-50%)
}

.mask_bottom.full {
    transform: translateY(100%)
}

.mask_bottom.full .t_container {
    transform: translateY(-100%)
}

.mobileOnly {
    display: none !important
}

.show>.mask_bottom,
.show>.mask_left,
.show>.mask_left .t_container,
.show>.mask_left .t_container img,
.show>.mask_right,
.show>.mask_right .t_container,
.show>.mask_right .t_container img,
.show>.mask_top,
.show>.mask_top .t_container,
.show>.mask_top .t_container img,
.show>.mask_bottom,
.show>.mask_bottom .t_container,
.show>.mask_bottom .t_container img {
    transform: none
}

.transition_all {
    transition-property: all !important
}

.has_transition_5000 {
    -webkit-transition: -webkit-transform 5e3ms cubic-bezier(.19, 1, .22, 1), opacity 5e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 5e3ms cubic-bezier(.19, 1, .22, 1), opacity 5e3ms cubic-bezier(.19, 1, .22, 1)
}

.has_transition_3000 {
    -webkit-transition: -webkit-transform 3e3ms cubic-bezier(.19, 1, .22, 1), opacity 3e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 3e3ms cubic-bezier(.19, 1, .22, 1), opacity 3e3ms cubic-bezier(.19, 1, .22, 1)
}

.has_transition_2000 {
    -webkit-transition: -webkit-transform 2e3ms cubic-bezier(.19, 1, .22, 1), opacity 2e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 2e3ms cubic-bezier(.19, 1, .22, 1), opacity 2e3ms cubic-bezier(.19, 1, .22, 1)
}

.has_transition_1500 {
    -webkit-transition: -webkit-transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1)
}

.has_transition_1000 {
    -webkit-transition: -webkit-transform 1e3ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1e3ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1)
}

.has_transition_800 {
    -webkit-transition: -webkit-transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1)
}

.has_transition_400 {
    -webkit-transition: -webkit-transform 400ms cubic-bezier(.19, 1, .22, 1), opacity 400ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 400ms cubic-bezier(.19, 1, .22, 1), opacity 400ms cubic-bezier(.19, 1, .22, 1)
}

.has_transition_2000_inout {
    -webkit-transition: -webkit-transform 2e3ms cubic-bezier(.575, .005, .285, 1.005), opacity 2e3ms cubic-bezier(.575, .005, .285, 1.005);
    transition: transform 2e3ms cubic-bezier(.575, .005, .285, 1.005), opacity 2e3ms cubic-bezier(.575, .005, .285, 1.005)
}

.has_transition_1500_inout {
    -webkit-transition: -webkit-transform 1500ms cubic-bezier(.575, .005, .285, 1.005), opacity 1500ms cubic-bezier(.575, .005, .285, 1.005);
    transition: transform 1500ms cubic-bezier(.575, .005, .285, 1.005), opacity 1500ms cubic-bezier(.575, .005, .285, 1.005)
}

.has_transition_1000_inout {
    -webkit-transition: -webkit-transform 1e3ms cubic-bezier(.575, .005, .285, 1.005), opacity 1e3ms cubic-bezier(.575, .005, .285, 1.005);
    transition: transform 1e3ms cubic-bezier(.575, .005, .285, 1.005), opacity 1e3ms cubic-bezier(.575, .005, .285, 1.005)
}

.show .d50,
.show.d50 {
    transition-delay: 50ms
}

.show .d100,
.show.d100 {
    transition-delay: 100ms
}

.show .d150,
.show.d150 {
    transition-delay: 150ms
}

.show .d200,
.show.d200 {
    transition-delay: 200ms
}

.show .d250,
.show.d250 {
    transition-delay: 250ms
}

.show .d300,
.show.d300 {
    transition-delay: 300ms
}

.show .d350,
.show.d350 {
    transition-delay: 350ms
}

.show .d400,
.show.d400 {
    transition-delay: 400ms
}

.show .d450,
.show.d450 {
    transition-delay: 450ms
}

.show .d500,
.show.d500 {
    transition-delay: 500ms
}

.show .d550,
.show.d550 {
    transition-delay: 550ms
}

.show .d600,
.show.d600 {
    transition-delay: 600ms
}

.show .d650,
.show.d650 {
    transition-delay: 650ms
}

.show .d700,
.show.d700 {
    transition-delay: 700ms
}

.show .d750,
.show.d750 {
    transition-delay: 750ms
}

.show .d800,
.show.d800 {
    transition-delay: 800ms
}

.show .d900,
.show.d900 {
    transition-delay: 900ms
}

.show .d950,
.show.d950 {
    transition-delay: 950ms
}

.show .d1000,
.show.d1000 {
    transition-delay: 1e3ms
}

.show .d1050,
.show.d1050 {
    transition-delay: 1050ms
}

.show .d1100,
.show.d1100 {
    transition-delay: 1100ms
}

.show .d1150,
.show.d1150 {
    transition-delay: 1150ms
}

.show .d1200,
.show.d1200 {
    transition-delay: 1200ms
}

.show .d1250,
.show.d1250 {
    transition-delay: 1250ms
}

.show .d1300,
.show.d1300 {
    transition-delay: 1300ms
}

.show .d1350,
.show.d1350 {
    transition-delay: 1350ms
}

.show .d1400,
.show.d1400 {
    transition-delay: 1400ms
}

.show .d1500,
.show.d1500 {
    transition-delay: 1500ms
}

.show .d1600,
.show.d1600 {
    transition-delay: 1600ms
}

.show .d1700,
.show.d1700 {
    transition-delay: 1700ms
}

.show .d1800,
.show.d1800 {
    transition-delay: 1800ms
}

.show .d1900,
.show.d1900 {
    transition-delay: 1900ms
}

.show .d2000,
.show.d2000 {
    transition-delay: 2e3ms
}

.show .d2100,
.show.d2100 {
    transition-delay: 2100ms
}

.show .d2200,
.show.d2200 {
    transition-delay: 2200ms
}

.show .d2300,
.show.d2300 {
    transition-delay: 2300ms
}

.show .d2400,
.show.d2400 {
    transition-delay: 2400ms
}

.show .d2500,
.show.d2500 {
    transition-delay: 2500ms
}

.full_width {
    width: 100%;
    height: auto
}

.full_height {
    height: 100%;
    width: auto
}

.block {
    display: block
}

span.block {
    will-change: transform
}

.inline_block {
    display: inline-block;
    will-change: transform;
}

.centered {
    text-align: center
}

.flex {
    display: flex
}

.bWhite {
    background: #fff
}

.bAlyssum {
    background: #1e2949;
}

.bTortora {
    background: #1e2949;
}

.bFango {
    background: #b6ada5
}

.bArgilla {
    background: #8c8279
}

.bMarrone {
    background: #1e2949;
}

.bGreige {
    background: #1e294933;
}

.cWhite {
    color: #fff
}

.cAlyssum {
    color: #000;
}

.cTortora {
    color: #d7d2cb
}

.cFango {
    color: #b6ada5
}

.cArgilla {
    color: #1e2949;
}

.cMarrone {
    color: #1e2949;
}

.cGreige {
    color: #9d968d
}

.mobileArrow {
    display: none
}

section {
    position: relative;
    width: 100%;
    display: flex
}

article {
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden
}

.halfMargin {
    margin-top: 2.5vw
}

.margin {
    margin-top: 5vw
}

.footer-section {
    height: 100% !important;
}

.footer-section:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgb(0 0 0 / 40%), rgb(0 0 0 / 42%));
    z-index: 1;
    pointer-events: none;
}

.tripleMargin {
    margin-top: 8vw;
}

.layerUpdate {
    position: absolute;
    top: 0
}

#hTop {
    position: relative;
    height: 200vh
}

#hElementsLayer {
    height: 100vh;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    will-change: transform;
    z-index: 1
}

#scrollDown {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: absolute;
    bottom: 23%;
    left: 50%;
    margin-left: -165px;
    width: 330px;
    text-align: center
}

.scrollDownText {
    font-family: geometria;
    font-weight: 300;
    font-size: 14px;
    letter-spacing: .5px;
    margin-top: 12px
}

#verticalArrow {
    width: 10px
}

svg * {
    will-change: transform
}

#hImgContainer {
    transform: scale(1.01);
    height: 100vh;
    opacity: 0;
    width: 100vw
}

#hImgContainer.show {
    opacity: 1;
    transform: scale(1)
}

#hImgLayer {
    position: absolute;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0
}

#hImgCover {
    height: 100%;
    overflow: hidden;
    width: 190vw
}

#hImg {
    width: 100vw
}

#hTarget {
    position: absolute;
    top: 100vh;
    height: 50vh
}

#hPayTarget {
    position: absolute;
    top: 50vh;
    height: calc(100% - 50vh)
}

#hPayLayer {
    font-family: Geometria;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column
}

#hPayLayer span {
    will-change: transform
}

#payLook {
    font-size: 3vw;
    font-weight: 300;
    margin-left: 8vw;
    height: 20vh;
    margin-top: 8vh;
    display: flex;
    position: relative;
    align-items: center;
    color: #1e2949;
}

#hPayLayer span {}

#payLimits {
    font-size: 2.5vw;
    font-weight: 300;
    position: absolute;
    top: calc(50% + 2.3vw);
    left: 19vw
}

#hStrip {
    width: 75vw;
    margin-top: 2.5vw;
    height: 20vh
}

#hImgStrip {
    top: -35%;
    height: 150%
}

#payFind {
    font-size: 5.5vw;
    font-weight: 300;
    margin-right: 7.5vw;
    align-self: flex-end;
    margin-top: -5vw
}

#payPerfection {
    font-size: 7vw;
    margin-top: .5vw;
    font-weight: 300;
    margin-right: 7.5vw;
    align-self: flex-end
}

#hLogo {
    width: 220px;
    position: absolute;
    top: calc(60% - 220px);
    left: calc(50% - 110px);
    width: 100% !important;
    position: relative;
}

#hLogo .fillColor,
#navLogo .fillColor {
    fill: #fff
}

#hLogo .logoLine {
    transform-origin: center
}

header {
    position: fixed;
    top: 0;
    left: 0;
    padding-right: 20px;
    z-index: 3;
    display: flex;
    align-items: center;
    height: 100px;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
    pointer-events: none
}

#headerShowTarget {
    position: absolute;
    top: 105vh
}

#headerHideTarget {
    position: absolute;
    top: 110vh
}

#textSwitch {
    position: absolute;
    z-index: 1;
    bottom: 30px;
    right: 2vw
}

#mainLogo {
    width: 260px;
    display: flex;
    align-items: center;
    margin-left: -25px;
    color: #1e2949;
}

#mainLogo svg {
    transform: translateX(-30px);
    width: 100%
}

/* #mainLogo.hidden,
#mainLogo.menuForced {
    transform: translateY(-65px)
} */

#mainLogo .fillColor {
    fill: #fff
}

#mainLogo.dark .fillColor {
    fill: #9d968d
}

#mainMenuController {
    width: 7.75vw;
    height: 40px;
    will-change: transform;
    cursor: pointer;
    z-index: 1;
    position: relative
}

#menuClose {
    width: 38px;
    height: 38px;
    top: 26px;
    left: 55px;
    z-index: 1
}

#mainMenuController:after {
    content: '';
    position: absolute;
    width: 60px;
    height: 60px;
    background: #1e2949;
    left: calc(50% - 30px);
    opacity: 0;
    top: -10px;
    border-radius: 50px;
    transform: scale(.2);
    -webkit-transition: -webkit-transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 600ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 600ms cubic-bezier(.19, 1, .22, 1);
    z-index: -1
}

#mainMenuController.show:hover:after {
    transform: scale(1);
    opacity: .7
}

.menuLines {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

@media all and (min-width:961px) {
    #mainMenuController.show:hover .line {
        background: #ffffff;
        transition: background 1e3ms cubic-bezier(.19, 1, .22, 1), fill 1e3ms cubic-bezier(.19, 1, .22, 1), transform 1500ms cubic-bezier(.19, 1, .22, 1);
        transition-delay: 0ms !important
    }
}

.quickColor {
    transition: background 1e3ms cubic-bezier(.19, 1, .22, 1), fill 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition-delay: 0ms !important
}

.menuController .line {
    width: 40px;
    height: 1px;
    background: #1e2949;
}

/* .menuController .fillColor,
.headerButton .circlePath .fillColor {
    stroke: #fff
} */

.menuController .line {
    margin-top: 4px
}

.menuController .line._1 {
    margin-top: 0
}

.menuController .line._2 {
    transition-delay: 50ms
}

.menuController .line._3 {
    transition-delay: 100ms
}

.menuController.dark .line {
    background: #1e2949;
}

.circlePath {
    width: 38px;
    height: 38px;
    transform: scale(.5);
    opacity: 0
}

.show .circlePath {
    transform: scale(1);
    opacity: 1
}

.headerButton.dark .circlePath circle {
    stroke: #1e2949;
}

.headerButton.dark .icon .fillColor {
    fill: #1e2949;
}

.headerButton .icon {
    transform: scale(.5);
    opacity: 0;
    z-index: 1
}

.show .icon {
    transform: scale(1);
    opacity: 1
}

.headerButton.hidden {
    transform: translateY(-65px)
}

.headerButton:hover .circlePath circle {
    stroke: #9d968d;
    fill: #fff
}

.headerButton:hover .icon path {
    fill: #9d968d
}

#hVideoLayer {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    transform: scale(.5);
    transform-origin: right;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    cursor: pointer;
    z-index: 1;
    display: none;
}

#hVideoLayer video {
    transition: all 1e3ms cubic-bezier(.19, 1, .22, 1) !important;
    width: 100%;
    height: 100%;
    top: 0%;
    right: 0%;
    position: absolute;
    object-fit: cover;
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    clip-path: inset(50% round 0);
    -webkit-clip-path: inset(50% round 0)
}

#hVideoLayer.open {
    transform: scale(1) !important;
    -webkit-transition: -webkit-transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1)
}

#hVideoLayer.open video {
    clip-path: inset(0 0 0 0 round 0) !important;
    -webkit-clip-path: inset(0 0 0 0 round 0) !important;
    width: 100% !important;
    height: 100% !important;
    top: 0 !important;
    left: 0 !important
}

.mainContainer {
    margin: 0 auto;
    width: calc(100% - 15.5vw);
}

.oButton {
    position: relative;
    height: 36px;
    margin-right: 24px;
    cursor: pointer;
    will-change: transform;
    font-size: 19px;
}

.view-map {
    color: #000000;
    font-size: 18px;
}

.oBackground {
    width: 100%;
    height: 100%;
    position: absolute;
    border-radius: 20px;
    background: #fff;
}

.oOuter {
    position: absolute;
    width: 53.5px;
    right: 0
}

.oOuter.fillColor {
    stroke: #fff;
    fill: #fff
}

.oContent {
    height: 100%;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    background: #fff;
    overflow: hidden
}

.transparent .oContent {
    background: 0 0
}

.oLabelContainer {
    z-index: 1
}

.oLabel {
    font-family: geometria;
    font-size: 16px;
}

.oSymbol {
    position: absolute;
    right: -12px;
    top: 4px
}

.oArrow {
    width: 8px;
    transform: rotateZ(45deg)
}

.oArrow.fillColor {
    fill: #6e6259
}

.oButton .oArrow {
    opacity: 0
}

.oButton.open .oOuter {
    transform: translateX(24px)
}

.oButton.open .oArrow {
    transform: none;
    opacity: 1
}

.oButton.dark .oBackground {
    background: #1e2949;
}

.oButton.dark .oContent {
    background: #1e2949;
}

.oButton.dark .oArrow.fillColor {
    fill: #9c998f
}

#bookNow.dark .oSymbol .fillColor {
    fill: #1e2949;
}

#bookNow.dark:hover .oSymbol .fillColor {
    fill: #fff
}

.oButton.dark .oOuter.fillColor {
    stroke: #1e2949;
    fill: #1e2949;
}

.oButton.dark .oLabel {
    color: #fff;
    transition-delay: 0ms
}

.oButton.fullWhite .oSymbol .fillColor {
    fill: #6e6259
}

.oButton.whiteArrow .oSymbol .fillColor {
    fill: #fff
}

.oButton.whiteArrow:hover .oSymbol .fillColor {
    fill: #6e6259
}

.oButton.fullWhite {
    overflow: hidden;
    width: 70px
}

.oButton.fullWhite.right .oSymbol {
    right: 10px;
    transform: translateX(20px)
}

.oButton.fullWhite.left .oSymbol {
    left: 6px;
    transform: translateX(-20px)
}

.oButton.fullWhite.show .oSymbol {
    transform: none
}

.oButton.fullWhite.right .oArrow {
    transform: rotateZ(45deg)
}

.oButton.fullWhite.left .oArrow {
    transform: rotateZ(-135deg)
}

.oButton.fullWhite .oOuter,
.oButton.bordered .oOuter {
    display: none
}

.oButton:hover .oBackground {
    transform: translateX(23px)
}

.oButton:hover .oArrow {
    fill: #9c998f;
    transform: rotateZ(-45deg)translateX(-3px)translateY(-3px)
}

.oButton.dark:hover .oArrow {
    fill: #fff
}

.oButton.bordered {
    border-radius: 25px;
    border: 1.5px solid #8c8279
}

#navigationTrack.bordered .oSymbol {
    display: none
}

.oButton.bordered .oContent {
    padding: 0 20px
}

.oButton.bordered .oArrow {
    transform: rotateZ(45deg)
}

.oButton.bordered .oSymbol {
    right: -30px
}

.oButton.bordered:hover .oBackground {
    transform: none
}

.oButton.download .oArrow {
    transform: rotateZ(135deg)
}

.callerTop {
    position: absolute;
    top: 0
}

.callerBottom {
    position: absolute;
    bottom: 0
}

#leftHeader {
    display: flex;
    align-items: center;
    pointer-events: all
}

#rightHeader {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    pointer-events: all
}

.headerButton {
    width: 38px;
    height: 38px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer
}

.headerButton.menuForced {
    transform: none !important
}

.headerButton .icon .fillColor {
    fill: #fff
}

.email {
    margin-right: 80px
}

.mobile {
    margin-right: 15px
}

.mobile .icon {
    width: 46%
}

.email .icon {
    width: 42%
}

.headerButton .circlePath {
    position: absolute;
    left: 0;
    top: 0
}

#brownies {
    position: absolute;
    height: 50px;
    bottom: 35px;
    margin: 0 2.8vw;
    z-index: 1
}

#brownies.hidden {
    transform: translateX(-6vw)
}

.brownie {
    height: 200px;
    position: absolute;
    width: 546px;
    bottom: 0;
    left: 50px
}

.brownieBack {
    background: #a8a297;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transition: all 800ms cubic-bezier(.19, 1, .22, 1), opacity 400ms cubic-bezier(.19, 1, .22, 1);
    transition: all 800ms cubic-bezier(.19, 1, .22, 1), opacity 400ms cubic-bezier(.19, 1, .22, 1);
    display: none;
}

.brownie.closed .brownieBack {
    border-radius: 50px;
    width: 50px;
    height: 50px;
    transform: translateX(23px)translateY(75px)scale(.5);
    opacity: 0
}

#cookieBrownie.closed .brownieBack {
    transform-origin: 67% 37%
}

#cookieBrownie .brownieButton {
    text-decoration: underline
}

#cookieBrownie.opened {
    height: 270px
}

.cookiePrefs {
    display: none
}

#cookieBrownie.opened .cookiePrefs {
    display: block
}

.cookiePrefs ul {
    margin-top: 10px;
    display: flex;
    width: 82%;
    justify-content: space-between
}

.cookiePrefs input {
    display: none
}

.cookiePrefs label {
    padding-left: 30px;
    background-repeat: no-repeat;
    background-position: -4px -1px;
    padding-top: 5px;
    padding-bottom: 6px;
    cursor: pointer;
    background-image: url(assets/images/whitechecks.png);
    display: inline;
    vertical-align: baseline;
    font-family: Geometria;
    font-size: 12px;
    color: #fff
}

.cookiePrefs input[type=checkbox]:checked+label {
    background-position: -4px -26px
}

#newsLetterBrownie.closed .brownieBack {
    transform-origin: 44%
}

#covidBrownie.closed .brownieBack {
    transform-origin: 60% 35%
}

#cookieBrownie.closed:hover .brownieBack {
    transform: translateX(27px)translateY(72px)scale(1);
    opacity: 1
}

#newsLetterBrownie.closed:hover .brownieBack {
    transform: translateX(21px)translateY(74px)scale(1);
    opacity: 1
}

#covidBrownie.closed:hover .brownieBack {
    transform: translateX(25px)translateY(71px)scale(1);
    opacity: 1
}

#cookieBrownie.closed {
    transform: translateX(-83px)translateY(93px)
}

#newsLetterBrownie.closed {
    transform: translateX(-77px)translateY(1px)
}

#covidBrownie.closed {
    transform: translateX(-81px)translateY(-84px)
}

.brownieContentLayer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    padding: 15px 0;
    box-sizing: border-box;
    display: none;
}

#cookieBrownie .brownieContentLayer {
    align-items: center;
    justify-content: center
}

.brownieIcoContainer {
    width: 93px;
    display: flex;
    align-items: center;
    justify-content: center
}

.brownieIcoContainer.hidden {
    transform: translateX(calc(-2.8vw - 30px))
}

.brownieContent {
    flex: 1;
    padding-right: 20px;
    box-sizing: border-box;
    overflow: auto;
    margin-right: 30px;
    transition-delay: 300ms
}

.brownieContent::-webkit-scrollbar {
    width: 0
}

.brownieContent::-webkit-scrollbar-track {
    border-radius: 25px;
    height: 5px
}

.brownieContent::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .5);
    height: 5px
}

#cookieBrownie .brownieContent {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%
}

.brownieText {
    font-family: geometria;
    font-size: 12px
}

.brownieButtons .fillColor {
    fill: #fff
}

#newsLetterBrownie .brownieText {
    margin-top: 20px
}

.brownieTitle {
    font-family: Notera;
    font-size: 40px;
    line-height: 30px
}

.brownieButtons {
    display: flex;
    width: 90%;
    justify-content: space-between
}

.brownieButton {
    font-family: Geometria;
    font-size: 12px;
    cursor: pointer
}

.brownieButton .oArrow {
    transform: none;
    margin-left: 10px
}

.brownie .brownieIco svg .fillColor {
    fill: #fff
}

.brownie.closed .brownieContentLayer {}

.brownie.closed .brownieContent {
    opacity: 0;
    transition-delay: 0ms;
    transition-duration: 0ms
}

.brownie.closed .brownieIco {
    pointer-events: all;
    padding: 10px;
    cursor: pointer;
    transform: scale(.9)
}

.brownie.closed {
    pointer-events: none
}

.brownie .brownieIco svg {
    width: 35px
}

#newsLetterBrownie .brownieIco svg {
    width: 23px
}

#covidBrownie .brownieIco svg {
    width: 32px
}

.brownie .brownieIco .svgLine {
    transform-origin: right
}

.brownie.closed .brownieIco .svgLine {
    transform: scale(0, 1)
}

#brownies.dark .brownie.closed .brownieIco svg .fillColor {
    fill: #6e6259
}

#covidBrownie .brownieText {
    font-size: 14px;
    line-height: 24px;
    margin-top: 35px
}

.brownieClose {
    position: absolute;
    right: 18px;
    top: 18px;
    width: 14px;
    height: 16px;
    cursor: pointer;
    z-index: 1
}

.brownieClose .line._1 {
    width: 20px;
    height: 2px;
    background: #fff;
    transform-origin: left;
    transform: rotate(45deg)
}

.brownieClose .line._2 {
    width: 20px;
    height: 2px;
    background: #fff;
    transform-origin: right;
    transform: rotate(-45deg);
    position: absolute;
    right: 0;
    top: 0
}

.mainBackground+.mainContainer {
    z-index: 1
}

.text {
    font-family: LM Roman;
    font-size: 22px;
    line-height: 36px;
    will-change: transform
}

.text.limited {
    max-width: 330px;
    width: 30vw
}

.text.small {
    font-size: 18px;
    line-height: 28px
}

.text.big {
    font-size: 1.8vw;
    line-height: 3vw;
    font-family: LM Roman
}

.compositionText {
    max-width: 280px
}

.geometria {
    font-family: Geometria
}

.text.tech {
    font-family: geometria;
    font-weight: 300;
    font-size: 30px;
    line-height: 40px
}

.text.tech.small {
    font-size: 25px
}

.text.tech.smaller {
    font-size: 20px
}

.stay-title {
    color: #9e2721 !important;
}

.miniTitle {
    font-size: 22px;
    line-height: 32px;
    font-family: LM Roman;
}

.introText {
    width: 50%
}

.introTextContainer {
    display: flex;
    justify-content: flex-end
}

#partners {
    display: flex;
    justify-content: space-between;
    align-items: center
}

#accoladesScroller {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.accolade.ruinart {
    max-width: 220px;
    width: 17%
}

.accolade.traveller,
.accolade.forbes,
.accolade.design {
    max-width: 80px;
    width: 6%
}

.accolade.slh {
    width: 14%;
    max-width: 165px
}

.accolade.reader {
    width: 21%;
    max-width: 290px
}

.mainBackground {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    will-change: transform;
}

#ethos {
    display: flex
}

.introPic {
    width: 17.5vw;
    position: relative;
    height: 11.5vw;
    max-width: 330px;
    display: none;
}

.picBar {
    position: absolute;
    width: 17.5vw;
    height: 125vh;
    max-width: 330px;
    top: calc(100% + 30px)
}

#ethosIntroPic {
    margin-top: -5vw
}

.fit.wider {
    height: 110%;
    top: -5%
}

img[data-scroll-speed] {
    will-change: transform
}

.covered:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #1e294933;
    will-change: transform
}

.covered.show:after {
    transform: translateY(-100%);
    -webkit-transition: -webkit-transform 1500ms 200ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1500ms 200ms cubic-bezier(.19, 1, .22, 1)
}

#ethosTitleContainer {
    display: flex
}

#ethosTitle {
    margin-left: 20px;
    /* align-self: flex-end; */
    z-index: 1;
    margin-top: 1.6vw;
    margin-bottom: 1.6vw;
    color: #1e2949;
}

.blockTitle {
    font-size: 4vw;
    font-family: Lm Roman;
    line-height: 4.2vw;
    will-change: transform
}

#ethosIntroText {
    /* max-width: 330px; */
    color: #fff;
    /* margin-left: calc(17.5vw + 20px); */
}

#ethosPic {
    position: relative;
    margin-left: 5vw;
    width: 56vw;
    height: 38vw;
    top: 5vw;
    overflow: hidden;
}

#ethosPic::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(0 0 0 / 1%);
    z-index: 1;
}

#ethosPic img {
    position: relative;
    z-index: 0;
    width: 100%;
    height: auto;
}

#ethosContent {
    display: flex
}

#ethosLayer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
    opacity: 0
}

#ethosText {
    margin-left: 5vw;
    max-width: 330px;
    display: flex;
    align-items: center;
    margin-top: 5vw;
    color: #fff;
}

.tl {
    opacity: .6
}

.tl._1 {
    font-family: Geometria;
    font-size: 5.5vw;
    color: #ffffff9c;
    position: absolute;
    opacity: 1 !important;
    top: 28vw;
    left: 2.5vw;
    font-weight: 300;
    will-change: transform
}

.tl._1.smaller {
    font-size: 7.5vw
}

.tl._2 {
    font-family: LM Roman;
    font-size: 3vw;
    color: #ffffff9c;
    opacity: 1;
    position: absolute;
    top: 42vw;
    left: 18vw;
    will-change: transform
}

.tl._3 span {
    transform: rotateZ(180deg);
    display: block;
    will-change: transform;
    writing-mode: tb;
    color: #ffffff9c;
    opacity: 1 !important;
}

.tl._3 {
    font-family: Geometria;
    font-size: 8vw;
    color: #ffffff;
    opacity: .6;
    position: absolute;
    top: 30vw;
    opacity: 1 !important;
    left: 59vw;
    font-weight: 300;
    will-change: transform;
    text-transform: lowercase;
    text-align: center;
    display: flex;
    justify-content: center
}



#prIntroText {
    /* max-width: 330px; */
    color: #000000;
}

#prTop {
    display: flex;
    justify-content: space-between
}

#prTitle {
    margin-left: -1.3vw
}

.sectionTitle {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    font-family: Geometria;
    font-weight: 300;
    will-change: transform
}

.sectionTitle .small {
    font-size: 2.6vw
}

.sectionTitle .big {
    font-size: 3vw;
    line-height: 6vw;
    position: relative
}

.sectionTitle .small+.sectionTitle .big {
    left: .6vw
}

#prSection .mainBackground,
#prSection .activeLayer {
    top: 12.5vw;
    height: calc(100% - 12.5vw)
}

#prSlider {
    height: 45vw;
    margin-bottom: 5vw
}

#prSlider {
    will-change: transform
}

#hDining .mainContainer {
    position: relative;
    /* margin-top: 2.5vw; */
    display: flex;
    justify-content: space-between
}

html[lang=en] #hDiningTitle .big {
    order: 0
}

html[lang=en] #hDiningTitle .small {
    order: 1
}

#hDiningFixed {
    display: flex;
    display: none;
    flex-direction: column;
    flex: 1;
    margin-left: 5vw
}

#hDiningIntroPic {
    margin-top: -6vw;
    align-self: flex-end
}

#hDiningScroll {
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

#hDiningItems {
    /* width: 52.5vw; */
    will-change: transform
}

.hDiningItemPic {
    height: 40vw
}

.long .hDiningItemPic {
    height: 25vw
}

#hDining .mainBackground {
    height: 41vw
}

#tasteTitle {
    margin-top: 10.5vw;
    will-change: transform
}

#tasteText {
    max-width: 300px
}

.listItemTitle {
    text-align: center;
    margin-top: 25px;
    font-family: geometria;
    font-size: 24px
}

.listItemSubtitle {
    text-align: center;
    font-family: LM Roman;
    margin-top: 5px;
    font-size: 21px;
    color: #000000;
}

.hDiningItem.whitening .listItemTitle,
.hDiningItem.whitening .listItemSubtitle {
    color: #fff
}

.hDiningItemRow {
    display: flex;
    justify-content: space-between
}

.hDiningItem {
    width: calc(50% - 1.25vw);
    display: block
}

.hDiningItem.long {
    width: 100%
}

#hDiningSticky {
    width: 100%
}

#hDiningTarget {
    position: absolute
}

#hLifeStyle {
    padding-bottom: 5vw
}

#hLifeStyle .mainContainer {
    display: flex;
    flex-direction: column
}

#hLifeStyle .mainBackground {
    top: 9vw;
    height: calc(100% - 9vw)
}

#hLifeStyleTitle {
    align-self: flex-end
}

.slidingTitle {
    display: flex;
    flex-direction: column
}

.slidingTitleBig {
    font-size: 6vw;
    font-family: LM Roman Dunhill;
    display: flex
}

.slidingTitleBig.small {
    font-size: 4.3vw;
    top: 2.4vw !important
}

.slidingTitleSmall {
    font-family: geometria;
    font-weight: 300;
    font-size: 2.5vw;
    color: #1e2949;
}

#hLifeStyle .slidingTitleSmall {
    margin-top: -6.5vw;
    z-index: 1;
    align-self: flex-end;
    margin-right: 3.6vw
}

#hLifeStylePanel {
    margin-top: .3vw
}

.hLifeStyleBlock {
    will-change: transform
}

.hLSBlockTitle {
    height: 5vw;
    display: flex;
    align-items: center;
    z-index: 1
}

.hLSBlockTitle:after {
    content: '';
    width: 100%;
    height: 1px;
    background: #fff;
    position: absolute;
    bottom: 0;
    left: 0
}

.panelLabel {
    font-family: Geometria;
    font-size: 2vw
}

.panelLabel * {
    font-weight: 300
}

.hLSBlockPic {
    height: calc(100vh - 10vw);
    width: 100%
}

#hLifeStyleTarget,
#hLifeStyleTarget2,
#hLifeStyleTarget3,
#hLifeStyleTarget4 {
    height: calc(200vh - 15vw);
    position: absolute
}

#hLifeStyleSticky,
#hLifeStyleSticky2,
#hLifeStyleSticky3,
#hLifeStyleSticky4 {
    height: calc(100vh - 5vw);
    width: 100%
}

#hLifeStylePanel {
    z-index: 1;
    margin-top: .25vw
}

.veil {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #00000091;
}

#hFacilitiesSticky {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    padding-bottom: 6vw;
    box-sizing: border-box
}

#hFacilities .mainContainer._1 {
    display: flex;
    /* justify-content: center; */
    align-items: center;

}

#hFacilitiesTitle .big {
    order: 0;
    margin-top: 1.125vw;
    left: -.5vw
}

#hFacilitiesTitle .small {
    order: 1;
    position: relative;
    left: -.15vw
}

html[lang=en] #hFacilitiesTitle {
    align-items: flex-end;
    color: #ffffff;
}

html[lang=en] #hFacilitiesTitle .small {
    order: 0;
    left: 0
}

html[lang=en] #hFacilitiesTitle .big {
    order: 1;
    left: 0;
    margin-top: 0
}

.hFacilitiesItem {
    margin-left: 7.5vw
}

.hFacilitiesItem:first-child {}

.hFacilitiesItem.horizontal .hFItemPic {
    width: 35vw;
    height: 22vw
}

.hFacilitiesItem.vertical .hFItemPic {
    width: 22vw;
    height: 35vw
}

.hFacilitiesItem.horizontal .hFItemTitle {
    bottom: -1.8vw;
    left: -1.5vw
}

.hFacilitiesItem.vertical .hFItemTitle {
    bottom: -1.5vw;
    left: -2.1vw;
    transform: rotate(-90deg);
    transform-origin: top left;
    white-space: nowrap;
    color: #ffffff;
}

.hFItemTitle {
    font-family: geometria;
    font-weight: 300;
    font-size: 3.2vw;
    position: absolute;
    color: #ffffff;
    opacity: 1 !important;
}

#hFacilitiesSlider {
    display: flex;
    margin-top: 6vw
}

#hFacilitiesScroller {
    display: flex;
    align-items: center;
    will-change: transform
}

#hFacilitiesTarget {
    position: absolute;
    top: 0;
    height: 400vh
}

#hFacilities {
    flex-direction: column;
    justify-content: space-between;
    height: 400vh
}

@keyframes hFScroll {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(-51.515%)
    }
}

#hExperiencesTitle {
    margin-top: -2.8vw
}

#hExperiences {}

#hExperiencesTitle .slidingTitleBig {
    margin-top: 2.5vw;
    color: #ffffff;
}

#hExperiencesContainer {
    height: 100%;
    display: flex
}

#hExperiencesLayer {
    flex: 1;
    height: 38vw;
    min-width: 35vw
}

#hExperiencesPics {
    width: 70vw;
    max-width: 960px;
    margin-left: 5vw;
    margin-right: -150px;
    height: 38vw
}

.hExperienceBlock {
    position: absolute;
    width: 100%;
    overflow: hidden
}

.hExperienceBlock.show~.hExperienceBlock {
    transform: translateY(calc(100% - 69px))
}

.hExperienceContent {
    height: calc(22vw - 281px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transform: translateY(-21vw);
    z-index: 0;
    will-change: transform
}

.hExperienceBlock.show {
    transform: none
}

.hExperienceBlock.show .hExperienceContent {
    transform: none
}

.hExperienceBlock._1 {
    top: 0;
    z-index: 0
}

.hExperienceBlock._2 {
    top: 70px;
    z-index: 1
}

.hExperienceBlock._3 {
    top: 140px;
    z-index: 2
}

.hExperienceBlock._4 {
    top: 210px;
    z-index: 3
}

.hExperienceButton {
    display: flex;
    justify-content: space-between;
    height: 70px;
    align-items: center;
    z-index: 1;
    cursor: pointer;
    will-change: transform
}

.hExperienceContent:after,
.hExperienceButton:after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 100%;
    background: #8c8279;
    left: 0;
    height: 1px;
    -webkit-transition: -webkit-transform 2e3ms cubic-bezier(.19, 1, .22, 1), opacity 2e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 2e3ms cubic-bezier(.19, 1, .22, 1), opacity 2e3ms cubic-bezier(.19, 1, .22, 1);
    transform-origin: left;
    will-change: transform
}

@media all and (max-width: 768px) {

    .hExperienceContent:after,
    .hExperienceButton:after {
        background: transparent !important;
    }
}

.hExperienceBlock.show .hExperienceButton:after {
    transform: scale(0, 1);
    transform-origin: right;
}

.hExperienceTitle {
    font-family: Geometria;
    font-size: 22px;
    color: #ffffff !important;
}

.hExperienceText p {
    color: #ffffff;
}

.hExperienceArrow {
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    pointer-events: none;
    margin-right: 1px
}

.hExperienceBlock.show .hExperienceArrow {
    pointer-events: all
}

.hExperienceArrow svg {
    width: 10px;
    z-index: 1
}

.hExperienceBackground {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
    color: #000;
    border-radius: 50%;
    transform: scale(.4);
    opacity: 0
}

.hExperienceBlock.show .hExperienceBackground {
    opacity: 1;
    transform: scale(1)
}

.hExperienceBlock.show .hExperienceArrow {
    transform: rotate(45deg)
}

.hExperienceBlock.show .hExperienceArrow .fillColor {
    fill: #000;
}

.hExperienceArrow .fillColor {
    fill: #fff;
}

.hExperienceSubTitle {
    font-family: LM Roman
}

.hExperiencePic {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

.hExperiencePic:first-child {
    position: relative
}

.hExperienceText {
    flex: 1;
    display: flex;
    align-items: center;
    color: #ffffff;
}

#hExperiencesPicsContainer {
    height: 100%
}

#clocksContainer {
    display: flex;
    justify-content: space-between
}

.clock {
    width: 180px
}

.clock-container {
    width: 100%;
    height: 200px;
    position: relative
}

.clock-container>div {
    will-change: transform
}

.clock-container:after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    margin: -4px 0 0 -4px;
    background: #dbdbdf;
    border-radius: 6px;
    content: "";
    display: block
}

.clock-hour {
    width: 0;
    height: 0;
    position: absolute;
    top: 50%;
    left: calc(50% + .5px);
    margin: -1px 0 0 -25%;
    padding: 1px 0 0 25%;
    background: #bab0a7;
    -webkit-transform-origin: 100% 50%;
    -ms-transform-origin: 100% 50%;
    transform-origin: 100% 50%
}

.clock-minute {
    width: 0;
    height: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40% -1px 0 0;
    padding: 40% 1px 0 0;
    background: #bab0a7;
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

.clock-second {
    width: 0;
    height: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40% 0 0;
    padding: 40% 0 0 1px;
    background: #e1dfdb;
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

.clock .center {
    width: 8px;
    height: 8px;
    background: #e1dfdb;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    margin-top: -4px;
    left: 50%;
    margin-left: -4px
}

.clock-city p {
    font-family: Geometria;
    font-size: 18px;
    text-align: center;
    margin-top: 20px
}

.clock.main {
    margin: 0 5vw
}

.clock.main .clock-container:before {
    content: '';
    position: absolute;
    width: 60%;
    left: 20%;
    background: #f6f4f2;
    top: 0;
    height: 100%;
    border-radius: 60px
}

#footerMain {
    height: 100% !important;
    padding: 300px 0px;
}

#footerTarget {
    position: absolute
}

#footerSticky {
    height: 100vh
}

#footerDataTop {
    background: #f3f0ec;
    display: flex;
    flex-direction: column;
    display: none;
}

#footerMain .mainContainer {
    z-index: 999;
    position: relative;
    height: 100%;
}

#footerLeft {
    height: 65%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    will-change: transform;
}

#footerLogo {
    width: 175px;
}

#footerLogo .fillColor {
    fill: #fff
}

#footerInfo p,
#footerInfo a {
    font-family: geometria;
    font-size: 21px;
    line-height: 33px;
    color: #fff;
    font-weight: 300;
    text-decoration: none;
}

#copyright {
    margin-bottom: 20px
}

#copyright p {
    font-family: LM Roman;
    font-size: 18px;
    color: #fff;
    font-weight: 300;
    text-decoration: none;
    letter-spacing: 1px
}

.socials {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px
}

.ig,
.tw {
    margin-top: 20px
}

#footerData {
    position: absolute;
    left: 100%;
    width: 50%;
    height: 100%;
    top: 0;
    flex-direction: column;
    display: flex;
    will-change: transform
}

#weatherIn {
    position: absolute;
    top: 100vh
}

#date {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    margin-top: 2.5vw
}

#date .year {
    font-family: geometria;
    font-size: 7vw;
    font-weight: 300
}

#date .day {
    display: flex;
    flex-direction: column;
    margin-bottom: 1.2vw;
    margin-left: 2.5vw
}

#date .ext-day {
    font-family: LM Roman;
    font-size: 1.3vw
}

#date .ext-date {
    font-family: geometria;
    font-weight: 300;
    font-size: 2vw
}

.weatherContainer {
    width: calc(100% - 5vw);
    max-width: 700px;
    margin: auto
}

#days {
    padding: 1vw 0;
    border-top: 1px solid #b9ada4;
    border-bottom: 1px solid #b9ada4
}

#days .weatherContainer {
    display: flex
}

#weather {
    flex: 1
}

#weather img {
    filter: brightness(.8)
}

.meteo_row {
    margin-top: 30px
}

.meteo_row .weatherContainer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 13px
}

.meteo_row:first-child {
    margin-top: 0
}

.meteo_col {
    width: 200px
}

.meteo_ico_big {
    display: flex;
    align-items: center;
    height: 85px;
    justify-content: center
}

.meteo_stats {
    text-align: center;
    font-family: Geometria;
    color: #6d5f51;
    font-size: 15px;
    height: 40px
}

.meteo_row .data {
    display: flex;
    justify-content: center
}

.meteo_row .data>div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px
}

.meteo_row .data>div img {
    margin-right: 12px
}

.meteo_small,
.hour_text {
    font-size: 13px;
    font-family: Geometria;
    color: #6d5f51
}

.temp_text {
    text-align: center;
    font-family: LM Roman;
    color: #6d5f51;
    font-size: 50px;
    letter-spacing: -6px;
    width: 100%;
    position: relative
}

.temp_text span.temp_deg {
    position: absolute;
    top: 10px;
    font-size: 24px;
    margin-left: 7px
}

#hourlyBox {
    margin-top: 2.5vw
}

.hourly_row {
    display: flex;
    border-top: 1px solid #b9ada4;
    border-bottom: 1px solid #b9ada4;
    padding-top: 20px;
    padding-bottom: 15px
}

.hourly_row .weatherContainer {
    display: flex
}

.hour_box {
    width: 12.5%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center
}

.hour_box .hour_ico {
    height: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end
}

.hour_box .hour_ico img {
    transform: scale(.55)translateY(20px)
}

.hour_box.active .hour_ico img,
.hour_box:hover .hour_ico img {
    transform: scale(.8)translateY(-5px)
}

.hour_box.active .active_line,
.hour_box:hover .active_line {
    transform: scale(1, 1)
}

.hour_box.active .hour_text p,
.hour_box:hover .hour_text p {
    transform: translateY(0)
}

.hour_box .active_line {
    width: 40px;
    height: 3px;
    background: #cfced3;
    margin-top: -2px;
    transform: scale(0, 1)
}

.hour_box .separator {
    width: 100%;
    margin-top: 10px;
    height: 1px;
    background: #e5e0e1
}

.hour_box .hour_text {
    margin-top: 12px
}

.hour_box .hour_text p {
    font-size: 14px;
    transform: translateY(-100%)
}

.hour_box.right .hour_ico {
    align-self: flex-end
}

.hour_box.active>.hour_ico {
    align-self: center;
    transform: translateY(-5px)
}

#days_box {
    width: calc(100% - 5vw);
    max-width: 700px;
    margin: auto;
    display: flex;
    margin-top: 50px
}

.day_name {
    width: 14.2857%;
    padding: 5px 15px;
    position: relative;
    cursor: pointer;
    will-change: transform
}

.day_name:first-child p {
    text-transform: none
}

.day_name p {
    font-family: geometria;
    font-size: 16px;
    text-align: center;
    z-index: 1;
    position: relative;
    text-transform: uppercase;
    will-change: transform
}

.day_name .day_back {
    width: 100%;
    height: 100%;
    position: absolute;
    background: #dbd6d1;
    left: 0;
    top: 0;
    -webkit-transform: scale(0, 1);
    transform: scale(0, 1);
    z-index: 0;
    -webkit-transform-origin: left;
    transform-origin: left;
    border-radius: 25px
}

.day_name.active .day_back,
.day_name:hover .day_back {
    -webkit-transform: scale(1);
    transform: scale(1)
}

#footerDataBottom {
    flex: 1;
    display: flex;
    align-items: center
}

#footerDataBottom .weatherContainer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: calc(100% - 5vw);
    max-width: none
}

#weather .animating {
    will-change: transform
}

.partner.lhw {
    max-width: 160px
}

.partner.virtuoso {
    max-width: 162px
}

.partner.ae,
.partner.traveller {
    max-width: 150px
}

.partner.virtuoso,
.partner.ae,
.partner.traveller,
.partner.lhw {
    width: 20%
}

nav {
    position: fixed;
    top: 0;
    left: 0;
    will-change: transform;
    width: 100%;
    height: 100vh;
    z-index: 2;
    display: none
}

nav.active {
    display: block
}

nav.hidden {
    transform: scale(.99);
    opacity: 0
}

#navVideo {
    position: absolute;
    width: 100%;
    height: 100%
}

#navVideo video {
    width: 100%;
    height: 100%;
    top: 0%;
    right: 0%;
    position: absolute;
    object-fit: cover;
    pointer-events: none
}

#navInner {
    display: flex;
    flex-direction: column;
    z-index: 1;
    position: relative;
    left: 10px;
    top: 10px;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    will-change: transform
}

#navTop {
    display: flex;
    width: 100%;
    height: calc(100% - 140px);
    margin-top: 50px;
    box-sizing: border-box;
    margin-left: 10px;
    width: calc(100% - 20px);
    padding: 7.5vh 0;
    position: relative
}

#navTop:before {
    content: '';
    position: absolute;
    top: 0;
    width: 100%;
    height: 1px;
    background: #fff;
    opacity: .3
}

#navTop:after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #fff;
    opacity: .3
}

#navBottom {
    display: flex;
    align-items: center;
    flex: 1;
    margin-left: 10px;
    width: calc(100% - 20px)
}

#navBottom .socials {
    min-width: 320px;
    display: flex;
    flex-direction: row;
    margin-bottom: 0;
    justify-content: center
}

#navBottom .socials .ig,
#navBottom .socials .tw {
    margin-left: 20px;
    margin-top: 0
}

#navBottom .socials .tw {
    margin-left: 25px
}

#navBackground {
    position: absolute;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    opacity: 1 !important;  
    border-radius: 25px;
    top: 10px;
    left: 10px
}

#navBackground.hidden {
    transform: scale(.99);
    opacity: 0
}

#navBar {
    min-width: 320px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between
}

#navLogo {
    width: 100%;
    max-width: 130px
}

#navLogo .logoLine.exit {
    transform-origin: center;
    -webkit-transition: -webkit-transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1)
}

.navSideItem {
    font-size: 16px;
    font-family: geometria;
    text-transform: lowercase;
    margin-top: 15px;
    position: relative;
    font-weight: 500
}

.navSideItem:after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 100%;
    background: #fff;
    height: 1px;
    transform: scale(0, 1);
    transform-origin: left;
    -webkit-transition: -webkit-transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1)
}

.navSideItem:hover:after,
.navSideItem.active:after {
    transform: scale(1)
}

.navSideItem:first-child {
    margin-top: 0
}

.navSideItem.margin {
    margin-top: 5vw
}

#navSideItems {
    display: flex;
    flex-direction: column;
    align-items: center
}

#navContent {
    flex: 1;
    padding-right: 100px;
    overflow: hidden;
    padding-left: 5vw
}

#navScroller {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-bottom: calc(70px + 28vh);
    will-change: transform;
    position: relative;
    top: 5px;
}

.navSection {
    margin-top: 1.5vh;
}

.navSection:first-child {
    margin-top: 0
}

.navSectionTitle {
    font-family: Geometria;
    color: #fff;
    font-size: 3vh;
    font-weight: 300;
    line-height: 4vh;
    padding-right: 100px;
}

.navSection:after {
    content: '';
    position: absolute;
    width: 30%;
    height: 1px;
    background: #ffffff66;
    top: 7.2vh;
    transform-origin: left;
    transform: scale(0, 1);
    opacity: 0;
    -webkit-transition: -webkit-transform 1e3ms cubic-bezier(.19, 1, .22, 1), opacity 600ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1e3ms cubic-bezier(.19, 1, .22, 1), opacity 600ms cubic-bezier(.19, 1, .22, 1)
}

.navSection.show:after {
    opacity: 1;
    transform: scale(1);
    -webkit-transition: -webkit-transform 3e3ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 3e3ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transform-origin: left;
    left: 0;
}

.navSectionItems {
    display: flex;
    flex-direction: column;
    margin-top: 4vh;
    padding-left: 2.5vw;
    padding-right: 2.5vw
}

.navItem:first-child {}

.navItem {
    font-family: geometria;
    color: #6f6359;
    font-size: 3vh;
    font-weight: 300;
    padding: 7px 0;
    text-transform: lowercase;
    display: flex;
    justify-content: space-between;
    position: relative;
    will-change: transform
}

.navItem:after {
    content: '';
    position: absolute;
    height: 100%;
    width: calc(100% + 5vw);
    border: 1px solid #ffff;
    border-radius: 50px;
    left: -2.5vw;
    top: -.1vh;
    transform: scale(1, 0);
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform 150ms linear, opacity 800ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 150ms linear, opacity 800ms cubic-bezier(.19, 1, .22, 1);
    will-change: transform
}

.navItem:hover:after,
.navItem.active:after {
    transform: scale(1);
    -webkit-transition: -webkit-transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 800ms cubic-bezier(.19, 1, .22, 1)
}

.subItem {
    font-size: 1.8vh;
    color: #fff;
    position: relative;
    height: 3.5vh;
    font-weight: 500;
    display: flex;
    align-items: center;
    padding-right: 30px;
    will-change: transform
}

.subItem .oArrow {
    position: relative;
    left: 20px;
    will-change: transform
}

.subItem:before {
    content: '';
    background: #b6ada5;
    position: absolute;
    right: 0;
    height: 100%;
    width: 80px;
    border-radius: 50px;
    z-index: -1;
    transform: translateX(-10px);
    opacity: 0;
    will-change: transform;
    -webkit-transition: -webkit-transform 500ms cubic-bezier(.19, 1, .22, 1), opacity 500ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 500ms cubic-bezier(.19, 1, .22, 1), opacity 500ms cubic-bezier(.19, 1, .22, 1)
}

.navItem:hover .subItem:before,
.navItem.active .subItem:before {
    opacity: 1;
    transform: translateX(0);
    -webkit-transition: -webkit-transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1)
}

.navItem:hover .subItem span,
.navItem.active .subItem span {
    transform: none
}

.subItem:after {
    content: ''
}

.langsContainer {
    position: absolute;
    left: calc(340px + 5vw);
    top: 21px
}

.langsContainer a {
    color: #fff;
    font-family: Geometria;
    font-size: 16px;
    text-transform: lowercase;
    font-weight: 500
}

.langs {
    display: flex
}

.lang-item {
    margin-left: 50px;
    position: relative
}

.lang-item:before {
    content: '';
    position: absolute;
    height: 14px;
    width: 1px;
    right: -25px;
    background: #fff;
    top: 50%;
    margin-top: -6px
}

.lang-item:after {
    content: '';
    position: absolute;
    height: 1px;
    width: 100%;
    left: 0;
    background: #fff;
    bottom: 0;
    transform: scale(0, 1);
    transform-origin: left;
    -webkit-transition: -webkit-transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 800ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1)
}

.lang-item:hover:after {
    transform: scale(1)
}

.current-lang:after {
    transform: scale(1)
}

.lang-item:last-child:before {
    content: none
}

.lang-item:first-child {
    margin-left: 0
}

#tracker {
    will-change: transform;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    transform: translate(50vw, 50vh)
}

#tracker * {
    pointer-events: none
}

#simpleTrack {
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 50px;
    top: -6px;
    left: -6px;
    transition-delay: 300ms
}

#simpleTrack.no_opacity {
    transition-delay: 0ms
}

#navigationTrack {
    position: absolute;
    top: -30px;
    left: -60px;
    white-space: nowrap;
    text-transform: lowercase
}

.activeLayerContainer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    display: flex;
    cursor: pointer
}

.activeLayer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    cursor: pointer
}

.activeLayerContainer .activeLayer {
    position: relative;
    width: 50%;
    height: 100%;
    z-index: 0
}

#actionTrack {
    top: -8px;
    left: 6px;
    position: absolute
}

#actionTrack .oArrow.fillColor {
    fill: #fff
}

#actionTrack circle.fillColor {
    stroke: #fff
}

#actionTrack.dark .oArrow.fillColor {
    fill: #6e6259
}

#actionTrack.dark circle.fillColor {
    stroke: #6e6259
}

#actionTrack circle {
    stroke-dasharray: 113;
    stroke-dashoffset: 113
}

#actionTrack .oArrow {
    position: absolute;
    top: -3px;
    left: -3px;
    transform: rotateZ(0);
    opacity: 0
}

#actionTrack .circlePath {
    opacity: 1;
    fill: transparent;
    top: -18px;
    left: -18px;
    transform: none;
    position: absolute
}

#actionTrack.show circle {
    stroke-dashoffset: 0
}

#overview #clocks,
#overview footer {
    display: none
}

#overviewScroller {
    height: 100vh;
    padding-top: 90px;
    padding-bottom: 12vh;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
    width: 200vw
}

[data-scroll-direction=horizontal] [data-scroll-section] {
    white-space: normal;
    display: flex
}

#overviewViewport {
    display: flex;
    height: 100%;
    max-height: 660px
}

#overviewIntro {
    min-width: 100vw
}

#overviewIntro .mainContainer {
    height: 100%;
    display: flex;
    justify-content: space-between;
    position: relative
}

#overviewIntroLeft {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 45%
}

#overviewMiniTitle {
    position: absolute;
    left: -7.75vw;
    top: 12px;
    width: 7.75vw;
    display: flex;
    justify-content: center
}

#overviewMiniTitle span {
    writing-mode: tb;
    transform: rotateZ(180deg);
    margin-left: -33px
}

.overWord {
    font-family: geometria;
    font-size: 57px;
    font-weight: 300
}

.overviewText {
    max-width: 520px;
    margin-left: 5vw;
    overflow: auto
}

.overviewSub {
    font-family: lm roman;
    font-size: 40px
}

#overviewIntroRight {
    flex: 1;
    margin-left: 5vw;
    display: flex;
    justify-content: center
}

#overviewIntroRight .oButton {
    position: absolute;
    right: 0;
    bottom: 5vw;
    cursor: pointer
}

.scrollBackContainer {
    position: absolute;
    left: 0;
    bottom: 0;
    cursor: pointer;
    width: 7.75vw;
    display: flex;
    justify-content: center;
    display: none
}

.oButton.bordered.scrollBack {
    margin-right: -68px;
    z-index: 1
}

.oButton.bordered.scrollBack .oSymbol {
    left: -30px
}

.oButton.bordered.scrollBack .oArrow {
    transform: rotateZ(-130deg)
}

#overviewIntroPic {
    height: calc(100vh - 90px - 12vh);
    width: calc(100vh - 90px - 12vh);
    min-width: 220px;
    min-height: 220px;
    max-width: 660px;
    max-height: 660px
}

#overviewItems {
    display: flex;
    min-width: 100vw
}

#overviewItems .mainContainer {
    display: flex;
    position: relative
}

.oLeftBar {
    width: 10vw;
    max-width: 150px;
    height: calc(100% + 15vh)
}

#overviewItemsContent {
    display: flex;
    width: 60%;
    flex: 1;
    z-index: 1
}

#overviewItemTop {
    height: 100%;
    display: flex
}

#overviewItemBottom {
    min-height: 12vh;
    display: flex;
    align-items: center
}

#overviewItemPicsContainer {
    height: 100%;
    z-index: 1;
    overflow: hidden
}

.itemPic {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

.itemPic img {
    will-change: transform
}

.itemPic:first-child {
    position: relative
}

.detailTitle {
    font-family: geometria;
    font-weight: 300;
    font-size: 2.5vw;
    will-change: transform
}

.detailDate {
    margin-top: 5px
}

#overviewItems .detailTitle {
    display: none
}

#overviewSnippetContainer {
    width: 100%
}

#overviewSnippetContainer .snippet:last-child {
    font-size: 18px;
    line-height: 28px
}

.overviewSnippet {
    display: none
}

.detailSubtitle {
    font-family: LM Roman;
    font-size: 1.5vw;
    text-transform: uppercase;
    will-change: transform
}

#overviewItems .detailSubtitle {
    display: none;
    writing-mode: tb;
    transform: rotateZ(180deg);
    max-height: 50vh;
    text-align: right
}

#overviewItemSubtitleContainer {
    margin-left: -.6vw
}

#overviewItemTitleContainer {
    margin-left: 25px;
    height: calc(34vh - 178px);
    display: flex;
    align-items: center;
    width: 200%
}

.overviewItemText:first-child {
    position: relative
}

#overviewItemRight {
    display: flex;
    justify-content: space-between;
    margin-left: 50px;
    flex-direction: column;
    height: 100%;
    box-sizing: border-box;
    width: 100%
}

#overviewItemLeft {
    width: 100%;
    max-width: 660px
}

#overviewItems .detailTitle.active,
#overviewItems .overviewSnippet.active,
#overviewItems .detailSubtitle.active {
    display: block
}

#overview .detailSubtitle ._2 {
    margin-right: 68px
}

.oNavigation {
    color: #fff;
    position: relative;
    height: 36px;
    display: flex;
    align-items: center;
    padding-right: 27px;
    padding-left: 13px;
    will-change: transform;
    border-radius: 25px;
    overflow: hidden;
    cursor: pointer;
    -webkit-transition: -webkit-transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1)
}

.oNavigation .oArrow {
    position: relative;
    left: 12px;
    will-change: transform;
    top: 1px
}

.oNavigation:before {
    content: '';
    background: #eae6e0;
    position: absolute;
    right: 0;
    height: 100%;
    width: 100%;
    border-radius: 50px;
    z-index: -1;
    opacity: 0;
    will-change: transform;
    -webkit-transition: -webkit-transform 500ms cubic-bezier(.19, 1, .22, 1), opacity 500ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 500ms cubic-bezier(.19, 1, .22, 1), opacity 500ms cubic-bezier(.19, 1, .22, 1)
}

.oNavigation.show:before {
    opacity: 1;
    transform: translateX(calc(100% - 100px));
    -webkit-transition: -webkit-transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1)
}

.oNavigation.show.left:before {
    transform: translateX(calc(-100% + 100px))
}

.oNavigation:hover.show:before {
    transform: translateX(0)
}

.oNavigation:hover {
    transform: translateX(0) !important
}

.navigationTitle {
    font-family: geometria;
    font-size: 14px
}

#overviewControls {
    position: absolute;
    width: 100%;
    height: 100%
}

.overviewColumn.left {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 3;
    width: 7.75vw;
    display: flex;
    justify-content: center
}

.overviewColumn.right {
    position: absolute;
    top: 0;
    height: 100%;
    right: 0;
    z-index: 3;
    width: 7.75vw;
    display: flex;
    justify-content: center
}

.oNavigation.left {
    padding-right: 13px;
    padding-left: 27px;
    margin-top: 100px;
    transform: translateX(-10px)
}

.oNavigation.right {
    margin-top: 100px;
    transform: translateX(10px)
}

.oNavigation.left .oArrow {
    transform: rotateZ(-135deg);
    left: -12px
}

#detailTop {
    padding-top: 120px
}

#detailTop>.mainContainer {
    display: flex
}

#detailTop .oLeftBar,
.oLeftBar.wide {
    width: 17.5vw;
    max-width: 330px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start
}

#detailTopTarget {
    position: absolute;
    top: 100vh
}

#detailTopContent {
    flex: 1
}

#detailSectionTitle {
    margin-left: 2.5vw;
    margin-top: 100px
}

#detailSectionTitle .detailTitle {}

#detailTopImgContainer {
    height: 75vw;
    width: calc(100% + 150px);
    transform: scale(.95);
    opacity: 0
}

#detailTopImgContainer.show {
    transform: none;
    opacity: 1
}

#detailTopImg {
    height: 100%;
    will-change: transform;
    transform: scale(.8);
    transform-origin: top
}

#detailImgBlock {
    transform: scale(1.25);
    height: 100%;
    overflow: hidden;
    transform-origin: top
}

#detailTopLayer {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    opacity: 0
}

#detailTopLayer .tl {
    opacity: .6
}

#detailTopLayer .tl._1 {
    top: 20vw;
    left: -10vw
}

html[lang=de] #detailTopLayer .tl._1.special {
    left: -16vw;
    font-size: 6vw
}

#detailTopLayer .tl._2 {
    top: 36vw;
    right: 32vw;
    width: auto;
    left: auto;
    text-align: left;
    white-space: nowrap
}

#detailTopLayer .tl._2.seascapeSpecial {
    top: 55vw;
    right: 45vw
}

#detailTopLayer .tl._3 {
    top: 0;
    right: 12.5vw;
    left: auto;
    font-weight: 300;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%
}

#detailTopLayer .tl._3 span {
    display: block;
    white-space: nowrap
}

.textLayer {
    will-change: transform;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.tl {}

#detailIntroTitle,
#detailIntroSubtitle {
    margin-left: 2.5vw
}

#detailIntroSubtitle {
    text-transform: uppercase
}

.blockTitle span {
    padding-bottom: .5vw
}

#detailText {
    margin-left: 2.5vw;
    margin-bottom: 7.5vw;
    width: 30vw
}

#detailTextSpecial {
    width: 30vw;
    margin-left: 2.5vw
}

#detailSpaces {
    height: 200vh
}

#detailSpaces .introPic.covered:after,
#detailInfo .introPic.covered:after {
    background: #eae6e0
}

#detailSpaces .introPic {
    margin-top: -2.5vw
}

.fullPicture {
    width: 100%;
    height: 200vh
}

.simplePicture {
    width: 100%;
    height: 100vh
}

#fullPictureTarget,
#fullPictureTarget2,
#fullPictureTarget3,
#fullPictureTarget4 {
    height: 200vh;
    position: absolute;
    top: 0
}

.fullPictureSticky {
    height: 100vh
}

.fullPictureBlock,
.fullPictureBlock2,
.fullPictureBlock3,
.fullPictureBlock4 {
    transform: scale(.8)
}

.fullPictureContainer,
.fullPictureContainer2,
.fullPictureContainer3,
.fullPictureContainer4 {
    transform: scale(1.25)
}

#detailSpaces .mainContainer {
    display: flex;
    flex-direction: column
}

#detailSpacesContainer {
    position: absolute;
    width: calc(100% - 17.5vw);
    align-self: flex-end;
    top: calc(100% - 4vw)
}

#detailSpacesBackground {
    height: 100%;
    position: absolute;
    width: 100%
}

#detailSpacesContent {
    display: flex;
    flex-direction: column
}

#detailSpaces #detailSnippets {
    margin-top: 2.5vw;
    text-align: right
}

#detailSpacesContent .tech ._2 {
    margin-top: 2.5vw
}

#detailSpaces #detailSnippets .snippet._2:last-child {
    font-size: 25px
}

#detailSpacesContent .slidingTitleBig,
.locationNameContent .slidingTitleBig {
    position: relative;
    top: 3.3vw;
    margin-left: 2.5vw;
    margin-top: -3.3vw
}

#detailServices {
    margin-top: 24vw
}

#detailServices .mainContainer {}

.listTitle {
    font-size: 6.5vw;
    font-family: geometria;
    font-weight: 300;
    margin-left: -3.1vw
}

.listText {
    margin-left: 6vw
}

.listItem {
    font-family: LM Roman;
    font-size: 2.2vw;
    margin-top: 1vw
}

#detailServicesContent {
    display: flex;
    justify-content: space-between
}

#detailServicesLeft {
    width: 60vw
}

#detailServicesPic {
    width: 25vw;
    height: 40vw
}

.sliderContainer {
    height: 100%;
    z-index: 0;
    position: relative
}

.slideContainer {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    will-change: transform;
    height: 100%
}

.slideContainer img {
    will-change: auto
}

.gallery {
    height: 100%;
    width: 100%
}

.galleryContainer {
    display: flex;
    height: 100vh
}

.loading {
    position: absolute;
    left: -100px;
    top: -25px;
    display: none
}

.loading svg {
    stroke-dasharray: 87px;
    animation: spinning 2s cubic-bezier(.575, .005, .285, 1.005)infinite
}

.loading svg circle {
    stroke: #fff
}

.loading.blue svg circle {
    stroke: #6c96bc
}

@keyframes spinning {
    0% {
        stroke-dashoffset: 87
    }

    50% {
        stroke-dashoffset: 174
    }

    100% {
        stroke-dashoffset: 261
    }
}

.sliderPreview {
    position: absolute;
    width: 330px;
    bottom: -40px;
    right: 150px
}

.previewText {
    height: 40px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    font-family: geometria;
    font-size: 13px
}

.previewContainer {
    height: 185px;
    margin-bottom: 40px
}

#styleDetails {}

#styleDetails .mainContainer {
    display: flex;
    align-items: center;
    flex-direction: column;
    padding-bottom: 6vw
}

.styleBackground {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1
}

#styleDetailsTitle {}

#styleDetailsTitle .slidingTitleSmall {
    margin-top: -6.5vw;
    z-index: 1;
    align-self: center
}

#styleDetailsContainer {
    width: 100vw
}

#styleDetailsScroller {
    display: flex;
    animation: styleDetailScroll 55s linear infinite
}

@keyframes styleDetailScroll {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(-253.5%)
    }
}

.styleDetail {
    margin-left: 2.5vw;
    min-width: 17vw
}

#styleDetailsLogos {
    display: flex;
    flex-wrap: wrap;
    padding: 0 5vw
}

.styleLogo {
    width: 33.333%;
    display: flex;
    justify-content: center;
    align-items: center
}

.styleLogo.smaller {
    width: 25%;
    flex: 1
}

.styleLogo.smaller.left {
    margin-left: 5%
}

.styleLogo.smaller.right {
    margin-right: 5%
}

.styleLogo img {
    width: auto
}

#others {
    position: relative
}

#others .layerUpdate {
    top: -5vw
}

#others .mainContainer {
    display: flex
}

#otherTarget {
    position: absolute
}

.otherItemPic {
    width: 50vw
}

.otherItemPic img,
.listItemTitle,
.listItemSubtitle {
    will-change: transform
}

#otherFixed {
    margin-left: 5vw;
    margin-top: -2vw
}

#otherFixed .blockTitle {
    color: #1e2949;
}

#detailExpandableText {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-top: -23vw;
    position: relative;
    top: -2.5vw
}

#detailExpandableText .text {
    max-width: 700px
}

.more p {
    display: flex;
    align-items: flex-end;
    flex-direction: column
}

.more p>span {
    margin-top: 2.5vw;
    margin-right: 5vw
}

#detailSnippets {
    align-self: flex-end;
    margin-right: 2.5vw;
    flex-direction: column;
    display: flex
}

#detailInfo #detailSnippets .snippet._2,
#detailInfo #detailSnippets .snippet._4,
#detailInfoSecond #detailSnippets .snippet._2,
#detailInfoSecond #detailSnippets .snippet._4 {
    font-size: 25px;
    margin-top: 0
}

#detailSnippets .snippet._2,
#detailSnippets .snippet._4 {
    margin-top: 2.5vw
}

.snippet.no_margin {
    margin-top: 0 !important
}

#detailComposition,
#detailBody,
.infoBlock {
    flex-direction: column
}

#detailComposition .mainContainer,
.infoBlock .mainContainer {
    display: flex;
    align-items: center;
    justify-content: space-between
}

#detailComposition.seascape .mainBackground {
    top: 5vw
}

.compositionPicContainer {
    position: relative;
    margin-left: 5vw;
    margin-right: 5vw;
    height: 39.5vw;
    width: 56vw;
    margin-bottom: 5vw
}

.compositionPic {
    height: 100%;
    width: 100%
}

.compositionLayer {
    position: absolute
}

.compositionPicContainer .tl._3 {
    top: 10.5vw;
    left: 0
}

.compositionPicContainer .tl._1 {
    top: auto;
    bottom: 7.8vw;
    left: 19vw;
    display: flex
}

#detailBody .mainContainer>.introPic {
    margin-top: -2.5vw
}

.detailBodyContent {
    display: flex;
    justify-content: space-between;
    padding-left: 5vw
}

#detailBody .detailBodyContent.scheme1 .blockTitle {
    margin-left: 13vw
}

#detailBody .detailBodyContent.scheme1 .left {
    width: 60%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    max-width: 650px
}

.verticalPic {
    width: 25vw;
    height: 40vw
}

#detailBody .galleryContainer {
    width: 56.771vw;
    height: 40vw
}


.detailBodyContent.scheme2>.right {
    flex: 1;
    display: flex;
    align-items: center;
    padding-left: 5vw;
    box-sizing: border-box;
    min-width: 300px
}

#detailBody .detailBodyContent.scheme3 .left {
    max-width: 590px;
    width: 40vw
}

.detailBodyContent.scheme3 .blockTitle {
    margin-left: 13vw
}

.detailBodyContent.scheme4 {
    padding-right: 5vw;
    flex-direction: column
}

.menu {
    display: flex
}

.menuBlock,
.menuPic {
    width: 34vw;
    height: 34vw
}

.menuBlock+.menuPic,
.menuPic+.menuBlock,
.menuBlock+.menuBlock {
    margin-left: 30px
}

.menu+.menu {
    margin-top: 30px
}

.menuBlock {
    display: flex;
    align-items: flex-end;
    position: relative;
}

.menuBlock::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.3);
    z-index: 1;
}

.menuLayout {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 2.5vw;
    width: 100%;
    z-index: 10;
}

.menuLayout .slidingTitleBig {
    position: relative;
    top: 1.3vw
}

.menuBlock.small .slidingTitleBig {
    font-size: 3.5vw;
    top: 1.9vw
}

.menuType {
    font-family: geometria;
    font-weight: 300;
    font-size: 3.5vw;
    opacity: .6;
    position: absolute;
    top: 30px;
    right: -15px;
    z-index: 10;
}

.menuBlock.small .menuType {
    font-size: 3vw
}

.menuType span {
    writing-mode: tb;
    transform: rotate(180deg);
    text-align: right
}

.menu._2 .menuType {
    opacity: 1
}

.menuBlock.small .oButton {
    position: absolute;
    top: 78%;
    left: 2.5vw
}

.menuBlock .oButton {
    position: absolute;
    top: 70%;
    left: 2.5vw;
    z-index: 10;
}

.infoBlock .mainBackground {
    top: 5vw;
    height: calc(100% - 10vw)
}

img.ruinart {
    width: 170px
}

.outerBlock {
    width: 40vw;
    position: relative;
    padding: 5vw;
    box-sizing: border-box
}

.outerBorders {
    position: absolute;
    width: 100%;
    height: calc(100% + 2vw);
    top: -1vw;
    left: 0;
    pointer-events: none
}

.outerBorders * {
    position: absolute
}

.outerBorders .top {
    height: 1vw;
    width: 100%
}

.outerBorders .bottom {
    height: 1vw;
    width: 100%;
    bottom: 0
}

.outerBorders .left {
    height: 100%;
    width: 1vw
}

.outerBorders .right {
    height: 100%;
    width: 1vw;
    right: 0
}

.outerContent {}

.outerRow {
    display: flex;
    align-items: center
}

.outerPic {
    width: 250px;
    display: flex;
    justify-content: center
}

.outerDescription {
    font-family: geometria;
    font-size: 16px;
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: flex-start
}

.outerDescription .outerTitle {
    font-weight: 600
}

.outerDescription a {
    display: block;
    margin-top: 5px;
    text-decoration: underline
}

.blockText.ruinart {
    max-width: 500px
}

.outerBlock.ruinart .otherContent {}

.outerBlock.ruinart .outerRow {
    flex-direction: column
}

.outerBlock .outerRow .outerDescription .action:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #333;
    transform: scale(0, 1);
    transform-origin: left;
    -webkit-transition: -webkit-transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1)
}

.outerBlock .outerRow:hover .action:after {
    transform: scale(1)
}

.outerBlock.ruinart .outerDescription {
    text-align: center;
    align-items: center
}

.outerBlock.ruinart .outerPic {
    width: 300px
}

.outerBlock.cnd {
    height: 20vw;
    display: flex;
    justify-content: center;
    align-items: center
}

.outerBlock.ab {
    height: 25vw;
    display: flex;
    justify-content: center;
    align-items: center
}

.outerBlock.cnd .outerPic {
    width: 148px
}

.outerBlock.ab .outerPic {
    width: 100%;
    max-width: 600px
}

.outerBlock.cnd .outerDescription {
    margin-left: 15px
}

.detailBodyContent.profile {
    padding-left: 0;
    flex-direction: column;
        margin-top: 2vw;
}

.profileTitle {
    display: inline-block;
    font-size: 5vw;
    font-weight: 300;
    font-family: geometria;
    margin-left: -3.1vw
}

.profileContent {
    display: flex;
    justify-content: space-between
}

.profileInfo {
    flex: 1
}

.vCenter {
    display: flex;
    align-items: center
}

.profilePic {
    width: 25vw;
    height: 40vw;
    margin-left: 5vw;
    margin-top: -15vw;
    position: relative;
    top: 8vw
}

#detailBody .detailBodyContent .left .profileText {
    max-width: 650px
}

.profileScheme .mainBackground {
    height: calc(100% + 3vw)
}

.scheme1.simpler .text {
    margin-left: 10vw
}

.backgroundScheme .mainContainer {
    display: flex;
    margin-top: 10vw
}

.taste .backgroundScheme .mainBackground {
    height: calc(100% - 5vw)
}

.taste .compositionPicContainer {
    margin-bottom: 0
}

.unlimited {
    max-width: none !important
}

#detailBody.taste .mainContainer:last-child .scheme1 .left {
    justify-content: flex-start
}

.compositionPicContainer.reversed .tl._3 {
    right: 0;
    left: auto;
    top: 8vw;
    opacity: .9
}

.compositionPicContainer.reversed .tl._1 {
    left: -7.5vw
}

#detailBody .mainContainer.introRight {
    display: flex;
    flex-direction: column
}

#detailBody .mainContainer.introRight>.introPic {
    align-self: flex-end
}

#detailBody .detailBodyContent .left.full {
    width: 56.771vw;
    max-width: none
}

#detailTopSecond {
    padding-top: 120px;
    flex-direction: column
}

#detailTopSecond>.mainContainer {
    display: flex
}

#detailTopSecond .oLeftBar {
    width: 17.5vw;
    max-width: 330px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start
}

.boatBody {
    margin-top: 24vw
}

.boatBody .detailBodyContent.scheme1 {
    padding-left: 0
}

#detailSpaces+#detailBody {
    margin-top: 24vw
}

.locationNameContainer {
    position: absolute;
    width: calc(100% - 17.5vw);
    align-self: flex-end;
    top: calc(100% - 4vw)
}

.locationNameBackground {
    height: 100%;
    position: absolute;
    width: 100%
}

.locationNameContent {
    display: flex;
    flex-direction: column
}

.locationContainer {
    display: flex;
    flex-direction: column;
    position: relative
}

.locationContainer+.mainContainer {
    margin-top: 17vw
}

.introPic.down {
    margin-top: 10vw
}

.formLayer {
    display: flex;
    flex-direction: column;
    min-height: 33vw
}

#formTitle {
    margin-top: -2.8vw;
    margin-left: 25px
}

#formTitle .slidingTitleBig {
    margin-top: -0.5vw;
}

#formTitle .slidingTitleBig+.slidingTitleBig {
    margin-top: -5vw
}

.formContainer {
    margin-right: 0vw;
    margin-left: 4vw;
    width: 50%;
    margin-top: -30px;
}

.formContent {
    display: flex
}

.formInfo.left {
    width: 45%;
    max-width: 600px
}

.formDescription {
    margin-left: 5vw;
    font-family: Geometria;
    font-size: 1.3vw;
    line-height: 2.5vw;
    font-weight: 300;
    color: #ffffff;
}

.wpforms-field-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.formContainer .wpforms-confirmation-container {
    color: #fff;
    position: absolute;
    left: 0;
    top: 14vw;
    background: #6e6259;
    height: calc(100% - 14vw);
    pointer-events: none;
    margin-left: 5vw;
    font-family: Geometria;
    font-size: 1.3vw;
    line-height: 2.5vw;
    font-weight: 300;
    width: 45%;
    max-width: 600px
}

.formField.readOnly textarea {
    display: none
}

.formField.half {
    width: 65%
}

.formField {
    width: 100%;
    margin-top: 30px
}

.formField.noMargin {
    margin-top: 0
}

.formField input {
    background: 0 0;
    border: none;
    border-bottom: 1px solid #b4a89f;
    padding-bottom: 5px;
    font-family: Geometria;
    font-size: 16px;
    color: #fff
}

.formField select {
    background: 0 0;
    border: none;
    border-bottom: 1px solid #b4a89f;
    padding-bottom: 3px;
    font-size: 16px;
    font-family: Geometria;
    color: #fff;
    margin-top: -3px
}

.formField textarea {
    background: 0 0;
    border: 1px solid #b4a89f;
    padding: 5px;
    font-size: 15px;
    font-family: Geometria;
    color: #fff
}

.wpforms-container label {
    font-family: Geometria;
    color: #fff;
    font-size: 16px;
    font-weight: 400 !important
}

/* .formContainer.dark .wpforms-container label,
.formContainer.dark .formField textarea,
.formContainer.dark .formField select,
.formContainer.dark .formField input,
.formContainer.dark input::-webkit-input-placeholder,
.formContainer.dark textarea::-webkit-input-placeholder,
.formContainer.dark .wpforms-field-description {
    color: #000000;
} */

.formContainer.dark input,
.formContainer.dark select {
    border-bottom: 1px solid #b6ada5
}

.formContainer.dark .formField textarea {
    border: 1px solid #b6ada5;
}

.formContainer.dark .wpforms-confirmation-container {
    background: #eae6e0;
    color: #6e6259;
    top: 19vw;
    height: calc(100% - 19vw)
}

.formField select option {
    color: #6e6259
}

.formField.wpforms-field-checkbox.multiple {
    display: flex;
    justify-content: space-between
}

.formField.wpforms-field-checkbox.multiple ul {
    width: 45%
}

.formField.wpforms-field-checkbox.multiple ul li {
    margin-top: 10px
}

.formField.wpforms-field-checkbox.multiple ul li:first-child {
    margin-top: 0
}

.formField.wpforms-field-checkbox input[type=checkbox] {
    display: none
}

.formField.wpforms-field-checkbox input[type=checkbox]+label {
    padding-left: 30px;
    background-repeat: no-repeat;
    background-position: -4px -1px;
    padding-bottom: 2px;
    padding-top: 2px;
    cursor: pointer;
    background-image: url(assets/images/checks.png)
}

.formField.wpforms-field-checkbox input[type=checkbox]:checked+label {
    background-position: -4px -26px
}

.formField.readOnly textarea {}

.formField.multiple {}

.formField.multiple ul {}

.formField.right {
    display: flex;
    justify-content: flex-end
}

.formField.right label.wpforms-error {
    left: auto;
    right: calc(45% - 5px);
    transform: translateX(100%)
}

.formField.right input,
.formField.right textarea {
    width: 45%
}

::-webkit-input-placeholder {
    font-family: Geometria;
    color: #fff;
    font-size: 15px;
    padding-left: 2px
}

.formField textarea::-webkit-input-placeholder {
    padding-left: 0
}

.wpforms-field-description {
    font-family: Geometria;
    color: #fff;
    font-size: 14px !important;
    font-weight: 400 !important;
    margin-top: 15px !important;
    max-width: 100%;
    border: 1px solid #999;
    padding: 10px !important;
    box-sizing: border-box;
    background: 0 0 !important
}

.wpforms-container .wpforms-field input.wpforms-error,
.wpforms-container .wpforms-field input.user-invalid,
.wpforms-container .wpforms-field textarea.user-invalid,
.wpforms-container .wpforms-field select.wpforms-error,
.wpforms-container .wpforms-field select.user-invalid,
.wpforms-container .wpforms-field.wpforms-has-error .choices__inner {
    border: none !important;
    border-bottom: 1px solid #c00 !important
}

.wpforms-container .wpforms-field textarea.wpforms-error {
    border: 1px solid #c00 !important
}

.wpforms-container label.wpforms-error {
    font-size: 12px !important;
    position: absolute;
    left: 5px;
    bottom: -7px
}

.wpforms-submit-container {
    display: flex;
    /* justify-content: flex-end; */
    padding-right: 50% !important;
    margin-top: 15px;
    width: 100%
}

.wpforms-submit {
    font-family: Geometria;
    padding: 0 12px;
    background: #fff !important
}

.wpforms-container input.wpforms-field-medium,
.wpforms-container select.wpforms-field-medium,
.wpforms-container .wpforms-field-row.wpforms-field-medium {
    max-width: none !important
}

.wpforms-submit-container .oButton.bordered {
    border: none
}

.experienceConditions {
    padding: 10vw 5vw
}

.newsletterForm {
    margin-top: 15px;
    font-family: Geometria
}

.newsletterFormTitle {
    color: #fff;
    font-size: 15px;
    font-weight: 300
}

.newsletter_input {
    margin-top: 10px;
    border-bottom: 1px solid #fff;
    padding-bottom: 4px !important;
    width: 40%
}

.newsletter_input.full {
    width: 100%
}

.newsletter_input.wpforms-has-error {
    border-bottom: 1px solid #900
}

.wpforms-container .wpforms-field.newsletter_input input.wpforms-error {
    border-bottom: none !important
}

.nLangPref {
    display: flex;
    align-items: flex-start;
    padding-bottom: 4px
}

.newsletter_input label {
    color: #fff;
    font-size: 13px;
    display: inline;
    padding: 1px 2px;
    height: auto;
    margin-top: 15px
}

.newsletter_input label.wpforms-error {
    display: none !important
}

.newsletter_input.nLangPref label {
    color: #fff;
    font-size: 13px;
    display: inline;
    height: 16px;
    padding: 1px 2px;
    margin-top: 0
}

.newsletter_input input {
    background: 0 0;
    border: none;
    color: #fff;
    font-family: geometria;
    font-size: 13px;
    width: 100%;
    display: block
}

.newsletter_input select {
    background: 0 0;
    border: none;
    color: #fff;
    font-family: geometria;
    font-size: 13px;
    padding-bottom: 0;
    width: 54px;
    display: block
}

html[lang=it] .newsletter_input select {
    width: 70px
}

html[lang=it] .newsletter_input.title {
    width: 80px
}

.newsletter_input.nLangPref select {
    width: 80px !Important
}

.newsletter_input select option {
    color: #000
}

.radio li {
    color: #333;
    font-size: 12px;
    position: relative;
    width: 100%;
    height: 18px;
    margin-top: 13px !important;
    float: left
}

.radio li>input {
    padding: 0;
    margin: 0;
    height: 16px;
    width: 16px;
    float: left;
    position: absolute;
    left: 0;
    opacity: 0
}

input[type=radio],
input[type=checkbox] {
    cursor: pointer
}

.radio li:not(#foo)>input[type=radio]+label {
    background-position: 0 -7px
}

.radio li:not(#foo)>input+label {
    background: url(assets/images/radio_input_white.png)0 -1px no-repeat;
    height: 16px
}

.radio li>label {
    padding: 0 0 1px 28px;
    float: left;
    letter-spacing: 0;
    line-height: 15px;
    font-family: Geometria;
    font-size: 13px;
    color: #fff;
    display: block;
    margin-top: 0
}

.radio li:not(#foo)>input[type=radio]:hover+label,
.radio li:not(#foo)>input[type=radio]:focus+label,
.radio li:not(#foo)>input[type=radio]+label:hover {
    background-position: 0 -32px
}

.radio li:not(#foo)>input[type=radio]+label {
    background-position: 0 -7px
}

.radio li:not(#foo)>input[type=radio]:hover:checked+label,
.radio li:not(#foo)>input[type=radio]:focus:checked+label,
.radio li:not(#foo)>input[type=radio]:checked+label:hover,
.radio li:not(#foo)>input[type=radio]:focus:checked+label {
    background-position: 0 -57px
}

.radio li:not(#foo)>input[type=radio]:checked+label {
    background-position: 0 -57px
}

.radio li:not(#foo)>input[type=checkbox]+label {
    background-position: 0 -7px
}

.radio li:not(#foo)>input+label {
    background: url(assets/images/radio_input_white.png)0 -1px no-repeat;
    height: 16px
}

.radio li:not(#foo)>input[type=checkbox]:hover+label,
.radio li:not(#foo)>input[type=checkbox]:focus+label,
.radio li:not(#foo)>input[type=checkbox]+label:hover {
    background-position: 0 -32px
}

.radio li:not(#foo)>input[type=checkbox]+label {
    background-position: 0 -7px
}

.radio li:not(#foo)>input[type=checkbox]:hover:checked+label,
.radio li:not(#foo)>input[type=checkbox]:focus:checked+label,
.radio li:not(#foo)>input[type=checkbox]:checked+label:hover,
.radio li:not(#foo)>input[type=checkbox]:focus:checked+label {
    background-position: 0 -57px
}

.radio li:not(#foo)>input[type=checkbox]:checked+label {
    background-position: 0 -57px
}

.newsletter_input.radio.wpforms-has-error ul li label {
    background-position: 0 -82px !important
}

.radio.wpforms-has-error li:not(#foo)>input[type=checkbox]:hover+label,
.radio.wpforms-has-error li:not(#foo)>input[type=checkbox]+label:hover {
    background-position: 0 -107px !important
}

.radio.wpforms-has-error li:not(#foo)>input[type=checkbox]:checked+label {
    background-position: 0 -157px !important
}

.newsletter_input input:-webkit-autofill,
.newsletter_input input:-webkit-autofill:hover,
.newsletter_input input:-webkit-autofill:focus,
.newsletter_input input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #a8a297 inset !important;
    -webkit-text-fill-color: white !important
}

.newsletter_input input::placeholder {
    color: #fff;
    opacity: 1;
    font-family: Geometria;
    color: #fff;
    font-size: 13px;
    padding-left: 2px
}

.newsletter_input input:-ms-input-placeholder {
    color: #fff;
    font-family: Geometria;
    color: #fff;
    font-size: 13px;
    padding-left: 2px
}

.newsletter_input input::-ms-input-placeholder {
    color: #fff;
    font-family: Geometria;
    color: #fff;
    font-size: 13px;
    padding-left: 2px
}

.newsletter_input.title {
    width: 59px
}

.newsletter_input .checkbox_container {
    width: 100%;
    margin-top: 0;
    margin-left: 0;
    float: inherit
}

.newsletter_input .checkbox_label {
    color: #fff;
    margin-left: 0;
    text-transform: uppercase
}

.newsletter_input .radio li:not (#foo)>input+label {
    background: url(assets/images/radio_input_white.png)0 -5.4px no-repeat;
    height: 14px;
    font-size: 14px;
    font-weight: 300;
    background-size: 14px;
    line-height: 14px
}

.newsletter_input .radio li:not (#foo)>input[type=checkbox]:focus+label {
    background-position: 0 -5.4px
}

.newsletter_input .radio li:not (#foo)>input[type=checkbox]:hover+label,
.radio li:not (#foo)>input[type=checkbox]+label:hover {
    background-position: 0 -26px
}

.newsletter_input .radio li:not (#foo)>input[type=checkbox]:checked+label {
    background-position: 0 -47px !important
}

.newsletter_controls .form_reset p {
    font-family: notera;
    letter-spacing: 0;
    font-size: 40px;
    color: #a7fffe;
    line-height: inherit
}

.newsletter_controls .form_submit p {
    font-family: notera;
    letter-spacing: 0;
    font-size: 40px;
    color: #fff;
    line-height: inherit;
    margin-right: 0
}

.newsletterForm .wpforms-confirmation-container {
    font-family: notera;
    letter-spacing: 0;
    font-size: 40px;
    color: #fff;
    line-height: inherit;
    margin-right: 0;
    margin-top: 8px
}

.newsletterForm .wpforms-container {
    margin-bottom: 0
}

.formText {
    color: #fff;
    margin-top: 30px;
    font-weight: 300;
    font-size: 13px;
    line-height: 23px
}

.newsletter_input.radio {
    border: none;
    margin-top: 0
}

.privacy>textarea {
    width: 98%;
    border: none;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 20px;
    font-family: Geometria;
    text-align: left;
    background: 0 0;
    height: 35px;
    margin-top: 6px;
    resize: none
}

.newsletter_input.privacy {
    color: #fff;
    border-bottom: none;
    display: flex;
    flex-direction: column;
    padding: 0 !important
}

.newsletter_input.privacy ul {
    order: 1
}

.newsletter_input.privacy label {
    color: #fff;
    font-size: 13px
}

.newsletter_input .wpforms-field-description {
    order: 0;
    font-size: 12px !important;
    color: #fff;
    line-height: 15px;
    padding: 5px !important;
    border: 1px solid #fff;
    height: 70px;
    overflow: auto;
    margin-top: 10px !important
}

.newsletter_input .wpforms-field-description::-webkit-scrollbar {
    width: 0
}

.newsletter_input .wpforms-required-label {
    color: #fff !important
}

.newsletterForm .wpforms-submit {
    font-family: notera;
    letter-spacing: 0;
    font-size: 40px;
    color: #fff;
    line-height: inherit;
    background: 0 0 !important;
    margin-right: 0;
    border: none !important;
    cursor: pointer
}

.newsletterForm .wpforms-submit-container {
    padding-right: 0 !important
}

#popClose {
    top: 0;
    right: 0;
    width: 23px;
    height: 23px;
    position: absolute;
    transform: rotateZ(45deg);
    padding: 10px;
    cursor: pointer
}

.newsletter_input.privacy textarea {
    font-size: 12px;
    color: #fff;
    line-height: 12px
}

.newsletter_controls {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px
}

#popLayer .menuCloseLine {
    background: #fff
}

#popLayer .menuCloseLine._1 {
    top: 21px;
    position: absolute;
    width: 23px;
    height: 1px
}

#popLayer .menuCloseLine._2 {
    height: 23px;
    width: 1px;
    left: 21px;
    position: absolute;
    top: 10px
}

#newsletterBody .confirm,
#newsletterBody .deleted,
#newsletterBody .already {
    display: none
}

.pressButtons {
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.pressButton {
    margin-top: 20px;
    position: relative;
    cursor: pointer
}

.pressButton:first-child {
    margin-top: 0
}

.pressButton:after {
    content: '';
    position: absolute;
    bottom: .1vw;
    left: 0;
    width: 100%;
    height: 1px;
    background: #6f6359;
    transform: scale(0, 1);
    transform-origin: left;
    -webkit-transition: -webkit-transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1)
}

.pressButton.active:after,
.pressButton:hover:after {
    transform: scale(1)
}

.pressList {
    align-self: flex-end;
    width: calc(100% - 17.5vw)
}

#pressBody {
    padding-top: 5vw
}

#pressContainer {
    display: flex
}

#pressContainer #detailSnippets {
    align-self: flex-start
}

#pressTarget {
    height: calc(100% - 5vw);
    position: absolute;
    top: 0
}

.pressContent .locationNameContainer {
    top: 0
}

.pressContent .locationContainer+.locationContainer {
    margin-top: 21vw
}

#pressList {
    flex: 1
}

#text .oLeftBar {
    width: 17.5vw;
    max-width: 330px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start
}

#bodyIndex .mainContainer,
#bodyContent .mainContainer {
    display: flex
}

.textIndexContainer,
.bodyParagraphContainer {
    flex: 1;
    margin-left: 2.5vw
}

.textIndex {
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.textIndexItem {
    margin-top: 15px;
    cursor: pointer;
    position: relative
}

.textIndexItem:after {
    content: '';
    position: absolute;
    transform: scale(0, 1);
    transform-origin: left;
    -webkit-transition: -webkit-transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 1500ms cubic-bezier(.19, 1, .22, 1), opacity 1e3ms cubic-bezier(.19, 1, .22, 1);
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #6e6259
}

.textIndexItem:hover:after {
    transform: scale(1)
}

.bodyParagraphTitle {
    margin-left: -2.5vw;
    display: flex
}

.bodyParagraphTitle h2 {
    margin-left: 2.5vw;
    font-size: 2vw;
    font-family: LM Roman Dunhill;
    position: relative;
    top: 1.15vw
}

.contactsContainer {
    display: flex
}

.mailBlock {
    display: flex;
    flex-direction: column
}

.overlay {
    position: fixed;
    height: 100vh;
    width: 100%;
    top: 0;
    left: 0;
    align-items: center;
    justify-content: center;
    z-index: 3;
    display: none
}

.overlay.hidden {
    transform: scale(.99);
    opacity: 0
}

.overlay.active {
    display: flex
}

.overlay .mainBackground {
    border-radius: 25px;
    left: 10px;
    top: 10px;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
}

.overlay .mainBackground.hidden {
    transform: scale(.99);
    opacity: 0
}

.overlayContainer {
    max-width: 1024px;
    max-height: 770px;
    width: 70%;
    height: calc(100% - 60px);
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-around
}

.overlayLabel {
    width: 18vw;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.overlayTitle {}

.ovSmall {
    font-family: geometria;
    font-size: 18px
}

.ovPeople {
    font-size: 2.3vw;
    font-family: Geometria;
    font-weight: 300;
    will-change: transform
}

.overlayClose {
    position: absolute;
    width: 38px;
    height: 38px;
    top: 25px;
    right: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer
}

.overlayClose:hover .overlayCloseInner {
    transform: scale(1.5);
    -webkit-transition: -webkit-transform 600ms cubic-bezier(.19, 1, .22, 1), opacity 400ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 600ms cubic-bezier(.19, 1, .22, 1), opacity 400ms cubic-bezier(.19, 1, .22, 1)
}

.overlayClose .circlePath {
    width: 38px;
    height: 38px;
    transform: none;
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0
}

.overlayClose .circlePath circle {
    stroke-dasharray: 125px;
    stroke-dashoffset: 125px
}

.show .overlayClose .circlePath circle,
.show.overlayClose .circlePath circle {
    stroke-dashoffset: 0
}

.overlayCloseInner {
    width: 8px;
    height: 8px;
    position: relative;
    transform: scale(0)
}

.show .overlayCloseInner {
    transform: scale(1)
}

.overlayCloseInner:before {
    content: '';
    width: 12px;
    height: 1px;
    background: #ffffff;
    position: absolute;
    transform: rotate(45deg);
    transform-origin: top left;
    left: 0;
}

.overlayCloseInner:after {
    content: '';
    width: 12px;
    height: 1px;
    background: #ffffff;
    position: absolute;
    transform: rotate(-45deg);
    transform-origin: top right;
    right: 0;
}

.overlayClose .fillColor {
    stroke: #ffffff;
}

.ovGroup {
    display: flex;
    padding-bottom: 30px;
    position: relative;
    flex-direction: column;
    align-items: flex-start
}

#bookOverlay .ovGroup {
    align-items: center;
    flex-direction: row;
    padding-bottom: 10px
}

.ovGroup.leaders {
    margin-top: -25px
}

.ovGroup.leaders .ovSmall {
    padding-top: 16px;
    line-height: 10px;
    padding-bottom: 6px
}

.ovGroup.leaders img {
    width: 146px;
    top: -14px;
    position: relative;
    margin-left: 7px
}

.ovGroup input,
.ovGroup select {
    border: none;
    background: 0 0;
    margin-left: 35px;
    font-size: 35px;
    letter-spacing: 3px;
    height: 100%
}

.ovGroup select option {
    font-size: 20px
}

.ovGroup:after {
    content: '';
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff;
    opacity: .6;
    transform: scale(0, 1);
    transform-origin: left;
    -webkit-transition: -webkit-transform 2e3ms cubic-bezier(.19, 1, .22, 1), opacity 2e3ms cubic-bezier(.19, 1, .22, 1);
    transition: transform 2e3ms cubic-bezier(.19, 1, .22, 1), opacity 2e3ms cubic-bezier(.19, 1, .22, 1)
}

.ovGroup:last-child:after {
    content: none
}

.show .ovGroup:after {
    transform: scale(1)
}

.ovGroup select {
    margin-left: -40px;
    padding-left: 75px
}

#bookSubmit {
    align-self: center;
    justify-content: center;
}

.inquire-container {
    height: calc(80% - 60px) !important;
}

.icoContainer {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px
}

.calendarIco {
    width: 100%
}

.downArrow {
    display: block;
    width: 15px;
    height: 15px;
    border-bottom: 2px solid #fff;
    border-left: 2px solid #fff;
    transform: translateY(-6px)rotateZ(-45deg)
}

.ovGroup select::-ms-expand {
    display: none
}

.ovGroup select {
    -moz-appearance: none;
    -webkit-appearance: none
}

#thanksOverlay .overlayContainer {
    max-height: 600px
}

@media all and (max-width:1440px) {
    .overviewText {
        max-width: 520px;
        margin-left: 0
    }

    #overviewIntroRight {
        margin-right: -100px
    }

    #overviewIntroPic,
    #overviewItemPicsContainer {
        width: calc(15vw + 40vh);
        height: calc(15vw + 40vh)
    }

    .overviewIntroLeft {
        width: 60%
    }

    .outerBlock {
        padding: 5vw 2.5vw
    }

    .text {
        font-size: 18px;
        line-height: 32px
    }

    .text.big {
        font-size: 22px;
        line-height: 40px
    }

    .text.tech.smaller {
        font-size: 18px
    }

    .text.small,
    #overviewSnippetContainer .snippet:last-child {
        font-size: 16px;
        line-height: 28px
    }

    #overviewIntroRight .oButton {
        margin-right: -20px;
        bottom: 0
    }

    .text.tech {
        font-size: 26px
    }

    #detailInfo #detailSnippets .snippet._2,
    #detailInfo #detailSnippets .snippet._4 {
        font-size: 20px
    }

    #overviewItemRight {
        padding-bottom: 12vh
    }

    #overviewItems .detailSubtitle {
        writing-mode: horizontal-tb;
        transform: none;
        max-height: 50vh;
        text-align: left;
        font-size: 22px
    }

    #overviewItemRight {
        padding-bottom: 0;
        height: calc(15vw + 40vh)
    }
}

@media all and (max-width:1279px) {
    #overviewIntroLeft {
        width: 70%
    }

    #overviewIntroRight {
        margin-left: 5vw;
        margin-right: -50px;
        justify-content: flex-end;
        display: flex;
        align-items: flex-start
    }

    #overviewIntroPic {
        height: 25vw;
        width: 25vw;
        margin-top: 7vw
    }

    .tl._3 {
        top: 24vw;
        left: 46vw
    }

    #detailExpandableText .text {
        max-width: 500px
    }

    .outerBlock {
        width: 48vw
    }

    #overviewIntroRight .oButton {
        bottom: 0
    }
}

.is-touch #tracker {
    display: none
}

.is-touch .oButton.mobileOnly {
    display: block !important
}

.is-touch #ethosText {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center
}

.is-touch #hVideoLayer {
    transform-origin: right bottom;
    transform: scale(.5)translateX(calc(50% - 130px))translateY(calc(50% - 130px));
    pointer-events: none
}

.is-touch #hVideoLayer video {
    pointer-events: all
}

.is-touch .oButton.watch {
    position: absolute;
    bottom: 30px;
    right: 75px;
    pointer-events: none;
    z-index: 1
}

.is-touch .oButton.close {
    position: absolute;
    bottom: 15px;
    right: 15px;
    pointer-events: none;
    z-index: 1
}

.is-touch #prSlider+.oButton {
    position: absolute;
    bottom: 120px;
    left: 60px
}

.is-touch #hFacilities,
.is-touch #hFacilitiesSticky,
.is-touch #hFacilitiesSlider,
.is-touch #hFacilitiesScroller,
.is-touch nav {
    will-change: transform;
    backface-visibility: hidden
}

@media all and (max-width:960px) {
    .mobileMargin {
        margin-top: 30px !important
    }

    .mobileOnly {
        display: block !important
    }

    .mobileHidden {
        display: none !important
    }

    [data-disable-mobile-scroll] {
        transform: none !important
    }

    .compositionPic img,
    .slide img {
        height: 105%;
        top: -2.5%
    }

    header {
        padding: 0 16px 0 0;
        /* height: 30px;
        top: 15px; */
    }

    .headerButton.email {
        display: none
    }

    #leftHeader {
        width: auto;
        /* position: relative; */
    }

    #mainLogo {
        position: absolute;
        left: 106px;
        width: 200px;
        top: 2.5px;
        height: 45px
    }

    #mainLogo svg {
        transform: translateX(-70px)
    }

    #mainMenuController {
        width: 25px;
        height: 25px;
        padding: 10px
    }

    #mainMenuController:after {
        content: none
    }

    .menuController .line {
        width: 25px
    }

    .mainContainer {
        width: calc(100% - 60px);
        margin-left: 27px;
    }

    #brownies {
        padding: 0 12px;
        left: -8px;
        bottom: 12px
    }

    .brownie.closed {
        height: 27px
    }

    #brownies.hidden {
        transform: translateX(-40px)
    }

    #cookieBrownie.closed {
        transform: translateX(-83px)translateY(0)
    }

    #newsLetterBrownie.closed {
        transform: translateX(-77px)translateY(-87px)
    }

    #covidBrownie.closed {
        transform: translateX(-81px)translateY(-167px)
    }

    .closed .brownieBack {
        opacity: 0 !important;
        transition-duration: 0ms
    }

    .brownie {
        height: 250px;
        position: absolute;
        width: calc(100vw - 61px);
        bottom: 0;
        left: 50px
    }

    .brownie.closed .brownieBack,
    .brownie.closed:hover .brownieBack {
        transform: translateX(23px)translateY(-10px)scale(.5) !important
    }

    .brownie .brownieIcoContainer {
        display: none
    }

    .brownie.closed .brownieIcoContainer {
        display: flex
    }

    .brownieButtons {
        width: 100%
    }

    .brownieButtons .oArrow {
        display: none
    }

    .brownie.closed .brownieIco {
        transform: scale(.8)
    }

    #cookieBrownie.opened {
        height: 340px
    }

    .cookiePrefs ul {
        width: calc(100% - 10px)
    }

    .oButton {
        height: 30px;
        margin-right: 18px
    }

    .brownieContent {
        margin: 0 10px;
        width: 100%;
        padding: 0
    }

    .oContent {
        padding: 0 8px
    }

    .oArrow {
        width: 7px
    }

    .oOuter {
        width: 44.5px
    }

    .oButton.open .oOuter {
        transform: translateX(20px)
    }

    .oSymbol {
        position: absolute;
        right: -11px;
        top: 2px;
        height: 26px;
        display: flex;
        align-items: center
    }

    .oLabel {
        font-size: 11px
    }

    #hLogo {
        width: 100px;
        position: absolute;
        top: 30%;
        left: calc(30% - 50px)
    }

    #hLogo img{
        max-width: 111px;
    }

    #hTarget {
        height: 30vh
    }

    #payLook {
        font-size: 9vw;
        letter-spacing: 0;
        margin-left: 35px;
        height: 24.5vw;
        margin-top: 2vw
    }

    #payLimits {
        font-size: 6vw;
        font-weight: 300;
        color: #1e2949;
        top: calc(50% + 3vw);
        left: 30vw
    }

    #hStrip {
        width: 73vw;
        margin-top: 10vw;
        height: 14vh
    }

    #payFind {
        font-size: 6.5vw;
        margin-right: 7.5vw;
        margin-top: -6vw
    }

    #payPerfection {
        font-size: 8.65vw;
        margin-top: 1vw;
        margin-right: 6vw
    }

    .introTextContainer {
        justify-content: flex-start
    }

    .introText {
        width: 100%
    }

    .text {
        font-size: 16px;
        line-height: 26px
    }

    .tripleMargin {
        margin-top: 40px;
    }

    .doubleMargin {
        margin-top: 60px
    }

    .margin {
        margin-top: 30px
    }

    .halfMargin {
        margin-top: 15px
    }

    #accoladesScroller {
        animation: accoladeScroll 30s linear infinite
    }

    @keyframes accoladeScroll {
        0% {
            transform: translateX(0)
        }

        100% {
            transform: translateX(-1445px)
        }
    }

    .accolade.slh img,
    .accolade.reader img {
        width: auto
    }

    .accolade {
        margin-left: 70px;
        width: auto !important
    }

    .accolade.ruinart {
        min-width: 180px
    }

    .accolade:first-child {
        margin-left: 0
    }

    .accolade.traveller,
    .accolade.forbes,
    .accolade.design {
        max-width: 80px;
        min-width: 80px
    }

    #ethos {
        margin-top: calc(80px + 15vw)
    }

    #ethosTitleContainer {
        width: 100%;
        flex-direction: column
    }

    .introPic {
        width: 43vw;
        height: 30vw
    }

    #ethosIntroPic {
        margin-top: -15vw
    }

    #ethosTitle {
        margin-top: 20px;
        align-self: flex-start;
        margin-left: 0
    }

    .blockTitle {
        font-size: 26px !important;
        line-height: 40px
    }

    #ethosContent {
        flex-direction: column;
        margin-top: 40px
    }

    #ethosPic {
        margin-left: -20px;
        width: calc(100% + 40px);
        height: 68vw;
        top: 0
    }

    #ethosPic img {
        height: 120%;
        top: -10%
    }

    #ethosText {
        margin-top: 40px;
        margin-bottom: 40px;
        max-width: none;
        margin-left: 0;
        flex-direction: column;
        align-items: flex-start
    }

    #ethosIntroText {
        margin-left: 0;
    }

    #ethosLayer {
        position: absolute;
        top: calc(39vw + 120px);
        height: 68vw
    }

    #minimalism {
        font-size: 25px;
        top: 35vw;
        left: 20vw
    }

    #sublime {
        font-size: 50px;
        top: 17vw;
        left: 2.5vw
    }

    #modern {
        font-size: 50px;
        top: 14vw;
        left: auto;
        right: 5vw
    }

    html[lang=it] #modern {
        top: 53vw
    }

    #prSection {
        margin-top: 30px
    }

    .miniTitle {
        font-size: 16px
    }

    .sectionTitle .small {
        font-size: 7vw
    }

    .sectionTitle .big {
        font-size: 11.3vw;
        line-height: 12vw
    }

    #prTop {
        flex-direction: column
    }

    #prSlider+.oButton {
        position: absolute;
        bottom: 60px !important;
        left: 0 !important;
        display: none !important;
    }

    #prSection .mainBackground {
        top: 26vw
    }

    #prIntroPic {
        width: 60%;
        height: 32vw;
        margin-top: 5px;
        z-index: 1
    }

    #prIntroText {
        margin-top: 30px;
    }

    #prSlider {
        margin-top: -5vw;
        margin-left: calc(-45px + 5vw);
        width: calc(100% + 60px - 5vw);
        height: 50vw
    }

    #prSection .mainBackground {
        top: calc(46px + 18vw)
    }

    #hFacilitiesTitle {
        margin-top: 15px
    }

    #hFacilities {
        height: 300vh
    }

    #hFacilitiesTarget {
        position: absolute;
        top: 0;
        height: 300vh
    }

    #hFacilitiesSticky {
        height: 100vh;
        display: flex;
        flex-direction: column;
        justify-content: space-around
    }

    #hFacilitiesSlider {
        top: 0
    }

    .hFacilitiesItem.horizontal .hFItemPic {
        width: 75vw;
        height: 47vw
    }

    .hFacilitiesItem.vertical .hFItemPic {
        width: 47vw;
        height: 75vw
    }

    .hFacilitiesItem {
        margin-left: 60px
    }

    .hFItemTitle {
        font-weight: 400;
        opacity: .7;
        font-size: 8vw
    }

    .hFacilitiesItem:first-child {
        margin-left: 35px
    }

    .hFacilitiesItem.horizontal .hFItemTitle {
        bottom: 10vw;
        left: auto;
        right: -7vw
    }

    .hFacilitiesItem.vertical .hFItemTitle {
        bottom: 16vw;
        left: -4vw
    }

    #hDining {
        margin-top: calc(15vw + 60px)
    }

    #hDiningSticky {
        height: auto;
        width: 100%
    }

    #hDiningIntroPic {
        margin-top: -15vw;
        align-self: flex-end
    }

    #hDining .mainContainer {
        flex-direction: column;
        margin-top: 0
    }

    #hDiningScroll {
        width: 100%
    }

    #hDiningScroll .miniTitle {
        margin-top: 7vw
    }

    #hDiningItems {
        width: 100%;
        margin-top: 0px;
    }

    #hDiningFixed {
        margin-left: 0;
        position: absolute;
        top: 0;
        width: 100%;
        left: 0
    }

    #hDiningTitle {
        align-self: flex-start;
        margin-top: 0px;
    }

    #tasteTitle {
        margin-top: 160px
    }

    .long .hDiningItemPic {
        height: 38vw;
        width: 100%
    }

    #hDining .mainBackground {
        height: calc(0vw + 200px)
    }

    .hDiningItemTitle {
        font-size: 18px;
        margin-top: 15px
    }

    .hDiningItemSubtitle {
        font-size: 18px
    }

    .hDiningItemPic {
        height: 76vw
    }

    .hDiningItem {
        width: 100% !important;
    }

    .hDiningItemContainer {
        flex-direction: column;
        margin-top: 0
    }

    .hDiningItemRow {
        flex-direction: column
    }

    #hDiningItems .callerBottom {
        position: relative
    }

    .hDiningItemSubtitle {
        margin-top: 0
    }

    .hDiningItemPic {
        height: 76vw;
        width: 100% !important;
        margin: auto;
    }

    .hDiningItem {
        margin-top: 30px
    }

    #hDiningItems>.hDiningItem:first-child {
        margin-top: 0
    }

    .slidingTitleBig {
        font-size: 11vw
    }

    .slidingTitleBig.small {
        font-size: 8vw !important;
        top: 4.4vw !important
    }

    .slidingTitleSmall {
        font-size: 5.9vw
    }

    #hExperiences {
        /*margin-top: 120px*/
    }

    #hLifeStyle .slidingTitleSmall {
        margin-top: -14vw
    }

    #hLifeStyle .mainBackground {
        top: 16.8vw;
        height: 105%
    }

    .panelLabel {
        font-size: 20px
    }

    .hLSBlockTitle {
        height: 65px
    }

    #hLifeStylePanel {
        margin-top: 0
    }

    #hExperiencesTitle {
        margin-top: -8.5vw
    }

    #hExperiencesTitle .slidingTitleBig {
        margin-top: 9.4vw;
    }

    .hExperienceTitle {
        font-size: 18px
    }

    .hExperienceButton {
        height: 40px
    }

    .hExperienceTitle {
        font-size: 16px
    }

    .hExperienceBlock._2 {
        top: 40px
    }

    .hExperienceBlock._3 {
        top: 80px
    }

    .hExperienceBlock._4 {
        top: 120px
    }

    .hExperienceContent {
        height: auto;
        justify-content: flex-start;
        padding-left: 15px;
        transform: translateY(-115vw)
    }

    .hExperiencePic {
        position: relative;
        height: 60vw;
        margin-top: 20px
    }

    #hExperiencesLayer {
        height: calc(68vw + 339px)
    }

    .hExperienceText {
        flex: none;
        margin-top: 20px;
        margin-bottom: 20px;
        height: 127px
    }

    .hExperienceSubTitle {
        height: 30px;
        line-height: 20px
    }

    #hExperiences .mainContainer {
        padding-bottom: 35px
    }

    .hExperienceBlock.show~.hExperienceBlock {
        transform: translateY(calc(100% - 40px))
    }

    .clock {
        width: 80px
    }

    .clock.main {
        flex: 1;
        margin: 0
    }

    .clock-city p {
        font-size: 14px
    }

    #date {
        margin-top: 15px
    }

    .weatherContainer {
        width: calc(100% - 20px)
    }

    #date .year {
        font-size: 50px
    }

    #date .day {
        margin-bottom: 9px;
        margin-left: 10px
    }

    #date .ext-day {
        font-size: 18px
    }

    #date .ext-date {
        font-size: 18px
    }

    #weather {
        border-top: 1px solid #b9ada4
    }

    footer {
        height: auto !important
    }

    #footerSticky {
        display: flex;
        flex-direction: column;
        height: 100vh !important;
    }

    #footerMain .mainContainer {
        align-items: flex-start !important;
    }

    #footerMain {
        order: 1;
        height: 100vh;
        padding: 60px 0px;
    }

    #footerData {
        position: relative;
        top: 0;
        width: 100%;
        left: 0;
        height: auto
    }

    #weatherIn {
        top: 0
    }

    #weather img {
        width: 40px
    }

    #weather .wind_direction img,
    #weather .wind_speed img {
        width: 20px
    }

    #weather .wave_height img {
        width: 11px
    }

    .meteo_stats {
        font-size: 14px
    }

    .temp_text {
        font-size: 50px;
        letter-spacing: -2px;
        font-size: 30px
    }

    .temp_text span.temp_deg {
        top: 3px;
        margin-left: 3px
    }

    .meteo_col {
        width: 33%
    }

    #footerInfo p,
    #footerInfo a {
        font-size: 16px;
        line-height: 28px
    }

    #footerLogo {
        width: 120px
    }

    #footerRight {
        position: absolute;
        bottom: 320px;
        right: 0
    }

    #footerLeft {
        justify-content: flex-end;
        margin-top: 30px;
    }

    /* #footerMain .mainBackground img {
        object-position: right
    } */

    #overviewScroller {
        height: auto;
        padding: 0;
        flex-direction: row;
        justify-content: flex-start;
        width: auto;
        padding-top: 60px;
        padding-bottom: 45px
    }

    #overviewScroller .oLeftBar {
        position: absolute;
        height: 100%
    }

    .oLeftBar {
        width: 45px
    }

    #overviewViewport {
        flex: 1;
        height: auto;
        max-height: none;
        flex-direction: column
    }

    #overviewMiniTitle {
        position: relative;
        left: 0;
        top: 0;
        width: 100%;
        justify-content: flex-start;
        margin-left: 35px;
        margin-top: 30px
    }

    #overviewMiniTitle span {
        transform: none;
        writing-mode: horizontal-tb
    }

    #overviewIntro .mainContainer {
        flex-direction: column
    }

    #overviewIntroRight {
        justify-content: flex-start;
        margin-left: 10px;
        margin-right: 0
    }

    #overviewIntroLeft {
        order: 2;
        width: auto;
        margin-left: 10px
    }

    #overviewSnippetContainer {
        width: 100%;
        height: auto
    }

    .overWord {
        font-size: 30px
    }

    .overviewSub {
        font-size: 20px
    }

    #overviewItems {
        margin-top: 60px;
        width: 100vw
    }

    #overviewControls {
        width: calc(35vw - 45px);
        height: 60vw;
        right: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-end
    }

    .overviewColumn.left {
        position: relative;
        height: auto;
        left: 0;
        display: flex;
        flex-direction: column;
        align-items: center
    }

    .overviewColumn.right {
        position: relative;
        height: auto;
        right: 0;
        display: flex;
        flex-direction: column;
        align-items: center
    }

    #overviewIntroPic,
    #overviewItemPicsContainer {
        width: 65vw;
        height: 65vw;
        margin-left: -10px;
        margin-top: 0
    }

    #overviewItemsContent .activeLayer {
        width: 70vw
    }

    .oNavigation.left,
    .oNavigation.right {
        width: 75px;
        padding-right: 10px;
        padding-left: 10px;
        box-sizing: border-box;
        margin-top: 0;
        transform: none !important
    }

    .oNavigation.left {
        justify-content: flex-end
    }

    .oNavigation.right {
        margin-top: 15px
    }

    .oNavigation .oArrow {
        left: 16px
    }

    .oNavigation.left .oArrow {
        left: -16px
    }

    .oNavigation.left:before {
        transform: translateX(25px)
    }

    .oNavigation.left:before {
        transform: translateX(-25px)
    }

    .oNavigation.show:hover:before {
        opacity: 1;
        transform: translateX(0) !important
    }

    .oNavigation .navigationTitle {
        width: 30px
    }

    .detailTitle {
        font-size: 30px
    }

    #overviewItemsContent {
        flex-direction: column
    }

    #overviewItemTitleContainer {
        margin-left: 0;
        height: auto;
        width: auto;
        padding: 20px 0
    }

    #overviewItemRight {
        margin-left: 0;
        padding-bottom: 0;
        align-items: flex-start;
        margin-left: 10px;
        max-height: 250px
    }

    #overviewItemLeft {
        margin-left: 10px
    }

    #detailTop {
        padding-top: 60px
    }

    #detailTop>.mainContainer:first-child,
    #detailTopSecond .simplePicture+.mainContainer {
        position: relative
    }

    #detailTop .oLeftBar,
    .oLeftBar.wide {
        width: 45px;
        position: absolute;
        left: -45px;
        height: calc(100% - 65px)
    }

    #detailTop .oLeftBar.mobileRoom {
        height: calc(100% - 130px)
    }

    #detailTopContent {
        display: flex;
        flex-direction: column;
        width: 100%
    }

    #detailSectionTitle {
        order: 1;
        margin-top: 30px;
        margin-left: 10px
    }

    #detailTopImgContainer {
        margin-top: 0;
        order: 0;
        margin-left: 0;
        width: calc(100vw - 45px);
        height: calc(100vw - 45px);
        transform: translateY(60px);
        opacity: 0
    }

    #detailTopImgContainer.show #detailTopImg {
        transform: scale(1) !important;
        -webkit-transition: -webkit-transform 3e3ms cubic-bezier(.19, 1, .22, 1), opacity 3e3ms cubic-bezier(.19, 1, .22, 1);
        transition: transform 3e3ms cubic-bezier(.19, 1, .22, 1), opacity 3e3ms cubic-bezier(.19, 1, .22, 1)
    }

    #detailTopImgContainer.show #detailImgBlock {
        transform: scale(1) !important;
        -webkit-transition: -webkit-transform 3e3ms cubic-bezier(.19, 1, .22, 1), opacity 3e3ms cubic-bezier(.19, 1, .22, 1);
        transition: transform 3e3ms cubic-bezier(.19, 1, .22, 1), opacity 3e3ms cubic-bezier(.19, 1, .22, 1)
    }

    #detailIntroTitle {
        order: 2;
        margin-left: 10px;
        font-size: 25px;
        line-height: 30px
    }

    #detailIntroSubtitle {
        text-transform: uppercase;
        order: 3;
        margin-left: 10px
    }

    #detailText {
        order: 4;
        width: 100%;
        margin-left: 10px;
        margin-bottom: 60px
    }

    .detailSubtitle {
        font-size: 20px
    }

    .detailTitle {
        font-size: 25px;
        margin-bottom: 20px;
    }

    #detailTop .miniTitle {
        margin-top: 0
    }

    #detailSectionTitle .detailTitle {
        margin-top: 15px
    }

    .more p>span {
        margin-top: 30px;
        margin-right: 0
    }

    #detailSpaces .introPic {
        margin-top: -25vw
    }

    .fullPicture,
    .fullPictureSticky {
        height: 70vw !important
    }

    #fullPictureTarget,
    #fullPictureTarget2,
    #fullPictureTarget3,
    #fullPictureTarget4 {
        height: 90vw !important
    }

    .locationContainer+.mainContainer {
        margin-top: 45vw
    }

    #detailBody .locationContainer+.mainContainer .detailBodyContent.scheme2 .left {
        order: 0;
        margin-top: 0
    }

    #detailBody .locationContainer+.mainContainer .detailBodyContent.scheme2 .right {
        order: 1;
        margin-top: 60px
    }

    #detailBody .locationContainer+.mainContainer .detailBodyContent.scheme3 .right {
        order: 0;
        margin-top: 0
    }

    #detailBody .locationContainer+.mainContainer .detailBodyContent.scheme3 .left {
        order: 1;
        margin-top: 60px
    }

    .locationContainer+.mainContainer+.fullPicture {
        margin-top: 120px
    }

    .mobileNegative {
        margin-top: -5vw
    }

    #detailSpacesContainer {
        width: 100%;
        position: relative;
        top: 0;
        margin-top: 60vw
    }

    #detailSpaces {
        height: auto;
        margin-top: 26vw
    }

    #detailSpaces #detailSnippets {
        margin-top: 8vw;
        order: 0
    }

    #detailSpaces .mainContainer {
        position: relative
    }

    #detailSpacesContent {
        padding: 0 30px;
        align-items: center
    }

    .text.small,
    .text.tech,
    #overviewSnippetContainer .snippet:last-child {
        font-size: 16px;
        line-height: 20px !important;
    }

    .text.tech.small,
    .text.tech.smaller {
        font-size: 14px !important;
        line-height: 26px
    }

    #detailSnippets .snippet {
        width: 100%;
        margin-top: 15px
    }

    #detailSnippets .snippet:first-child {
        margin-top: 0
    }

    #detailSpaces .snippet {
        text-align: center
    }

    #detailSpacesContent .slidingTitleBig,
    .locationNameContent .slidingTitleBig {
        top: 6.2vw;
        margin-left: 10px;
        margin-top: 0;
        order: 1;
        position: relative
    }

    #detailServices,
    #shopItems {
        margin-top: 60px
    }

    #detailServicesContent {
        order: 0;
        flex-direction: column;
        margin-left: 0;
        align-items: center
    }

    #detailServicesPic {
        order: 0;
        height: 66vw;
        width: 42vw;
        max-width: none;
        flex: auto;
        margin-top: 0
    }

    #detailServices .mainContainer {
        display: flex;
        flex-direction: column
    }

    #detailServicesLeft {
        order: 1;
        width: 100%;
        margin-top: 60px
    }

    .listTitle {
        font-size: 33px;
        margin-left: 0
    }

    .listText {
        margin-left: 0;
        margin-top: 30px
    }

    .listItem {
        font-size: 18px;
        margin-top: 12px
    }

    .galleryContainer {
        height: 70vw !important
    }

    #styleDetailsTitle .slidingTitleSmall {
        margin-top: -13vw;
        font-size: 6vw
    }

    .styleDetail {
        min-width: 40vw
    }

    #styleDetailsScroller {
        display: flex;
        animation: styleDetailScroll 40s linear infinite
    }

    @keyframes styleDetailScroll {
        0% {
            transform: translateX(-5%)
        }

        100% {
            transform: translateX(-557.5%)
        }
    }

    #styleDetails .mainContainer {
        width: calc(100% - 60px)
    }

    #others .mainContainer {
        flex-direction: column
    }

    #otherFixed {
        order: 0;
        margin-left: 0;
        margin-top: 0
    }

    #otherFixed .blockTitle {
        text-align: center;
        font-size: 30px;
        line-height: 30px
    }

    #otherFixed .blockTitle br {
        display: none
    }

    #otherItems {
        order: 1;
        margin-top: 30px;
    }

    .otherItemPic {
        width: 100%
    }

    .listItemTitle {
        font-size: 16px;
    }

    .listItemSubtitle {
        font-size: 14px;
        margin-top: 0
    }

    #detailExpandableText {
        order: 0;
        margin-left: 0;
        margin-top: 0
    }

    #detailInfo>.mainContainer {
        display: flex;
        flex-direction: column
    }

    #detailInfo>.mainContainer>.introPic {
        order: 1;
        margin-top: 60px
    }

    #detailInfo.noText>.mainContainer>.introPic {
        margin-top: 0
    }

    #detailInfo .snippet._2,
    #detailInfo .snippet._4,
    #detailInfoSecond .snippet._2,
    #detailInfoSecond .snippet._4 {
        margin-top: 0
    }

    #detailInfo .snippet br {}

    #detailSnippets {
        order: 3;
        width: 100%;
        margin-right: 0
    }

    #detailBody .mainContainer>.introPic {
        margin-top: -5vw
    }

    .compositionPicContainer {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        height: 62vw;
        order: 0;
        margin-bottom: 30px
    }

    .compositionText {
        margin-bottom: 60px;
        max-width: none;
        margin-top: 60px
    }

    #detailComposition .mainContainer,
    .infoBlock .mainContainer {
        flex-direction: column
    }

    .compositionPicContainer .tl._3 {
        font-size: 15vw;
        top: 20vw
    }

    .compositionPicContainer .tl._1 {
        top: 10vw;
        bottom: auto;
        left: 25vw
    }

    .text.big {
        font-size: 20px;
        line-height: 35px
    }

    .detailBodyContent {
        padding-left: 0;
        flex-direction: column
    }

    .detailBodyContent .blockTitle {
        margin-left: 0 !important;
        margin-top: 60px
    }

    #detailBody .detailBodyContent>.left,
    #detailBody .detailBodyContent>.right {
        width: 100% !important
    }

    .verticalPic {
        width: 100%;
        height: 140vw;
        margin-top: 40px;
        margin-left: 0
    }

    #detailBody .galleryContainer {
        height: 60vw
    }

    #detailBody .detailBodyContent.scheme2>.right {
        order: 0;
        padding-left: 0
    }

    #detailBody .detailBodyContent.scheme2>.left {
        order: 1;
        margin-top: 60px;
        width: 100% !important;
        margin-left: 0
    }

    #detailBody .detailBodyContent.scheme2>.left:only-child {
        margin-top: 0
    }

    .menuPic img {
        height: 110%;
        top: -5%
    }

    .detailBodyContent.scheme3>.right {
        display: flex;
        justify-content: flex-end;
        margin-top: 60px
    }

    .detailBodyContent.scheme3>.right .introPic {
        transform: none !important;
        margin-right: 0
    }

    .menuBlock,
    .menuPic {
        width: 41vw;
        height: 41vw;
        margin-left: 0 !important;
        margin-right: 0
    }

    .detailBodyContent.scheme4 {
        padding-right: 0;
        width: 100% !important;
        margin-left: 0
    }

    .menu {
        display: flex;
        justify-content: space-between
    }

    .menu+.menu {
        margin-top: 2vw
    }

    .menuLayout .slidingTitleBig {
        position: relative;
        top: 5.45vw;
        font-size: 10vw
    }

    .menuBlock.small .slidingTitleBig,
    .menuBlock.mobileSmall .slidingTitleBig {
        font-size: 5vw;
        top: 2.6vw
    }

    .menu .oButton {
        position: absolute |important;
        top: 30% !important
    }

    .menuType {
        right: 0;
        top: 20px;
        font-size: 20px
    }

    #detailForm .mainBackground {
        left: 0;
        width: 100%
    }

    .formLayer {
        flex-direction: column;
        width: calc(100% - 20px);
        margin: auto;
        min-height: 45vw
    }

    .wpforms-confirmation-container {
        font-size: 16px;
        width: calc(100% - 5vw);
        line-height: 25px
    }

    .formContent {
        flex-direction: column
    }

    #formTitle {
        margin-left: 0;
        margin-top: -13.3vw
    }

    #detailForm {
        margin-top: calc(60px + 13.3vw)
    }

    #formTitle .slidingTitleBig {
        margin-top: -6.1vw
    }

    .formDescription {
        margin-left: 0
    }

    .formInfo.left {
        width: 100%
    }

    .formContainer .right {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
        margin-top: 0
    }

    .formField {
        width: 100% !important;
        padding-bottom: 17px !important
    }

    .formField {
        margin-top: 20px
    }

    .formField select,
    ::-webkit-input-placeholder,
    .formField input,
    .wpforms-container label {
        font-size: 14px
    }

    .wpforms-field-description {
        font-size: 12px !important;
        padding: 5px 5px 0 !important
    }

    .wpforms-container .wpforms-submit-container {
        padding: 0 !important;
        width: 100%
    }

    .wpforms-submit {
        margin-right: 0;
        border: none !important
    }

    .formContainer {
        margin: 0;
        width: 100%
    }

    .wpforms-container label.wpforms-error {
        bottom: 0
    }

    .taste .backgroundScheme .mainBackground {
        top: 5vw
    }

    .compositionPicContainer.reversed .tl._3 {
        bottom: 5vw;
        top: auto;
        right: 5vw
    }

    .compositionPicContainer.reversed .tl._1 {
        left: 8vw;
        top: auto;
        bottom: 2vw;
        opacity: .8
    }

    .backgroundScheme .mainContainer {
        margin-top: 0;
        flex-direction: column
    }

    .taste .compositionPicContainer {
        margin-left: 0
    }

    .backgroundScheme+.mainContainer .detailBodyContent.scheme1 {
        margin-top: 0
    }

    .infoBlock .blockText>.text {
        text-align: center;
        font-size: 20px
    }

    .infoBlock .blockText>.text.tech {
        font-size: 16px !important
    }

    .outerBlock {
        width: 100%;
        margin-top: 30px;
        padding: 25px 20px
    }

    .outerRow {
        flex-direction: column
    }

    .outerDescription {
        margin-top: 30px;
        font-size: 14px;
        text-align: center;
        align-items: center
    }

    .infoBlock .mainBackground {
        top: 0
    }

    .infoBlock .mainContainer {
        margin-top: 30px;
        width: calc(100% - 90px)
    }

    .outerRow._1 img {
        width: 75px
    }

    .ab .outerRow._1 img {
        width: 200px
    }

    .outerRow._2 img.ruinart {
        width: 100px
    }

    .scheme1.simpler .text {
        margin-left: 0
    }

    .outerBlock.ruinart .outerPic {
        width: 200px
    }

    #detailBody .detailBodyContent.scheme1 .left .text:only-child {
        margin-top: 60px
    }

    .seascape .compositionPicContainer {
        order: 0
    }

    .seascape .compositionText {
        order: 1
    }

    #detailTextSpecial {
        order: 4;
        width: 100%;
        margin-left: 10px
    }

    .simplePicture {
        height: 70vw
    }

    #detailTopSecond .oLeftBar {
        width: 20px;
        position: absolute;
        left: -35px;
        height: calc(100% - 65px)
    }

    .detailBodyContent.scheme3 .blockTitle {
        margin-top: 0
    }

    #detailIntroTitle br {
        display: none
    }

    #detailInfo .mainContainer #detailSnippets:only-child {
        margin-top: 0
    }

    .profileTitle {
        font-size: 30px;
        margin-left: 0
    }

    .profileContent {
        flex-direction: column
    }

    .profilePic {
        width: 100% !important;
        height: 50vw !important;
        margin-left: 0vw !important;
        margin-top: 50px;
    }

    .locationContainer+.mainContainer .text.big br {
        display: none
    }

    #detailSpaces+#detailBody {
        margin-top: 30px
    }

    .pressButton {
        margin-top: 10px
    }

    #navBar {
        display: none
    }

    #navBackground {
        width: 100%;
        height: 100%;
        border-radius: 15px;
        top: 5px;
        left: 0px;
    }

    #navScroller {
       transform: none !important;
        overflow: auto !important;
        top: 30px;
        padding-bottom: calc(70px + 9vh);
    }

    #navTop {
        padding: 25px 0;
        margin-top: 55px;
        margin-left: 0;
        width: 100%;
        height: calc(100% - 110px)
    }

    .navSection {
         margin: 1.5vh 0vh !important;
    }

    .navSectionItems {
        margin-top: 1;
    }

    .navItem {
        font-size: 18px;
        padding: 5px 0;
        margin: 0
    }

    .subItem {
        height: auto
    }

    .navItem:after {
        top: 1px;
        height: 26px;
        left: -9px;
        width: calc(100% + 17px)
    }

    .navItem:hover .subItem svg {
        transform: translateX(10px)rotateZ(45deg)
    }

    #navBottom {
        justify-content: space-between;
        margin-bottom: 40px !important;
    }

    #navBottom .socials {
        order: 1;
        justify-content: flex-end;
        min-width: 0;
        margin-right: 25px
    }

    #navBottom .socials svg {
        height: 18px
    }

    #navBottom .socials .tw {
        margin-left: 12px
    }

    #navBottom .socials .ig {
        margin-left: 10px
    }

    #navBottom .langsContainer {
        order: 0;
        margin-left: 10px;
        padding-left: 0;
        position: static
    }

    .navSection:after {
        top: 5.2vh !important;
        width: 50% !important;

    }

    .subItem .subTitle {
        display: none
    }

    .subItem:before {
        content: none
    }

    .navSectionTitle {
        padding-right: 0;
       font-size: 19px;
    }

    #navContent {
        padding-right: 0;
        padding-left: 0;
        margin: 0 10px
    }

    .c-scrollbar {
        right: 2px;
        overflow: hidden
    }

    .mobileArrow {
        width: 30px;
        height: 30px;
        border-radius: 50px;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .mobileArrow.left {
        margin-left: 15px
    }

    .mobileArrow.right {
        margin-right: 15px
    }

    .mobileArrow.left .oArrow {
        transform: rotateZ(-135deg)
    }

    .mobileArrow.right .oArrow {}

    .galleryContainer .activeLayer {
        display: flex;
        align-items: center
    }

    .galleryContainer .activeLayer.right {
        justify-content: flex-end
    }

    .sliderPreview {
        position: relative;
        top: 0;
        width: 100%;
        right: 0;
        bottom: 0
    }

    .photogalleryMarginBottom {
        margin-bottom: 100px
    }

    .hExperienceArrow svg {
        width: 8px
    }

    .hExperienceArrow {
        width: 25px;
        height: 25px
    }

    .styleLogo:nth-child(1),
    .styleLogo:nth-child(2) {
        margin-top: 0
    }

    .styleLogo,
    .styleLogo.smaller,
    .styleLogo.smaller.left,
    .styleLogo.smaller.right {
        width: 40%;
        margin-left: 0;
        margin-right: 0;
        margin-top: 60px;
        flex: inherit
    }

    #styleDetailsLogos {
        padding: 30px;
        justify-content: space-between
    }

    .styleLogo img.tinyLogo {
        width: 75%
    }

    .styleLogo img.smallerLogo {
        width: 50%
    }

    .styleLogo img.smallestLogo {
        width: 30%
    }

    .styleLogo:nth-child(3) {
        margin-top: 30px
    }

    .styleLogo img {
        width: 100%
    }

    .wind_direction img {
        display: none
    }

    #mainLogo.menuForced {
        transform: translateY(0)
    }

    .formField.wpforms-field-checkbox.multiple {
        flex-direction: column
    }

    .formField.wpforms-field-checkbox.multiple ul {
        width: 100%;
        margin-top: 15px
    }

    .formField.wpforms-field-checkbox input[type=checkbox]+label {
        background-position: -4px -3px
    }

    .formField.wpforms-field-checkbox input[type=checkbox]:checked+label {
        background-position: -4px -28px
    }

    .formField.right input,
    .formField.right textarea {
        width: 100%
    }

    .langsContainer a {
        font-size: 16px
    }

    .overlay .mainBackground {
        width: calc(100% - 10px);
        height: calc(100% - 10px);
        border-radius: 15px;
        top: 5px;
        left: 5px
    }

    .overlayContainer {
        width: calc(100% - 50px);
        max-width: 280px
    }

    .ovGroup input,
    .ovGroup select {
        font-size: 18px;
        letter-spacing: 0;
        margin-left: 20px
    }

    .ovGroup {
        padding-bottom: 5px
    }

    .overlayLabel {
        width: 100px;
        font-size: 18px
    }

    .bookGuests .icoContainer {
        margin-left: 56px
    }

    .ovGroup select {
        margin-left: 0;
        padding-left: 50px
    }

    .overlayClose {
        transform: scale(.8);
        top: 10px;
        right: 10px;
        z-index: 2
    }

    .lang-item {
        margin-left: 30px;
        position: relative
    }

    .lang-item:before {
        right: -15px
    }

    .ovPeople {
        font-size: 20px
    }

    .ovSmall {
        font-size: 13px
    }

    #thanksOverlay .overlayContainer {
        max-height: 300px
    }

    #creditsOverlay .overlayContainer {
        max-height: 530px
    }

    .ovGroup {
        padding-bottom: 15px
    }

    #bookOverlay .ovGroup {
        padding-bottom: 5px
    }

    .text.tech.small.ovRole {
        line-height: 20px
    }

    #menuClose {
        top: 11px;
        left: 9px;
        transform: scale(1.2)
    }

    #partners {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap
    }

    .partner {
        width: 40% !important;
        display: flex;
        justify-content: center;
        max-width: none !important
    }

    .partner.slh img {
        max-width: 80px
    }

    .partner.virtuoso img {
        max-width: 162px
    }

    .partner.ae {
        margin-top: 65px
    }

    .partner.ae img {
        max-width: 100px
    }

    .partner.traveller {
        margin-top: 66px
    }

    #footerDataBottom .weatherContainer {
        flex-wrap: wrap;
        padding: 90px 0
    }

    #scrollDown {
        width: 200px;
        margin-left: -100px;
        letter-spacing: .5px;
        text-align: center;
        bottom: 174px;
        display: none;
    }

    #verticalArrow {
        transform: rotateZ(180deg)
    }

    .scrollDownText {
        font-size: 12px
    }

    .mobile {
        margin-right: 10px
    }

    .amalfiFirst {
        margin-top: 60px
    }

    #formTitle .slidingTitleSmall {
        height: 13.3vw;
        display: flex;
        align-items: flex-end
    }

    .navSection:last-child .navItem {
        color: #6f6359 !important
    }

    .newsletter_input.title {
        width: 50px
    }

    .bodyParagraphTitle h2 {
        font-size: 20px;
        top: 11px
    }

    .textIndexContainer,
    .bodyParagraphContainer {
        width: 100%
    }

    #pressBody {
        padding-top: 90px
    }

    #pressContainer {
        width: calc(100% - 20px);
        margin-left: 10px
    }

    #pressContainer #detailSnippets {
        width: 70px;
        order: 0
    }

    .pressContent .locationNameContainer {
        width: 100%
    }

    .pressContent .locationNameContent {
        margin-top: 0
    }

    .pressContent .locationContainer+.locationContainer {
        margin-top: 35vw
    }

    .pressList {
        width: 100%
    }

    .pressList .text.big {
        text-transform: lowercase;
        font-size: 18px
    }

    #pressBody+#clocks {
        margin-top: 160px
    }

    #pressTarget {
        height: calc(100% - 90px)
    }

    .outerBlock.cnd {
        height: auto
    }

    .ovGroup.leaders .ovSmall {
        padding-bottom: 4px;
        line-height: 17px
    }

    .ovGroup.leaders img {
        top: -15px
    }
}

#mainLogo .logo-text {
    margin-left: 30px;
}

.testimonials-section {
    background: #f7f7f7;
    padding: 60px 20px;
    font-family: sans-serif;
}

.section-title {
    text-align: center;
    font-size: 2rem;
    margin-bottom: 40px;
    color: #222;
}

.testimonial-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
}

.testimonial-box {
    background: #1e2949;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
    padding: 30px;
    text-align: center;
    width: 25% !important;
    margin-bottom: 30px;
    margin-right: 10px !important;
    transition: transform 0.3s ease;
    font-family: LM Roman Dunhill;
}

.testimonial-box:hover {
    transform: translateY(-10px);
}

.reviewer-img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 20px;
}

.review-text {
    color: #ffffff;
    margin-bottom: 15px;
}

.reviewer-name {
    font-size: 18px;
    margin-top: 10px;
    color: #ffffff;
}

.mobilecallbtn {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 999;
    color: #fff;
    border-top: 1px solid #fff;
}

.mobilecallbtn a:first-child {
    border-right: 1px solid #fff;
}

.mobilecallbtn {
    text-align: center;
    color: #fff;
}

.mobilecallbtn a {
    color: #fff;
    text-decoration: none;
    width: 50%;
    float: left;
    vertical-align: middle;
    font-size: 16px;
    padding: 10px 0;
}

.wp img {
    width: 100%;
    max-width: 20px;
    display: inline-block;
    vertical-align: middle;
}

@media all and (max-width: 768px) {
    .mobilecallbtn {
        display: flex;
        background-color: #1e2949;
    }

    .mobilecallbtn a:hover {
        background-color: #96201e;
    }
}

#accoladesScroller {
    padding-top: 60px;
    overflow: hidden;
}

#accoladesScroller .accolade {
    margin-right: 20px;
}

#accoladesScroller .accolade img {
    width: 100px;
}

.contact-form-bg {
    background-color: #1e2949;
}

.testi-image {
    max-width: 30px;
}

@media all and (max-width: 768px) {
    #bookNow {
        display: none;
    }

    .section-title {
        font-size: 1.4rem !important;
    }
}

.fixed-image img {
    max-width: 270px;
}

.main-header {
    background-color: #ffffff;
    box-shadow: rgb(27 40 75 / 3%) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
}

.download-text {
    color: #ffffff !important;
}

.download-brochure-btn .oBackground {
    background: #1e2949;
}

.download-brochure-btn .oButton.dark .oOuter.fillColor {
    stroke: #1e2949;
    fill: #1e2949;
    transform: translateX(24px);
}

.clients-section {
    margin: 60px 0px;
    display: none;
}

.view-map-arrow {
    fill: #ffffff !important;
}

.faqs-background {
    background-color: #1e2949;
}

.dholera-backgound {
    background-color: #1e2949;
}

.about-us-background {
    background-color: #1e2949;
}

@media all and (max-width: 768px) {

    .header-btn.headerButton .icon .fillColor {
        display: none;
    }

    #blogText {
        margin-top: 80px !important;
    }

    #others {
        margin-top: 30px !important;
    }

    .clients-section {
        margin-top: 100px !important;
    }
}

.contact-margin {
    margin: 3vw 0vw;
}

.home-banner-main img {
    top: 100px !important;
}

@media (max-width: 768px) {
    #mainMenuController {
        width: 25px;
        height: 25px;
        padding: 10px;
        position: absolute !important;
        right: 3px !important;
    }

    .fixed-image img {
        max-width: 240px;
    }

    #mainLogo {
        position: absolute;
        left: 30px;
        width: 132px;
        top: 25.5px;
        height: 45px;
    }
}

@media (max-width: 768px) {
    #navTop {
        padding: 25px 0;
        margin-top: 55px;
        margin-left: 0;
        width: 100%;
        height: calc(100% - 110px);
    }

    #navContent {
        overflow: unset !important;
    }

    /* #navInner{
        height: 100% !important;
        top: -45px !important;
    } */
    #navTop:after {
        background: transparent !important;
    }

    /* #navScroller
 {
    top: -165px;
} */

}

.blur-image img {
    filter: blur(2px);
}

.right-data {
    margin-left: 50px;
}

.left-image {
    margin-right: 5vw;
    margin-left: 0vw !important;
}

.right-to-left {
    padding: 60px 0px;
    margin-bottom: 80px;
}

@media (max-width: 768px) {
    .profilePic {
        margin-top: 0px !important;
    }

    .right-data {
        margin-top: 20px !important;
        margin-left: 0px !important;
        margin-top: 50px !important;
    }
}

.our-projects-title {
    text-align: center !important;
    margin-top: 30px;
    color: #1e2949;
}

#reamore-btn {
    display: block !important;
    max-width: 100px;
    margin-top: 30px;
}

#reamore-btn .ream-more-arrow {
    fill: #1e2949 !important;
}

.projectTitle .big,
.projectTitle .small {
    color: #1e2949 !important;
}


.projects_title {
    color: #1b2946;
}

.about-us-btn {
    color: #1b2946;
}

@media (max-width: 768px) {
    .testimonials-section {
        padding: 60px 0px !important;
    }

    .testimonial-box {
        width: 100% !important;
        padding: 20px !important;
        margin-right: 0px !important;
        margin-bottom: 15px !important;
    }

}

.blog-details-background {
    background-color: #97291b;
}

.white-text {
    color: #ffffff;
}

.news-short-desc {
    color: #000000;
}

#brochure-form {
    width: 100% !important;
}

#brochure-form .formField.half {
    width: 100%;
}

.inquire-form {
    margin: 0 auto;
}

.inquire-container {
    text-align: center;
}

@media all and (max-width: 768px) {
    #footerLogo {
        width: 225px;
    }

    #footerLogo img {
        width: 100%;
    }
}

.vm-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    max-width: 1000px;
    margin: 30px auto;
}

.vm-box {
    background-color: transparent;
    border: 3px solid #ffffff;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
    padding: 30px 20px;
    flex: 1 1 300px;
    max-width: 450px;
    text-align: center;
}

.vm-box h3 {
    font-size: 31px;
    font-weight: 500;
    margin-bottom: 15px;
    color: #ffffff;
    font-family: Geometria;
}

.vm-box p {
    font-size: 19px;
    color: #ffffff;
    line-height: 1.5;
    font-family: Geometria;
}

@media all and (max-width: 768px) {
    .vm-box h3 {
        font-size: 21px
    }
    .vm-box p {
    font-size: 16px;
}
}

.news-desc-title {
    font-size: 46px;
}

.news-desc-text {
    font-size: 24px;
    line-height: 31px;
}

.short-title {
    font-size: 36px;
}

@media all and (max-width: 768px) {
    .short-title {
        font-size: 19px !important;
    }

    .news-desc-title {
        font-size: 26px !important;
    }

    .news-desc-text {
        font-size: 14px !important;
        line-height: 25px !important;
    }
}

#brochure-form .formContainer.dark .wpforms-container label,
.formContainer.dark .formField textarea,
.formContainer.dark .formField select,
.formContainer.dark .formField input,
.formContainer.dark input::-webkit-input-placeholder,
.formContainer.dark textarea::-webkit-input-placeholder,
.formContainer.dark .wpforms-field-description::placeholder {
    font-size: 21px !important;
}

@media all and (max-width: 768px) {
    .property-locations {
        font-size: 16px !important;
    }
}

.swastik-logo {
    max-width: 190px;
    height: 75% !important;
    top: 5px;
    left: 70px;
}

@media (max-width: 768px) {
    .introPic {
        width: 30vw !important;
        height: 30vw !important;
    }

    .swastik-logo {
        max-width: unset;
        height: unset !important;
        top: unset !important;
        left: unset !important;
    }
}

/* XS - Extra small (portrait phones, less than 576px) */
.col-xs-12 {
    width: 100%;
}

/* SM - Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    .col-sm-3 {
        width: 25%;
    }
}

/* MD - Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .col-md-3 {
        width: 25%;
    }
}

/* LG - Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .col-lg-4 {
        width: 33.3333%;
    }
}

.footer_box {
    display: flex;
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y);
    justify-content: space-evenly;
}

.footer-row {
    display: flex;
    padding-top: 100px;
}

.footer_title {
    color: #ffffff;
    position: relative;
    font-size: 20px;
    margin-left: -22px;
    font-weight: 600;
}

.quick_links {
    padding-top: 20px;
    padding-left: 0px !important;
}

.quick_links li a {
    color: #ffffff;
    font-size: 18px;
    padding: 4px 0px;
    opacity: 0.9;
    position: relative;
}

.link-address {
    color: #ffffff;
    width: 300px;
}

.main-social {
    display: flex;
    padding-left: 0px;
    margin-top: 20px;
}

.vital-media-link {
    color: #f5bc0c;
    text-decoration: none;
    font-weight: 600;
}

.main-social li {
    padding: 5px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #97291b;
    width: 35px;
    height: 35px;
    margin-top: 0px;
    opacity: 1;
    transition: all 0.3s linear 0s;
    cursor: pointer;
    box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
}

.main-social li:hover {
    background: #1e2949;
    transition: all 0.3s linear 0s;
}

.main-social li+li {
    margin-left: 5px;
}

.social-link ul.main-social .social li+li {
    margin-left: 0px;
}

.main-social li img {
    max-width: 18px;
    display: block;
}

.quick_links li img {
    max-width: 22px;
}

.f-b-content {
    margin-top: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.f-b-content p {
    font-size: 16px;
    color: #fff;
    font-weight: 500;
    margin: 0;
    padding: 15px 0px;
}

@media only screen and (max-width: 768px) {
    .main-footer {
        padding: 50px 0 0;
    }

    .footer-logo {
        margin-bottom: 30px;
    }

    .footer-contact-info {
        margin-bottom: 30px;
    }

    .footer-contact-info h2 {
        font-size: 36px;
    }

    .footer-contact-info h3 {
        font-size: 30px;
        margin-bottom: 20px;
    }

    .footer-contact-info p {
        max-width: 100%;
    }

    .footer-social-icon ul li a {
        height: 50px;
        width: 50px;
    }

    .footer-social-icon ul li a i {
        font-size: 24px;
    }

    .footer-link-list {
        margin-top: 40px;
    }

    .footer-link-list ul li {
        margin-right: 20px;
    }

    .footer-copyright-text {
        margin-top: 30px;
        padding: 30px 0;
    }

    .footer-row {
        flex-wrap: wrap !important;
        flex-direction: column;
        padding-top: 32px;
    }
    .is-touch #hVideoLayer video{
        display: none;
    }

    .footer_box {
        flex-direction: column;
        padding-left: 20px;
        margin-bottom: 30px;
    }

    #footerSticky,
    #footerMain {
        height: auto !important;
         overflow: visible;
    }
    .footer_box .main-list{
        margin-top: 20px;
    }
    .main-social{
        margin: 20px 0px;
    }
    .f-b-content{
        margin-top: -21px;
        align-items: start;
        flex-direction: column;
    }
    .quick_links{
        padding-top: 10px;
    }
    .f-b-content p{
     padding: 5px 0px;
    }
}
.section-image img{
    max-width: 50px;
    margin-right: 10px;
    margin-top: -35px;
}
@media only screen and (max-width: 768px) {
    .section-image img{
    margin-top: 0px;
}
}
.our-gallery-title{
    line-height: 6vw;
}

@media only screen and (max-width: 768px) {
    #detailBody{
        padding-top: 60px;
    }
    .right-to-left{
        margin-bottom: 20px;
    }
    .testimonial-grid{
        margin-top: 30px;
    }
}

.call-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 2px solid #1e2949;
  border-radius: 10px;
  padding: 7px 14px;
  font-size: 16px;
  background-color: white;
  color: #1e2949;
  text-decoration: none;
  font-weight: 500;
  transition: all 0.3s ease;
  margin-right: 15px;
}

.call-button img {
  width: 20px;
  height: 20px;
  filter: brightness(0) saturate(100%) invert(15%) sepia(9%) saturate(1095%) hue-rotate(187deg) brightness(97%) contrast(88%);
}

.call-button:hover {
  background-color: #1e2949;
  color: white;
}

.call-button:hover img {
  filter: brightness(100) invert(100%);
}
.email-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 2px solid #1e2949;
  border-radius: 10px;
  padding: 7px 14px;
  font-size: 16px;
  background-color: white;
  color: #1e2949;
  text-decoration: none;
  font-weight: 500;
  transition: all 0.3s ease;
   margin-right: 15px;
}

.email-button img {
  width: 20px;
  height: 20px;
  filter: brightness(0) saturate(100%) invert(15%) sepia(9%) saturate(1095%) hue-rotate(187deg) brightness(97%) contrast(88%);
}

.email-button:hover {
  background-color: #1e2949;
  color: white;
}

.email-button:hover img {
  filter: brightness(0) invert(1);
}

@media only screen and (max-width: 768px) {
    .call-button, .email-button {
        display: none;
    }
    #prTitle{
        margin-bottom: 50px;
    }
}

.custom-contact-form {
  max-width: 600px;
  background-color: #1e2949;
  border-radius: 10px;
  color: white;
}

.custom-contact-form .form-group {
  margin-bottom: 20px;
}

.custom-contact-form input,
.custom-contact-form textarea {
  width: 100%;
  padding: 12px 15px;
  border: 1px solid white;
  border-radius: 6px;
  background-color: transparent;
  color: white;
  font-size: 16px;
  z-index: 99999;
    position: relative;
}

.custom-contact-form input::placeholder,
.custom-contact-form textarea::placeholder {
  color: #ccc;
}

.custom-contact-form textarea {
  resize: vertical;
  min-height: 120px;
}

.custom-contact-form button {
  background-color: white;
  color: #1e2949;
  border: none;
  padding: 12px 30px;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
        z-index: 9999;
    position: relative;
}

.custom-contact-form button:hover {
  background-color: #97291b;
  color: #ffffff;
}

@media only screen and (max-width: 768px) {
    .whatsapp-icon img{
        max-width: 19px !important;
    margin-bottom: 10px !important;
    }
}

@media only screen and (max-width: 768px) {
    .custom-contact-form input, .custom-contact-form textarea{
        width: 85% !important;
    }
}


@media only screen and (max-width: 768px) {
    .section-image img{
    max-width: 35px;
    }
    .review-text{
        font-size: 17px;
    }
}

.read-more-btn{
    font-size: 14px;
}

@media (max-width: 768px) {
    .link-address{
        font-size: 16px !important;
    }
    .quick_links li a{
        font-size: 16px;
    }
    .footer_title{
        font-size: 18px;
    }
    .inquire-container{
        height: 100% !important;
        justify-content: inherit;
    }
}

@media (max-width: 768px) {
.is-touch .oButton.mobileOnly {
    display: none !important;
}
}
@media (max-width:  768px) {
    #Quick_Inquiry input,
    #Quick_Inquiry textarea {
        width: 100% !important;
    }
}


.manortha-project-skim-project{
    padding: 80px 0px;
}
.project-row {
  display: flex;
  align-items: center;
  background-color: #f5f5f5;
  gap: 30px;
}

.project-image {
  width: 50%;
}

.project-image img {
  width: 100%;
  height: auto;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.project-content {
  width: 50%;
  color: #1e2949;
}

.project-content h3 {
  font-size: 24px;
  margin-bottom: 16px;
  color: #1e2949;
}

.project-content p {
  margin-bottom: 12px;
  font-size: 18px;
  line-height: 1.6;
  color: #000000;
}

.project-btn {
  display: inline-block;
  background-color: #97291b;
  color: #fff;
  padding: 10px 20px;
  text-decoration: none;
  font-weight: bold;
  border-radius: 6px;
  margin-top: 10px;
  transition: background-color 0.3s ease;
}

.project-btn:hover {
  background-color: #1e2949;
}

.explore-360-btn{
    max-width: 125px !important;
}
@media (max-width: 768px) {
.manortha-project-skim-project{
    padding: 60px 0px;
}
.project-row{
    flex-direction: column;
    gap: 15px;
}
.project-image, .project-content{
    width: 100%;
}
.project-content h3{
    font-size: 19px;
    margin-bottom: 10px;
}
.project-content p{
    font-size: 16px;
}
}


.project-image img {
    width: 100%;
    height: auto;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
 
