/* Root Variables */
:root {
    --utk-logo--smokey: #4b4b4b;
    --utk-logo--orange: #ff8200;
    --utk-logo--white: #fff;
    --utk-blue--accent: #1c3644;
    --utk-link: #006c93;
    --utk-black: #000;

    --font-family-base: "Montserrat", sans-serif;
}

body {
    /* Need to overwrite Bootstrap */
    font-family: var(--font-family-base);
    font-optical-sizing: auto;
    font-style: normal;
}

a {
    text-decoration: none;
}

/* Utility Classes */

/* Text Colors */
.text-smokey {
    color: var(--utk-logo--smokey);
}

.text-link {
    color: var(--utk-link);
    --text-color: var(--utk-link);
}

/* Link Text Colors */
.link-smokey a {
    color: var(--utk-logo--smokey);
    --underline-color: var(--utk-logo--orange);
    --hover-color: var(--utk-link);
}

.link-link a {
    color: var(--utk-link);
    --underline-color: var(--utk-logo--orange);
    --hover-color: var(--utk-link);
}

/* Link Hover Colors */
.link-smokey a:hover {
    color: var(--utk-logo--smokey);
}

.link-link a:hover {
    color: var(--utk-link);
}

/* Underline Colors */
.underline-orange {
    color: var(--utk-logo--orange);
}

.utk-search-selector,
.utk-search-selector a {
    color: var(--text-color, var(--utk-logo--smokey));
}


/* Underline effect */
.utk-search-selector a:hover,
a:focus,
a:active {
    color: var(--hover-color, #ccc2c0);
    text-decoration: none;
    background-size: 100% 2px;
}

.utk-search-selector a {
    text-decoration: none;
    position: relative;
    line-height: 16px;
    padding: 3px 0;
    margin-bottom: 5px;
    background-image: linear-gradient(to right,
            var(--underline-color, var(--utk-logo--orange)) 100%,
            var(--underline-color, var(--utk-logo--orange)) 100%);
    background-size: 0 2px;
    background-repeat: no-repeat;
    background-position: left bottom;
    transition: color 0.1s, background-color 0.1s, background-size 0.2s ease-out;
}

#viewer {
    height: 100vh;
    width: 80%;
    margin: 1.5rem auto 1.5rem auto;
    border: 1px solid var(--utk-logo--smokey);
    
}

.top-line {
    border-top: 6px solid var(--utk-logo--orange);
    margin: 0;
    padding-bottom: 5px;
    opacity: 1;
}

/* Background Colors */
.bg-smokey {
    background-color: var(--utk-logo--smokey);
}

/* Font Sizes */
.font-small {
    font-size: 0.875rem;
}

/* White link color + underline */
.link-white a,
.link-white a:visited,
.link-white a:active {
    color: #fff;
    --underline-color: var(--utk-logo--orange);
    --hover-color: #fff;
    --text-color: #fff;
}

.link-white a:hover {
    color: #fff;
}

/* Smokey underline variant */
.underline-smokey a {
    --underline-color: var(--utk-logo--smokey);
}

/* Inset box shadow for campus footer top edge */
.utk--inset-box-shadow {
    box-shadow: inset 0 4px 6px -4px rgba(0, 0, 0, 0.25);
}