#spacer{
  padding-top: 6vmin;
}

div#main_content {
  display: flex;
  width:100%;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
}

div#about_us_container{
  display: flex;
  justify-items: center;
  flex-direction: column;
  align-items: center;
}


img#church_image{
  width:50vmin;
  height:50vmin;
  border-radius: 100%;
}


div.meeting_info_container div p{
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
}


.wherewemeet_normal{
    font-size: clamp(1rem, 5vmin, 5vmin);
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
}

.wherewemeet_heading{
    font-size:  clamp(2rem, 10vmin, 5vmin);
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
}

#notes{
  white-space: pre-line;
}

#add_to_cal{
  width:100%;
  display: flex;
  align-items: center;
  justify-content: center;
}


.container {
  display: flex;
  flex-direction: column; /* Mobile default: stacked */
  gap: 1rem; /* spacing between divs */
}
  
.box {
  width: 100%;
  text-align: center;
}

.map_container{
    width: 90vw;
    aspect-ratio: 20/15;
}
  
/* Desktop layout */
@media (min-width: 768px) {
    .container {
      flex-direction: row; /* side by side */
      justify-content: space-between;
    }
  
    .box {
      width: 40%; /* each div gets 40% */
    }

    .map_container{
        width: 60vw;
        aspect-ratio: 20/10;
    }
}