/*palette color

#206a5d
#81b214
#FFCC29
#F58634

*/

body{
    font-family: Montserrat,Roboto,"Helvetica Neue",Arial,sans-serif;
    font-weight: bold;
}

h1, h2, h3, h4, h5, h6{
    font-family: Montserrat,Roboto,"Helvetica Neue",Arial,sans-serif;
    font-weight: 800;
    text-align:center;
    text-transform: uppercase;
    padding:0 10px
}

h2{
    font-size:62px;
    padding:50px;
}
h3{
    line-height: 2.5;
}

p{
    font-family: Montserrat,Roboto,"Helvetica Neue",Arial,sans-serif;
    text-align:center;
}
a{
    color:#81b214;
}
a:hover{
    text-decoration: none;
    color:#206a5d;
}
.txt-white{
    color:white
}
.txt-justify{
    text-align:justify;
}



/*bouton*/

.btn{
    display:block;
    margin-left:auto!important;
    margin-right: auto!important;
    width: min-content;
}

.btn-primary{
    font-weight: bold;
    text-transform: uppercase;
    background:none;
    margin-top:50px;
    padding:15px;
    border:2px solid white;
    border-radius:0 35px 0 35px;
    transition:ease .4s;
}


.btn-primary:hover{
    background-color:#81b214;
    border:2px solid #81b214;
    border-radius:35px 0 35px 0;
}

.btn-primary:focus{
    box-shadow:none;
}

.btn-white{
    background-color:#81b214;
    border:2px solid #81b214;

}

.btn-white:hover{
    background-color:#206a5d;
    border:2px solid #206a5d;
}


.btn-secondary{
    background:#81b214;
    margin-top:50px;
    padding:5px 20px;
    margin:0 0 0 20px;
    border:2px solid #81b214;
    border-radius:0 25px 0 25px;
    transition:ease .4s
}


.btn-secondary:hover{
    border:2px solid #206a5d;
    border-radius:25px 0 25px 0;
    background-color:#206a5d;
}



/*nav*/

.nav-fill{
    background-color: #ffffff1c;
    font-family: 'Montserrat';
    font-weight: bold;
}

.nav-item{
    padding:9px 10px 0 10px
}

.nav-item:hover{
    transition:ease .4s;
    background-color: #81b214;
    border-radius: 35px 0 35px 0;
}
.nav-item-active{
    transition:ease .4s;
    background-color: #ffffff3a;
    border-radius: 0 35px 0 35px; 
}

.nav-link{
    color: white;
    transition:ease .4s
}

.nav-link:hover{
    color: white;
}

.nav-link:active{
    color: #81b214;
}

.picto-social{
    filter:invert(1);
    width: 32px;
}


.dropdown-menu {
    border-radius: 0 25px 0 25px;
    margin:10px -12px!important;
    
}

.dropdown-menu.show a{
    font-weight:bold;
    font-size:14px;
}
.dropdown-menu.show a:hover{
    color:#81b214;
    background: none;
}
.dropdown-item{
    padding:10px 28px;
}




/*nav-responsive*/

.nav-responsive{
    display: flex;
    flex-direction: column;
}

.bg-dark{
    background-color: #ffffff1c!important;
    padding: 15px;
}

button:focus{
    outline:none
}


/*section standard*/

.section-exterieur{
    margin:-12% 0 0 0;
}

.section-interieur{
    padding:0 0 12% 0;
    background-color:white
}

.background-black{
    background-color:black;
}

.separator{
    margin-bottom: -10%;
}
.separator-image{
    margin-bottom: -8%;
}

/*--------------home Header-------------------*/
video {
    background-size: cover;
    position: fixed;
    margin-right: 50%;
    z-index: -1;
    height: 100vh;
  }

#header{
    height: 100vh;
}


.rounded{
    margin:50px 0 50px 0;
}

.txt-header{
    font-size: 32px;
    text-transform: none!important;
    margin:30px;
}



/*newsletter*/

.newsletter {
    padding: 40px 0;
    background:#81b214;
    }
    
.newsletter .content {
    max-width: 650px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 2; }
  
 .newsletter .content .form-control {
    height: 50px;
    border-color: #ffffff;
    border-radius:0;
    }
 .newsletter .content.form-control:focus {
    box-shadow: none;
    border: 2px solid #206a5d;
    }
 .newsletter .content .btn {
    min-height: 50px; 
    border-radius:0;
    background: #206a5d;
    color: #fff;
    font-weight:600;
    border: 2px solid #206a5d;
    }

.newsletter .content .btn:hover {
    background: #278171;
    border: 2px solid #278171;
    }

.checkbox{
    margin: 20px;
    font-size: 14px;
}

.home-line-up{
    background:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 60%);
    padding:0 0 12% 0;
}




/*home artistes*/


.flex-carte{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

.card{
    background:none;
    margin-bottom: 50px;
    border:none;
}

.card{
    background:none;
    margin-bottom: 50px;
    border:none;
    text-align:center;
}


.card p{
    font-size:14px;
    text-align:center;
}

.card-img-top{
    width:200px;
    margin-left:auto;
    margin-right:auto;
}




/*home partenaires*/

.home-partenaires{
    padding:0 0 10% 0;
    background:linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 60%);
}


.logo-partenaires{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

.logo-partenaires img{
    padding:0 50px;
}

.carousel-control-prev, .carousel-control-next{
    background:none;
    border:none;
}
.visually-hidden{
    display:none;
}

/*-----------------fin de home------------------------------*/



/*page header*/


#header-page{
    height: 600px;
}
.background-header-page{
        background-image: url("img/astropolis-slide.jpg");
        filter: brightness(0.4);
        background-size: cover;
        background-position:bottom;
        position:fixed;
        height: 700px;
        width: 100%; 
        z-index: -1;
    }



/* le festival */

.notre-histoire img{
    width: inherit;
    box-shadow: 13px 13px #81b214;
    border-radius:0 50px 0 50px;
}

.notre-histoire p{
    padding:30px 10px;
}

.notre-projet{
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 60%), url(img/chapiteau.jpg);
    filter: drop-shadow(2px 4px 6px black);
}


/* page programmation */

.lieu1{
    background-image: linear-gradient(to bottom, rgb(255, 255, 255) 20%, rgba(255, 255, 255, 0.7) 60%), url(img/fort-b.jpg);
    background-position: bottom;
}
.lieu2{
    background-image: linear-gradient(to bottom, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0.7) 60%), url(img/atelier-capucin.jpg);
    background-position: bottom;
}
.lieu3{
    background-image: linear-gradient(to bottom, rgb(255, 255, 255) 20%, rgba(255, 255, 255, 0.7) 60%), url(img/chateau.jpg);
    background-position: bottom;
}
.lieu4{
    background-image: linear-gradient(to bottom, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0.7) 60%), url(img/cool-bar.jpg);
    background-position: bottom;
}
.lieu5{
    background-image: linear-gradient(to bottom, rgb(255, 255, 255) 20%, rgba(255, 255, 255, 0.7) 60%), url(img/main-stage.jpg);
    background-position: top;

}

.adress{
    display: block;
     margin: -40px 0 40px 0;
}



.table-dark td, .table-dark th, .table-dark thead th {
  border-color: unset;
}

.table-col{
    background-color:#81b214;
    border-radius: 0 20px 0 0;
    text-transform: uppercase;
}
.table-evenement {
    font-family: Montserrat,Roboto,"Helvetica Neue",Arial,sans-serif;
}

.card-evenement{
    margin:0 -20px;
}



/* page billetterie */

.card-billetterie{
    width: 18rem;
    background-color: #206a5d;
    border-radius:0 50px 0 50px;
    padding-bottom:20px;
    transition: .5s ease;
}
.card-billetterie:hover{
    background-color: #81b214;
}

.card-billetterie img{
    filter:invert(1);
    border-bottom: 10px dotted black;
}

.tarif{
    padding:0px;
}




/*-----------------footer------------------*/

.footer{
    padding-bottom:10px;
}

.bloc-coordonne{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.coordonne{
    margin:30px 0;
    width:300px;
}
.coordonne p{
    text-align: left;
}

.picto-contact{
    width: 32px;
    float:left;
    margin:0 20px;
}



#map,#map1,#map2,#map3,#map4 {
    height: 400px;
    width: 100%;
  }


  .barre-bas{
    background-color: black;
    padding: 10px;
  }




/*-----------------responsive------------------*/


@media (min-width: 767.98px) {
    .pos-f-t{
        display:none;
    }
}
@media (max-width: 767.98px) { 
    
    h1{
        font-size:30px;
    }
    h2{
        font-size:28px;
    }
    h4{
        font-size:20px;
    }
    h5{
        font-size:14px;
    }
    .txt-header{
        font-size: 20px;
        margin:30px;
    }

    .nav-desktop{
        display: none;
    }

    .nav-fill{
        background:none;
    }


    .rounded{
        width: 200px;
    }

    .card:nth-last-child(2n) {
        display:none;
      }

    .f-nkm{
        font-size:10px;
    }


    .logo-partenaires img{
        padding:0 20px;
    }

    .bloc-coordonne {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        align-content: space-around;
    }


}