/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

html, body, h2, h3, p, a {
    color:#2d3c43 ;
    font-family: 'Roboto Condensed', sans-serif;
}

html {
    scroll-behavior: smooth;
}

.row {
    margin: 0;
}

article {
    margin: 10rem 0;
}

.h1_pages {
    font-size: 3rem;
    color: white;
    padding: 8rem 0rem 7rem 0rem;
    font-family: 'Fredericka the Great', cursive;
    text-align: center;
    height: 4rem;
    background-color: #ff5401;
}

.h1_pages_background_white {
    font-size: 3rem;
    color: white;
    padding: 8rem 0rem 7rem 0rem;
    font-family: 'Fredericka the Great', cursive;
    text-align: center;
    height: 4rem;
    background-color: #ff5401;
}

.h2_accueil {
    font-family: 'Fredericka the Great', cursive;
    font-size: 2rem;
    color: #fefefe;
    text-align: center;
    height: 4rem;
    font-weight: 100;
    margin-top: 10rem;
}

@media screen and (max-width: 520px) {
    .h1_pages, .h1_pages_background_white {
        font-size: 1.7rem;
    }
}

/* /////////////////////// ANIMATION SCROLL REVEAL  ////////////////////////////// */

.sr_anim-scroll {
    visibility: hidden;
}

/* ////////////////////////// ANCRE VERS LE HAUT  ////////////////////////////// */

#myBtn {
    text-align: center;
    position: fixed;
    bottom: 9%;
    right: 5%;
    border-radius: 50%;
    height: 5rem;
    width: auto;
    z-index: 10000;
    padding: .4rem;
    /*  //// */
    visibility: hidden;
    cursor: pointer; /* Add a mouse pointer on hover */
}

#myBtn:link {
    text-decoration: none;
}

#myBtn img {
    height: 5rem;
    width: auto;
    z-index: 10000;
    padding: .4rem;
}

#myBtn span {
    font-weight: 600;
    margin: auto;
}

/* //////////////////////////// LOGO MENU HEADER //////////////////////// */

.menu_logo_header {
    font-family: 'Fredericka the Great', cursive;
    position: fixed;
    top: 1%;
    left: 1%;
    z-index: 10000;
    font-size: 1.5rem;
    color: aliceblue;    
}

.menu_logo_header:link {
    text-decoration: none;    
}
.menu_logo_header:hover {
    color: #ff5401;
}

@media screen and (max-width: 520px) {
    a.sr_anim-scroll.menu_logo_header {       
        left: 20%;      
        font-size: 1.5rem;
    }
}

@media screen and (min-width: 520px) and (max-width: 992px) {
    a.sr_anim-scroll.menu_logo_header {       
        left: 33%;      
        font-size: 1.5rem;
    }    
}

@media screen and (min-width: 992px) and (max-width:1450px) {
    .menu_logo_header {       
        left: 36%;      
    }
}

/* //////////////////////////// MENU HEADER //////////////////////// */

#nav-header-base {
    background-color: #090b33;
    padding: 0rem;
}

#nav-header-base .nav-link {
    color: white;
    text-decoration: none;
    padding: 1rem;
    border-bottom: solid 0.3rem #090b33; 
}

#nav-header-base .nav-link:hover {
    border-bottom: solid 0.3rem;
    border-bottom-color: #ff5401;
}

.navbar-nav .dropdown-menu {
    position: absolute;
    float: none;
}

.dropdown-item {
    background-color: white;
    color: #2d3c43;
}

.dropdown-item:hover {
    background-color: #090b33;
    color: white;
}

.navbar-toggler-icon {
    display: contents;
    max-width: 2rem;
}

button.navbar-toggler:focus, .button.navbar-toggler:active {
    outline: none;
}

.navbar-toggler-icon img{
    max-width: 2rem;
}

.navbar-toggler {   
    border: 1px solid #090b33;
}

.carousel-control-next-icon, .carousel-control-prev-icon {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-color: #090b33;
    padding: 1.5rem;
}

li.li_icone_menu {
    position: absolute;
    right: 0%;
    border-bottom: none;
}

a.nav-link {
    font-size: .9rem;
}

.icone-menu {
    width: 2rem;
}

#nav-header-base .nav-link.a_connexion {
    position: absolute;
    top: 5%;
    right: 0%;
    border-bottom: none;
}

#nav-header-base .nav-link.a_authentifie {
    border-bottom: none;
}

@media screen and (max-width: 520px) {
    .navbar-toggler-icon img{
        min-width: 3rem;
    }
}

@media screen and (max-width: 992px) {
    .navbar-nav .dropdown-menu {
        position: absolute;
        float: none;
        left: 40%;
    }
}

@media screen and (min-width: 992px) and (max-width:1450px) {
    ul.navbar-nav.d-flex {
        margin-top: 2.5rem;
    }
}   

/* /////////////////////////// FOOTER //////////////////////////// */

footer {
    background-color: #090b33;
    color: white; 
}

footer h2 {
    color: #9A9BAC;
    font-size: 1.5rem;
    border-bottom: solid #ff5401;
}

footer ul {
    padding: 0;
}

footer li {
    list-style: none;
    color: #9A9BAC;
}

footer p {
    color: white;
}

footer a {
    color: #9A9BAC;
    text-decoration: none;
}

footer a:hover {
    color: white;
    text-decoration: none;
}

.logo-footer {
    font-family: 'Fredericka the Great', cursive;
    font-size: 1.5rem;
    padding-top: 2rem;
    font-weight: 300;
}

.col-logo-footer p.col-12 {
    text-align: center;
}

.col-logo-footer p,.copyright {
    text-align: center;
}

.col-logo-footer p .span2 {
    color: white;
    background-color: #ff5401;
    padding: .3rem;
    font-size: .8rem;
}

.col-logo-footer p span{
    color: white;
    background-color: #2d3c43;
    padding: .3rem;
    font-size: .8rem;
}

.col-coordonnees {
    padding: 3.5rem 2rem;
}

.col-coordonnees img {
    max-width: 1rem;
    max-height: 1rem;
}

.col-reseaux-sociaux img {
    max-width: 3rem;
    max-height: 3rem;
    margin: 1rem;
    -webkit-transition: -webkit-transform 300ms;
    transition: -webkit-transform 300ms;
    -o-transition: transform 300ms;
    transition: transform 300ms;
    transition: transform 300ms, -webkit-transform 300ms;
}

.col-reseaux-sociaux img:hover {
    -webkit-transform: scale(121);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

#img-adresse {
    margin: .2rem 0;
}

.copyright {
    color: #9A9BAC;
}

@media screen and (max-width: 768px) {
    .col-coordonnees {
        padding: 1rem;
    }
}

@media screen and (min-width: 768px) and (max-width: 992px){
    .logo-footer {
        font-size: 1rem;
    }
}
