:root {
    --primary: #e67c1c;
    --secondary: #313131;
    --navbar-background: #ffff;
    --secondary: #010101;
    --primary-lighter: #356b45;
    --white: #ffffff;
}
body:after{
    content: url(../img/slider/3.jpg)url(../img/slider/5.jpg)url(../img/slider/1.jpg);
    position: absolute;
    width:0; height:0; overflow:hidden;
    z-index: -1;
}
@font-face {
    font-family: Switzer-Bold;
    src: url(../font/Switzer-Bold.woff2);
  }
  
  
  @font-face {
    font-family: Switzer-Regular;
    src: url(../font/Switzer-Regular.woff2);
  }
  
  
body{
    font-family: switzer-regular;
}
h1,h2,h3{
    font-family: switzer-bold;
}
@keyframes changeBackgorundMobile{
    45%{
        background-image: url(../img/slider/slide-mobile-2.jpg);
    }
    75%{
        background-image: url(../img/slider/slide-mobile-3.jpg);
    }
   
}
@keyframes changeBackgorund-autobus-mobile{
    45%{
        background-image: url(../img/slider/slider-autobus/slide-2-mobile.png);
    }
    75%{
        background-image: url(../img/slider/slider-autobus/slide-1-mobile.png);
    }
}
@keyframes changeBackgorund-mezzi-mobile{
    45%{
        background-image: url(../img/slider/slider-mezzi/slide-2-mobile.png);
    }
    75%{
        background-image: url(../img/slider/slider-mezzi/slide-1-mobile.png);
    }
   
}
@keyframes changeBackgorund-auto-mobile{
    45%{
        background-image: url(../img/slider/slider-auto/slide-2-mobile.png);
    }
    75%{
        background-image: url(../img/slider/slider-auto/slide-1-mobile.png);
    }
   
}
@keyframes changeBackgorund{
    45%{
        background-image: url(../img/slider/3.jpg);
    }
    75%{
        background-image: url(../img/slider/5.jpg);
    }
   
}
@keyframes changeBackgorund-auto{
    45%{
        background-image: url(../img/slider/slider-auto/slide-2.png);
    }
    75%{
        background-image: url(../img/slider/slider-auto/slide-1.png);
    }
   
}
@keyframes changeBackgorund-autobus{
    45%{
        background-image: url(../img/slider/slider-autobus/slide-1.png);
    }
    75%{
        background-image: url(../img/slider/slider-autobus/slide-2.png);
    }
   
}
@keyframes changeBackgorund-mezzi{
    45%{
        background-image: url(../img/slider/slider-mezzi/slide-2.png);
    }
    75%{
        background-image: url(../img/slider/slider-mezzi/slide-1.png);
    }
   
}
.btn-white{
    color: var(--white);
   padding:20px;
   font-size: 1.2rem;
   text-decoration: none;
   border-radius: 20px;
   padding:0.5em;
   border:2px solid var(--white);
   background-color: var(--primary);
}
.btn-white:hover{
    color: var(--secondary);
    padding:20px;
    font-size: 1.2rem;
    text-decoration: none;
    border-radius: 20px;
    padding:0.5em;
    border:2px solid var(--secondary);
    background-color: transparent;
}
.list{
    color:var(--white);
}
.tit-menu a{
    color: var(--primary);
    text-decoration: none;
}
.back-img{
    background-image: url(../img/slider/1.jpg); 
    background-repeat:no-repeat;
    background-position: top;
    aspect-ratio: 16/9;
    animation: changeBackgorund 15s infinite;
    background-size: 100vw;
}
.back-img-auto{
    background-image: url(../img/slider/slider-auto/slide-1.png); 
    background-repeat:no-repeat;
    background-position: top;
    aspect-ratio: 16/9;
    animation: changeBackgorund-auto 15s infinite;
    background-size: 100vw;
}
.back-img-autobus{
    background-image: url(../img/slider/slider-autobus/slide-2.png); 
    background-repeat:no-repeat;
    background-position: top;
    aspect-ratio: 16/9;
    animation: changeBackgorund-autobus 15s infinite;
    background-size: 100vw;
}
.back-img-mezzi{
    background-image: url(../img/slider/slider-mezzi/slide-1.png); 
    background-repeat:no-repeat;
    background-position: top;
    aspect-ratio: 16/9;
    animation: changeBackgorund-mezzi 15s infinite;
    background-size: 100vw;
}
.logo-nav{
    max-width: 170px;
    min-width: 170px;
    
}
.box-text-page{
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    background-color: var(--primary);

}
.box-page{
    padding-left:2vh;
    padding-right:2vh;
}
.tit-menu{
    font-family: switzer-bold;
    font-size: 1.3rem;
    color: var(--primary);
}
.link-menu a{
    color: var(--secondary);
    text-decoration: none;
}
.link-menu a:hover{
    color: var(--primary);
    text-decoration: none;
}
.navbar .megamenu {
    padding: 4rem;
    background-color: var(--white);
    box-shadow: 0px 0px 10px 0px #1a1a1a75;
    
    background-position: right;
    background-size: 90vw;
    border-radius:15px;
  }
  .logo-menu{
    position: absolute;
    bottom:2rem;
    right:2%;
  }
.navbar{
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    background-color: var(--white); 
    transition: ease 1s;
}
.carousel-inner{
    max-height: 90vh;
    border-radius: 20px;
}
.navbar-brand{
    margin-left:2rem;
}
.navbar{
    
    border-radius: 20px ;
    margin:2rem;
    margin-top:1.5rem;
    padding:0.3em;

}
.header{
    position: relative;
}
.box-wha{
    position: fixed;
    bottom:2rem;
    right:2rem;
    z-index: 9;

}
.spacing-footer{
    padding-top:7vh;
    padding-bottom: 7vh;
}
#map{
    filter: grayscale(1);
    height:45vh;
}
.link-footer{
    font-size: 1rem;
    color: var(--secondary);
    text-decoration: none;
}
.link-footer:hover{
    color: var(--primary);
    text-decoration: none;
}
.list-footer{
    list-style: none;
    padding-left:0;
}
.img-wha{
    width: 80px;
}
.title-white{
    text-align: center;
    color:var(--white);
}
input[type="text"],input[type="email"],input[type="tel"],textarea{
    margin-top:0.5rem;
}
.box-slider{

    margin-top:32vh;
    text-align: center;
    left:0;
    font-weight: 800;
    right:0;
    z-index: 9;
    top:35%
}
.box-header{
    margin-top:22vh;
}
.link-privacy{
    color: var(--secondary);
    text-decoration: none;
}
.link-privacy:hover{
    color: var(--primary);
    text-decoration: none;
}
.payof{
    color: var(--primary);
    font-weight: 700;
}
.box-img img{
    border-radius:20px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.text-slider{
    font-size: 1.4rem;
    color: var(--white);
    text-shadow: var(--secondary) 1px 0 8px;
}
.title{
    text-shadow: var(--secondary) 1px 0 8px;
    color: var(--white);
    font-size: 4rem;
    line-height: 3.6rem;
    
}
.video-bg{
    z-index: -1;
    position: fixed;
    width: 100%;
    height: 100%;

    object-fit: cover;
}
.subtitle-header{
    text-shadow: var(--secondary) 1px 0 8px;
    color: var(--white);
    font-size: 2rem;
    
    
}
.text{
    text-align: justify;
}
.box{
    padding-top:0vh;
    padding-left:32.5vh;
    padding-right:22vh;
    padding-bottom:4vh;
}
.list-call{
    list-style: none;
    display: inline-flex;
    padding-left:0;
    gap:1rem;
}
.list-call li a{
   color: var(--white);
   padding:20px;
   font-size: 1.2rem;
   text-decoration: none;
   border-radius: 20px;
   padding:0.5em;
   border:2px solid var(--primary);
   background-color: var(--primary);
}
.list-call-white{
    list-style: none;
    display: inline-flex;
    padding-left:0;
    gap:1rem;
}


.card-servizi{
    border-radius:20px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    transition: 0.3s ease;

}
.row-card > div:nth-child(1) > div:hover, .row-card > div:nth-child(3) > div:hover{
    background-color: var(--primary);
    color: var(--white); 
}
.row-card > div:nth-child(1) > div:hover .scopri-di-piu, .row-card > div:nth-child(3) > div:hover .scopri-di-piu{
    
    color: var(--white); 
}
.row-card > div:nth-child(2) > div:hover{
    background-color: var(--white); 
}
.row-card > div:nth-child(2) > div:hover .scopri-di-piu-white{
   color: var(--primary); 
}
.row-card > div:nth-child(2) > div:hover .title-card{
    color: var(--secondary);
}
.row-card > div:nth-child(2) > div:hover p{
    color: var(--secondary);
}

/*icon-----*/
.row-card > div:nth-child(1) > div:hover img, .row-card > div:nth-child(3) > div:hover img{
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(48deg) brightness(112%) contrast(114%);
}
.row-card > div:nth-child(2) > div:hover img{
    filter: brightness(0) saturate(100%) invert(74%) sepia(40%) saturate(6341%) hue-rotate(348deg) brightness(93%) contrast(94%);
}

#info-orari{
    border:1px solid var(--primary);
    background-color: var(--primary);
    padding:1em;
    border-radius:20px;
}


#info-orari.scrolled{
    border:1px solid var(--primary);
    background-color: var(--primary);
}
/*icon-----*/
.navbar.scrolled {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    background-color: var(--white); 
    transition: ease 1s;
}
.navbar.scrolled .nav-link:hover {
    border-bottom:1px solid var(--primary);
    
}
.orange{
    color: var(--primary);
}
.navbar.scrolled .nav-link {
    color: var(--primary); /* Colore dei nav-link quando si effettua lo scroll */
}
.navbar.scrolled .nav-button li a {
    color: var(--primary); /* Colore dei nav-link quando si effettua lo scroll */
    border-color: var(--primary);
    transition: 0.3s ease;
    
}
.navbar.scrolled .nav-button li a:hover {
    background: var(--primary);
    color: var(--white); /* Colore dei nav-link quando si effettua lo scroll */
    border-color: var(--primary);
    transition: 0.3s ease;
}

.list-call-white li a{
   color: var(--white);
   padding:20px;
   font-size: 1.2rem;
   text-decoration: none;
   border-radius: 20px;
   padding:0.5em;
   border:2px solid var(--white);
   background-color: var(--primary);
}
.list-call-white li a:hover{
    color: var(--secondary);
    padding:20px;
    font-size: 1.2rem;
    text-decoration: none;
    border-radius: 20px;
    padding:0.5em;
    border:2px solid var(--secondary);
    background-color: transparent;
 }
.text{
    font-size: 1.2rem;
}
.list-call li a:hover{
    color: var(--secondary);
    padding:20px;
    font-size: 1.2rem;
    text-decoration: none;
    border-radius: 20px;
    padding:0.5em;
    border:2px solid var(--secondary);
    background-color: transparent;
 }
.box-header{
    
    background-color: var(--primary);
    padding:2em;
    border-radius: 20px;
}
.nav-link{
    font-size: 1.3rem;
    border-bottom:2px solid transparent;
    color:var(--primary);
}
.nav-link:hover{
    color:var(--primary);
    border-bottom:1px solid var(--primary);
}
.nav-item{
    margin-right:1.4rem;
}
.nav-button{
    margin-right:2rem;
    display: inline-flex;
    gap:1rem;
    margin-bottom:0;
    list-style: none;
}
.bg-orange{
    background-color: var(--primary);
}
.nav-button a{
    font-size: 1.1rem;
    background-color: transparent;
    border:1px solid var(--primary);
    padding:1em;
    text-decoration: none;
    color: var(--primary);
    border-radius:20px
}
.rounded-box{
    border-radius: 20px;
}
.white{
    color: var(--white);
}
.box-sezione-colorata{
    padding-top: 4vh;
    padding-left: 5vh;
    padding-right: 4vh;
    padding-bottom: 4vh;
}
.list li{
    font-size: 1.2rem; 
}
.nav-button a:hover{
    background-color: transparent;
    border:1px solid var(--primary);
    padding:1em;
    text-decoration: none;
    color: var(--primary);
    border-radius:20px
}
.title-card{
    font-weight: 700;
}
.scopri-di-piu{
    text-decoration: none;
    color: var(--primary);
    font-weight: 700;
}
.scopri-di-piu-white{
    text-decoration: none;
    color: var(--white);

    font-weight: 700;
}
.scopri-di-piu-white:hover, .scopri-di-piu:hover{
    text-decoration: none;
    color: var(--secondary);
    
    font-weight: 700;
}
.box-card{
    padding-top:2vh;
    padding-left:32.5vh;
    padding-right:33vh;
    padding-bottom:4vh;
}
#sendBtn{
    background-color: transparent;
    color:white;
    padding:0.5em;
    border-radius:20px;
    border:2px solid var(--white);
}
#sendBtn:hover{
    background-color: white;
    color:var(--primary);
    
}

@media all and (min-width: 992px) {

    .navbar .has-megamenu {
      position: static !important;
    }
  
    .navbar .megamenu {
      left: 0;
      right: 0;
      width: 80%;
      margin-top: 4px;
    }
  
  }

  @media only screen and (max-width: 1920px) {
    .box {
        padding-top: 0vh;
        padding-left: 30.5vh;
        padding-right: 19vh;
        padding-bottom: 4vh;
    }
    
    .card-servizi{
        aspect-ratio: 8/9;
    }
    .text {
        font-size: 1.1rem;
    }
    .subtitle {
        font-size: 1.6rem;
    }
  }  
  @media only screen and (max-width: 1690px) {
    .title {
    
        font-size: 2rem;
        line-height: 2.6rem;
    }
    .box-slider {
        
        top: 25%;
    }
    .box-header {
        
        
        background-color: var(--primary);
       
    }
    .card-servizi{
        aspect-ratio: 9/11;
    }
    .box{
        padding-top: 5vh;
    }
  }
  @media only screen and (max-width: 1460px) {
     
    .box-header {
        bottom: -12rem;
    }
    .card-servizi{
        aspect-ratio: 13/12;
    }
    .box {
        padding-top: 4vh;
        padding-left: 12vh;
        padding-right: 0vh;
        padding-bottom: 4vh;
    }
    .box-card {
        padding-top: 2vh;
        padding-left: 12vh;
        padding-right: 12vh;
        padding-bottom: 4vh;
    }
  }
  @media only screen and (max-width: 1024px) {
    .navbar .megamenu{
        padding:1em;
        box-shadow:unset;
        border:none;
        max-width: 100%;
        width: 100%;
    }
    .box-img{
        aspect-ratio: 16/9;
        width: 100%;
        object-fit: cover;
        margin-top:1rem;
    }
    .navbar-collapse{
        padding-bottom: 1.4em;
    }
    .box-text-page{
        padding: 2em;
    }
    .nav-button{
        flex-direction: column;
        padding-left:0;
    }
    .nav-button a{
        font-size: 1.3rem;
        width: 100%;
        border:0;
        padding:0;
    }
    .box-slider{
        margin-top: 12rem;
    }
    .card-servizi{
        aspect-ratio: 5/7;
    }
    .box-header {
       margin-top:8rem;
    }
    .card-servizi{
        aspect-ratio: 16/9;
    }
    .box {
        padding-top: 5vh;
        padding-left: 2vh;
        padding-right: 2vh;
        padding-bottom: 4vh;
    }
    .box-card {
        padding-top: 2vh;
        padding-left: 2vh;
        padding-right: 2vh;
        padding-bottom: 4vh;
    }
    .img-home-1, .img-home-2{
        aspect-ratio: 16/9;
        margin-bottom:2rem;
    }
    .back-img{
        background-image: url(../img/slider/slide-mobile-1.jpg); 
        aspect-ratio: 9/16;
        animation: changeBackgorundMobile 15s infinite;
        background-size: 100vw;
    }
    .back-img-auto{
        background-image: url(../img/slider/slider-auto/slide-1-mobile.png); 
        
        aspect-ratio: 9/16;
        animation: changeBackgorund-auto-mobile 15s infinite;
        background-size: 100vw;
    }
    .back-img-autobus{
        background-image: url(../img/slider/slider-autobus/slide-1-mobile.png); 
        
        aspect-ratio: 9/16;
        animation: changeBackgorund-autobus-mobile 15s infinite;
        background-size: 100vw;
    }
    .back-img-mezzi{
        background-image: url(../img/slider/slider-mezzi/slide-1-mobile.png); 
        
        aspect-ratio: 9/16;
        animation: changeBackgorund-mezzi-mobile 15s infinite;
        background-size: 100vw;
    }
    .navbar{
        margin:1rem;
    }
    
  }
  @media only screen and (max-width: 768px) {
    .box-text-page{
        padding:2em;
    }
    .box-img img{
        object-fit: cover;
        width: 100%;
        margin-top:3rem;
        aspect-ratio: 16/9;
    }
    .box-slider{
        margin-top: 13rem;
    }
    .title{
        font-size:1.6rem;
    }
    .box-header{
        margin-top:0;
    }
    .card-servizi{
        aspect-ratio: 16/9;
    }
    .box-header{
        position: relative;
    }
    .box-header{
        bottom:-2rem;
    }
  }
  @media only screen and (max-width: 590px) {

    .box-img img{
        object-fit: cover;
        width: 100%;
        margin-top:2rem;
        aspect-ratio: 1/1;
    }
    .box-slider{
        margin-top: 12rem;
    }
   
    .list-call{
        flex-direction: column;
    }
    .list-call li{
        margin-top:1rem;
    }
    .box {
        padding-top: 2vh;
        padding-left: 2vh;
        padding-right: 2vh;
        padding-bottom: 4vh;
    }
    .box-card {
        padding-top: 2vh;
        padding-left: 2vh;
        padding-right: 2vh;
        padding-bottom: 4vh;
    }
    .box-header{
        margin-top: 12rem;
        position: unset;
    }
    .title {
        padding:0.5em;
        font-size: 1.4rem;
        line-height: 1.3rem;
    }
    .carousel-item img{
        object-fit: cover;
        max-height: unset;
        aspect-ratio: 9/16;
        margin-bottom:1rem;
        border-radius: 20px;
    }
    .text-slider{
        font-size: 1rem;
    }
    .box-slider{
        top:40%;
    }
    .nav-button li{
        margin-top: 1rem;;
    }
    .card-servizi{
        margin-top:1rem;
        aspect-ratio: 1/1;
    }
    .box-sezione-colorata{
        padding:1em;
    }
    .button{
        font-size: 1.3rem;
        color: var(--white);
        background-color: var(--primary);
        border:2px solid var(--white);
        border-radius: 20px;
        padding:0.3em;
    }
    .list-call-white{
        
        display: inline-flex;
        flex-direction: column;
    }
    .list-call-white li{
        margin-bottom:1rem;
    }
    .logo-nav{
        max-width: 120px;
        min-width: 120px;
    }
    .nav-button{
        flex-direction: column;
        padding-left:0;
    }
    .nav-button a{
        font-size: 1.3rem;
        width: 100%;
        border:0;
        padding:0;
    }
    .nav-button a:hover{
        border:0;
        padding:0;
    }
    .box-wha{
        right:1rem;
        bottom:1rem;
    }
    .img-wha{
        
        width: 60px;
    }
    .navbar .megamenu{
        box-shadow: 0px 0px 10px 0px #d3d3d375;
        padding:1em;
        overflow-y: scroll;
        max-height: 60vh;
    }
    .nav-item{
        margin-right:0;
    }
    
    .navbar-collapse{
        padding-bottom:2em;
    }
    
  }