* {
    box-sizing: border-box;
  }
  
  .grid-container {
    display: grid;
    border: 5px rgb(4, 36, 19) solid;
    height: 1200px;
    width: 1000px;
    grid-template-columns: repeat(11, 1fr);
    grid-template-rows: repeat(15, 1fr);
    background-color: tan;
    justify-items: center;
    background-image: url("WATERTOWERSTCFmay24.jpg");
 
    background-repeat: no-repeat;
    background-size: cover;

    margin-left: auto;
    margin-right: auto;
    
    
    
    
    
  }
  

  
  
  .title {
      grid-area: 2 / 6 / span 1 / span 5;
      font-family: 'Odibee Sans', cursive;
      font-size: 45px;

  }
  
  .blog {
      grid-area: 1 / 6 / span 1 / span 3;
      text-align: center;
      font-size: 38px;
      font-family: 'Odibee Sans', cursive;
      padding-top: 20px;
      color: darkgray;
      
  }

  
    
  
  
  .vert3 {
    
        
        width: 600px;
        height: 450px;
        overflow-x: hidden;
        overflow-y: auto;
        text-align: center;
        padding: 20px;
        grid-area: 5 / 7 / span 10 / span 4;
        font-family: odibee sans;
        font-size: 28px;
        list-style: none;
        font-family: 'Odibee Sans', cursive;
        
        text-align: left;
        margin-top: 40px;
        width: 80%;
        margin-left: 55px;
        padding-left: 10px;
    
         
        
  }
  
  
  
  li {
      padding-left: 15px;
      color: darkgrey;
  }
  
  
  
  
  
  ul {
  
  
  margin-left: auto;
  margin-right: auto;
  padding-top: 35px;
  padding-left: 20px;
  
  }

  a {
    text-decoration: none;
    color: darkgreen;
    


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


    .grid-container {
     
      background-image: url("WATERTOWERSTCFmay2442Opac.jpg");



      }


 .title {
      grid-area: 2 / 3 / span 1 / span 5;
      
      font-size: 46px;

    
 }


.blog {
      grid-area: 1 / 3 / span 1 / span 3;
      text-align: center;
      font-size: 42px;
      font-family: 'Odibee Sans', cursive;
      padding-top: 20px;
      color: darkgray;
      
  }



.vert3 {
    

  
        grid-area: 5 / 3 / span 10 / span 4;
        font-size: 34px;
       
         
        
  }





    

    
    }
    
	
	
	
	
@media (min-width: 2000px) {

}


@media (min-width: 1800px) and (max-width: 1999px) {

}

@media (min-width: 1600px) and (max-width: 1799px) {

}

@media (min-width: 1440px) and (max-width: 1599px) {

}
@media (min-width: 1300px) and (max-width: 1439px) {

}
@media (min-width: 1100px) and (max-width: 1299px) {

}

@media (min-width: 1000px) and (max-width: 1099px) {

}

@media (min-width: 768px) and (max-width: 999px) {

}

@media (min-width: 601px) and (max-width: 767px) {

}

@media (min-width: 480px) and (max-width: 600px) {

}


@media (min-width: 381px) and (max-width: 479px) {
.grid-container {
    display: block!Important;
    height: 1200px!Important;
    width: auto!Important;
}
.title{
    text-align: center!Important;
    font-size: 36px;
}
.vert3 {
    margin-left: 60px!Important;
	height: 850px;
}
}


@media (min-width: 150px) and (max-width: 380px) {
.grid-container {
    display: block!Important;
    height: 1200px!Important;
    width: auto!Important;
}
.title{
	text-align: center!Important;
}
.vert3 {
    margin-left: auto!Important;
    height: 850px;
}
}