/*GENERALE--------------------------------------------------------------------------------------------------------*/

body {
    font-family: 'Raleway', sans-serif;
    line-height: 1;
    color: #3E3E3E;
    font-weight: 400;
    width: 100%;
    overflow-x: hidden !important;
}

.div1500 {
    width: 1500px;
    margin: auto;
}

.relative {
    position: relative;
}

#debug {
    position: fixed;
    bottom: 0px;
    right: 20px;
    background-color: rgba(0, 0, 0, 0.68);
    color: #fff;
    padding: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: 10pt;
    display: block;
    z-index: 9;
}

.clear {
    clear: both;
}

.fancybox-container {
    z-index: 99999999 !important;
}

h1 {
    font-family: 'Playfair Display', serif;
    font-weight:400;
    line-height:1.2;
}

h2 {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    line-height: 1.2;
}

h3 {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
}

h4 {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
}

h5 {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
}

p {
    font-size:14px;
    padding:0 !important;
    margin:0 !important;
    line-height:1.8;
}

.button {
    display: inline-block;
    width: 190px;
    height: 60px;
    background-color: var(--beige);
    transition: all 0.5s;
    text-decoration: none;
    position: relative;
    -webkit-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.25);
    letter-spacing:2px;
}

.button:hover {
    background-color: var(--beige-bg-hover);
}

.button span{
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
    margin: 0 auto;
    transform: translateY(-50%);
    z-index: 9;
    font-size:13px;
    color:var(--white);
    font-family: 'Playfair Display', serif;
    text-transform:uppercase;
}

.buttonShopping{
    width:300px !important;
}

.buttonSmall {
    height: 35px;
    width: 120px;
}

.buttonSmall span {
    font-size: 10px !important;
}

.backgroundCoverCenter{
    background-position:center center;
    background-repeat:no-repeat;
    background-size:cover;
}

:root {
    --white: #FFFFFF;
    --light-bg: #F8F5F1;
    --beige-bg: #E2D7CC;
    --beige-bg-hover: #9A7F5D;
    --beige: #AA9274;
    --brown: #8E6D45;
    --dark-brown: #3A3736;
    --dark-gray: #3A3736;
}

.smallTit {
    position: absolute;
    top: 150px;
    left:0;
    right: 0;
    text-align:center;
    margin:0 auto;
    z-index: 999;
    width:700px;
}

.smallTit h3 {
    position: relative;
    overflow: hidden;
}

.smallTit h3 span {
    display: inline-block;
    vertical-align: baseline;
    zoom: 1;
    *display: inline;
    *vertical-align: auto;
    position: relative;
    padding: 0 20px;
     font-size: 14px;
    color: var(--white);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: 'Playfair Display', serif;
}
.smallTit h3 span:before,
.smallTit h3 span:after {
    content: '';
    display: block;
    width: 1000px;
    position: absolute;
    top: 7px;
    border-top: 1px solid var(--beige);
}
.smallTit h3 span:before {
    right: 100%;
}
.smallTit h3 span:after {
    left: 100%;
}

.buttonTab{
    width:230px !important;
    line-height:1.2;
}


/*TOP --------------------------------------------------------------------------------------------------------*/
.top {
    transition: all 0.5s;
}

.top.close {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    display:none !important;
    opacity:0 !important;
}

.top.openM {
    position:relative;
    z-index:999999;
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.topLeft{
    position:absolute;
    top:50px;
    left:50px;
    z-index:999;
}

.topLogo {
    position: absolute;
    top: 15px;
    left: 0;
    right:0;
    text-align:center;
    margin:0 auto;
    z-index: 999;
    width:200px;
}

.topLogo img{
    width: 200px;
}

.topRight {
    position: absolute;
    top: 40px;
    right: 40px;
    z-index: 999;
}

.topLang{
    display:inline-block;
    margin-right:40px;
}

.topLang a {
    font-size: 14px;
    color: var(--white);
    text-decoration:none;
}

.topLang a:hover {
    color: var(--beige);
}

.topLang span {
    font-size: 14px;
    color: var(--white);
    margin:0 3px;
}

.topFind{
    display:inline-block;
}

.topFind span {
    font-size: 13px;
    color: var(--white);
    font-weight: 600;
    margin-right: 5px;
    display: inline-block;
    vertical-align:middle;
}

.topFind img{
    font-size:13px;
    color: var(--white);
    font-weight:600;
    margin-right:5px;
    display:inline-block;
    vertical-align:middle;
}

.topRight a {
    font-size: 15px;
    color: var(--white);
    text-decoration: none;
    letter-spacing:2px;
    cursor:pointer;
}

.topRight a:hover {
    color: var(--beige);
}

.topRight span {
    font-size: 15px;
    color: var(--white);
    margin:0 25px;
}

.hamburger {
    display: inline-block;
    text-align: right;
    width: 30px;
    margin-right: 25px;
    vertical-align: middle;
    cursor: pointer;
}

.hamburger:hover .strip{
    background-color: var(--beige);
}

.hamburger2.open {
    width: 24px;
    padding-bottom:4px;
}

.strip {
    width: 30px;
    height: 2px;
    background-color: var(--white);
    margin: 5px 0 0 auto;
    text-align: right;
}

.strip2 {
    width: 20px;
}

#top {
  margin-top: 17px;
  -webkit-transition: all 0.25s ease;
  -moz-transition: all 0.25s ease;
  -ms-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  transition: all 0.25s ease;
}
#top.topRotate {
    transform-origin: center;
    transform: translateY(5px) rotateZ(45deg);
    width: 20px;
}

#bottom {
    margin-bottom: 17px;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -ms-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
    
}
#bottom.bottomRotate {
    transform-origin: center;
    transform: translateY(-2px) rotateZ(-45deg);
    
}

#top2 {
  margin-top: 3px;
  -webkit-transition: all 0.25s ease;
  -moz-transition: all 0.25s ease;
  -ms-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  transition: all 0.25s ease;
}
#top2.topRotate {
    transform-origin: center;
    transform: translateY(5px) rotateZ(45deg);
    width: 20px;
}

#bottom2 {
    margin-bottom: 3px;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -ms-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
    
}
#bottom2.bottomRotate {
    transform-origin: center;
    transform: translateY(-2px) rotateZ(-45deg);
    
}

/*MENU --------------------------------------------------------------------------------------------------------*/
.menu {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: var(--dark-brown);
    width: 100%;
    height: 70px;
    z-index: 999;
    display: none;
    transition: all 0.5s;
}

.menu.open {
    display: block;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -webkit-animation-duration: 0.7s;
    animation-duration: 0.7s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.menuLogo{
    float:left;
    width:220px;
    padding:15px 0 0 20px;
    box-sizing:border-box;
}

.menuNav {
    float: left;
    width: calc(100% - 540px);
    text-align:center;
    padding-top:28px;
}

.menuNav a{
    font-size:15px;
    color:var(--white);
    text-transform:uppercase;
    text-decoration:none;
    margin:0 25px;
}

.menuNav a:hover{
    color:var(--beige);
}

.menuButtons{
    float:left;
    width:320px;
}

.menuLang{
    float:left;
    width:160px;
    height:70px;
    padding-top:27px;
    text-align:center;
    background-color:var(--brown);
    box-sizing:border-box;
}

.menuLang a {
    font-size: 14px;
    color: var(--white);
    text-decoration: none;
}

.menuLang a:hover {
    color: var(--beige);
}

.menuLang span {
    font-size: 14px;
    color: var(--white);
    margin: 0 3px;
}

.buttonPrenota {
    float:left;
    width: 160px;
    height: 70px;
    background-color: var(--beige);
    transition: all 0.5s;
    text-decoration: none;
    position: relative;
}

.buttonPrenota:hover {
    background-color: var(--beige-bg-hover);
}

.buttonPrenota span {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
    margin: 0 auto;
    transform: translateY(-50%);
    z-index: 9;
    font-size: 15px;
    color: var(--white);
    font-weight:700;
    text-transform: uppercase;
    letter-spacing:2px;
}

.menuLabel {
    display: none !important;
    background-color: var(--beige);
    padding: 10px 10px;
    color: var(--white);
}

.menuLabel.open {
    display: block !important;
}

.menuLabel.close {
    display: none !important;
}

.menuLabel  .hamburger:hover .strip {
    background-color: var(--white);
}

.menuLabel .hamburger {
    margin-right:5px;
}

.menuLabelMenu{
    display:block !important;
    font-size:11px;
    padding-top:5px;
}

.menuMobile {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    display: none;
    transition: all 0.5s;
    background-image:url('../Gfx/hotel-alexander-livigno-slider.jpg');
}

.menuMobile.open {
    display: block;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -webkit-animation-duration: 0.7s;
    animation-duration: 0.7s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.menuMobileOverlay {
    position: absolute;
    background: rgba(58,55,54,0.95);
    width: 100%;
    height: 100%;
    z-index: 99;
}

.menuMobileLogo {
    text-align: center;
    padding-top: 50px;
    position: relative;
    z-index: 999;
}

.menuMobileLogo img{
    width:200px;
}

.menuMobileTit {
    padding-top:50px;
    text-align:center;
    margin:0 auto;
    z-index: 999;
    width:100%;
}

.menuMobileTit h3 {
    position: relative;
    overflow: hidden;
}

.menuMobileTit h3 span {
    display: inline-block;
    vertical-align: baseline;
    zoom: 1;
    *display: inline;
    *vertical-align: auto;
    position: relative;
    padding: 0 20px;
    font-size: 14px;
    color: var(--beige);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: 'Playfair Display', serif;
}
.menuMobileTit h3 span:before,
.menuMobileTit h3 span:after {
    content: '';
    display: block;
    width: 1000px;
    position: absolute;
    top: 7px;
    border-top: 1px solid var(--beige);
}
.menuMobileTit h3 span:before {
    right: 100%;
}
.menuMobileTit h3 span:after {
    left: 100%;
}

.menuMobileContainer {
    padding-top:30px;
    text-align: center;
    margin: 0 auto;
}

.menuMobileContainer a{
    font-size:18px;
    color:var(--white);
    text-transform:uppercase;
    text-decoration:none;
    display:block;
    padding:15px 0;
}

.menuMobileContainer a:hover{
    color:var(--beige);
}

.accordionMenu a {
    width: 100% !important;
    display: block !important;
    cursor: pointer !important;
    font-size: 18px !important;
    font-family: 'Raleway', sans-serif !important;
    text-transform: uppercase !important;
    margin-top: 0 !important;
    margin-bottom: unset !important;
    line-height: unset !important;
}

.menuMobile .button{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    width:100%;
    z-index:999;
}

.menuCamere, .menuFood, .menuSpa {
    display: none;
}

.menuCamere.active, .menuFood.active, .menuSpa.active {
    display: block;
    width: 100%;
    height: 180px;
    background-color: var(--beige-bg);
    position: absolute;
    z-index: 99;
    top: 60px;
    left: 0;
    padding: 30px 0;
}

.linkHover {
    font-size: 15px;
    color: var(--white);
    text-transform: uppercase;
    text-decoration: none;
    display:inline-block;
}

.linkHover:hover {
    color: var(--beige);
}

.linkCamere, .linkFood, .linkSpa {
    height: 36px;
    display: inline-block;
    box-sizing: border-box;
}

.menuCamereContainer, .menuFoodContainer, .menuSpaContainer{
    width:1023px;
    margin:0 auto;
}

.menuCamereBox {
    float: left;
    width: 23%;
    margin: 0 1%;
    text-align: center;
}

.menuCamereBoxImageContainer {
    width: 100%;
    height: 150px;
    overflow: hidden;
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.menuCamereBoxImage {
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-transition: all .95s;
    -moz-transition: all .95s;
    -o-transition: all .95s;
    transition: all .95s;
    z-index: 8;
}

.menuCamereBoxImageContainer:hover .menuCamereBoxImage, .menuCamereBoxImageContainer:focus .menuCamereBoxImage {
    -ms-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.menuCamereBoxImageContainer:hover .menuCamereBoxImage:before, .menuCamereBoxImageContainer:focus .menuCamereBoxImage:before {
    display: block;
}

.menuCamereBoxImage:before {
    content: "";
    display: none;
    height: 150px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(170,146,116,0.50);
}

.menuCamereBoxImageContainer a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.correlatiBoxImageContainer a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.menuCamereBox h2 {
    font-size: 17px;
    color: var(--brown);
    padding-top: 10px;
}

/*HEADER --------------------------------------------------------------------------------------------------------*/
.header {
    width: 100%;
    position: relative;
    z-index: 9;
    height:100vh;
}

.footerOfferte {
    width: 100%;
    position: relative;
    z-index: 9;
    height: 100vh;
}

.headerOverlay {
    position: absolute;
    background: rgba(0,0,0,0.33);
    width: 100%;
    height: 100%;
    z-index: 99;
    top:0;
}

.headerOverlayGradient {
    position: absolute;
    background: rgb(17,17,17);
    background: -moz-linear-gradient(0deg, rgba(17,17,17,0.5550595238095238) 0%, rgba(18,18,18,0.48783263305322133) 22%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(0deg, rgba(17,17,17,0.5550595238095238) 0%, rgba(18,18,18,0.48783263305322133) 22%, rgba(255,255,255,0) 100%);
    background: linear-gradient(0deg, rgba(17,17,17,0.5550595238095238) 0%, rgba(18,18,18,0.48783263305322133) 22%, rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#111111",endColorstr="#ffffff",GradientType=1);
    width: 100%;
    height: 100%;
    z-index: 99;
}

.headerOverlayGradientRight {
    position: absolute;
    background: rgb(17,17,17);
    background: -moz-linear-gradient(270deg, rgba(17,17,17,0.5550595238095238) 0%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(270deg, rgba(17,17,17,0.5550595238095238) 0%, rgba(255,255,255,0) 100%);
    background: linear-gradient(270deg, rgba(17,17,17,0.5550595238095238) 0%, rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#111111",endColorstr="#ffffff",GradientType=1);
    width: 100%;
    height: 100%;
    z-index: 99;
}

.headerContainer {
    position: absolute;
    top: 50%;
    left:0;
    right:0;
    text-align:center;
    margin:0 auto;
    transform: translateY(-50%);
    z-index: 999999;
    width:815px;
}

.headerContainerBottom {
    position: absolute;
    bottom: 170px;
    left: 0;
    right: 0;
    text-align: center;
    margin: 0 auto;
    z-index: 999999;
    width: 920px;
}

.headerContainer h1 {
    font-size: 65px;
    color: var(--white);
}

.headerContainer h2 {
    font-size: 17px;
    color: var(--white);
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 25px;
}

.headerContainerBottom h2 {
    font-size: 65px;
    color: var(--white);
}

.headerContainerBottom p {
    font-size: 14px;
    color: var(--white);
    padding:30px 0 50px 0 !important;
    display:block;
}

.headerContainerBottom a {
    margin:0 5px;
}

.scroll {
    position: absolute;
    text-align: center;
    margin: 0 auto;
    height: 110px;
    left:0;
    right: 0;
    bottom: 0;
    font-weight: 300;
    z-index: 200;
}

.scroll .hr {
    color: var(--white);
    position: relative;
    border: none;
    width: 1px;
    height: 110px;
    margin: 0 auto 0 auto;
    padding: 0 10px;
    padding-top: 10px;
    cursor: pointer;
}

.scrollSpeciale .hr {
    color: var(--white) !important;
}

.scroll .hr .hrIn {
    background-color: var(--white);
    position: absolute;
    bottom: 0;
    z-index: 999;
    height: 105px;
    width: 1px;
    animation: scroll 2s infinite;
}

.scrollSpeciale .hr .hrIn {
    background-color: var(--white);
}

@keyframes scroll {
    0% {
        height: 110px;
    }

    50% {
        height: 90px;
    }

    100% {
        height: 110px;
    }
}

@keyframes scroll {
    0% {
        height: 110px;
    }

    50% {
        height: 90px;
    }

    100% {
        height: 110px;
    }
}

@keyframes scrollSpan {
    0% {
        top: -20px;
    }

    50% {
        top: 0;
    }

    100% {
        top: -20px;
    }
}

.scrollSpan {
    font-size: 12px;
    color: var(--white);
    letter-spacing: 2px;
    cursor: pointer;
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    text-align: center;
    margin: 0 auto;
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    animation: scrollSpan 2s infinite;
}

.boxRichiestaDesktop{
    margin-top:50px;
}

.boxRichiestaMobile {
    display:none;
}

.boxRichiestaBox {
    float: left;
    width: 18%;
    height: 115px;
    box-sizing: border-box;
    text-align: center;
    padding: 0;
    position: relative;
    background: rgba(58,55,54,0.74);
}

.boxRichiestaBoxSelect {
    background-image: url('../Gfx/select.svg');
    background-repeat: no-repeat;
    background-position: top 50% right 15px;
    width: 20%;
}

.boxRichiestaBoxButton {
    padding: 0 !important;
    border-bottom: none;
}

.boxRichiestaBoxContainer {
    position: absolute;
    top: 50%;
    right: 0;
    width: 100%;
    transform: translateY(-50%);
    z-index: 9999;
}

.boxRichiestaBoxContainer2 {
    padding-top: 17px;
}

.boxRichiestaBox span {
    font-size: 14px !important;
    color: var(--white) !important;
    display: block;
    margin: 0 !important;
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.titdata{
    
}

.data span {
    font-size: 44px !important;
    color: var(--white);
    font-family: 'Playfair Display', serif;
    display: block;
    padding-top: 0 !important;
    margin: 0 !important;
}

.data b {
    font-size: 14px;
    color: var(--white);
    display: block;
    vertical-align: middle;
    margin-top: 7px;
    text-align: center;
    line-height: 1.2;
    font-family: 'Playfair Display', serif;
    font-weight:400;
}

.boxRichiestaBox input {
    border: none;
    height: 44px;
    font-size: 44px;
    color: var(--white);
    font-family: 'Playfair Display', serif;
    width: 50px;
    text-align: center;
    /*margin-top: 14px;*/
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: transparent;
    margin-left: 15px;
}

.boxRichiestaBox input[type=text] {
    display: block;
    width: 0px;
    height: 0px;
    opacity: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.ui-datepicker{
    z-index:99999999999999 !important;
}

.boxRichiestaDesktop a {
    float: left;
    width: 20%;
    margin-left:2%;
    height: 115px;
    background-color: var(--beige);
    transition: all 0.5s;
    text-decoration: none;
    position: relative;
    -webkit-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.25);
    letter-spacing: 2px;
}

.boxRichiestaDesktop a:hover {
    background-color: var(--beige-bg-hover);
}

.boxRichiestaDesktop a span {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
    margin: 0 auto;
    transform: translateY(-50%);
    z-index: 9;
    font-size: 14px;
    color: var(--white);
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
}

/*SCROLL PAGE --------------------------------------------------------------------------------------------------------------------------------*/
.background {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  overflow: hidden;
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  height: 130vh;
  position: fixed;
  width: 100%;
  -webkit-transform: translateY(50vh);
  -ms-transform: translateY(20vh);
  transform: translateY(20vh);
  -webkit-transition: all 1.4s cubic-bezier(0.22, 0.44, 0, 1);
  transition: all 1.4s cubic-bezier(0.22, 0.44, 0, 1);
}

.background:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.background:first-child {
    /*background-image: url('/Gfx/hotel-alexander-livigno-slider.jpg');*/
    -webkit-transform: translateY(-10vh);
    -ms-transform: translateY(-10vh);
    transform: translateY(-10vh);
}

.background:first-child .content-wrapper {
  -webkit-transform: translateY(10vh);
  -ms-transform: translateY(10vh);
  transform: translateY(10vh);
}

/* Set stacking context of slides */

.background:nth-child(1) { z-index: 12; }

.background:nth-child(2) { z-index: 11; }

.background:nth-child(3) { z-index: 10; }

.background:nth-child(4) { z-index: 9; }

.background:nth-child(5) { z-index: 8; }

.background:nth-child(6) { z-index: 7; }

.background:nth-child(7) { z-index: 6; }

.background:nth-child(8) { z-index: 5; }

.background:nth-child(9) { z-index: 4; }

.background:nth-child(10) { z-index: 3; }

.background:nth-child(11) { z-index: 2; }

.background:nth-child(12) { z-index: 1; }


.content-wrapper {
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    display: flex;
    justify-content: center;
    flex-flow: column nowrap;
    -webkit-transform: translateY(40vh);
    transform: translateY(40vh);
    will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: all 1.7s cubic-bezier(0.22, 0.44, 0, 1);
}

.background.up-scroll {
    -webkit-transform: translate3d(0, -15vh, 0);
    transform: translate3d(0, -15vh, 0);
}

    .background.up-scroll .content-wrapper {
        -webkit-transform: translateY(15vh);
        transform: translateY(15vh);
    }

    .background.up-scroll + .background {
        -webkit-transform: translate3d(0, 30vh, 0);
        transform: translate3d(0, 30vh, 0);
    }

        .background.up-scroll + .background .content-wrapper {
            -webkit-transform: translateY(30vh);
            transform: translateY(30vh);
        }

.background.down-scroll {
    -webkit-transform: translate3d(0, -130vh, 0);
    transform: translate3d(0, -130vh, 0);
}

    .background.down-scroll .content-wrapper {
        -webkit-transform: translateY(40vh);
        transform: translateY(40vh);
    }

    .background.down-scroll + .background:not(.down-scroll) {
        -webkit-transform: translate3d(0, -15vh, 0);
        transform: translate3d(0, -15vh, 0);
    }

        .background.down-scroll + .background:not(.down-scroll) .content-wrapper {
            -webkit-transform: translateY(15vh);
            transform: translateY(15vh);
        }

/*INTRO --------------------------------------------------------------------------------------------------------------------------------*/
.videoContainer {
    position: absolute;
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    overflow: hidden;
    top:0;
}

    .videoContainer video {
        object-fit: cover;
        width: 100vw;
        height: 100vh;
        height: calc(var(--vh, 1vh) * 100);
        position: absolute;
        top: 0;
        left: 0;
    }

.intro {
}

.introLeft {
    float: left;
    width: 50%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    background-color: var(--light-bg);
    position: relative;
}

.introLeft2 {
    float: right;
}

.introLeftGallery {
    background-color: var(--beige-bg);
}

.introLeftContainer {
    position: absolute;
    top: 55%;
    left: 18%;
    right: 18%;
    text-align: left;
    transform: translateY(-50%);
    z-index: 9;
    width: 64%;
}

.introLeftContainerInside {
    top: 50%;
}

.introLeftContainerGallery {
    left: 20%;
    right: 20%;
    text-align: center;
    width: 60%;
}

.introLeft h3 {
    position: absolute;
    top: 120px;
    right: 120px;
    font-size: 14px;
    color: var(--beige);
    text-transform: uppercase;
    letter-spacing: 2px;
    z-index: 999;
}

.introLeft h4 {
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding-top:30px;
}

.introLeft h2{
    font-size:39px;
    color:var(--brown);
    line-height:1.4;
}

.introLeft b {
    font-size: 14px;
    font-weight:400;
    text-transform: uppercase;
    display: block;
    padding: 25px 0 45px 0;
    font-family: 'Playfair Display', serif;
}

.introLeft p{
    margin-top:40px !important;
}

.introLeftContainerLine{
    position:relative;
}

.introLeftContainerLine hr {
    position: absolute;
    top: 50px;
    color: var(--beige);
    background-color: var(--beige);
    height: 1px;
    border: none;
    width: 120px;
    left: -173px;
}

.hrTitInside {
    top: 28px !important;
}

.hrtit {
    position: absolute;
    top: 125px;
    left:0;
    right:0;
    text-align:center;
    margin:0 auto;
    color: var(--beige);
    background-color: var(--beige);
    height: 1px;
    border: none;
    width: 160px;
    z-index:999;
}

.hrtit2 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    margin: 0 auto;
    color: var(--beige);
    background-color: var(--beige);
    height: 1px;
    border: none;
    width: 430px;
    z-index: 999;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.introRight {
    float: left;
    width: 50%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
}

.introRightSpecial{
    width:100%;
    height:100vh;
    height:calc(var(--vh, 1vh) * 100);
}

.introRight2 {
    float: right;
}

.introMob {
    display:none;
    background-image: url('/Gfx/hotel-alexander-livigno-intro.jpg');
}

.introLeftInside a{
    margin-top:70px;
}

.introLeftInside h2 {
    font-size:50px;
}

.introLeftInside a {
    margin-right: 10px;
}

.introRoom {
    margin-top:40px;
}

.introRoomCorrelati {
    margin:25px 0 35px 0;
}

.introRoomBox {
    float: left;
    padding: 0 40px;
    border-right: solid 1px #EFE7DF;
    text-align:center;
}

.introRoomBoxCorrelati {
    padding: 0 20px;
    float:unset;
    display:inline-block;
}

.introRoomBox:first-child {
    padding-left:0 !important;
}

.introRoomBox:nth-last-child(2) {
    border-right: none !important;
}

.introRoomBox label {
    font-size: 37px;
    font-weight: 400;
    font-family: 'Playfair Display', serif;
    display:block;
}

.introRoomBox span {
    font-size: 17px;
    font-family: 'Playfair Display', serif;
    display:block;
    text-transform:uppercase;
    padding-top:25px;
}

.introRoomBoxCorrelati label {
    font-size: 30px !important;
}

.introRoomBoxCorrelati span {
    font-size: 14px !important;
    padding-bottom:0 !important;
}

.introSport {
    margin:40px 0 50px 0;
}

.introSportBox {
    float: left;
    /*border-right: solid 1px #EFE7DF;*/
    text-align: center;
    /*width:120px;*/
    box-sizing:border-box;
}

.introSportBox:first-child {
    padding-left: 0 !important;
}

.introSportBox:last-child {
    border-right: none !important;
}

.introSportBox label {
    font-size: 13px;
    font-weight: 400;
    font-family: 'Playfair Display', serif;
    display: block;
    text-transform: uppercase;
    padding: 10px 25px;
    line-height: 1.2;
}

.introSportBox span {
    font-size: 40px;
    display: block;
}

#sliderEstate .slick-dots, #sliderInverno .slick-dots {
    bottom: -25px;
    z-index: 9;
}

.introDetails {
    margin-top:40px;
}

.introDetailsBox {
    float: left;
    padding: 0 40px;
    border-right: solid 1px #EFE7DF;
    text-align: center;
    width: 170px !important;
    box-sizing: border-box;
}

.introDetailsBox:first-child {
    padding-left: 0 !important;
}

.introDetailsBox:last-child {
    border-right: none !important;
    padding-right:0 !important;
}

.introDetailsBox label {
    font-size: 14px;
    font-weight: 400;
    font-family: 'Playfair Display', serif;
    display: block;
    text-transform: uppercase;
    padding-top: 15px;
    line-height: 1.2;
}

.introDetailsBox span {
    font-size: 45px;
    display: block;
}

.introDetailsBox p {
    font-size: 13px;
    display: block;
    margin-top:10px !important;
    line-height:1.2 !important;
}

.introDetailsBox a {
    font-size: 15px;
    color: var(--brown);
    font-family: 'Playfair Display', serif;
    text-transform:uppercase;
    margin: 15px 0 0 0;
    display:block;
}

.introDetailsBox a:hover {
    color: var(--beige);
}

.introDetailsBoxRestaurant{
    width:180px !important;
    padding:0 0 0 20px !important;
}

.introDetailsBoxRestaurant p{
    font-size:12px !important;
}

.sliderDetailsBoxBB .slick-track{
    margin-left:0;
    margin-right:0;
}

.popup {
    display: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.popupContainer {
    padding: 30px;
}

.galleryHide{
    display:none;
}

.linkRegolamento {
    font-size: 16px;
    color: var(--brown);
    font-family: 'Playfair Display', serif;
    text-transform:uppercase;
    display:block;
    margin-top:20px !important;
    width:100% !important;
}

.linkRegolamento:hover {
    color: var(--beige);
}

.headerContainerRight {
    position: absolute;
    top: 50%;
    right: 5%;
    text-align: left;
    transform: translateY(-50%);
    z-index: 99;
    width: 400px;
}

.headerContainerRight h4 {
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding-top: 30px;
    color: var(--white);
}

    .headerContainerRight h2 {
        font-size: 39px;
        color: var(--white);
        line-height: 1.4;
    }

.headerContainerRight p {
    font-size: 14px;
    color: var(--white);
    padding-top: 30px !important;
    display:block;
}

ul.tabs2 {
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0 auto;
    width: 100%;
    text-align: left;
    padding-bottom:40px;
}

ul.tabs2 li {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    margin-right:40px;
    position:relative;
    z-index:999;
}

ul.tabs2 li:last-child {
    margin-right: 0;
}

ul.tabs2 li a {
    text-decoration: none;
    display: block;
    outline: none;
    transition: all 0.5s ease 0s;
    color: var(--dark-gray);
    font-size: 14px;
    font-weight: 300;
    display: table;
    margin: 0 auto;
    font-family: 'Playfair Display', serif;
    text-transform:uppercase;
    width:unset !important;
}

ul.tabs2 li a:hover {
    color: var(--brown);
}


html ul.tabs2 li.active a, html ul.tabs2 li.active a {
    color: var(--brown);
}

.tabContainer2 {
    position: relative;
    margin: 0 auto;
    padding:15px 0 30px 0;
}

.introLeftContainerMap {
    text-align: center !important;
    top: 0 !important;
    transform: unset !important;
    left: 5%;
    right: 5%;
    width: 90%;
}

.introLeftContainerMap hr {
    text-align: center;
    margin: 0 auto;
    color: var(--beige);
    background-color: var(--beige);
    height: 1px;
    border: none;
    width: 380px;
    z-index: 999;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.introLeftContainerMap h2{
    margin-top:270px;
}

.introLeftContainerMap p{
    font-size:18px;
    line-height:2;
    letter-spacing:2px;
    display:block;
    padding-bottom:70px;
    margin-top:60px !important;
}

.introLeftContainerMap a{
    width:270px;
}

.map {
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
}

.mapContainer{
    position:relative;
}

.overlayMap {
    background: transparent;
    position: absolute;
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    top: 0; /* your iframe height */
}

.comeArrivare{
    margin-top:50px;
}

.accordion {
  margin: 0 auto 20px;
}
.accordion li {
  position: relative;
}
.accordion li p {
  display: none;
  padding: 10px 0;
  margin:10px 0 20px !important;
}
.accordion a {
    width: 94% !important;
    display: block;
    cursor: pointer;
    font-size: 16px;
    font-family: 'Playfair Display', serif;
    text-transform:uppercase;
    margin-top: 0!important;
    margin-bottom:30px;
    line-height:1.2;
}
.accordion a:after {
  width: 8px;
  height: 8px;
  border-right: 1px solid var(--brown);
  border-bottom: 1px solid var(--brown);
  position: absolute;
  right: 10px;
  content: " ";
  top: 3px;
  transform: rotate(-45deg);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.accordion p {
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 2;
  padding: 10px;
}

a.active:after {
  transform: rotate(45deg);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.firma{
    margin-top:30px;
}

.accordionMenu{
    margin:0 !important;
}

.accordionMenu {
    margin: 0 auto;
}
.accordionMenu li {
    position: relative;
}
.accordionMenu li p {
    display: none;
    padding: 10px 0;
    margin: 0 0 5px !important;
}
.accordionMenu li p span {
    display: block;
    font-size: 15px;
    color:var(--beige);
    text-transform:uppercase;
    cursor:pointer;
    line-height:1.5;
}
.accordionMenu li p span:hover {
    color:var(--brown);
}
.accordionMenu a {
    width: 100% !important;
    display: block;
    cursor: pointer;
}
.accordionMenu p {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 2;
    padding: 5px;
}


/*CAMERE HOME --------------------------------------------------------------------------------------------------------------------------------*/
.camereHome {
    background-image: url('/Gfx/Homepage/hotel-alexander-livigno-camere.jpg');
}

/*RISTORANTE HOME --------------------------------------------------------------------------------------------------------------------------------*/
.ristoranteHome h2 {
    width:360px;
}

.ristoranteHome p {
    padding-bottom:50px !important;
}

.ristoranteHome p {
    padding-bottom: 50px !important;
}

.buttonContainer{
    margin-left:-2%;
}

.buttonContainer a{
    width:22% !important;
    margin-left: 2%;
}

/*WELLNESS HOME --------------------------------------------------------------------------------------------------------------------------------*/
.wellnessHome {
    background-image: url('/Gfx/Homepage/hotel-alexander-livigno-wellness.jpg');
}

/*CORRELATI --------------------------------------------------------------------------------------------------------------------------------*/
.correlati {
    height: calc(var(--vh, 1vh) * 100);
    background-color: var(--light-bg);
    text-align:center;
}

.correlati hr {
    text-align: center;
    margin: 0 auto;
    color: var(--beige);
    background-color: var(--beige);
    height: 1px;
    border: none;
    width: 280px;
    z-index: 999;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.correlati span {
    font-size: 14px;
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    letter-spacing: 2px;
    display: block;
    padding: 190px 0 20px 0;
}

.correlati h2 {
    font-size: 39px;
    color: var(--brown);
}

.correlatiContainer{
    margin-top:70px;
    margin-left:-3%;
    padding:0 3%;
}

.correlatiContainerRoom {
    margin-top: 40px;
    margin-left: -3%;
    padding: 0 3%;
}

.correlatiBox{
    float:left;
    width:30.3%;
    margin-left:3%;
    text-align:center;
}

.correlatiBoxImageContainer {
    width: 100%;
    height: 250px;
    overflow: hidden;
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.correlatiBoxImage {
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-transition: all .95s;
    -moz-transition: all .95s;
    -o-transition: all .95s;
    transition: all .95s;
    z-index: 8;
}

.correlatiBoxImageContainer:hover .correlatiBoxImage, .correlatiBoxImageContainer:focus .correlatiBoxImage {
    -ms-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.correlatiBoxImageContainer:hover .correlatiBoxImage:before, .correlatiBoxImageContainer:focus .correlatiBoxImage:before {
    display: block;
}

.correlatiBoxImage:before {
    content: "";
    display: none;
    height: 250px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(170,146,116,0.50);
}

.correlatiBoxImageContainer a{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

.correlatiBox h2 {
    font-size: 35px;
    color: var(--brown);
    padding-top: 30px;
}

.correlatiBox span {
    font-size: 16px;
    font-family: 'Playfair Display', serif;
    display:block;
    padding:20px 0 25px 0;
}

.correlatiBox a span {
    padding: 0 !important;
    font-size:13px !important;
}

/*RICHIESTA DISPONIBILITA --------------------------------------------------------------------------------------------------------------------------------*/
.richiestaDisponibilita {
    height: calc(var(--vh, 1vh) * 100);
    background-color: var(--light-bg);
    text-align: center;
    position:relative;
}

.richiestaDisponibilita hr {
    position: absolute;
    top: 0;
    left: -100px;
    margin: 0 auto;
    color: var(--beige);
    background-color: var(--beige);
    height: 1px;
    border: none;
    width: 430px;
    z-index: 999;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.richiestaDisponibilita h3 {
    position: absolute;
    top: 350px;
    left: 5px;
    font-size:14px;
    text-transform:uppercase;
    letter-spacing:2px;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.richiestaDisponibilitaContainer {
    position: absolute;
    top: 50%;
    right: 0;
    width: 100%;
    transform: translateY(-50%);
    z-index: 9999;
}

.richiestaDisponibilitaContainer h2 {
    font-size: 39px;
    color: var(--brown);
    line-height: 1.4;
}

.richiestaDisponibilitaContainer p{
    font-size:16px;
    padding:20px 50px 0 50px !important;
}

.richiesta {
    text-align: center;
    margin: 70px 20% 0 20%;
}

.richiestaTbs {
    width: 14.8%;
    display: inline-block;
    margin: 0 0.5%;
    position: relative;
    vertical-align: middle;
}

.richiestaTb2 {
    width: 44%;
    display: inline-block;
    margin: 0 0.5%;
    position: relative;
    vertical-align: middle;
}

.richiestaTb3 {
    width: 31%;
    display: inline-block;
    margin: 0 0.5%;
    position: relative;
    vertical-align: middle;
}

.richiestaTb {
    width: 95.8%;
    display: inline-block;
    position: relative;
    margin: 0 0.5%;
}

.richiestaPrivacy {
    width: 95%;
    margin: 0 0.5%;
    display: inline-block;
    color: #7B7B7B;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.2;
    text-align: left;
    margin-top: 10px;
    box-sizing: border-box;
    overflow-y: auto;
    height: 70px;
    padding-right: 25px;
}

.richiestaPrivacy strong{
    font-size:14px;
    color: #373646;
    display:block;
    font-weight:400;
}

.richiestaPrivacy b {
    color: #373646;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    margin-bottom: 10px;
    display: inline-block;
}

.richiestaCb {
    width: 95%;
    margin: 0 0.5%;
    display: inline-block;
    color: #373646;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.4;
    text-align: left;
    margin-top: 10px;
}

.richiestaInvia {
    width: 100%;
    display: inline-block;
    text-align: center;
    margin: 50px auto 0 auto;
}

.richeistaLabel {
    position: relative;
    display: inline-block;
    width: 100%;
}

.required {
    color: #fff;
    z-index: 999999;
}

.obbligatorio {
    color: #FFFFFF !important;
    right: 10px;
    z-index: 999999;
    line-height: 1.8;
    background-color: #B7202D;
    padding: 30px;
    width: 30%;
    margin: 30px auto 0 auto;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.obbligatorioPrivacy {
    color: #B7202D !important;
    margin: 10px auto 0 auto;
    font-size:12px;
    text-align:left;
}

.obbligatorio span {
    display: block;
}

.richeistaLabel input {
    font-size: 12px !important;
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    text-transform:uppercase;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    border: solid 1px #DFD3C6;
    background-color: transparent;
    padding: 20px;
    width: 100%;
    margin-bottom: 0;
    outline: none;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.richeistaLabel input::-webkit-input-placeholder, richeistaLabel select::-webkit-input-placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    font-weight: 400;
}

.richeistaLabel input:-ms-input-placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    font-weight: 400;
}

.richeistaLabel input::-ms-input-placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    font-weight: 400;
}

.richeistaLabel input::placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    font-weight: 400;
}

.richeistaLabel input:focus, .richeistaLabel input.populated {
    padding-top: 28px;
    padding-bottom: 12px;
}

.richeistaLabel input:focus::-webkit-input-placeholder, .richeistaLabel input.populated::-webkit-input-placeholder {
    color: transparent;
}

.richeistaLabel input:focus:-ms-input-placeholder, .richeistaLabel input.populated:-ms-input-placeholder {
    color: transparent;
}

.richeistaLabel input:focus::-ms-input-placeholder, .richeistaLabel input.populated::-ms-input-placeholder {
    color: transparent;
}

.richeistaLabel input:focus::placeholder, .richeistaLabel input.populated::placeholder {
    color: transparent;
}

.richeistaLabel input:focus + span, .richeistaLabel input.populated + span {
    opacity: 1;
    top: 10px;
}

.richiestaSpan {
    color: var(--brown) !important;
    font-size: 12px !important;
    font-weight: 400;
    position: absolute;
    top: 0px;
    left: 20px;
    opacity: 0;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.richeistaLabel select {
    font-size: 12px !important;
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    border: solid 1px #DFD3C6;
    background-color: transparent;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 20px;
    width: 100%;
    margin-bottom: 0;
    outline: none;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    text-transform: uppercase;
}


.richeistaLabel select::-webkit-input-placeholder, richeistaLabel select::-webkit-input-placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    color:var(--dark-gray);
    font-weight: 400;
}

.richeistaLabel select:-ms-input-placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    color:var(--dark-gray);
    font-weight: 400;
}

.richeistaLabel select::-ms-input-placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    color:var(--dark-gray);
    font-weight: 400;
}

.richeistaLabel select::placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    color:var(--dark-gray);
    font-weight: 400;
}

.richeistaLabel select:focus, .richeistaLabel select.populated {
    padding-top: 28px;
    padding-bottom: 12px;
}

.richeistaLabel select:focus::-webkit-input-placeholder, .richeistaLabel select.populated::-webkit-input-placeholder {
    color: transparent;
}

.richeistaLabel select:focus:-ms-input-placeholder, .richeistaLabel select.populated:-ms-input-placeholder {
    color: transparent;
}

.richeistaLabel select:focus::-ms-input-placeholder, .richeistaLabel select.populated::-ms-input-placeholder {
    color: transparent;
}

.richeistaLabel select:focus::placeholder, .richeistaLabel select.populated::placeholder {
    color: transparent;
}

.richeistaLabel select:focus + span, .richeistaLabel select.populated + span {
    opacity: 1;
    top: 10px;
}

.richeistaLabel textarea {
    font-size: 12px !important;
    font-family: 'Playfair Display', serif;
    font-weight: 400 !important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    border: solid 1px #DFD3C6;
    background-color: transparent;
    padding: 20px;
    width: 100%;
    margin-bottom: 15px;
    outline: none;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    height: 100px;
    text-transform:uppercase;
}

.richeistaLabel textarea::-webkit-input-placeholder, richeistaLabel textarea ::-webkit-input-placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    color:var(--dark-gray);
    font-weight: 400;
}

.richeistaLabel textarea:-ms-input-placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    color:var(--dark-gray);
    font-weight: 400;
}

.richeistaLabel textarea::-ms-input-placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    color:var(--dark-gray);
    font-weight: 400;
}

.richeistaLabel textarea::placeholder {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size: 12px;
    color:var(--dark-gray);
    font-weight: 400;
}

.richeistaLabel textarea:focus, .richeistaLabel textarea .populated {
    padding-top: 28px;
    padding-bottom: 12px;
}

.richeistaLabel textarea:focus::-webkit-input-placeholder, .richeistaLabel textarea.populated::-webkit-input-placeholder {
    color: transparent;
}

.richeistaLabel textarea:focus:-ms-input-placeholder, .richeistaLabel textarea.populated:-ms-input-placeholder {
    color: transparent;
}

.richeistaLabel textarea:focus::-ms-input-placeholder, .richeistaLabel textarea.populated::-ms-input-placeholder {
    color: transparent;
}

.richeistaLabel textarea:focus::placeholder, .richeistaLabel textarea.populated::placeholder {
    color: transparent;
}

.richeistaLabel textarea:focus + span, .richeistaLabel textarea.populated + span {
    opacity: 1;
    top: 10px;
}

.tbDataPartenza {
    background-image: url('../Gfx/calendar.svg');
    background-repeat: no-repeat;
    background-position: center right 15px;
}

.tbDataArrivo {
    background-image: url('../Gfx/calendar.svg');
    background-repeat: no-repeat;
    background-position: center right 15px;
}

.tbTipologia {
    background-image: url('../Gfx/select2.svg');
    background-repeat: no-repeat;
    background-position: center right 15px;
    -webkit-appearance: none;
}

.errorValidation {
    border: 2px solid #B7202D !important;
    border-radius: 5px;
}

.grazie {
    padding: 50px !important;
    text-align: center !important;
}

.grazie h2 {
    color:  var(--beige);
    font-size: 25px !important;
    font-weight: 400;
    margin-bottom: 15px;
    text-transform:uppercase;
}

.grazie h4 {
    font-family: 'Raleway', sans-serif;
    font-size: 15px;
    font-weight: 400;
}

.grazie a {
    display:block;
    margin:0 auto;
    margin-top:20px;
    cursor:pointer;
}

.richiestaBoxAppartamento {
    padding: 30px 0 20px 0;
    background-color: #F9F9F9;
    margin: 0 2% 30px 2%;
}

.richiestaBoxAppartamento h4 {
    font-size: 19px;
    font-family: 'Cinzel Decorative', cursive;
    color: #A36A35;
    font-weight: 400;
    line-height: 2.2;
    text-align: left;
}

/*CAMERA DETTAGLIO --------------------------------------------------------------------------------------------------------------------------------*/
.introLeftCamera {
   top:50%;
   left:10%;
   right:10%;
   width:80%;
   text-align:center;
}

.caratteristicheCamera{
    margin-top:50px;
}

.caratteristicheCameraBox {
    float: left;
    width: 25%;
    text-align: center;
    margin-top: 20px;
    height: 110px;
    word-break: break-word;
    box-sizing: border-box;
    padding: 0 15px;
}

.caratteristicheCameraBox span {
    font-size: 35px;
}

.caratteristicheCameraBox label {
    font-size: 15px;
    font-weight: 400;
    display: block;
    margin-top: 10px;
}

.valori{

}

.valori hr {
    position: relative;
    top:unset;
    left: unset;
    border: none;
    text-align: center;
    width: 280px;
}

.valori span {
    font-size: 14px;
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    letter-spacing: 2px;
    display: block;
    padding: 0 0 20px 0;
}

.valori h2 {
    font-size: 39px;
    color: var(--brown);
    padding-bottom: 30px;
}

.valoriContainer{
    margin:0 8%;
    width:84%;
}

.valoriBox {
    float: left;
    width:25%;
    padding: 0 0;
    border-right: solid 1px #EFE7DF;
    text-align:center;
    box-sizing:border-box;
}

.valoriBox:first-child {
    padding-left:0 !important;
}

.valoriBox:last-child {
    border-right: none !important;
}

.valoriBox label {
    font-size: 100px;
    color:var(--beige);
    font-weight: 400;
    font-family: 'Playfair Display', serif;
    display:block;
}

.valoriBox span {
    font-size: 23px;
    font-family: 'Playfair Display', serif;
    display:block;
    text-transform:uppercase;
    padding-top:40px;
    height:20px;
}

.valoriBox p {
    font-size: 15px;
    display:block;
    line-height:1.2;
    padding:20px 40px 0 40px !important;
}

#sliderValori .slick-dots {
    bottom: -40px;
    z-index: 9;
}


/*FOOTER --------------------------------------------------------------------------------------------------------------------------------*/
.footer {
}

.footerPrenota {
    width: 100%;
    height: calc(100vh - 350px);
    background-color:var(--light-bg);
    text-align:center;
    position:relative;
}

.footerBar {
    width:100%;
    height:350px;
    background-color:var(--dark-brown);
    padding:45px 125px 0 125px;
    box-sizing:border-box;
}

.footerBarLeft {
    float:left;
    text-align:left;
}

.footerBarLeft h2 {
    font-size: 27px;
    color: var(--beige);
    letter-spacing: 2px;
}

.footerBarLeft b {
    font-size: 14px;
    color: var(--white);
    font-weight: 400;
    text-transform: uppercase;
    font-family: 'Playfair Display', serif;
    letter-spacing: 2px;
    padding: 25px 0 30px 0;
    display: block;
}

.footerBarLeft span {
    font-size: 14px;
    color: var(--white);
    font-family: 'Playfair Display', serif;
    letter-spacing: 2px;
    line-height: 1.4;
    padding: 0 0 40px 0;
    display: block;
}

.footerBarLeft p {
    font-size: 11px;
    color: var(--white);
}

.footerBarLeft a {
    font-size: 11px;
    color: var(--white);
    text-decoration: none;
}

.footerBarLeft a:hover {
    color: var(--beige);
}

.footerBarLeft i {
    font-size: 11px;
    color: var(--white);
    font-style: normal;
    margin: 0 5px;
}

.footerBarRight {
    float: right;
    text-align:right;
    position:relative;
}

.footerBarRight {
    float: right;
    text-align: right;
}

.footerBarRight img{
    position:absolute;
    top:25px;
    left:-11px;
    width:90px;
}

.linkSocial {
    font-size: 14px;
    color: var(--white);
    font-family: 'Playfair Display', serif;
    text-decoration: none;
    letter-spacing: 2px;
    display: block;
    margin-bottom: 30px;
}

.linkSocial:hover {
    color: var(--beige);
}

.linkSocial b {
    display: inline-block;
    vertical-align: middle;
    font-weight: 400;
}

.linkSocial span {
    font-size: 20px;
    width: 20px;
    text-align: center;
    color: var(--beige-bg);
    display: inline-block;
    vertical-align: middle;
    margin-left: 35px;
}

.footerBarRight .button{
    width:250px;
}

.footerBarRight .button span{
    font-size: 10px;
}

.footerPrenota hr {
    text-align: center;
    margin: 0 auto;
    color: var(--beige);
    background-color: var(--beige);
    height: 1px;
    border: none;
    width: 280px;
    z-index: 999;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.footerPrenota span {
    font-size: 14px;
    font-family: 'Playfair Display', serif;
    text-transform:uppercase;
    letter-spacing:2px;
    display:block;
    padding:190px 0 20px 0;
}

.footerPrenota h2 {
    font-size: 39px;
    color:var(--brown);
    padding-bottom:30px;
}

.boxRichiestaFooter{
    margin-top:50px;
    width:650px;
    margin:0 auto;
}

.boxRichiestaBoxF {
    float: left;
    width: 22%;
    height: 115px;
    box-sizing: border-box;
    text-align: center;
    padding: 0;
    position: relative;
}

.boxRichiestaBoxSelectF {
    background-image: url('../Gfx/select2.svg');
    background-repeat: no-repeat;
    background-position: top 55% right 20px;
    background-size:15px;
    width: 27%;
}

.boxRichiestaBoxContainerF {
    padding-top: 20px;
}

.boxRichiestaBoxContainer2F {
    padding-top: 20px;
}

.boxRichiestaBoxF span {
    font-size: 14px !important;
    display: block;
    margin: 0 !important;
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding:0 !important;
}

.titdataF {
    
}

.dataF span {
    font-size: 44px !important;
    color: var(--beige);
    font-family: 'Playfair Display', serif;
    display: block;
    padding-top: 0 !important;
    margin: 0 !important;
}

.dataF b {
    font-size: 14px;
    display: block;
    vertical-align: middle;
    margin-top: 5px;
    text-align: center;
    line-height: 1.2;
    font-family: 'Playfair Display', serif;
    font-weight: 400;
}

.boxRichiestaBoxF input {
    border: none;
    height: 44px;
    font-size: 44px;
    color: var(--beige);
    font-family: 'Playfair Display', serif;
    width: 50px;
    text-align: center;
    /*margin-top: 14px;*/
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: transparent;
    margin-left: 15px;
    padding: 0 !important;
    margin: 0 !important;
}

.boxRichiestaBoxF input[type=text] {
    display: block;
    width: 0px;
    height: 0px;
    opacity: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.boxRichiestaFooter a {
   margin-top:30px;
}

.boxRichiestaFooter a span{
    padding:0 !important;
}

.meteoBox{
    background-color:var(--beige-bg) !important;
}

.meteoBoxContainer{
    margin:70px 20% 0 20%;
}

.meteoBoxContainer2 {
    display:none;
}


/*FOOTER INFO --------------------------------------------------------------------------------------------------------*/
.footerInfo {
    width: 100%;
    background-color: #FFFFFF;
    margin: auto;
    padding: 10px 0 15px 0;
    color: #686868;
    font-size: 13px;
    font-weight: 400;
    text-align: center;
}

.footerInfo span {
    display: inline-block;
}

.footerSep {
    margin: 5px;
    color: #999;
}

.footerLogoApp {
    top: 6px;
    position: relative;
    padding-left: 5px;
}

.footerInfo a {
    text-decoration: none;
}

.footerInfo a:hover {
    color: #686868;
}

.footerIP {
    display: unset;
}

.footerAP {
    display: unset;
}

/*PRIVACY COOKIE--------------------------------------------------------------------------------------------------------*/
.privacy_info {
    text-align: left !important;
    display: none;
    font-size: 12px;
    line-height: 20px;
    width: 70%;
}

.bannerCookie {
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 96%;
    background-color: #fff;
    padding: 5px 2%;
    z-index: 99999 !important;
    font-size: 12px;
    -webkit-text-size-adjust: none;
}

.bannerCookie a {
    font-weight: bold;
}

.bannerCookieClose {
    background-color: #333;
    padding: 5px;
    border-radius: 3px;
    color: #fff !important;
    margin-left: 20px;
    display: inline-block;
    margin-top: 5px;
    text-decoration: none;
}

.pOffTesto a {
    text-decoration: none;
    font-weight: bold;
    color: inherit;
}

/*CALENDAR*/

.ui-datepicker table {
    background-color:var(--dark-brown) !important;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    background-color: var(--dark-brown) !important;
    border: solid 1px var(--beige) !important;
    color: var(--white) !important;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
    background-color: var(--beige) !important;
}

.ui-widget-content {
    background-color: var(--dark-brown) !important;
    color: var(--white) !important;
    border: solid 1px var(--dark-brown) !important;
}

.ui-widget.ui-widget-content{
    border-radius:0 !important;
}

.ui-widget-header {
    background-color: var(--beige) !important;
    color: var(--white) !important;
    border-radius: 0 !important;
    border: solid 1px var(--beige) !important;
}

.quantity {
  position: relative;
}

.quantity input[type=number]::-webkit-inner-spin-button,
.quantity input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.quantity input[type=number] {
    -moz-appearance: textfield;
}

.quantity input {
  height: 50px;
  line-height: 0px !important;;
  float: left;
  display: block;
  padding: 0;
  padding-left: 20px;
}

.quantity input:focus {
  outline: 0;
}

.quantity-nav {
    float: left;
    position: relative;
    height: 50px;
    margin-top:7px;
}

.quantity-button {
  position: relative;
  cursor: pointer;
  width: 20px;
  text-align: center;
  color: var(--white);
  font-size: 20px;
  line-height: 1;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

.quantity-button.quantity-up {
    position: relative;
    height: 25px;
    top:0;
}

.quantity-button.quantity-down {
    position: relative;
    height: 25px;
    bottom:0;
}

.quantity-button.quantity-up label {
    position: absolute;
    bottom: 0;
    left:0;
    cursor:pointer;
}

.quantity-button.quantity-down label {
    position: absolute;
    top: 0;
    left:0;
    cursor:pointer;
}

.quantityR label{
    color:var(--beige) !important;
}

.boxRichiestaFooterM{
    display:none;
}


/*OFFERTE*/

.offerte{
    background-color:var(--light-bg);
    padding: 100px 10% 0 10%;
}

.boxOfferta{
    float:left;
    width:48%;
    margin:0 1% 50px 1%;
    height:600px;
    padding:20px;
    background-color:#FFFFFF;
    box-sizing:border-box;
}

.TitoloOffertaHome a {
    font-family: 'Playfair Display', serif;
    font-size:30px;
    color:var(--brown);
    font-weight: 400;
    line-height: 1.2;
    text-decoration:none;
    display:block;
    margin-bottom:15px;
}

.desc_breve {
    margin: 10px 0 !important;
}

.desc_breve p{
    font-size: 18px !important;
    color: var(--brown) !important;
    font-style:italic;
}

.desc_lunga {
    font-size: 14px !important;
    color: #3E3E3E !important;
    font-family: 'Raleway', sans-serif !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;
    height:130px;
    overflow-y:scroll;
}

.desc_lunga span{
    font-size: 14px !important;
    color: #3E3E3E !important;
    font-family: 'Raleway', sans-serif !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;
}

.desc_lunga p{
    font-size: 14px !important;
    color: #3E3E3E !important;
    font-family: 'Raleway', sans-serif !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;
}

.dettagliOfferta {
    display: block;
    position: relative;
    width: 100%;
    height: 70px;
    background: rgb(255,255,255);
    background: -moz-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
}

.dettagliOfferta a {
    display: inline-block;
    padding:15px 30px;
    background-color: var(--beige);
    transition: all 0.5s;
    text-decoration: none;
    position: relative;
    -webkit-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.25);
    letter-spacing: 2px;
    text-decoration: none;
    font-size: 13px;
    color: var(--white);
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    margin-top:20px;
}

.dettagliOfferta a:hover {
    background-color: var(--beige-bg-hover);
}

.immagineOfferta{
    height:250px;
    margin:0;
    position:relative;
}

.immagineOfferta img {
    height: 250px;
    display: block;
    width: 100%;
    object-fit: cover;
}

.desc_lunga::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #FFFFFF;
}

.desc_lunga::-webkit-scrollbar {
    width: 5px;
    background-color: var(--light-bg);
}

.desc_lunga::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: var(--light-bg);
}

.footerPrenotaOfferte hr{
    display:none !important;
}

.topFind a{
    font-size:13px;
    color: var(--white);
    font-weight:400;
    text-transform:uppercase;
    font-family: 'Playfair Display', serif;
    margin-right:5px;
    display:inline-block;
    vertical-align:middle;
    text-decoration:none;
}

.imgLogoAnnibale{
    width:110px;
    display:block;
    margin-top:30px;
}