/* 
* Created on 08/03/2021  09:55
* Author Lingjing Giraud
*/

@charset "utf-8";
@import "color.css";

main .video {
    display: flex !important;
    justify-content: center;
}

main #fait-marquant img {
    max-width: 200px !important;
    height: auto;
}

main #sectors img {
    max-width: 100px !important;
    height: auto;
}


main #sectors li {
    padding-left: 20px;
}

/* define margin and padding */
main > section:not(:last-of-type) {
    margin: 2rem auto;
}

main > section{
    padding: 0 1rem;
    padding-bottom: 2rem;
}

main h1 {
    text-align: center;
}


main h1, main h2 {
    text-transform: uppercase;
    margin-top: 2rem;
    padding-top: 2rem;
    padding-bottom: 2rem;
}

#organizers img{
    max-width: 120px !important;
    height: auto;
}

/* From https://github.com/kenwheeler/slick/issues/281#issuecomment-253579816 */
#organizers .slick-initialized .slick-slide {
    float: none;
    display: inline-block;
    vertical-align: middle;
}

.home-video {
    position: relative;
}

.home-video > .filtre {
    position: absolute;
    top: 35%;
    left:0;
    right:0;
    color:#fff;
    font-family:arial;
    font-size:1.5em;
    text-align: center;
    margin: auto;
    background: rgba(0, 0, 0, 0);
    padding: 0 1rem;
    max-width: 60% !important;
    height: auto;
}

.filtre img, .filtre div {
    max-width: 100%;
    height: auto;
}

/* For screen > 768 grid: md */
@media screen and (min-width: 768px) {
    #organizers img {
        max-width: 250px !important;
    }
}

@media screen and (max-width: 1024px) {
    .home-video .filtre {
        top: 30%;
        max-width: 60% !important;
    }
}

@media screen and (max-width: 768px) {
    .home-video .filtre {
        top: 20%;
        max-width: 70% !important;
        transform: scale(0.8);
    }
}

@media screen and (max-width: 576px) {
    .home-video .filtre {
        top: 15%;
        max-width: 80% !important;
        transform: scale(0.7);
    }
}