
  .large--header {
    justify-content: flex-start;
  }
  .container,
  #ham,
  main {
    width: 98%;
    margin: 0 1%;
  }
  .hero {
    height: 300px;
    width: 100%;
    /* background-size: cover;
    background-image: url(../images/heromedium.jpg); */
  }
  section {
    border-radius: 0.4rem;
    position: absolute;
    width: 200px;
    background-color: rgba(99, 96, 21, 0.775);
    margin: 0;
    padding: 0;
    padding-bottom: 0.5rem;
    top: 80%;
    left: 8%;
  }
    /*////////////////////////////// forecat ////////////////////////////////////*/

  .forecast {
    display: block;
    display: flex;
    
  }
  
  .forecast h3,
  .forecast p {
    text-align: center;
  }
  #forecast > div {
    padding: 0 0;
    width: 95px;
  margin: 0 auto;}
  #forecast > div p {
    font-size: 1.2rem;}
  #forecast > div h3 {
    width: 95px;
    padding: 0.2rem 0;}

  /*          /////////////////////////// gallery//////////////////////////////////////////////////////// */
.gallery-container{
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 0 5% 50px 5%;

  gap: 4vh;
}
figure{
  width: 100%;
  height: 40vh;
  margin: 0;
  background-color: white;
  border-radius: 3px;
  
  overflow: hidden;
}
.gallery-container img {
  height: 100%;
}
.gallery-container figure:nth-child(1){
  grid-area: 1/1/2/2;
  
}
.gallery-container figure:nth-child(2){
  grid-area: 2/1/3/2;


}
.gallery-container figure:nth-child(3){


}
.gallery-container figure:nth-child(4){
  height: 84vh;
  grid-area: 1/2/3/3;


}
.gallery-container figure:nth-child(5){

}
.gallery-container figure:nth-child(6){

}
.gallery-container figure:nth-child(7){


}
.gallery-container figure:nth-child(8){
  height: 82vh;
  grid-area: 3/1/5/2;


}
.gallery-container figure:nth-child(9){
  height: 82vh;
  grid-area: 4/2/6/3;


}

/**                   HOME                 **/
div.town-data {
  

}
div.town-data > div  {
  display: flex;
  justify-content: space-around;


  
}
div.town-data > div  div {
  width: 35%;
}
div.town-data > div  img {
  width: 50%;
  max-width: 300px;
  height: 200px;
  margin: 2rem 0;
}
.home-hero img  {
  
  height: 350px;
}
#home-article-img img {
  height: 330px;
}

 



