/* Navbar styling */

#brand {
    background-color: darkred;
    color: white;
}

nav {
    background-color: blue;
}

.navbar .nav-link, .navbar-brand {
    color: white;
}

.navbar-brand:focus {
    color: white;
}

.navbar-toggler-icon {
    /* Provides an icon for the navbar on mobile view */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.nav-link:hover {
    text-decoration: underline;
}

.navbar-brand:hover {
    text-decoration: underline;
    color: white;
}

.navbar-nav {
    margin-top: 9px;    
}

/* Main section styling */

h3 {
    font-size: 1.25rem;
}

h4 {
    font-size: 1rem;
}

.links:hover {
    text-decoration: underline;
}

.subheadimgcontainer {
    max-width: 300px;
    margin: auto;
}

.subheadimg {
    object-fit: cover;
}

.headimgcontainer {
    max-width: 300px;
    margin: auto;
}

.headimg {
    object-fit: cover;
}

@media only screen and (min-width: 767px) {
    .subheadtext {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
}

@media only screen and (min-width: 991px) {
    
    .border-lg-right {
        border-right: 1px solid #e4e7ea;
    }

    .border-lg-bottom {
        border-bottom: 1px solid #e4e7ea;
    }

    .border-lg-top {
        border-top: 1px solid #e4e7ea;
    }

    .subheadimgcontainer {
        width: auto;
    }

    .subheadimg {
        height: 100px;
        width: auto;
        margin: auto;
    }
    
}

@media only screen and (min-width: 1199px) {
    .mt-xl-6 {
        /* In keeping with standard bootstrap 5 classes for margins */
        margin-top: 4rem;
    }
}