@charset "UTF-8";
/* CSS Document */
body:after{
position:absolute; width:0; height:0; overflow:hidden; z-index:-1;
content:
url(../img/balestre/1.jpg)
url(../img/balestre/2.jpg)
url(../img/balestre/3.jpg);


}
body,
h1,
h2,
h3,
h4,
h5,
p {
    font-family: "Open Sans", sans-serif;
}


.open-sans-<uniquifier> {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:"wdth" 100;
}

.bg-light{
  transition:1s ease;
  background:transparent!important;
  padding-top: 0.2rem;
  padding-bottom: 0.2rem;
}
.bg-light.scrolled{
  background:#287ca9!important;
  padding-top: 0rem;
  padding-bottom:  0rem;
}
.bg-light.scrolled > div > div > ul > li > .nav-link{
    color: #fff!important;
}

.bg-blu{
  transition:1s ease;
  background:transparent!important;
  padding-top: 1rem;
  padding-bottom: 0.2rem;
}
.bg-blu.scrolled{
  background:#fff!important;
  padding-top: 0rem;
  padding-bottom:  0rem;
}
.bg-blu.scrolled > div > div > ul > li > span > .nav-link{
    color: #287ca9!important;
}
.bg-blu.scrolled > div > div > ul > li > .nav-link{
    color: #287ca9!important;
}
.nav-pag{
    background:#287ca9!important;
}
.nav-pag-blu{
    background:#fff!important;
}
.nav-pag-blu > div > div > ul > li > span > .nav-link{
    color: #287ca9!important;
}
.nav-pag-blu > div > div > ul > li > .nav-link{
    color: #287ca9!important;
}
.logo-nav {
    max-width: 160px;
    min-width: 160px;
}
.dropdown-menu {

}
.dropdown-item {
    display: block;
    margin-right:4rem;
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 500;
    text-transform: uppercase;
    color: #818181;
    text-decoration: none;
}
.nav-link {
    display: block;
    margin-right:4rem;
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
}
.dropdown-item:active {
    background-color: #BDBDBD;
}
.dropdown-menu {
    border-radius: 0px;
    border:0px
}
/*-----------------------------------Video Back----------------------------------------------*/
.box-video-head{
    padding: 1rem;
    
}
.video-background-holder {
    position: relative;
    background-color: #222222;
    height: 94vh;
    min-height: 25rem;
    width: 100%;
    overflow: hidden;
    opacity: 0.9;
    border-radius:1rem;
}
.h-video-gel{
    height: 100%;
}
.video-background-holder video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 0;

    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
.video-background-content {
    position: relative;
    z-index: 2;
}
.video-background-overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: #fff;
    opacity: 0;
    z-index: 1;
}
.back-sez{
  background-color: #FDFBF8;
  padding: 0px;
}
.pos-call{
    position: absolute;
    bottom:2rem;
    left:2rem;
}
.txt-call{
    font-size: calc(16px + (22 - 16) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(18px + (20- 18) * ((100vw - 300px) / (1920 - 300)));
    color:#fff;
    font-weight: 500;
    text-shadow: 0px 0px 7px #092335;
}
.txt-call-b{
    font-size: calc(16px + (22 - 16) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(18px + (20- 18) * ((100vw - 300px) / (1920 - 300)));
    color:#092335;
    font-weight: 500;
}
/*----------------------------------Video Back----------------------------------------------*/

.logo-head{
    position: absolute;
    bottom: 1rem;
    right:1px;
    width: 60%;
}
.sp-studio{
    padding-top: 6%;
}

.box-sez{
    padding-top: 6rem;
    padding-bottom:2rem;
}

.box-1txt{
    padding-right: 2rem;
}
.title-h1{
    font-size: calc(26px + (110 - 26) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(26px + (100 - 26) * ((100vw - 300px) / (1920 - 300)));
    color:#1c2b34;
    font-weight: 400;
}

.sub-title-h1{
    font-size: calc(18px + (22 - 18) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(16px + (31 - 16) * ((100vw - 300px) / (1920 - 300)));
    color:#1c2b34;
    font-weight: 700;
    padding-bottom: 3rem;
}
.txt{
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(20px + (24 - 20) * ((100vw - 300px) / (1920 - 300)));
    color:#101214;
    font-weight:400;
}
.txt-servizio{
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(18px + (24 - 18) * ((100vw - 300px) / (1920 - 300)));
    color:#101214;
    font-weight:400;
    text-transform:uppercase;
    margin-bottom: 0px;
}

.pos-1box{
    position:absolute;
    bottom:2rem;
    right: 2rem;
    left: 2rem;
    text-align: right;
}
.tit1-box{
    font-size: calc(26px + (50 - 26) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(26px + (50 - 26) * ((100vw - 300px) / (1920 - 300)));
    color:#fff;
    font-weight: 700;
    text-shadow: 0px 0px 10px #101214;
}
.tit-box{
    font-size: calc(26px + (50 - 26) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(26px + (50 - 26) * ((100vw - 300px) / (1920 - 300)));
    color:#fff;
    font-weight: 700;
    text-shadow: 0px 0px 10px #101214;
    position: absolute;
    bottom:2rem;
    right: 2rem;
    left: 2rem;
    text-align: right;
    transition-duration: 1s;
}
.icn-d{
    max-width: 1.6rem;
    min-width: 1rem;
}

hr{
    margin-top:0.8rem;
    margin-bottom: 0.8rem;
    background-color:#101214;
}

.tit-call{
    font-size: calc(20px + (22 - 20) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(20px + (26 - 20) * ((100vw - 300px) / (1920 - 300)));
    color:#144260;
    font-weight:700;
}
.tit-call-foot{
    font-size: calc(20px + (22 - 20) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(20px + (26 - 20) * ((100vw - 300px) / (1920 - 300)));
    color:#fff;
    font-weight:700;
    padding-top: 20%;
}
.btn{
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 700;
    color: #fff;
    background-color: #1A7BB0;
    border-radius: 0.5rem;
    padding-left: 1rem!important;
    padding-right: 1rem!important;
    margin-top: 0.3rem;

}

.btn-w{
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 700;
    color: #1A7BB0;
    background-color: #fff;
    border-radius: 0.5rem;
    padding-left: 1rem!important;
    padding-right: 1rem!important;
    margin-top: 0.3rem;

}

.btn:hover{
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 700;
    color: #6bb0d5;
    background-color: #transparent;
    border-radius: 0.5rem;
    padding-left: 1rem!important;
    padding-right: 1rem!important;
    margin-top: 0.3rem;

}
.title-h2{
    font-size: calc(24px + (40 - 24) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(20px + (41 - 20) * ((100vw - 300px) / (1920 - 300)));
    color:#287ca9;
    font-weight: 700;
}
.icn{
    max-width:80%;
}

.back-blu{
    background-color: #287ca9;
    padding: 3rem;
    border-radius: 2rem;
}
.sp-st{
    padding: 0px;
}
.img-st{
    border-radius: 1rem;
    padding: 0.5rem;
}
.sp-serv{
    padding: 0.2rem;
}

.img-servizio-blu{
    background-color:#287ca9;
    border-radius:1rem;
    position: relative;
}
.img-servizio{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius:1rem;
    opacity:calc(0.6);
    transition-duration:1s;
}

.img-servizio:hover{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius:1rem;
    opacity:calc(1);
    transition-duration:1s;
    box-shadow: 0px 0px 10px hsl(201, 50%, 30%);
}

.img-servizio:hover > .tit-box{
    color:#287ca9;
    text-shadow: 0px 0px 20px #fff;
    transition-duration: 1s;
}
.s01{
    height:30rem;
}
.s1{
    height:30rem;
}
.s2{
    height: 60.4rem;
}
.call-cura{
    padding-top:2rem
}
.back-mani{
    background-image: url(../img/back-mani.jpg);
    background-position: bottom left;
    background-size: 100%;
    background-repeat: no-repeat;
    padding-top: 6rem;
    padding-bottom: 6rem;
}
.nome-prodotto{
    font-size: calc(16px + (22 - 16) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(16px + (26 - 16) * ((100vw - 300px) / (1920 - 300)));
    color:#2d2d2d;
    font-weight:600;
    padding-top: 1rem;
}

.txt-head-pag{
    position: absolute;
    bottom: 2rem;
    left:2rem;
    width: 100%;
    font-size: calc(16px + (90 - 16) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(16px + (80 - 16) * ((100vw - 300px) / (1920 - 300)));
    text-shadow:1px 1px 10px #393939;
    color:#fff;
    font-weight: 800;
    text-transform: uppercase;
}

.img-ph{
    border-radius:2rem

}


.title-h1-pag{
    font-size: calc(26px + (70 - 26) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(26px + (70 - 26) * ((100vw - 300px) / (1920 - 300)));
    color:#1c2b34;
    font-weight: 400;
    padding-top: 15%;
}

.sp-gallery{
    padding-bottom: 3rem;
}
.img-gallery{
    padding: 0.5rem;

}
.back-gallery{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 20vh;
    border-radius: 0.5rem;
}


.brd-l{
    border-left: 4px solid #287ca9;
    margin-bottom: 0.5rem;
}






.sp-foot{
    padding-top: 4rem;
    padding-bottom: 4rem;
    background-color: #144260;
}
.tit-foot {
    font-size: calc(20px + (24 - 20) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(26px + (26 - 26) * ((100vw - 300px) / (1920 - 300)));
    color:#fff;
    margin-bottom: 6px;
    margin-top: 2rem;

}
.txt-foot {
    font-size: calc(16px + (22 - 16) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(24px + (24 - 24) * ((100vw - 300px) / (1920 - 300)));
    color:#fff;
    font-weight: 400;
    margin-bottom: 4px;

}

.dati {
    font-size: calc(14px + (14 - 14) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(16px + (16 - 16) * ((100vw - 300px) / (1920 - 300)));
    color:#fff;
    font-weight: 400;
    margin-bottom: 0px;

}
.logo-foot{
    max-width: 90%;
}
.box-foot{
    padding-left: 4rem;
    padding-right:4rem;
}
.dottore{
    max-width: 50%;
}
/*----------------------------------form-----------------------------------------------*/
.form-control {
    color: #fff;
    background-color: transparent;
    border: 2px solid #fff;
    border-radius: 0.5rem;
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
}

.form-control:focus {
    color: #fff;
    background-color: #144260;
    border-color: #287ca9;
    outline: 0;
    box-shadow: 0 0 0 0;
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
}

.form-control::placeholder {
    color: #deecf4;
    font-weight: 300;
    font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));
}

.sp-form {
    padding-top: 1rem
}

.form-check-label {
    color: #fff;
    display: inline;
}

/*--------------------------------------fine-form--------------------------------------*/

.iubenda-nostyle, .iubenda-cs-preferences-link {
    color: #fff;
    text-decoration: underline;
}

.white{
    color:#fff
}

a{
    text-decoration:none;
}
a:hover{
    text-decoration:none;
}
@media only screen and (max-width: 1700px) {}
@media only screen and (max-width: 1400px) {
    .nav-link {
        display: block;
        margin-right:0.2rem;
        font-size: calc(15px + (15 - 15) * ((100vw - 300px) / (1920 - 300)));
        font-weight: 700;
        text-transform: uppercase;
        color: #fff;
        text-decoration: none;
    }

}
@media only screen and (max-width: 840px) {
    .mano{
        position: relative;
        width:40%;
        top:-8rem;
        left:24%;
    }
 
    .call-cura{
        padding-top:2rem;
        padding-bottom:2rem;
    }
    .img-sede{
        position:relative;
        margin-top: -8rem;
        width: 94%;
    }

    .form-control {
        margin-bottom: 0.5rem;
    }
        .sp-form {
            padding-top: 0rem;
    }
    .nav-link {
        margin-left: 0.2rem;
    }
    .top-form{
        padding-top:3rem
    }
    .box-foot {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
.box-video-head {
    padding: 0.2rem;
}
.box-1txt {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
    padding-bottom:2rem
}
.back-blu {
    background-color: #287ca9;
    padding: 1.5rem;
    border-radius: 2rem;
}
.pos-call {
    position: absolute;
    bottom: 1rem;
    left: 0.4rem;
}

.logo-head {
    position: absolute;
    top: 20%;
    right: 5%;
    width: 90%;
}
.bg-light {
    transition: 1s ease;
    background-color: #287ca9!important;
    padding-top: 0rem;
    padding-bottom: 0rem;
}
.bg-blu {
    transition: 1s ease;
    background-color: #fff!important;
    padding-top: 0rem;
    padding-bottom: 0rem;
    color: #287ca9!important;
}
.bg-blu > div > div > ul > li > span > .nav-link{
    color: #287ca9!important;
}
.bg-blu > div > div > ul > li > .nav-link{
    color: #287ca9!important;
}
.nav-pag-blu > div > div > ul > li > span > .nav-link{
    color: #287ca9!important;
}
.nav-pag-blu > div > div > ul > li > span > .nav-link{
    color: #287ca9!important;
}
.s01{
    height: 40vh;
}
.s1{
    height: 20vh;
}
.s2{
    height: 20vh;
}
.box-sez {
    padding-top: 2rem;
    padding-bottom: 2rem;
}
.title-h1-pag{
    padding-top: 2rem;
}
.tit-call-foot{
    font-size: calc(20px + (22 - 20) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(20px + (26 - 20) * ((100vw - 300px) / (1920 - 300)));
    color:#fff;
    font-weight:700;
    padding-top: 1%;
}


.navbar-toggler{
    border: 0px;
}

      .head-balestre{
        height: 40vh;
      }
      .head-ammortizzatori{
        height: 40vh;
      }
      .head-molla{
        height: 40vh;
      }
      .head-sospensioni{
        height: 40vh;
      }
.dottore{
    max-width: 90%;
}
}