:root{
    --green-1: #00ef86; 
--blue-1: #008cff;
--purple-1: #5f36f4; 
--red-1: #ec3258; 
--yellow-1: #fcda00; 
--btn-background-color:#00ef86;
}




body{
    background-color: rgb(252, 251, 251);
    color: black;
}
.offcanvas-top {
  background-color: rgb(255, 255, 255);
  color: rgb(0, 0, 0);
--bs-offcanvas-width: 100vw;
--bs-offcanvas-height: 100vh;
}
.offcanvas-body >ul>li{
font-size: 72px;
}
.offcanvas-body >ul>li>a{
  text-decoration: none;
  color: rgb(7, 7, 7);
  font-size: 72px;
  }

.offcanvas-body>ul>li::before {
content: ""; 
width: 20px;
height: 20px;
border-radius: 50%;
background:  linear-gradient(270deg, var(--green-1)  0%, var(--green-1) 100% ) !important;
font-weight: bold;
display: inline-block;
/* margin-left: -1em; */
font-size: 40px;
margin-bottom: 11px;
margin-right: 8px;
opacity: 0; /* Initially hidden */
transition: opacity 0.3s ease; /* Smooth transition */
}

.offcanvas-body>ul>li:hover:before {
opacity: 1;
}

.ex-btn-1:hover {
    box-shadow: 0 0 10px 0 var( --green-1) inset, 0 0 20px 2px var( --green-1);
  }
.ex-btn-1
{ 
    padding-inline: 20px;
} 


.ex-btn-1{
    background-color: var(--btn-background-color);
    animation: gradient 15s ease infinite !important;
    color: white !important;
}

.ex-btn-1:hover{
    background-color: var(--btn-background-color);
    animation: gradient 15s ease infinite !important;
    color: white !important; 
}


            /* footer  */
            footer.sticky-footer .copyright {
                line-height: 1;
                font-size: .8rem;
            }
            footer.sticky-footer {
                padding: 2rem 0;
                flex-shrink: 0;
            }

            a{
                color: var(--green-1);
                text-decoration: none;
            }
            a:hover{
                text-decoration: underline;
            }



            .map-container {
                position: relative;
                width: 100%;
                padding-bottom: 56.25%; /* 16:9 aspect ratio */
                height: 0;
                overflow: hidden;
            }
            
            .map-container iframe {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                border: 0;
            }