@import url('https://fonts.googleapis.com/css?family=Francois+One');
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed');
@import url('https://fonts.googleapis.com/css?family=Press+Start+2P');
@import url('https://fonts.googleapis.com/css2?family=Bungee&display=swap');

#site h3>a,#site h1{
    font-family: 'Press Start 2P', cursive;
}

#magazine h3,#magazine h1{
    font-family: 'Bungee', cursive;
}

#MoiMail{
    font-weight: normal
}

h1{
    font-family: 'Francois One', sans-serif;
    text-align: center;
    font-size: 3em;
    margin-bottom: 0;
}
h2{
    font-family: 'Francois One', sans-serif;
}
p,a,h3,h4{
    font-family: 'Roboto Condensed', sans-serif;
}

/*Home*/
#textHome{
    width: 35%;
    padding-left: 1%;
}
#textHome p{
    font-size: 1.3em;
    width: 80%;
    margin: 0 22px;
}
@media screen and (max-width: 1024px) {
    #home h1{
        color: black;
    }
    #textHome{
        width: 100%;
    }
    #textHome p{
        width: 90%;
        padding-bottom: 5px;
        margin-bottom: 15px;
    }
}


/*Texte Moi*/
#textMoi{
    width: 24%;
    padding-top: 10%;
    padding-left: 8%;
}
#textMoi p{
    font-size: 1.6em;
    color: black;
    transform: rotate(-2deg);
}

@media screen and (max-width: 1024px) {
    #textMoi{
        width: 90%;
        padding-top: 0;
        padding-left: 0;
        margin: 0 5%;
    }
    #textMoi p{
        font-size: 1.6em;
        color: white;
        transform: rotate(0deg);
    }
}
@media screen and (max-width: 1680px) {
    #textMoi p {
        font-size: 1.4em;
    }
}
@media screen and (max-width: 1440px) {
    #textMoi p {
        margin-top: 0;
        font-size: 1.2em;
    }
}
@media screen and (max-width: 1200px) {
    #textMoi p {
        margin-top: 0;
        font-size: 1em;
    }
}

@media screen and (min-width: 2000px) {
    #textMoi p {
        margin-top: 110px;
        font-size: 1.8em;
    }
}

#moi h1{
    color: snow;
}





strong{
    transition: 0.5s;
}

#jeu strong:hover{
    transition: 0.5s;
    color: #761c19;
}

#site strong:hover{
    transition: 0.5s;
    color: #000000;
}

#newVideo strong:hover{
    transition: 0.5s;
    color: #111111;
}

#magazine strong:hover{
    transition: 0.5s;
    color: #118811;
}


#newVideo p{
    font-size: 1.2em;
}
#newVideo{
    color: white;
}
#introVideo{
    margin: 0 13% 30px 13%;
    padding: 10px;
}

@media screen and (max-width: 900px) {
    #introVideo{
        background: none ;
    }

}



.disclaimer{
    font-size: 0.7em;
}

.sidenav3 p{
    text-align: center;
    color: black;
    font-size: 1.2em;
    margin-top: 0;
}

#dessin>h1{
    color: white;
}
#dessin>p{
    color: white;
    margin: 10px 5%;
    font-size: 1.3em;
}
h4{
    font-size: 1.4em;
}
.unMagazine p{
    font-size: 1.3em;
}
#magazine>p{
    width: 80%;
    font-size: 1.3em;
    padding: 25px 10%;
}

#site{
    color: white;
}
#site a{
    color: white;
    text-decoration: none;
}
#site>p{
    width: 80%;
    padding: 25px 10%;
}
#site h3, #magazine h3,#newVideo h3, #jeu h3{
    font-size: 2em;
}
.unSite p{
    font-size: 1.3em;
}

#titreVideo{
    text-align: center;
}