@font-face {

    font-family: 'BrownRegular';
    font-display: swap;
    src: url("../fonts/Brown-Regular.otf"); 

}

@font-face {

    font-family: 'BrownLight';
    font-display: swap;
    src: url("../fonts/Brown-Light.otf"); 

}

@font-face {

    font-family: 'BrownBold';
    font-display: swap;
    src: url("../fonts/Brown-Bold.otf"); 

}



/* all */

body{

    font-family: 'BrownLight';

}

.row{margin: 0 !important}

hr{

    opacity: 1;

    color: #A8A8A8;

}

b, strong {

    font-family: 'BrownBold';

}

.col-xl-7, .col-xl-9, .col-xl-8{
    margin: 0;
    padding: 0;
}

.center{text-align: center;}

/* header */

.header{

    margin: auto;

    display: block;

    text-align: center;

    padding: 0;

    background-color: #fff !important;

    border-bottom: 10px solid #00376B;
}

.header .brand img{
    max-width: 150px;
    margin: 10px auto 5px;
}

.brand{margin-bottom: 10px;}

.logo {

    margin: 2px auto auto;

    text-align: center;

    position: relative;

    z-index: 1;

}

.logo img{

    background: #fff;

    padding: 50px 50px 30px;

    max-width: 300px;

}

.header .call{

    color: #A8A8A8;

    text-transform: uppercase;

    font-weight: 500;

    background-color: #fff;

}

.phone span{font-family: 'BrownBold';}

.sticky-bottom a{font-size: 1.4rem;}

.phone a, .call a, .sticky-bottom a{

    text-decoration: none;

    color: #A8A8A8;

}

/* slider */

.slider{margin-top: 170px;}

.slider .col-lg-8, .slider .col-lg-4{padding: 0;}

.col-lg-4.contact.contact-slider.contact-inverted {
    position: relative;
    top: -100px;
}

.contact-slider {
    margin-top: -150px;
}

#image-slider{

    margin-top: -170px;

    padding: 0;

}

.splide__slide img {

    width : 100%;

}




.slogan {

    text-align: center;

    color: #fff;

    font-size: 2rem;

    font-family: 'BrownBold';

}

#image-slider .slogan, .newspace .slogan, .viaggio .slogan{

    font-size: 4rem;

    text-transform: uppercase;

    color: #fff;

    text-align: center;

    font-family: 'BrownLight';

    line-height: 1.1em;

}

#image-slider .slogan{margin-top: 100px;}

.slider-center {

    z-index: 1;

    position: absolute;

    top: 40%;

    left: 50%;

    transform: translate(-50%, -50%);

}

.slogan-small{

    font-size: 2rem;

    text-transform: uppercase;

    color: #fff;

    text-align: center;

    font-family: 'BrownBold';

    line-height: 1.1em;

}

/* primary-text */

.primary-text{

    /*margin-top: -150px;*/

    margin-top: 30px;

    position: relative;

    z-index: 1;

}

.primary-text p{

    color: #4B4B4B;

    line-height: 1.5rem;

}

.primary-text .white-box-center{

    background-color: #fff;
    position: relative;
    /* padding: 85px 140px; */
    padding: 0;

}

.primary-text .heading.blue.center{
    margin-bottom: 20px;
    margin-top: 30px;
}

.box-height{margin-top: -100px;}

.primary-text .white-box-center hr{

    background-color: #00376B;
    height: 10px;
    max-width: 400px;
    text-align: center;
    display: block;
    position: absolute;
    top: -17px;
    display: block;
    width: 400px;
    left: 50%;
    transform: translate(-50%, -50%);

}

.primary-text .white-box-center .intro{

    font-size: 1rem;

    line-height: 1.8rem;

    color: #4B4B4B;

}

.primary-text img{

    max-width: 100%;

    text-align: center;

    display: block;

    margin: auto auto 150px;

}

.logo-small{

    max-width: 150px;

}

.primary-text img.logo-small{

    margin: auto auto 70px;

}



.border-bottom-blue{

    border-bottom: 10px solid #00376B;

}

.btn-blue{
    background: #00376B;
    padding: 15px 100px;
}
.richiedi-informazioni a{
    text-align: center;
    display: block;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    font-family: 'BrownLight';
}

/* contact */

.contact{

    font-family: 'BrownLight';

}

.contact .text {
    text-transform: uppercase;
    font-size: 1.7rem;
    color: #00376B;
    text-align: left;
    margin: 0 0 15px;
    font-family: 'BrownLight';
}

.contact input {

    font-size: 1rem;

    color: #A8A8A8;

    padding: 16px 20px;

    margin: 5px 0;

    font-family: 'BrownLight';

    border: none;

    border-radius: 0;

}

.form-check { 
    padding-left: 0;
}

.contact .text-privacy{

    font-size: 0.75rem;

    color: #A8A8A8;

    margin-top: 20px;

    text-align: left;

    padding-right: 20px;

}

.contact .btn {

    background-color: #00376B;

    color: #fff;

    padding: 15px !important;

    margin-top: 20px !important;

    border: none;

    border-radius: 0;

    width: 100%;

}

#contact_form .col-lg-12, #contact_form .col-lg-6 {
    padding: 0;
}
#contact_form .col-12:first-child, #contact_form2 .col-12:first-child {
    padding-left: 0!important;
    padding-right: 5px!important;
}
#contact_form .col-12:last-child, #contact_form2 .col-12:last-child  {
    padding-right: 0!important;
    padding-left: 5px!important;
}

#contact_form select, #contact_form2 select {
    font-size: 1rem;
    color: #6c757d;
    padding: 16px 20px;
    margin: 5px 0;
    font-family: 'BrownLight';
    border: none;
    border-radius: 0;
    background-color: #EFEFEF;
}

#contact_form input[type="checkbox"], #contact_form2 input[type="checkbox"]{
    font-size: 1rem;
    color: #A8A8A8;
    padding: 5px;
    margin: 5px 5px 5px 0;
    text-align: left
    ;
    font-family: 'BrownLight';
    border: none;
    border-radius: 0;
}

#contact_form .type, #contact_form2 .type {
    color: #4B4B4B;
    display: block;
    margin: 10px 0 6px 0;
}
.contact-inverted input {

    background: #EFEFEF;

}

.contact li{
    text-transform: uppercase;
    line-height: 3em;
}

/* secondary-text */

.secondary-text .intro-big{

    font-size: 1.75rem;

    color: #4B4B4B;

    text-align: center;

    line-height: 2.375rem;

    font-family: 'BrownLight';

    margin-top: 50px;

}

.secondary-text .intro-big .color-blu{

    color: #00376B;

}

.small-margin{margin-top: -50px;}

/* contact */

.contact{
    position: relative;
    padding: 0 15px !important;
}

.contact.white{background: #fff !important;}

.discount .phone .call{

    color: #A8A8A8;

    text-transform: uppercase;

    font-weight: 500;

}

.contact .phone .call{
    color: #A8A8A8;

    text-transform: uppercase;

    font-weight: 500;

    font-size: 1.625rem;
    text-align: center;
}
.contact .phone .call span{font-size: 2.438rem;}

p.call span {
    position: relative;
    z-index: 10000;
}

.call.subtext {
    font-size: 0.8rem;
}

.discount .phone, .slider .phone{

    display: block;

    text-align: center;

    margin-bottom: 30px;

}

.contact .contact-slider .phone{
    text-align: left;
    margin-bottom: 30px;
}
.contact-footer{
    padding: 100px 0 150px !important;
}
.contact-footer img{
    width: 60px;
}
.contact-footer .col-lg-12, .contact .col-lg-8{padding: 0;}

/* newspace */

.newspace{

    background-image: url('../img/bassetti-solari.jpg');

    background-position: center;

    background-size: cover;

    padding: 150px 0 250px;

}

.newspace .slogan{

    font-size: 3.5rem;

    text-transform: uppercase;

    color: #fff;

    text-align: center;

    font-family: 'BrownBold';

    line-height: 1.1em;

}

/* viaggio */

.viaggio{

    background-image: url('../img/bassetti-hero-viaggio.jpg');

    background-position: center;

    background-size: cover;

    padding: 150px;

}

/* separator */

.separator-blue {

    color: #00376B;

    height: 10px !important;

    max-width: 100px;

    text-align: center;

    display: block;

    margin: 0 auto 70px;

}

.separator-blue-high-bottom {

    color: #00376B;

    height: 10px !important;

    max-width: 500px;

    text-align: center;

    display: block;

    margin: 70px auto 0;

}

.separator-blue-high-top {

    color: #00376B;

    height: 10px !important;

    max-width: 500px;

    text-align: center;

    display: block;

    margin: 0 auto 70px;

}

/* 4 images */
.splide__pagination__page.is-active {
    background: #00376B !important;
}

.numbers-left {

    color: #A8A8A8 !important;

    font-size: 4.688rem;

    font-family: 'BrownLight';

    position: relative;

    left: 400px;

    margin-top: 50px;

    margin-bottom: -2px;

    z-index: 10;

}

.numbers-right {

    color: #A8A8A8 !important;

    font-size: 4.688rem;

    font-family: 'BrownLight';

    position: relative;

    left: 65px;

    margin-top: 50px;

    margin-bottom: -2px;

    z-index: 10;

}

.box-text-white-right {

    background-color: #fff;

    padding: 100px 70px;

    max-width: 600px;

    float: right;

    position: relative;

    right: 100px;

}

.box-text-white-left {

    background-color: #fff;

    padding: 100px 70px;

    max-width: 600px;

    float: right;

    position: relative;

    left: 110px;

}



.gray-line-left {

    text-align: center;

    width: 55%;

    height: 4px;

    background: #A8A8A8;

    display: block;

    transform: rotate(90deg);

    margin-left: 38%;

    margin-bottom: -2px;

    position: absolute;

    top: -44px;

    z-index: 10;

}



.gray-line-right {

    text-align: center;

    width: 55%;

    height: 4px;

    background: #A8A8A8;

    display: block;

    transform: rotate(90deg);

    margin-left: 3%;

    margin-bottom: -2px;

    position: absolute;

    top: -37px;

    z-index: 10;

}

.heading{

    color: #00376B;

    font-size: 1.6rem;

    font-family: 'BrownLight';

    text-transform: uppercase;    

}

.heading-big{
    color: #00376B;

    font-size: 3.125rem;

    font-family: 'BrownLight';

    text-transform: uppercase;   

    line-height: 1.2em;
}

.contact .heading-big{
    font-size: 2.2rem;
}

.subtext{

    color: #4B4B4B;

    font-size: 1rem;

}

/* box-gray */

.box-gray {

    background-color: #00376B;

    padding: 50px;

    margin: auto;

    text-align: center;

}

.box-gray .text-light{

    text-transform: uppercase;

    font-family: 'BrownLight';

    color: #fff;

    font-size: 2rem;

    line-height: 2.5rem;

}

.box-gray .text-bold{

    text-transform: uppercase;

    font-family: 'BrownLight';

    color: #fff;

    font-size: 2rem;

    line-height: 2.5rem;

}

.btn-white {
    background: #Fff;
    max-width: 900px;
    text-align: center;
    display: block;
    margin: 50px auto 0;
    padding: 10px;
    color: #00376B !important;
    text-transform: uppercase;
    font-family: 'BrownLight';
    text-decoration: none;
}
.btn-white a{
    color: #00376B;
    text-decoration: none;
    text-transform: uppercase;
    font-family: 'BrownBold';
}
.box-blue{max-width: 300px;}

/* four-images */

.four-images{
    background-color: #fff;
    margin-bottom: 50px;
}

.four-images .title{

    text-transform: uppercase;

    color: #00376B;

    font-size: 2.5rem;

    text-align: center;

    display: block;

    margin: auto;

    padding: 100px 50px;

    font-family: 'BrownLight';

    line-height: 3rem;

}

.four-images .row{margin-bottom: 50px;}

.four-images .col-lg-6 {

    padding: 0 50px;

    margin-bottom: 50px;

}

.four-images img{

    text-align: center;

    display: block;

    margin-bottom: 30px;

    border-bottom: 10px solid #00376B;

    max-width: 100%;

}

.four-icons p{
    color: #00376B;
    text-transform: uppercase;
    font-size: 1rem;
    font-family: 'BrownLight';
    text-align: center;
}
.four-icons img {
    border: none;
    text-align: center;
    display: block;
    margin: auto auto 30px;
}

/* discount */

.discount{

    background-color: #F8F8F8;

    padding: 50px 50px 0;

    text-align: center;

}

.img-evidence{

    margin: auto auto 50px;

    display: block;

    text-align: center;

}

hr.separator{

    background: #00376B;

    max-width: 500px;

    text-align: center;

    display: block;

    height: 10px;

    margin: 50px auto;

}

/* sticky-bottom */

.sticky-bottom{

    position: fixed;

    /*bottom: -80;*/

    bottom: 0;

    left: 0;

    background: #EFEFEF;

    width: 100%;

    padding: 10px 0 0;

    display: block;

    margin: auto;

    text-align: center;

    z-index: 11;

    box-shadow: 0px -6px 12px #00000024;

    transition: bottom 0.5s;

}

footer a {
    color : #fff;
}
footer {
    text-align: center;
    padding-top: 25px;
}
footer .innerContent p {
    margin-bottom: 25px;
}

.sticky-bottom .btn {

    background: #00376B;

    border-radius: 5px;

    margin: auto 5px 10px;

    padding: 15px;

    text-transform: uppercase;

    font-weight: 700;

    font-family: 'BrownLight';

}

.sticky-bottom .btn, .sticky-bottom .btn a, .sticky-bottom .btn span{color: #fff;}

/* footer */

footer{margin-bottom: 100px;}

footer img{

    margin: auto auto 50px;

    display: block;

    text-align: center;

}
.margin-fluid {
        max-width: 85vw;
        margin: 100px auto;
}
#image-slider-middle img{
    margin: 0;
    width: 60%;
    text-align: left;
}
.box-text{
    background: white;
    padding: 90px 70px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(7%, -50%);

}

.box-text .heading{
    color: #00376B;
    font-family: 'BrownLight';
    font-size: 32px;
    line-height: 48px;
}
.box-text .number{
    position: absolute;
    top: -20px;
    left: 25%;
    color: #A8A8A8;
    font-family: BrownLight;
    font-size: 70px;
}

/* responsive */

@media (max-width: 1920px) and (min-width: 1200px){ 
   
    .contact .phone .call{font-size: 1.2rem;}
    .contact .phone .call span {font-size: 1.438rem;}
    .primary-text .white-box-center{padding: 20px;}
}

@media (max-width: 1600px){
    .primary-text{margin-top: 0;}
    #image-slider .slogan{
        font-size: 2.5rem;        
   }

}

@media (max-width: 1500px) and (min-width: 1201px){
   .col-lg-4.contact.contact-slider.contact-inverted{
        top: -150px ;
        padding: 0 10px!important;
   }

   .col-lg-4.contact.contact-slider.contact-inverted .text{
        margin: 0 0 15px;
   }

   .col-lg-4.contact.contact-slider.contact-inverted input{
        padding:  14px;
   }

   .box-text .number {
       font-size: 50px;
       margin-top: 8px;
   }
   .box-text{
        padding: 55px 70px;
   }
   
}

@media (max-width: 1400px) { 
    #contact_form select, #contact_form2 select {
        padding: 10px 20px;
    }

    .contact .text {
        font-size: 1.5rem;
    }


    #contact_form input, #contact_form2 input {
        padding: 10px 20px;
    }
    .primary-text{margin-top: 30px;}

   #image-slider .slogan{

        font-size: 2rem;

   }

   .box-text {
    
    padding: 40px 70px;
    
}
   .slide-center{

    top: 50%;

   }

   .box-text .heading {
        color: #00376B;
        font-family: 'BrownBold';
        font-size: 25px;
        line-height: 29px;
    }

    .box-text{
        padding: 50px 70px;
        left: 45%;
    }


   .gray-line-left{

    width: 55%;

    height: 4px;    

    margin-left: 32%;

    margin-bottom: -2px;

    top: -56px;



   }



   .gray-line-right{

        margin-left: 12%;  

        top: -56px;

   }

}





@media (max-width: 1200px) {

    .contact-slider{
        margin-top: 0;
    }

    .slider{margin-top: 0;}

       .box-text {
    
                    padding: 40px 70px;
    
        }
    .col-lg-4.contact.contact-slider.contact-inverted{
        top: 0;
    }
    .slider .col-lg-8, .slider .col-lg-4 {
        width: 100%;
    }
    #image-slider {
        margin-bottom: 50px;
        margin-top: 0;
    }

    #image-slider .slogan{

        font-size: 1.8rem;
        margin-top: 20px;

   }

   .slider-center{

    top:50%;

   }

   .contact .heading-big{font-size: 1.5rem;}

   .gray-line-left {

    text-align: center;

    width: 75%;

    margin-left: 33%;

    margin-bottom: -2px;

    top: -85px;



    }

    .numbers-left {  

    left: 325px;

    margin-top: 19px;

    margin-bottom: 4px;

 

    }

    .box-text-white-left {   

    padding: 30px 35px;

    left: 65px;

    }

} 

@media (max-width: 1024px){
    #image-slider .slogan{margin-top: 0;}
}

@media (max-width: 991px){
    .header .brand img{
        float: none;
        margin: 20px auto auto;
        display: block;
        text-align: center;
    }

    #image-slider .slogan {
        margin-top: 0px;
    }

       .box-text {
    
             padding: 40px 60px;
    
        }
    .box-text .heading {
        font-size: 30px;
        line-height: 34px;
    }
    #image-slider-middle .splide__slide{
        margin-bottom: 40px!important;
    }
}

@media (min-width:  768px){
       #image-slider-car{display: none;}
}

@media (max-width: 768px){
    .bluBox{display: none!important;}
    .bluBox.bluBox-mobile {font-size: 15px!important; position: relative; display: block!important;
        margin-bottom: 40px;}
    .gallery-four{display: none;}
    .brand{margin-bottom: 10px;}
    .box-text{
        position: static;
    }
    .primary-text img{

        margin: 0 auto;

        

        padding-bottom: 20px;

    }
    #image-slider-middle{
        height: auto;
    }

    .box-text .number{
        position: inherit;
        top: 0;
        left: 0;
    }
    .box-text{
        padding: 0;
        left: 0;
        position: inherit;
        transform: none;
        top: 0;

    }

    .primary-text .white-box-center hr{
        display: none;
    }


    .logo-small{

        max-width: 150px!important;

    }

    .box-text-white-left, .box-text-white-right{

        left: 0;

        right: 0;

    }

    .numbers-left{

        position: unset;

    }



    .numbers-left, .numbers-right {

        padding-top:10px!important;

    }



    .sticky-bottom .btn{

        display: inline-block;

    width: 46%;

    font-size: 0.8rem;



    }

    #image-slider, #image-slider img{

        height: 350px;

        width: 100%;

    }

    #image-slider-car{

        margin-bottom: 100px;

    }

    .splide__slide img {

    width : auto;

    }

    .col-lg-6.logo {

        background: #fff;

    }

    .header .call, .brand{padding-bottom: 20px;}

  .newspace .slogan, .viaggio .slogan, .newspace .slogan, .four-images .title{font-size: 1.8rem;line-height: 2rem;}

    .slogan-small, .box-gray .text-light, .box-gray .text-bold{font-size: 1.5rem;}

    .primary-text .white-box-center{padding: 30px;}

    .viaggio{padding: 150px 20px;}

    .secondary-text .intro-big{

        font-size: 1.3rem;

        line-height: 1.7rem;

    }

    .box-text-white-left{

        float: none;

        left: auto;

        max-width: 100%;

        padding: 0 20px 50px;

    }

    .box-text-white-right{

        float: none;

        right: auto;

        max-width: 100%;

        padding: 0 20px 50px;

    }

    .numbers-left{

        left: auto;

        padding: 50px 20px;

        margin-top: 0;



    }

    .numbers-right{

        left: auto;

        padding: 50px 20px;

        margin-top: 0;

        



    }

    .primary-text.small-margin.secondary-text img {

        max-width: 100%;

    }

    .primary-text .white-box-center hr{margin: -31px auto 50px;}

    .four-images .col-lg-6 {

        padding: 0;

    }

    .four-images .title{padding: 50px 0;}

    .heading, .subtext{padding: 0 10px;}

    .contact {

        padding: 20px;

    }

    footer{margin-bottom: 200px;}



    .gray-line-left, .gray-line-right{

        display: none;

    }

    .header {

        border-bottom: none;

    }

    .logo img{

        height: 100px;

        padding:10px 0;

        margin: 0 auto;
    }

    .heading-big {
        font-size: 2rem;
    }
}

.bluBox.bluBox.bluBox-mobile{display: none;}
.bluBox {
    padding: 25px;
    background-color: #00376b;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 90%;
    margin: auto;
    max-width: 600px;
    color: #fff;
    text-align: center;
    font-size: 22px;
}