:root {
  /* --show-grid: solid black; */
  --show-grid: 0px;
}
  
.container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; 
    /* grid-template-rows: 80px 1fr 1fr 1fr 1fr 1fr; */
    grid-template-rows: 80px;
    /* place-items: center; */
    /* justify-items: center; */

    grid-template-areas:
      "nav nav nav nav nav nav"
      "main main main main main main"
      "content1 content1 content1 content2 content2 content2"
      "content3 content3 content3 content4 content4 content4"
      "content5 content5 content5 content5 content5 content5"
      "content6 content6 content6 content7 content7 content7" 
      "content8 content8 content8 content9 content9 content9" 
      "content10 content10 content10 content10 content10 content10"
      "content11 content11 content11 content11 content11 content11"
      "content12 content12 content13 content13 content14 content14"
      "content15 content15 content15 content15 content15 content15"
      "content16 content16 content16 content16 content16 content16"
      "content17 content17 content18 content18 content18 content18"
      "footer footer footer footer footer footer";
    /* text-align: center; */
    padding-left: 150px;
    padding-right: 150px;
    text-align: center;
}
  
#content1, #content2, #content3, #content4, #content5, #content6,
  #content7, #content8, #content9, #content10, #content11, #content12, #content13, #content14, #content15, #content16, #content17, #content18, #footer
{
  background-color: rgba(246, 238, 209, 0.8); 
  line-height: 1.5;
  border: var(--show-grid);
}

#content1 {
  padding-top: 15px;
}
#content6 {
  padding-top: 15px;
}

.img-s {
	width: 95%;
	/* max-width: 600px; */
	height: auto;

}
.img-l {
	width: 95%;
	/* max-width: 600px; */
	height: auto;

}
#content8 {
  padding-top: 15px;
}
#content9 {
  padding-top: 15px;
}



#content2 {
  padding-top:0px;
  padding-left:10px;
  padding-right:10px;
}


#content10 {
  padding-left:30px;
}

#content11, #content16 {
  padding-left:20px;
}

#content12, #content17 {
  padding:10px;
}

#content18{
  padding:30px;

}



#content5, #content10, #content15{
  font-weight: 600;
} 

@media only screen and (max-width: 1268px) {
  /* ipad/small laptop */ 

  .container {
    padding-left: 20px;
    padding-right: 20px;
  } 
}

@media only screen and (max-width: 768px) {
    /* phone */
    #content2, #content5, #content6, #content9, #content10, #content15
    {
      padding: 5px;
      line-height: 1;
      /* border: solid rgb(240, 14, 14); */
    }

    #content3, #content4, #content7, #content8
    {
      padding: 5px;
      line-height: 1.2;
      /* border: solid rgb(240, 14, 14); */
    }

    #content2, #content7 .general-info{
      padding-top:5px;
      padding-left:5px;
      padding-right:5px;
    }

    #content13{
      padding-left:5px;
      padding-right:5px;
      line-height: 1;
      padding-bottom:0px;

    }
     
    #content14{
      padding-left:5px;
      padding-right:5px;
      line-height: 1;
      padding-top:0px;
    }

    
    
    
    


    #content12{
      padding-top:0px;
      padding-bottom:0px;
    }
    
    #content13{
      padding-top:0px;
      padding-bottom:0px;
    }
    
    /* #content12 ul {
      margin-top: 0px;
    }
    #content11 ul {
      margin-bottom: 0px;
      padding-bottom:0px;
    } */

    .container {
      grid-template-columns: 1fr;
      /* grid-template-rows: 0.4fr 0.4fr 2.2fr 1.2fr 1.2fr 1.2fr 1fr; */
      grid-template-areas:
      "nav"
      "main"
      "content1"
      "content2"
      "content3"
      "content4"
      "content5"
      "content6"
      "content7"
      "content8"
      "content9"
      "content10"
      "content11"
      "content12"
      "content13"
      "content14"
      "content15"
      "content16"
      "content17"
      "content18"
      "footer";
      padding-left: 0px;
      padding-right: 0px;
    } 

}