﻿body, html {
   margin: 0;
   padding: 0;
   font-family: 'Kumbh Sans', sans-serif
}

#animated-header {
   position: relative;
   height: 70vh;
   overflow: hidden;
   background-color: grey;

}

#animated-header2 {
   position: relative;
   height: 43vh;
   overflow: hidden;
   background-color: grey;
}

#animated-header3 {
   position: relative;
   height: 600px;
   overflow: hidden;
   background-color: grey;
}

#animated-header4 {
   position: relative;
   height: 500px;
   overflow: hidden;
   background-color: grey;
}

.white-line {
   border: none;
   height: 2px;
   background-color: white;
   width: 80px;
   margin: 1rem auto;
}


.overlap-box {
   position: absolute;
   top:25%; /* adjust as you want */
   left: 43%; /* adjust as you want */
   transform: translateY(-50%);
   z-index: 10;
   background-color: #419D87;
   color: white;
   border-radius: 12px;
}

.overlap-box2 {
   position: absolute;
   top:35%; /* adjust as you want */
   left: 50%; /* adjust as you want */
   transform: translateY(-50%);
   z-index: 10;
   background-color: #419D87;
   color: white;
   border-radius: 12px;
}

.overlap-box3 {
   position: absolute;
   top: 30%; /* adjust as you want */
   left: 50%; /* adjust as you want */
   transform: translateY(-50%);
   z-index: 10;
   background-color: #419D87;
   color: white;
   border-radius: 12px;
}
.overlap-box4 {
   position: absolute;
   top: 28%; /* adjust as you want */
   left: 50%; /* adjust as you want */
   transform: translateY(-50%);
   z-index: 10;
   background-color: #419D87;
   color: white;
   border-radius: 12px;
}
.custom-btn {
   background-color: #0A1A3D; /* Navy blue */
   color: white;
   border: none;
   padding: 8px 20px;
   font-size: 1rem;
   font-weight: 300;
   border-radius:0px;
   cursor: pointer;
   transition: background-color 0.35s ease, transform 0.25s ease, box-shadow 0.35s ease;
}

   .custom-btn:hover {
      background-color: #419D87; /* Your green */
      transform: translateY(-3px) scale(1.03);
      box-shadow: 0 10px 20px rgba(0,0,0,0.15);
   }

   .custom-btn:active {
      transform: scale(0.98);
   }

.custom2-btn {
   background-color: #419D87;
   color:white;
   border: none;
   padding: 8px 15px;
   font-size: 1rem;
   font-weight: 300;
   border-radius: 0px;
   cursor: pointer;
   transition: background-color 0.35s ease, transform 0.25s ease, box-shadow 0.35s ease;
}

   .custom2-btn:hover {
      background-color: #0A1A3D;
      color: white;
      transform: translateY(-3px) scale(1.03);
      box-shadow: 0 10px 20px rgba(0,0,0,0.15);
   }

   .custom2-btn:active {
      transform: scale(0.98);
   }

.text-shadow-black {
   text-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

.site-footer {
   background-color: #343A40;
   color: white;
   padding: 40px 0;
   font-size: 0.9rem;
}

   .site-footer a {
      color: #419D87;
      text-decoration: none;
      transition: color 0.3s;
   }

      .site-footer a:hover {
         color: #ffffff;
         text-decoration: underline;
      }

   .site-footer .footer-logo img {
      width: 180px;
   }

   .site-footer .social-icons a {
      margin-right: 10px;
      font-size: 1.2rem;
   }
