.titre{
  background: rgba(255, 255, 255, 0.6);
  padding:2%;
  font-size: 100px;
  text-align: center; 
  font-family: Amatic;
  width:50%;
  margin:auto;
  border-radius: 25px;
}

.heade{
  width:50%;
  mix-blend-mode:screen;
  text-align: center;
  margin:auto;
}

.navigation{ 
  color:black;
  text-align:center;
  width:50%;
  padding:1%;
  margin:auto;
  border-radius: 25px;
  background: rgba(255, 255, 255, 0.6);
  display:flex;
  justify-content:space-evenly;
}

  body{
    text-align:center;
    background-color: rgb(6,245,230);
    background: linear-gradient(180deg, rgba(115,17,0,1) 0%, rgba(200,87,42,1) 50%, rgba(236,187,21,1) 100%), url("../../../images/clouds.jpg");
    background-blend-mode: screen;
    background-size: cover;
    background-size: 50%;
}
  .navigation a{
    color: black;
    padding:5px;
  }

  .navigation a:hover{
    color: white;
    background-color:black;
    border-radius:10px
    }
    
  #principal{
    width:60%;
    margin:auto;
    background-color:rgba(255,255,255,0.5);
    padding:2%;
    border-radius:25px;
    color:#9B0862;
  }
  
  #principal p{
    mix-blend-mode:multiply;
  }
  
  #oeuvre{
    width:100%;
  }
  
  @font-face {
  font-family: Amatic;
  src: url(../../../Fonts/AmaticSC.ttf);
}

  /*@media (min-width:320px) { 
    /* smartphones, iPhone, portrait 480x320 phones
    .titre{
      width:90%;
    }
    .heade{
      width:90%;
    }
    .navigation{
      width:90%;
    }*/