body{
    background-color: white;
}
a {
    text-decoration: none;
}
#verticals:target {
    scroll-margin-top: -99px; /* Adjust this value to match your fixed header's height */
}

.header{
    background-color: transparent;
    transition: background-color 0.3s ease;
}

nav.header.inverted{
    background-color: black;
    transition: ease-in-out;
}


#logo{
    width: 120px;
    padding: 1rem;
}
.cls-1, .cls-2 {
    fill: #fff;
}

.nav-link{
    color: white;
}
.nav-link:hover{
    color: rgb(190, 190, 190);
}

.banner{
    background-image: url("../img/banner1.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
    height: 100vh;
    display: flex;
    align-items: end;
}
.box-text{
    background-color: rgba(121, 121, 121, 0.5);
    padding: 2rem;
    margin: .8rem;
    border-radius: 20px;
}
#btn-contact{
    width: 120px;
    margin-bottom: 1rem;
}

#opportunities{
    width: 140px;
    margin-bottom: 1rem;
}

.opp-btn{
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.anchor{
    height: 200px;
}

.verticals-bg{
    background-image: url("../img/vert-2.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.vert-box{
    min-height: 300px;
    position: relative;
}
.text{
    margin: auto 1rem 0;
    bottom: 26px;
    position: absolute;
}

.vert-box .text span{
    font-size: 12px;
}

footer{
    background-color: black;
}

@media only screen and (max-width: 600px) {
    #navbarNav{
        background-color: black;
    }
    #navbarNav ul li.nav-item a.nav-link{
        text-align: center;
    }
    .banner{
        height: 110vh;
    }
    div.verticals h2{
        margin-top: 3rem;
    }
    i.bi.bi-list{
        color: white;
        font-size: 2rem;
    }
    .opp-btn{
        position: relative;
        margin-left: auto;
        display: block;
    }
    .anchor{
        height: 80px;
    }
}