body{
   margin:0;
   padding:0;
  }
.boitefond{
  background-color: #000000;
  color: #FFFF;
  margin:0;
  padding:0;
}


h1{
  font-family: arpona, serif;
  font-weight: 200;
  font-size: 200px;
  font-style: italic;
  margin:0;
  padding:0;
  animation:clignoter 3s infinite;
}

@keyframes clignoter {
  0%  {opacity: red; width:5vh; font-size:5px; }
  50%  {opacity:blue; width: 15vh; }
  100% {opacity:1;  }
}

i{
  font-size: 10px;
}
p{
  animation: clignoter1 5s infinite;
}

@keyframes clignoter1 {
  0%  {opacity: red; width:15vh; font-size:5px; }
  50%  {opacity:blue; width: 15vh; }
  100% {opacity:yellow;font-size: 15px}
}

.boite1{
  background-color: #4D706D;
  display: inline-block;
  width: 20%;
  margin: 15px 5px 15px 5px;
  padding: 10px;
}

.grande-image{
  width:100%;
  animation-duration: 1s;
  animation-name: clignoter1;
  animation-iteration-count: infinite;
  transition: none;
}
.moyenne-image{
  width:50%;
}
.boite2{
  background-color: #505371;
  display: inline-block;
  width: 40%;
  margin: 15px 5px 15px 5px;
  padding: 10px;
}
.texteboite2{
  column-count: 2;
}

.boite3{
  display: inline-block;
  width: 20%;
  margin: 15px 5px 15px 5px;
  padding: 10px;
  animation: clignoter2 5s infinite;
 }

@keyframes clignoter2{
100% {background-color:yellow;font-size: 15px}
70%  {background-color:blue; width: 15vh; }
50%  {background-color:blue; width: 15vh; }
0%  {background-color:red; width:20vh; font-size:2px; }
}

.boite4{
  background-color: #313A6F;
  display: inline-block;
  width: 20%;
  margin: 15px 5px 15px 5px;
  padding: 10px;
}
.boite6{
  background-color: #4D706D;
  display: inline-block;
  width: 20%;
  margin: 15px 5px 15px 5px;
  padding: 10px;
}
.boite5{
  background-color: #6F3169;
  display: inline-block;
  width: 20%;
  margin: 15px 5px 15px 5px;
  padding: 10px;
}

@media (min-width: 200px) and (max-width: 900px) {
.boite1{
  background-color: #ABC6EB;
  display: block;
  width: 94%;
}
.boite2{
  background-color: #ABC6EB;
  display: block;
  width: 94%;
}
.boite3{
      background-color: #ABC6EB;
      display: block;
      width: 94%;

    }
      .boite4{
        background-color: #ABC6EB;
        display: block;
        width: 94%;

        }
        .boite5{
          background-color: #ABC6EB;
          display: block;
          width: 94%;

          }
          .boite6{
            background-color: #ABC6EB;
            display: block;
            width: 94%;

            }
            .boitefond{
              margin:0;
              padding:0 0 5px 0;
            }
}