body {
 font-family: "DM Sans", sans-serif;
 color: #000022;
 background-color: #ffffff;
 margin: 0px;
 padding-top: 10px;
}

#container {
 background-color: #f8f8ff;
 position: relative;
 margin: 0px auto;
 padding: 0px;
 max-width: 900px;
 min-height: 500px;
 background-repeat: no-repeat;
 background-size: 100% auto;
 border: 1px solid #d9d9d9;
}

#masthead {
 width: 100%;
 height:60px;
}
.masthead_image {
 width:50px;
}
.masthead_image img {
 padding: 0;
 width:40px;
 margin: 5px 5px 11px 5px;
}
.masthead_text {
 padding: 0px 0px 10px 0px;
 max-width:100px;
}
.masthead_text a:link, .masthead_text a:visited {
 font-family: "DM Serif Display", sans-serif;
 font-weight: bold;
 font-size: 10px;
 line-height: 10px;
 color: #000022;
 text-decoration: none;
}

#navigation {
 float: right;
 height: 50px;
 margin: 10px 0px 0px 0px;
}

h1, h2, h3, h4, h5, h6 {
 font-family: "DM Serif Display", sans-serif;
 color: var(--h-color);
 margin: 0px;
 padding: 0px;
}

figure {
 margin:20px 0px 20px 0px;
 font-size:14px;
}

#content {
 z-index:0;
 width: 100%;
 min-height: 400px;
 margin: 0;
 padding-top: 10px 0px 20px 0px;
 font-size: 20px;
}
#content a:link, #content a:visited {
 color: #57504b;
}
#content a:hover {
 color: #332e2c;
 text-shadow: 2px 2px 2px rgba(50, 50, 50, 0.2);
}
#content_inner {
 padding-left: 3%;
 padding-right: 3%;
 color: #000022;
}
#content img {
 border-top: 10px var(--pictop-color) solid;
}

.support_us, .become_member,.make_donation {
 background-color: #b8c83e; /* Green background */
 width:200px;
 height: 34px; /* Fixed height */
 margin: 0 auto; /* Horizontal centering */
 display: flex; /* Flexbox for centering text */
 justify-content: center; /* Center text horizontally */
 align-items: center; /* Center text vertically */
 font-size: 16px; /* Text size */
 text-decoration:none;
}

 .become_member a:link, .become_member a:visited {
  text-decoration: none;
  color: #000022 !important;
 }

 /*When screen is smaller than 700px*/
 @media screen and (max-width: 700px) {
  body {
   padding-top: 0px;
  }

  #container {
   background-image: none !important;
  }

  #content {
   display: block;
   width: 96%;
   padding: 10px 2% 10px 2%;
   margin: 0;
   min-height: 300px;
   font-size: 16px;
  }

  .div_visit {
   flex-direction: column;
  }


  .box {
   width: 100%; /* Full width on mobile */
  }
 }

.div_visit {
 display: flex;
 flex-wrap: wrap; /* Allows items to wrap if needed */
 gap: 10px;
 padding: 10px;
 font-size: 15px;
 width: 100%;
 box-sizing: border-box; /* Includes padding in width */
 border-top: 1px solid #d9d9d9;
 border-bottom: 1px solid #d9d9d9;
}

.div_visit img {
 border: none !important;
}


.div_boxes {
 display: flex;
 flex-wrap: wrap; /* Allows items to wrap if needed */
 gap: 10px;
 padding: 10px;
 font-size: 15px;
 width: 100%;
 box-sizing: border-box; /* Includes padding in width */
 border-top: 1px solid #d9d9d9;
 border-bottom: 1px solid #d9d9d9;
}
.boxes_links {
 display: inline-block;
 width: fit-content;
 padding: 10px;
 background-color: var(--pictop-color); /* Green background */
 height: 34px; /* Fixed height */
 margin: 0 auto; /* Horizontal centering */
 display: flex; /* Flexbox for centering text */
 justify-content: center; /* Center text horizontally */
 align-items: center; /* Center text vertically */
 margin-bottom: 10px;
}
.boxes_links a:link, .boxes_links a:visited {
 min-width:140px;
 text-align:center;
 text-decoration: none;
 color: #000022 !important;
 font-size: 16px;
}
.div_boxes img {
 border-top: 14px solid #84A07C;
 border-right: 1px solid #84A07C;
 border-bottom: 1px solid #84A07C;
 border-left: 1px solid #84A07C;
}
.box {
 flex: 1; /* Equal width */
 min-width: 0; /* Prevents overflow issues */
 padding: 20px;
 background-color: #f8f8ff;
 box-sizing: border-box;
 overflow: hidden;
}