:root{
   --gold:#977e47;
   --white:#ffffff;
   --gold-lighter:#ad9867;
   --black:#000000;
   --light-white:#d5c8a8;
   
}
#map{
    height:35vh;
}
body{
    overflow-x: hidden;
    font-family: "Urbanist", sans-serif;
}
.title{
    font-size: calc(45px + 8 * ((2560px - 320px) / 680));
    color:var(--gold);
    font-family: "Indie Flower", cursive;
    font-weight: 400;
    font-style: normal;
}
.subtitle{
    font-size: calc(48px + 6 * ((2560px - 320px) / 680));
    font-family: "Indie Flower", cursive;
    font-weight: 300;
    
}
.subtitle-footer{
    font-size: calc(48px + 4 * ((2560px - 320px) / 680));
    font-family: "Indie Flower", cursive;
    font-weight: 400;
    color: var(--gold);
    font-style: normal;
}
.link-footer{
    font-size: calc(11px + 4 * ((2560px - 320px) / 680));
    color:var(--black);
    text-decoration: none;
}
.link-footer:hover{
    color:var(--gold); 
}
.carousel-item{
    height:75vh;
}
.text{
    font-size: calc(16px + 2 * ((2560px - 320px) / 680));
}
.back-parallax{
    background-image: url("../img/parallax.jpg");
    background-size: cover;
    background-attachment: fixed;
    min-height:35vh;
}
.back-slide-1{
    background-image: url("../img/slider/1.jpg");
    background-size: cover;
    background-position: center;
}
.back-slide-2{
    background-image: url("../img/slider/2.jpg");
    background-size: cover;
    background-position: center;
}
.back-slide-3{
    background-image: url("../img/slider/3.jpg");
    background-size: cover;
    background-position: center;
}
.back-slide-4{
    background-image: url("../img/slider/4.jpg");
    background-size: cover;
    background-position: center;
}
.back-slide-5{
    background-image: url("../img/slider/5.jpg");
    background-size: cover;
    background-position: center;
}
.back-slide-6{
    background-image: url("../img/slider/6.jpg");
    background-size: cover;
    background-position: top;
}
.box{
    background-color: var(--gold-lighter);
}
.white{
    color:var(--white);
}
.gold{
    color:var(--gold);
}
.link-privacy{
    text-decoration: none;
    color: var(--black);
}
.link-privacy:hover{
    
    color: var(--gold);
}
.back-light{
    background-color: var(--light-white);
}
.nav-link{
    color:var(--gold);
    font-size: calc(16px + 2 * ((2560px - 320px) / 680));
}
.logo-active{
    width: 1vw;
}
.button, .link-nav{
    white-space: nowrap;
    padding:0.4em;
    border-radius: 20px;
    color: var(--white);
    text-decoration: none;
    background-color: var(--gold-lighter);
}
.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    color: #977e47;
}
.button:hover, .link-nav:hover{
   color:var(--black);
   background-color: var(--light-white);
   border:1px solid var(--gold);
}
.bordered-top{
    border-top:4px solid var(--gold)
}
.back-fiore{
    background-image: url("../img/back-fiore.svg");
    background-size: 35vw;
    background-repeat: no-repeat;
    background-position: top left;
    
}
.back-fiore-inverted{
    background-image: url("../img/back-fiore-inverted.svg");
    background-size: 35vw;
    background-repeat: no-repeat;
    background-position: top right;
    
}
.back-vetrina{
    background-image: url("../img/vetrina.jpg");
    background-size: cover;
    background-position: center;
    aspect-ratio: 1/1;
}
.back-qualita{
    background-image: url("../img/prodotti/qualita.jpg");
    background-size: cover;
    background-position: center;
    aspect-ratio: 4/3;
}
.back-benessere{
    background-image: url("../img/prodotti/corpo.jpg");
    background-size: cover;
    background-position: center;
    aspect-ratio: 4/3;
}
.back-esigenza{
    background-image: url("../img/prodotti/esigenza.jpg");
    background-size: cover;
    background-position: center;
    aspect-ratio: 4/3;
}
.back-reducem{
    background-image: url("../img/prodotti/reducem-intimo.jpg");
    background-size: 35vw;
    background-position: center;
    background-repeat: no-repeat;
    aspect-ratio: 4/3;
}
.logo-nav{
    max-width: 170px;
}
.logo-slider{
    width: 40vh;
    position: absolute;
    bottom: 11px;
    right:11px;
}

@media only screen and (max-width:1465px){
    #map{
        height:45vh;
    }
    .carousel-item{
        height:85vh;
    }
    .link-nav{
        padding:0.6em;
    } 
}
@media only screen and (max-width:1440px){
    .carousel-item{
        height:75vh;
    }
}
@media only screen and (max-width:1024px){
    .carousel-item{
        height:65vh;
    }
}
@media only screen and (max-width:991px){
    .title {
        font-size: calc(25px + 8 * ((2560px - 320px) / 680));
    }
    .text {
        font-size: calc(12px + 2 * ((2560px - 320px) / 680));
    }
}
@media only screen and (max-width:768px){
    .carousel-item{
        height:45vh;
    }
    .logo-slider{
        width: 28vh;
        }
        .logo-nav{
            max-width: 90px;
        }
}
@media only screen and (max-width:560px){  
    .carousel-item{
        height: 45vh;
        padding-top:5em;
    }
    
    .col-footer{
        text-align: center;
    }
    .logo-footer{
        max-width:55vw;
    }
    .logo-slider{
        width: 18vh;
        
    }
    .title {
        font-size: calc(20px + 8 * ((2560px - 320px) / 680));
    }
    .text {
        font-size: calc(10px + 2 * ((2560px - 320px) / 680));
    }
}