:root {
    --lanl_ultramarine: #000f7e;
    --lanl_ultramarine_gradient: #090238;
    --lanl_black: #0c0d17;
    --lanl_dark_grey: #555962;
    --lanl_light_grey: #cdd1e2;
    --lanl_bg_accent: #f1eff7;
    --lanl_blue: #0070c1;
    --lanl_blue_tint: #3296dc;
    --lanl_red: #eb0f1e;
    --lanl_red_tint: #ff474d;
    --lanl_orange: #e17800;
    --lanl_orange_tint: #ff9129;
    --lanl_green: #00aa64;
    --lanl_green_tint: #2cc486;
    --lanl_cautionbox_bg: #fff4ea;
}

pre.code,
code {
    background-color: var(--lanl_light_grey);
    color: var(--lanl_black);
    font-size: 90%;
    overflow-x: auto;
    padding: 2px;
    white-space: pre-wrap;
    word-break: break-word;
}

body {
    color: var(--lanl_black);
    font-family: source-sans-pro, sans-serif;
    font-size: 1rem;
    font-weight: normal;
    text-align: justify;
    line-height: normal;
    margin: 0;
}

b {
    font-weight: 600;
}

a {
    transition: all .2s ease-in-out;
}

a:link,
a:visited,
a:active {
    color: var(--lanl_blue);
    text-decoration: none;
}

a:hover {
    color: var(--lanl_ultramarine);
    text-decoration: underline;
}

ul.toc {
    list-style-position: inside;
    margin: 0.0em 0.4em 0.0em 0.4em;
    padding: 0;
}

ul.toc li {
    list-style-type: none;
    margin: 0.0em 0.4em 0.0em 0.4em;
    padding: 0;
}

.btn_register {
    display: inline-block;
    font-size: 18px;
    font-weight: bold;
    padding: 10px;
    height: auto;
    width: auto;
    text-align: center;
}

.btn_register a:link,
.btn_register a:visited,
.btn_register a:active {
    color: #ffffff;
    background-color: var(--lanl_blue);
    text-decoration: none;
    padding: 10px;
}

.btn_register a:hover {
    color: #ffffff;
    background-color: var(--lanl_ultramarine);
    padding: 10px;
}

.legalese {
    font-size: 0.75rem;
    text-align: justify;
    margin: 15px;
}

.emph {
    color: var(--lanl_red);
}

emph {
    font-weight: bold;
    color: var(--lanl_red);
}

div.indent {
    margin-left: 1.5em;
}

/* Note and Caution Boxes */

div.notebox,
div.cautionbox {
    margin: 1em 0 1em 0;
    padding: 0;
}

div.notebox {
    background-color: var(--lanl_bg_accent);
    border: 1px solid var(--lanl_light_grey);
}

div.cautionbox {
    background-color: var(--lanl_cautionbox_bg);
    border: 1px solid var(--lanl_orange_tint);
}

div.notebox p,
div.cautionbox p {
    margin: 0.5em 1em 0.5em 1em;
    padding: 0;
}

div.notebox pre,
div.cautionbox pre {
    margin: 0.4em 1em 0.4em 1em;
}

div.notebox p.notebox-title,
div.cautionbox p.cautionbox-title {
    margin: 0;
    padding: 0.1em 0 0.1em 0.5em;
    border-bottom: 1px solid var(--lanl_light_grey);
    font-weight: bold;
    background-color: var(--lanl_light_grey);
}

div.cautionbox p.cautionbox-title {
    color: white;
    background-color: var(--lanl_orange_tint);
    border-bottom-color: var(--lanl_orange_tint);
}

/* *** */

.lanl-header {
    background: linear-gradient(95deg, #08198e, #05023c);
    height: 45px;
    padding: 30px 30px;
    position: relative;
    z-index: 99999
}

.lanl-header .lanl-header-logo-left {
    height: 45px;
    max-width: 45%;
}

.lanl-header .lanl-header-logo-right {
    float: right;
    height: 45px;
    max-width: 45%;
}

.lanl-footer {
    background: #000000;
    color: #ffffff;
    height: 250px;
    padding: 30px 30px;
    position: relative;
    text-align: center;
    z-index: 99999;
}

.lanl-footer a:link,
.lanl-footer a:visited,
.lanl-footer a:active {
    color: #ffffff;
}

.lanl-footer a:hover {
    color: var(--lanl_dark_grey);
    text-decoration: underline
}

/* *** */

.layout-body {
    display: flex;
    flex-flow: column nowrap
}

@media (min-width: 800px) {
    .layout-body {
        flex-flow: unset
    }
}

@media print {
    .noprint {
      display: none;
    }
}

.layout-body .lanl-side-nav {
    overflow-x: hidden;
    overflow-y: auto;
    position: relative
}

.layout-body .lanl-content-wrapper {
    margin: 10px;
    max-width: 100vw;
    padding: 20px
}

.layout-body main {
    margin: 0 auto;
    min-height: 100vh
}

/* *** */

.lanl-side-nav {
    background-color: var(--lanl_bg_accent);
    margin: 0;
    min-height: 50%;
    min-width: 250px;
}

.lanl-side-nav-text {
    color: var(--lanl_black);
    display: block;
    font-family: source-sans-pro, sans-serif;
    font-style: normal;
    font-weight: normal;
    letter-spacing: 1.35px;
    margin: 10px;
    padding: 10px 0 10px 0;
    text-align: center;
    text-transform: uppercase
}

/* *** */

.lanl-hero {
    background: 50%/cover no-repeat border-box;
    display: flex;
    height: 100%;
    position: relative;
    font-size: 1.5rem;
}

.lanl-hero-container {
    display: flex;
    height: 100%;
    width: 100%;
    z-index: 2
}

.landing-page {
    width: 100%
}

.landing-page .home-hero {
    color: #ffffff;
    height: 200px
}

.landing-page .home-hero .hero-text {
    margin: auto 20px
}

@media (min-width: 1024px) {
    .landing-page .home-hero .hero-text {
        margin: auto 100px
    }
}

.lanl-class-table {
    width: 100%;
    border-collapse: collapse;
}

.lanl-class-table tr:nth-child(even) {
    background-color: var(--lanl_bg_accent);
}

.lanl-class-table tr:hover {
    background-color: var(--lanl_light_grey);
}

.lanl-class-table td {
    padding: 5px;
}

.lanl-class-table th {
    padding-left: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: var(--lanl_dark_grey);
    color: #ffffff;
}

.add-to-calendar {
    font-size: 0.85em;
}

.lanl-description-table {
    width: 100%;
    border-collapse: collapse;
}

.lanl-description-table tr:nth-child(odd) {
    background-color: var(--lanl_bg_accent);
}

.lanl-description-table td {
    padding: 5px;
    text-align: left;
}

.lanl-description-table th {
    padding-left: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: var(--lanl_dark_grey);
    color: white;
    text-align: left;
}

.lanl-form-table {
    width: 100%;
    border-collapse: collapse;
}

.lanl-form-table tr:nth-child(odd) {
    background-color: var(--lanl_bg_accent);
}

.lanl-form-table td {
    padding: 15px;
}

.reg-box {
    size: 100%;
    border: 1px solid #ccc !important;
    padding: 5px;
    font-size: 1rem;
}

.toggle-us {
    display: none;
}

.toggle-gc {
    display: none;
}

.toggle-non-us {
    display: none;
}

fieldset {
    background-color: var(--lanl_bg_accent);
}

.lcf {
    font-size: 0.85em;
    margin: 0 0 0 1.0em;
    padding: 0;
    white-space: nowrap;
}

/* MODAL BEHAVIOR
--------------------------------------------------------------------------------*/

/* The Modal (background) */
.modal {
    background-color: #000000;
    /* Fallback color */
    background-color: #00000088;
    /* Gray with opacity */
    display: none;
    /* Hidden by default */
    height: 100%;
    /* Full height */
    left: 0;
    overflow: auto;
    /* Enable scroll if needed */
    padding-top: 100px;
    /* Location of the box */
    position: fixed;
    /* Stay in place */
    top: 0;
    width: 100%;
    /* Full width */
    z-index: 10;
    /* Sit on top */
}

/* Modal Content */
.modal-content {
    background-color: var(--lanl_bg_accent);
    border: 1px solid var(--lanl_dark_grey);
    box-shadow: 0 4px 8px 0 var(--lanl_dark_grey), 0 6px 20px 0 #00000088;
    margin: auto;
    padding: 0;
    position: relative;
    width: 80%;
}

/* Modal Button */
.modal-button {
    background-color: #ffffff;
    border: none;
    color: var(--lanl_blue_tint);
    cursor: pointer;
    display: inline-block;
    font-size: 0.85em;
    margin: 0 0 0 1.0em;
    padding: 0;
}

.modal-button:hover {
    color: var(--lanl_ultramarine);
}

/* The Close Button */
.close {
    color: var(--lanl_blue_tint);
    float: right;
    font-size: 2em;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: var(--lanl_ultramarine);
    text-decoration: none;
    cursor: pointer;
}

.modal-header {
    padding: 2px 16px;
    background-color: var(--lanl_blue);
    color: #ffffff;
}

.modal-body {
    padding: 2px 16px;
}

.modal-footer {
    padding: 2px 16px;
    background-color: var(--lanl_blue);
    color: #ffffff;
}

/* DROPDOWN MENU BEHAVIOR
--------------------------------------------------------------------------------*/

.btn_dropdown {
    background-color: var(--lanl_blue);
    border: none;
    color: #ffffff;
    cursor: pointer;
    font-size: 18px;
    font-weight: bold;
    padding: 10px;
}

.btn_dropdown:hover,
.btn_dropdown:focus {
    background-color: var(--lanl_ultramarine);
    padding: 10px;
}

.search_box {
    width: 100%;
}

.search_separator {
    color: var(--lanl_light_grey);
}

#search_input {
    border-bottom: 1px solid var(--lanl_dark_grey);
    border: none;
    box-sizing: border-box;
    font-size: 1em;
    padding: 1em 1em 1em 1em;
}

#search_input:focus {
    outline: 3px solid var(--lanl_bg_accent);
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    background-color: var(--lanl_bg_accent);
    border: 1px solid var(--lanl_dark_grey);
    display: none;
    font-family: Arial, Helvetica, sans-serif;
    min-width: 200px;
    overflow: auto;
    position: absolute;
    z-index: 1;
    height: 55vh;
}

.dropdown-content a {
    color: black;
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    padding: 0.5em;
    text-decoration: none;
}

.dropdown-content a:hover {
    background-color: #ffffff;
}

.show {
    display: block;
}

/* BIBLIOGRAPHIC ITEM BEHAVIOR
--------------------------------------------------------------------------------*/

.bibitems {}

.bibitem {
    margin: 0.75em 1em 0.75em 1em;
}

/* Modal Button */
.top-button {
    background-color: #ffffff;
    border: none;
    color: var(--lanl_blue_tint);
    cursor: pointer;
    display: inline-block;
    font-size: 0.85em;
    margin: 0 0 0 1.0em;
    padding: 0;
}

.top-button:hover {
    color: var(--lanl_ultramarine);
}

/* FAQ
--------------------------------------------------------------------------------*/

.faq-entry {
    /* background-color: var(--lanl_bg_accent); */
    border: 1px solid var(--lanl_light_grey);
    padding: 10px;
    /* padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px; */
    margin-bottom: 10px;
    margin-top: 10px;
}

.faq-direct-link {
    font-size: 80%;
}

.btn-filter {
    border-radius: 10px;
    border: 1px solid;
    cursor: pointer;
    display: inline-block;
    font-size: 0.85em;
    padding: 0 8px;
    transition: background-color 200ms, color 200ms;
    white-space: nowrap;
}

.btn-reset {}

.lbl-filter {
    border-radius: 10px;
    border: 1px solid;
    display: inline-block;
    font-size: 0.65em;
    padding: 0 8px;
    white-space: nowrap;
}
