/* Header */
#logo {
    margin: 0;
    padding: 0;
    line-height: 1;
    font-weight: 400;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #222222;

    background-image: url(media/Headshot.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.img-thumbnail {
    border-radius: 50px;
}

.header-social-links {
    padding-right: 15px;
}

.header-social-links a {
    color: #6f6f6f;
    padding-left: 6px;
    display: inline-block;
    line-height: 0;
    transition: 1s;
    font-size: 16px;
}

.header-social-links a:hover {
    color: #34b7a7;
}

/* Background Image */
body {
    background-color: #f8f5e5;
}

#splash {
    background-image: url(media/IMG_9556.jpg);
    background-size: cover;
    background-position: center center;
    
    text-align: right;
    text-shadow: 0.75px 0.75px gray;
}

.mt-6 {
    margin-top: 4rem;
}

#btn-back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
}

.bi {
    font-size: 1.5rem;
}

/* applies to elements that have class="nav-link active" */
.nav-link.active {
    border-bottom: 1px solid;
}

.no-list-item {
    list-style-type: none;
    margin: auto;

    padding-left: 0;
    margin-left: 0;
}

#desc-list li {
    margin: 0.5rem;
    padding-left: 0;
    margin-left: 0;
}

#btn-back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: block;
}

@media (max-width: 767px) { /* medium */
    #splash {
        background-image: url(media/IMG_9551.jpg);
        background-size: cover;
        background-position: bottom;
    }

    #splash-text {
        text-align: center;
    }

    .text-bg {
        background-image: none;
    }

    .text-md-light {
        /* override .text-dark */
        color: white !important;
    }

    .nav-link {
        color: white;
    }

    .navbar-nav .nav-link.active {
        color: white;
    }
}