/**, *::before, *::after {*/
/*    margin:0;*/
/*    padding:0;*/
/*}*/

/*html {*/
/*    height:100%;*/
/*}*/
/*body {*/
/*    min-height:100%;*/
/*}*/
/*.vert {*/
/*    background-color:green;*/
/*}*/
/*.bleu {*/
/*    background-color:blue;*/
/*}*/
/*.violet {*/
/*    background-color:violet;*/
/*}*/
/*.orange {*/
/*    background-color:orange;*/
/*}*/
/*.rouge {*/
/*    background-color:red;*/
/*}*/
/*section {*/
/*    display:flex;*/
/*    align-items:center;*/
/*    justify-content:center;*/
/*    height:100vh;*/
/*}*/
/*div {*/
    /*flex-grow:1;*/
    /*height:100vh;*/
/*    width:100%;*/
/*}*/
/*span {*/
    /*background-color:white; /*rgba
/*    border-radius:50%;*/
/*    height:auto;*/
/*    display:block;*/
/*    font-size: 48px;*/
/*    font-weight:bold;*/
/*    text-align:center;*/
/*    width:1em;*/
/*}*/


/* ====================================
   CSS setup – ne rien modifier
   éditer plus bas
 * ==================================== */

body { margin: 0; padding: 0; border: 0; }
section { min-height: 100vh; }
div { background-color: lightgrey; 
        width:100%;
}
div:nth-of-type(5n+1) { background-color: #1abc9c; }
div:nth-of-type(5n+2) { background-color: #3498db; }
div:nth-of-type(5n+3) { background-color: #9b59b6; }
div:nth-of-type(5n) { background-color: #e74c3c; }
span { background-color: rgba(255, 255, 255, .5); 
        border-radius: 50%; 
        display: block; 
        font-size: 48px; 
        height: auto; 
        line-height: 3em; 
        text-align: center; 
        width: 3em; }

/* ====================================
   éditer à partir d'ici
 * ==================================== */

section {
  display:flex;
  /*Exercie 2*/
  flex-wrap:wrap;
}

div {
    width:25%;
}

/*Exercie 3*/
section {
    border: 2px solid;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
    justify-content: space-around;
    align-content: center;
    align-items: center;
}

div {
    height:49vh;
    width:24%;
    margin-top:5px;
    margin-bottom:5px;
    display:flex;
    justify-content:center;
    align-items:center;
}