:root {
--dark: #2f3232;
--light: #d0cdcd;
}
* {
    margin: 0; padding: 0; border: 0; box-sizing: boarder-box;
} 
html {
    scroll-behavior: smooth;
}
body{
    background-color: var(--light);
    min-height: 90vh;
}

.background-box {
    background-color: var(--light);
    min-height: 80vh;
}

@media (max-width: 576px) {
    .background-box {
        min-height: 85vh;
    }
}
.background-footer {
    background-color: #d0cdcd;
    margin-top: auto;
}
.hr-footer {
    border: none;
    height: 3px;
    background: var(--dark);
}
.text-dark{
    color: var(--dark)
}
.activegd{
    text-decoration: overline;
}

.text-med{
    font-size: 22pt;
  padding-inline: 1.3vw;
}

@media (max-width: 576px) {
    .text-med{
        font-size: 36pt;
      padding-inline: 1.3vw;
    }
}
.footer-ul{
    display:inline;
}


.navbar-light{
   font-family: 'Segoe UI';
   font-size: 1.5rem;
}
.nav-link{
    color:var(--dark) !important
}
.nav-item{
    padding-inline: 10px;
}
.dropdown-menu{
    background-color: var(--light);
}
.dropdown-item.active, .dropdown-item:active {
    color: var(--dark);
    text-decoration: none;
    background-color: var(--light);
}
.navbar-gilli{
    border-color: var(--dark);
    font-family: 'Segoe UI';
    font-size: 1.5rem;
    color: var(--dark);
    padding-top: Auto;
}
a:link{
    color: var(--dark)
}
a:visited{
    color: var(--dark)
}
a:hover{
    color: var(--dark)
}
a:active{
    color: var(--dark);
   
}
a:after{
    color: var(--dark);
    text-decoration:overline;
}


.button-custom {
    background-color: var(--dark);
    color: var(--light);
    border: 2px solid var(--dark);
    padding: 10px 80px;
    font-size: 1.2rem;
    font-family: 'Segoe UI', sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-radius: 5px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
    text-align: center;
    display: inline-block;
    width: 100%;
}

.button-custom:hover {
    background-color: var(--light);
    color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 5px 2px rgba(47, 50, 50, 0.5);
}

.button-custom:active {
    background-color: #565656;
    color: var(--light);
    border-color: var(--dark);
}

.button-custom:focus {
    outline: none;
    box-shadow: 0 0 5px 2px rgba(47, 50, 50, 0.5);
}

.form-label {
    text-transform: lowercase;
    font-family: 'Segoe UI', sans-serif;
    font-size: 1.5rem;
    }