/* Fonts */
    
    @font-face {
        font-family: Atkinson-Hyperlegible;
        src: url(/fonts/Atkinson-Hyperlegible-Regular-102.eot?#iefix) format("embedded-opentype"), url(/fonts/Atkinson-Hyperlegible-Regular-102a.woff2) format("woff2"), url(/fonts/Atkinson-Hyperlegible-Regular-102.woff) format("woff"), url(/fonts/Atkinson-Hyperlegible-Regular-102.ttf) format("truetype"), url(/fonts/Atkinson-Hyperlegible-Regular-102.svg#Atkinson-Hyperlegible) format("svg");
    }
    /* General */
    
    @media screen {
        html {
            font-family: 'Atkinson-Hyperlegible', 'Arial', 'Helvetica', sans-serif;
            overflow: hidden;
            height: 100%
        }
        body {
            font-size: 1rem;
            font-family: 'Atkinson-Hyperlegible', 'Arial', 'Helvetica', sans-serif;
            padding-top: 4.5rem;
            overflow: hidden;
            height: 100%;
        }
        .wrap {
            height: 100%;
            overflow: auto;
        }
        .navbar-brand {
            font-family: 'Grandstander', 'Arial', 'Helvetica', sans-serif;
            font-weight: bold;
        }
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .h1,
        .h2,
        .h3,
        .h4,
        .h5,
        .h6 {
            font-family: 'Grandstander', 'Arial', 'Helvetica', sans-serif;
            font-weight: 600;
        }
        .foldyhead {
            font-size: 1.6em;
            font-family: 'Grandstander', 'Arial', 'Helvetica', sans-serif;
            font-weight: 600;
            color: rgb(0, 157, 220);
        }
        #main p {
            font-size: 1.2rem;
        }
        #comicmodal p {
            font-size: 1.2rem;
        }
        .comicrow {
            margin-bottom: 60px;
        }
        .newcomic {
            margin-bottom: 60px;
        }
        .twobytwo {
            max-width:70%;
        }
        .threebytwo {
            max-width:100%;
        }
        .journalfigure {
            width:34%;
            max-width:80%;
            padding:12px;
        }
        .widefigure {
            width:80%;
            padding:12px;
        }
        .blueborder {
            border-color: rgb(131, 194, 236);
            border-width: .15rem;
            border-style: solid;
        }
        /* Colors */
        .foldyblue {
            color: rgb(0, 157, 220);
        }
        .paleblue {
            color: rgb(213, 246, 255);
        }
        .shadowblue {
            color: rgb(131, 194, 236);
        }
        .darkblue {
            color: rgb(0, 120, 165);
        }
        .darkestblue {
            color: rgb(40, 76, 153);
        }        
        .grayblue {
            color: rgb(174, 216, 236);
        }
        .shaded {
            color: rgb(168, 211, 241);
        }
        .backblue {
            color: rgb(191, 234, 255);
        }
        .white {
            color: #fff;
        }
        /* Text sizes */
        .subhead {
            font-size: 1.2em;
        }
        .lightback {
            background-color: rgb(191, 234, 255);
        }
        .blueback {
            background-color: rgb(0, 157, 220) !important;
        }
        .bg-dark {
            background-color: rgb(0, 157, 220) !important;
        }
        /* Hyperlinks */
        a:link {
            color: rgb(0, 157, 220);
            text-decoration: underline;
          }
          
          a:visited {
            color: rgb(0, 120, 165); 
            text-decoration: underline;
          }
          
          a:hover {
            color:chocolate; 
            text-decoration: underline;
          }
          
          a:active {
            color:aqua;  
            text-decoration: underline;
          }
        a.bg-dark:hover,
        a.bg-dark:focus,
        button.bg-dark:hover,
        button.bg-dark:focus {
            background-color: #1d2124 !important;
        }
        /* Navbar */
        .navbar a {
            text-decoration:none;
        }
        .navbar-dark .navbar-brand {
            color: #fff;
        }
        .navbar-dark .navbar-brand:hover,
        .navbar-dark .navbar-brand:focus {
            color: #fff;
        }
        .navbar-dark .navbar-nav .nav-link {
            color: rgba(255, 255, 255, 0.8);
        }
        .navbar-dark .navbar-nav .nav-link:hover,
        .navbar-dark .navbar-nav .nav-link:focus {
            color: rgba(255, 255, 255, 1.0);
        }
        .navbar-dark .navbar-nav .nav-link.disabled {
            color: rgba(255, 255, 255, 0.25);
        }
        .navbar-dark .navbar-nav .show>.nav-link,
        .navbar-dark .navbar-nav .active>.nav-link,
        .navbar-dark .navbar-nav .nav-link.show,
        .navbar-dark .navbar-nav .nav-link.active {
            color: #fff;
        }
        .navbar-dark .navbar-toggler {
            color: rgba(255, 255, 255, 0.5);
            border-color: rgba(255, 255, 255, 0.1);
        }
        .navbar-dark .navbar-toggler-icon {
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
        }
        .navbar-dark .navbar-text {
            color: rgba(255, 255, 255, 0.8);
        }
        .navbar-dark .navbar-text a {
            color: #fff;
        }
        .navbar-dark .navbar-text a:hover,
        .navbar-dark .navbar-text a:focus {
            color: #fff;
        }
        /* Other */
        /* #footer p {
        color:#fff;
    }
    */

        #footer {
            margin-top: 30px;
            padding: 15px 15px 0px 15px;
        }
        p {
            font-size: 1.0em;
            line-height: 1.4em;
        }
        label {
            font-family: 'Atkinson-Hyperlegible', 'Arial', 'Helvetica', sans-serif;
        }
        .normal {
            font-weight: normal;
        }

        .btn-primary {
            color: #fff;
            background-color: #009ddc;
            border-color: #009ddc;
          }
          
          .btn-primary:hover {
            color: #fff;
            background-color: #0069d9;
            border-color: #0062cc;
          }
          
          .btn-primary:focus, .btn-primary.focus {
            color: #fff;
            background-color: #0069d9;
            border-color: #0062cc;
            box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
          }
          
          .btn-primary.disabled, .btn-primary:disabled {
            color: #fff;
            background-color: #007bff;
            border-color: #007bff;
          }
          
          .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
          .show > .btn-primary.dropdown-toggle {
            color: #fff;
            background-color: #0062cc;
            border-color: #005cbf;
          }
          
          .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
          .show > .btn-primary.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
          }
    }