

.article_wrapper{
    width:90%;
    max-width:820px;
    margin:0 auto;
}
.article_hero{
  height:300px;
  background-position:bottom;
  background-repeat: no-repeat;
  background-size: cover;
  color:white;
  position: relative;
  border-radius: 3px;
}
.article1{
    background-image:  url('../img/article-image-1.jpeg');
}
.article2{
    background-image:  url('../img/article-image-2.jpeg');   
}
.article3{
    background-image:  url('../img/article-image-3.jpeg');
}
.article_text{
    max-width:675px;
    margin:50px auto;
    line-height: 28px;
}
.grid { 
    display: grid; 
    grid-template-columns: 1fr 1fr; 
    grid-template-rows: 1fr 1fr 1fr; 
    grid-column-gap: 5px;
    grid-row-gap: 10px; 
    max-width:600px;
    margin:0 auto;
  }
  .block{
    display:block;
  }
  .grid_image{
   display:block;
   height:145px;
   background-repeat: no-repeat;
   background-size: cover;
  }
  .gimage1{
    background-image:  url("../img/article-image-1.jpeg");
  }
  .gimage2{
    background-image:  url("../img/article-image-2.jpeg");
  }
  .gimage3{
    background-image:  url("../img/article-image-3.jpeg");
  }
  .gimage4{
    background-image:  url("../img/article-image-1.jpeg");
  }
  .gimage5{
    background-image:  url("../img/article-image-2.jpeg");
  }
  .gimage6{
    background-image:  url("../img/article-image-3.jpeg");
  }
  .text{
    padding:0.5rem;
  }
  .text h2{
    margin:0;
    font-size:1em;
    font-weight:600;
    color:black;
  }
  .text h2:hover{
    text-decoration:underline;
  }
  .text p{
    margin:3px 0 6px 0;
    color:grey;
    font-size:0.8em;
    font-family: sans-serif;
  }
  @media only screen and (min-width: 700px) {
    
  }
  @media only screen and (min-width: 1000px) {
    .grid { 
      display: grid; 
      grid-template-columns: 1fr 1fr 1fr; 
      grid-template-rows: 1fr 1fr; 
      grid-column-gap: 5px;
      grid-row-gap: 10px; 
      max-width:600px;
      margin:0 auto;
    }
  }