svg{fill:red}div.fixed{position:fixed;bottom:0;right:0;padding-bottom:10px;padding-right:10px;font-size:30px}.container{width:100%;transition:width 2s}span{font-size:25px;color:#000;animation:blink 4s linear infinite}@keyframes blink {
0%{opacity: 0;}
50%{opacity: 1;}
100%{opacity: 0;}
}a{text-decoration:none;color:#000}.vid{width:100%;height:auto;padding:0 11%;padding-top:20px;outline:none}.container{position:relative}.middle{transition:.5s ease;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);text-align:center}.container:hover .image{opacity:.3;animation-name:example;animation-duration:2s;-webkit-filter:grayscale(100%) invert(100%) contrast(100%)}@keyframes example {
  from {opacity: 1;}
  to {opacity: 0.3;}
  from {-webkit-filter: grayscale(0%) invert(0%) contrast(100%);}
  to {-webkit-filter: grayscale(100%) invert(100%) contrast(100%);}
}.container:hover .middle{opacity:1}.text{color:#000;font-size:20px;padding:16px 32px}*{box-sizing:border-box}body{margin:0;font-family:Arial;background-color:#f5f5f5}.cont{position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0);font-size:35px;text-align:center}.projecttitle{font-size:35px;display:inline-block;text-align:left;margin:20px 11% 0 11%}.description{font-size:20px;display:inline-block;text-align:justify;text-justify:inter-word;margin:20px 11% 20px 11%}.titre{font-size:35px;display:inline-block;text-align:left;padding-top:30px;padding-bottom:5px;padding-left:11%;transition:font-size 2s}.titre:hover,.soustitre:hover{}.soustitre{transition:font-size 2s;font-size:35px;float:right;text-align:right;display:inline-block;padding-top:30px;padding-bottom:5px;padding-right:11%}.row{display:flex;flex-wrap:wrap;padding:0 20px}.column1{flex:39.2%;padding:0 10px;padding-left:10%}.column2{flex:60.8%;padding:0 10px;padding-right:10%}.column3{display:flex;flex-wrap:wrap;flex:60.8%;padding:0 10px;padding-left:10%;align-self:flex-end}.column4{display:flex;flex-wrap:wrap;flex:39.2%;padding:0 10px;padding-right:10%;align-self:flex-end}.column5{flex:39.2%;padding:0 10px;padding-left:10%;padding-bottom:60px}.column6{flex:60.8%;padding:0 10px;padding-right:10%;padding-bottom:60px}.column1 img{margin-top:20px;vertical-align:middle}.column2 img{margin-top:20px;vertical-align:middle}.column3 img{margin-top:20px;vertical-align:middle}.column4 img{margin-top:20px;vertical-align:middle}.column5 img{margin-top:20px;vertical-align:middle}.column6 img{margin-top:20px;vertical-align:middle}@media (max-width:1000px){.column1{flex:100%;max-width:100%;padding:0 10%}.column2{flex:100%;max-width:100%;padding:0 10%}.column3{flex:100%;max-width:100%;padding:0 10%}.column4{display:block;flex:100%;max-width:100%;padding:0 10%}.column5{flex:100%;max-width:100%;padding:0 10%}.column6{flex:100%;max-width:100%;padding:0 10%;padding-bottom:40px}.titre{font-size:40px}.soustitre{font-size:40px}.projecttitle{font-size:40px}.cont{font-size:40px}.description{font-size:15px}.text{font-size:30px}}@media (max-width:800px){.titre{font-size:32px}.soustitre{font-size:32px}.projecttitle{font-size:32px}.cont{font-size:32px}.description{font-size:22px}.text{font-size:20px}}a.titre:hover,a.soustitre:hover,a.mail:hover{-webkit-mask-image:linear-gradient(-75deg,rgba(0,0,0,.4) 30%,#000 50%,rgba(0,0,0,.4) 70%);-webkit-mask-size:200%;animation:shine 2s infinite}@-webkit-keyframes shine {
  from {
    -webkit-mask-position: 150%;
  }

  to {
    -webkit-mask-position: -50%;
  }
}@media (max-width:600px){.titre{font-size:28px}.soustitre{font-size:28px}.projecttitle{font-size:28px}.cont{font-size:28px}.description{font-size:18px}.text{font-size:20px}}