.container {  display: grid;
    grid-template-columns: 0% 80% 0%;
    grid-template-rows: 0fr 1.5fr 1.5fr 0fr;
    grid-auto-rows: 1fr 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
      ". header ."
      ". main ."
      ". main ."
      ". . .";
      width: 80%;
      margin: 0 auto;
  }
  
  
  .main {  display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 5px 5px;
    grid-auto-flow: row;
    grid-template-areas:
      "blog1 blog2 blog3"
      "blog4 blog5 blog6";
    grid-area: main;
  }
  
  .blog1 { grid-area: blog1;}
  
  .blog2 { grid-area: blog2; }
  
  .blog3 { grid-area: blog3; }
  
  .blog4 { grid-area: blog4; }
  
  .blog5 { grid-area: blog5; }
  
  .blog6 { grid-area: blog6; }