/* Extra small devices (portrait phones, less than 576px)  ------ */
/* No media query since this is the default in Bootstrap    ----- */

header .navbar-nav .dropdown-menu {
    position: relative;
    float: none;
}

header .navbar .mega-dropdown .dropdown-menu.mega-menu {
    /*left:-50vw;*/
    width:90vw;
    margin-left:5vw;
}

#promo-3 #postGalleryHomepage,
#promo-3 #postGalleryHomepage .item,
#promo-3 #postGalleryHomepage .item img {
    /*
    min-height: 250px !important;
    max-height: 250px !important;
    height: 250px !important;
    */
    aspect-ratio:4/3 !important;
    width:100%;
}
#promo-3 #postGalleryHomepage .item .carousel-caption {padding:2rem;bottom:0;}
#promo-3 #postGalleryHomepage .item .carousel-caption .caption-title {font-size:1rem;}
#postGalleryHomepage .carousel-indicators {margin-bottom:-105px;padding-top:1rem;padding-bottom:1rem;}
#postGalleryHomepage .carousel-indicators li,
#postGalleryHomepage .carousel-indicators li img {width:72px;}


#homepage-actualites {margin-top:90px;}

.article_content {
    margin-top:0px;
}

.article-content h1.title {
    font-size: 1.75rem;
    line-height: 1.75rem;
}

.article_content h3  {margin-top:0px;}
#ff-stream-6 .ff-item {width:100% !important;}

footer a#btn-faq-footer {width:100%;}
footer a#btn-magazine {
	background-position: .25rem center;
}
/* ---------------------------------------------------------------------- SD - Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {}

/* ---------------------------------------------------------------------- MD - Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    header {
        background-image: linear-gradient(to bottom, 
        var(--hdf-color-white) 0%,
        var(--hdf-color-white) 50%,
        var(--hdf-color-blue) 50%,
        var(--hdf-color-blue) 100%);  
    }

    
    header .navbar .mega-dropdown .dropdown-menu.mega-menu {
        left:-69vw;
        width:85vw;
        margin-left:5vw;
    }

    #promo-3 #postGalleryHomepage,
    #promo-3 #postGalleryHomepage .item,
    #promo-3 #postGalleryHomepage .item img {
        /*
        min-height: 350px !important;
        max-height: 350px !important;
        height: 350px !important;
        */
        aspect-ratio:2/1 !important;
        width:100%;
    }
    #promo-3 #postGalleryHomepage .item .carousel-caption {padding:2rem;/*bottom:4rem*/;}
    #promo-3 #postGalleryHomepage .item .carousel-caption .caption-title {font-size:2rem;}
    #postGalleryHomepage .carousel-indicators {margin-bottom:-128px;/*padding-top:2rem;padding-bottom:2rem*/}
    #postGalleryHomepage .carousel-indicators li,
    #postGalleryHomepage .carousel-indicators li img {width:112px;}
    #homepage-actualites {margin-top:128px;}



    .article-content h1.title {
        font-size: 2.625rem;
        line-height: 2.625rem;
    }

    #ff-stream-6 .ff-item {width:auto !important;}

}

/* ---------------------------------------------------------------------- LG - Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    header .navbar-nav .dropdown-menu {
        position: static;
        float: none;
    }
    header .navbar .mega-dropdown .dropdown-menu.mega-menu {
        left:-60vw;
        width:70vw;
        margin-left:0;
    }

    #promo-3 #postGalleryHomepage,
    #promo-3 #postGalleryHomepage .item,
    #promo-3 #postGalleryHomepage .item img {
        /*min-height: 375px !important;
        max-height: 375px !important;
        height: 375px !important;
        */
        aspect-ratio:2.5/1 !important;
        width:100%;
    }

    footer a#btn-faq-footer {width:75%;}
    footer a#btn-magazine {
        background-position: .5rem center;
    }
}

/* ---------------------------------------------------------------------- XL - Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {

    header .navbar .mega-dropdown .dropdown-menu.mega-menu {
        left:-60vw;
    }
    #promo-3 #postGalleryHomepage,
    #promo-3 #postGalleryHomepage .item,
    #promo-3 #postGalleryHomepage .item img {
        /*
        min-height: 425px !important;
        max-height: 425px !important;
        height: 425px !important;*/
        aspect-ratio: 3.5/1 !important ;
        width:100%;
    }
}





@media (max-width: 768px) {
    .navbar-light .navbar-toggler {border-color:var(--hdf-color-black);color:var(--hdf-color-black);}
    header .navbar .nav-item .nav-link {
        color: var(--hdf-color-black);
        text-align:right;
    }
    header .navbar .nav-item .nav-link:hover {
        color: var(--hdf-color-black);
    }

    div[id*="ajaxsearchpro"] {
        margin:0px !important;
    }
    #searchFromWrapper div[id*="ajaxsearchpro1_"] {
        width:100% !important;
    }

}