/* Move down content because we have a fixed navbar that is 50px tall */
body {
    /*padding-top: 200px;*/
    padding-bottom: 20px;
    background-color: lightgray;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    /*padding-left: 15px;
    padding-right: 15px;*/
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input,
select,
textarea {
    max-width: 280px;
}

    /******************************************************************************************************/
    /*Text Styles*/
    .text {
        font-size: 1.1em;
    }

    .boldtext {
        font-weight: bold;
    }

    .linktext {
        font-size: 1.1em;
        text-decoration:none;
        color:#337AB7;
    }

        .linktext a:hover {
            text-decoration: underline;
        }

    /*End Text Styles*/
    /******************************************************************************************************/


/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
        vertical-align: text-top;
        border: 1px solid darkgray;
        background-color: cornflowerblue;
        width: 90%;
    }
    .body-content {
        padding: 0;
    }

    .logo-image {
        visibility: visible;
        width: 125px;
        height: 125px;
        margin-left:10px;
    }
    .marquee {
        /*margin-top: 20px;*/
        width: 60%;
        margin: 0 auto;
        text-align: left;
        background-color: lightgray;
        padding: 15px;
    }

    
    .main-page-section-header {
        font-size: 1.5em;
        text-align: center;
        color: black;
        font-weight: bold;
        padding-left:5px;
    }

    .main-page-section {
        padding: 5px 5px 5px 5px;
        height: 100%;
        width: 100%;
        background-color: whitesmoke;
        border: 1px solid darkgray;
        border-radius: 7px;
        margin: 0 auto;
    }

    .gv {
        border-style: none;
    }

        .gv tr td {
            padding: 5px;
            border: 1px solid #ddd;
            font-size: 1.2em;
        }

        .gv tr th {
            padding: 5px;
            background-color: whitesmoke;
            border-style: none;
            font-size: 1.2em;
        }

    .navbar-brand {
        background-color: white;
        color: #337AB7;
        font-size: 2.2em;
        line-height: 27px;
        font-weight: bold;
    }
}

/* Responsive: Portrait tablets and up */
@media screen and (max-width: 767px) {
    .jumbotron {
        margin-top: 20px;
        vertical-align: text-top;
        border: 1px solid darkgray;
        background-color: cornflowerblue;
        text-align: center;
        display: inline-block;
        margin: 0 auto;
    }

    
    .body-content {
        padding: 0;
    }

    .logo-image {
        visibility: visible;
        width: 100px;
        height: 100px;
        margin-left:10px;
    }

    .marquee {
        /*margin-top: 20px;*/
        width: 100%;
        margin: 0 auto;
        text-align: left;
        background-color: lightgray;
        padding: 5px;
    }

    .main-page-section-header {
        font-size: 1.3em;
        text-align: center;
        color: black;
        font-weight: bold;
        padding-left: 5px;
    }

    .main-page-section {
        padding: 5px 5px 5px 5px;
        height: 100%;
        width: 100%;
        background-color: whitesmoke;
        border: 1px solid darkgray;
        border-radius: 7px;
        margin:0 auto;
    }


        .gv {
        border-style: none;
        background-color: whitesmoke;
        font-size: 0.8em;
    }

        .gv tr td {
            padding: 5px;
            border: 1px solid #ddd;
            font-size: 0.8em;
        }

        .gv tr th {
            padding: 5px;
            /*background-color: whitesmoke;*/
            border-style: none;
            font-size: 0.8em;
        }

    .navbar-brand {
        background-color: white;
        color: #337AB7;
        font-size: 1.7em;
        line-height: 22px;
        font-weight: bold;
    }
}


/* Responsive: Portrait tablets and up */
@media screen and (max-width: 410px) {

    .marquee {
        /*margin-top: 20px;*/
        width: 100%;
        margin: 0 auto;
        text-align: left;
        background-color: lightgray;
        padding: 0px;
    }

    .logo-image {
        visibility: visible;
        width: 75px;
        height: 75px;
        margin-left: 10px;
    }

    .main-page-section-header {
        font-size: 1.1em;
        text-align: center;
        color: black;
        font-weight: bold;
        padding-left: 5px;
    }

    .main-page-section {
        padding: 5px 5px 5px 5px;
        height: 100%;
        width: 100%;
        background-color: whitesmoke;
        border: 1px solid darkgray;
        border-radius: 0px;
        margin: 0 auto;
    }

    .gv {
        border-style: none;
        background-color: whitesmoke;
    }

        .gv tr td {
            padding: 5px;
            border: 1px solid #ddd;
            font-size: 0.7em;
        }

        .gv tr th {
            padding: 5px;
            /*background-color: whitesmoke;*/
            border-style: none;
            font-size: 0.7em;
        }

    .navbar-brand {
        background-color: white;
        color: #337AB7;
        font-size: 1.3em;
        line-height: 18px;
        font-weight: bold;
    }

}

    .page-header {
        font-size: 2em;
        text-align: center;
        color: black;
        width: 100%;
        text-align: center;
        padding: 5px 5px 5px 5px;
        box-sizing: border-box;
        margin-top: 20px;
        font-weight: bold;
        /*border: 1px solid green;*/
    }


    .navbar .navbar-nav {
        background-color: white;
        color: cornflowerblue;
        font-size: 1.4em;
        font-weight: bold;
    }

        .navbar .navbar-nav > li > a:hover, .navbar .navbar-nav > li > a:focus {
            background-color: white;
            color: darkblue;
        }


        .navbar-brand > li > a:hover, .navbar-brand > li > a:focus {
            background-color: white;
            color: darkblue;
            /*font-size: 1.4em;
        font-weight: bold;*/
        }


    .navbar-toggler {
        width: 47px;
        height: 34px;
        background-color: #ffffff;
        border: 1px solid darkblue;
    }

        .navbar-toggler .line {
            width: 100%;
            float: left;
            height: 2px;
            background-color: darkblue;
            margin-bottom: 5px;
        }