@import url('https://fonts.googleapis.com/css2?family=Stint+Ultra+Condensed&family=Viga&display=swap');

html, body {
   padding:0;
   margin:0;
   font-family:'Stint Ultra Condensed', cursive;
   font-size:1.2em;
   letter-spacing:0.02em;
}

main {
   display:flex;
   margin-bottom:80px;
}

aside {
   position:fixed;
   left:0;
   overflow-y:hidden;
   max-width:33%;
   width:100%;
   height:100vh;
   background-image:url('affichejpm.jpg');
   background-size:cover;
   background-repeat:no-repeat;
   background-position:center;
}

#blogue {
   width:100%;
   max-width:66.666%;
   margin-left:33.333%;
   padding:0 80px;
   box-sizing:border-box;
}

article {
   display:block;
   padding:30px 0;
   border-bottom:1px solid #d1d1d1;
}

article:last-child {
   border-bottom:unset;
}

article img {
   max-width:260px;
   width:auto;
   height:auto;
   float:right;
   margin-left:30px;
   margin-bottom:20px;
   display:flex;
}

p {
   margin-top:0;
}

.entry-content {
   display:table;
   clear:both;
}

time {
   float:left;
   font-size:0.9em;
   color:#373737;
}

h1 {
   font-family:'Viga', sans-serif;
}

/*///////////////////////////////////////////
Adaptatif
//////////////////////////////////////////*/

@media screen and (max-width:960px) {

   #blogue {
      max-width:60%;
      padding:0 40px;
      margin-left:40%;
   }

   aside {
      max-width:40%;
   }

}

@media screen and (max-width:920px) {

   article img {
      max-width:unset;
      width:100%;
   }

}

@media screen and (max-width:680px) {

   aside {
      display:none;
   }

   #blogue {
      max-width:100%;
      margin-left:unset;
   }

}

@media screen and (max-width:320px) {

   #blogue {
      padding:0 30px;
      font-size:1.05em;
   }

}