@import url("main.css");/*Import de la page de référence (header, nav, footer,...)*/


#intro{
    text-align:center;
    margin:20px;
}
#intro h3{
    margin-bottom: 30px;
}
#intro hr{
    height: 1px;
    width: 10%;
    background-color:black;
    animation-name: apparitionHr;
    animation-duration: 2.5s;
}
@keyframes apparitionHr{
    0%{
        width: 0%;
    }
    100%{
        width: 10%;
    }
}

#lesSortiesConteneur{
    width: 90%;
    margin:auto;
}

#calendrier .col-md-2{
    margin:20px;
    text-align: center;
}
#calendrier .row1{
    margin : auto;
    padding: 20px 0 0 0;
    margin-bottom: 0px;
}
#calendrier .row2 .btn{
    position: relative;
    right: 50px;
}

#calendrier .container{
    border:1px black solid;
    border-radius: 15px;
    margin-bottom:70px;
}

#lesSortiesConteneur button{
    transition:0.5s;
}


#txt{
    padding-bottom: 100px;
    text-align: justify;
}
#txt hr{
    margin: 0;
}
#txtSectionRoute hr{
    margin-top: 60px;
}
#txtSectionDetente hr{
    margin-top: 60px;
}
#txt .btn{
    margin-left: 20px;
    margin-bottom: 5px;
}

#contactVTTBtn, #contactRouteBtn{
    float : right;
    position: relative;
    top:-5px;
}


@media screen and (max-width : 1000px)
{
    #intro hr{
        width: 100%;
    }
    #calendrier .row2 .btn{
        right: 0;
    }
    #calendrier .row2{
    margin-right:0;
   
    }

  
}

.loadingEvent #intro hr{
    animation : 0;
}