section
{
    box-sizing: border-box;
    display: flex;
    width: 100%;
    height: 100%;

}    

section h1
{
    font-family:'Too_drunk_to_fuck';
    font-weight: normal;
    text-transform: uppercase;
}

/*Paramètre article*/
article
{
    width: 70%;
    height: 1200px;
    border: 5px white groove;
    border-radius: 10px;
    margin-right: 50px;
    margin-left: 40px;
    margin-top: 10px;
    background:url(Fond/Artiste_modif.png) no-repeat;
    background-size: 99%;
}

article h1
{
    font-family: 'Too_drunk_to_fuck';
    font-size: 3em;
    text-align: center;
    color: black;
}

article a 
{
    font-family: 'llalarm';
    text-decoration: none;
    color: rgb(255,205,0);
}

.music
{
    margin-left: 39%;
    margin-top: 41%;
    font-size: 3em;
    transform:rotate(358deg);
}

.spectacle
{
    font-size: 1.9em;
    transform:rotate(355deg);
    margin-left: 10%;
    margin-top: -0.5%;
}

.perf
{
    font-size: 2.5em;
    transform: rotate(5deg);
    margin-left: 82%;
    margin-top: -3%;
}

article a:hover
{
    border-top: 4px solid rgb(255,205,0);
    border-bottom: 4px solid rgb(255,205,0);
}


@media all and (max-width: 1500px)
{
   
    .music
    {
        font-size: 2.7em;
        margin-top: 38%;
    }
    .spectacle{
        font-size: 1.5em;
        margin-top:-1.5% ;
    }
    .perf{
        font-size:2.2em ;
        margin-top: -4%;        
    }
}


@media all and (max-width: 1000px)
{
   
    article h1
    {
        font-size: 2.5em;
        padding-left: 3%;
    }
    section
    {
        flex-direction: column;
        width: 100%;
    }
    article
    {
        width: 85%;
        margin-left: 8%;
        height: 760px;
        margin-bottom: 2%;
    }
    .music
    {
        font-size: 2.5em;
        margin-top: 39%;
    }
    .spectacle{
        font-size: 1.3em;
        margin-top:-2.5% ;
    }
    .perf{
        font-size:2em ;
        margin-top: -4%;        
    }

@media all and (max-width: 800px)
{
    article h1
    {
        font-size: 2em;
    }

        article
    {
        height: 660px;
    }

        .music
    {
        font-size: 1.8em;
        margin-top: 39%;
    }
    .spectacle{
        font-size: 1em;
        margin-top:-2% ;
    }
    .perf{
        font-size:1.6em ;
        margin-top: -3.5%;        
    }
}

@media all and (max-width: 600px)
{
    article h1
    {
        font-size: 1.9em;
    }

    article
    {
        height: 490px;
    }

    .music
    {
        font-size: 1.4em;
        margin-top: 36%;
    }
    .spectacle{
        font-size: 0.7em;
        margin-top:-2% ;
    }
    .perf{
        font-size:1.2em ;
        margin-top: -3.5%;        
    }
}


@media all and (max-width: 500px)
{
    article h1
    {
        font-size: 1.5em;
    }
    article
    {
        height: 400px;
    }

       .music
    {
        font-size: 1.2em;
        margin-top: 37%;
    }
    .spectacle{
        font-size: 0.6em;
        margin-top:-3% ;
    }
    .perf{
        font-size:1em ;
        margin-top: -3.5%;        
    }
}

@media all and (max-width: 400px)
{
    .music
    {
        font-size: 1em;
        margin-top: 25%;
    }
    .spectacle{
        font-size: 0.5em;
        margin-top:-3% ;
    }
    .perf{
        font-size:0.8em ;
        margin-top: -3.5%;        
    }
}