body{
    /* background-color: brown; */
    margin: 0;
    padding: 0;
}

header{
    width: 100%;
    height: 70vh;
    background-image: url('..//img/top_bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    padding-top: 10px;
}

.top{
    width: 100%;
    height: auto;
    /* border: 2px solid orangered; */
    
    text-align: center;
    gap: 10px;
    padding-top: 10px;
    /* display: flex; */
}

.top h2{
    font-size: 50px;
    color:  #80002a;
}

.top p{
    /* width: 600px; */
    text-align: center;
    margin: 10px;
    margin-top: 10px;


}

.intro-text{
    font-family: "Bree Serif", serif;
  font-weight: 400;
  font-style: normal;
  color: #cc0000;
}

.description{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #4d0000;
}

.events{
   width: 95%;
   height: auto;
   display: flex;
   flex-wrap: wrap;
   /* align-items: center; */
   justify-content: center;
   margin: auto;


  
  

}

 .events .container{
    width: 300px;
    height: auto;
    border: 2px solid rgba(185, 185, 185, 0.37);
    margin: 10px;
    padding: 10px;
    text-align: center;
    /* box-shadow: 0 26px 58px 0 rgba(0, 0, 0, 0.075), 0 5px 14px 0 rgba(0, 0, 0, 0.062); */
 }
 
 .events .container img{
    width: 100%;
 }

 .events .container h3{
    color: #cc0000;

    margin: 8px;
 }

   /* Responsive Design */
   @media (max-width: 768px) {
   .top h2{
    font-size: 30px;
   }

   
  }