/* -------------------------------------------------------------------------- */
/* COLOR VARIABLES.                                                           */
/* -------------------------------------------------------------------------- */

:root{
    --vt-maroon: #861F41;
    --vt-burntOrange: #E5751F;
    --vt-hokieStone: #75787b;
    --vt-white: #FFFFFF;
}


/* -------------------------------------------------------------------------- */
/* BASE BODY LAYOUT.                                                          */
/* -------------------------------------------------------------------------- */

body{
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial;
    color: #000;
    background: var(--vt-white)
}

h2{
    color: var(--vt-maroon);
}


/* -------------------------------------------------------------------------- */
/* HEADER.                                                                    */
/* -------------------------------------------------------------------------- */

.navbar{
    background: var(--vt-maroon);
    font-weight: bold;
}

.navbar .navbar-brand, .navbar .nav-link, .navbar .dropdown-item{
    color: var(--vt-white);
    margin-left: auto !important;
}

.navbar .nav-link:hover, .navbar .dropdown-item:hover{
    color: var(--vt-white);
}

.dropdown-menu{
    background: var(--vt-maroon);
}

header.hero{
    background: var(--vt-maroon);
    color: var(--vt-white);
    padding: 2rem 0;
    text-align: center
}


/* -------------------------------------------------------------------------- */
/* TALK CARDS.                                                                */
/* -------------------------------------------------------------------------- */

.talk-card{
    border: 1px solid var(--vt-hokieStone);
    border-radius: .75rem;
    padding: 1rem;
    margin-bottom: 1rem;
    margin-left: 0.05rem;
    margin-right: 0.05rem;
    background: var(--vt-white)
}

.talk-card h3{
    color: var(--vt-maroon);
    font-size: 1.15rem;
    margin-bottom: .25rem
}

.btn-vtana{
    background: var(--vt-burntOrange);
    color: var(--vt-white);
    border: none;
    font-size: 0.9rem;
    border-radius: 0.25rem;
    padding: 0.25rem 0.5rem;
}

.active,
.btn-vtana:hover{
    background: #c15e18;
    color: var(--vt-white)
}

.active{
    background: #c15e18;
    color: var(--vt-white)
}


/* -------------------------------------------------------------------------- */
/* FOOTER.                                                                    */
/* -------------------------------------------------------------------------- */

footer{
    border-top: 1px solid rgba(117,120,123,.3);
    margin-top: 2rem;
    padding: 1rem 0;
    color: #000;
    font-size: 1rem;
}

.content {
    padding: 0px 0px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    background-color: var(--vt-white);
    font-size: 1rem;
    text-align: justify;
}