/* Global Styles */
html {
    height: 100%;
}

body {
    position: relative;
    min-height: 100%;
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

table {
    width: 100% !important;
}

.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11 {
    margin-right: 3.8%;
    float: left;
    min-height: 1px;
}

.span1 {
    width: 4.85%;
}

.span2 {
    width: 13.45%;
}

.span3 {
    width: 22.05%;
}

.span4 {
    width: 30.75%;
}

.span5 {
    width: 39.45%;
}

.span6 {
    width: 48%;
}

.span7 {
    width: 56.75%;
}

.span8 {
    width: 65.4%;
}

.span9 {
    width: 74.05%;
}

.span10 {
    width: 82.7%;
}

.span11 {
    width: 91.35%;
}

.span12 {
    width: 100%;
    float: left;
}

.last {
    margin-right: 0px;
}

.required {
    border: 1px solid #f90914 !important;
}

.spacer-top {
    margin-top: 20px;
}

.spacer-top-large {
    margin-top: 40px;
}

.spacer-bottom {
    margin-bottom: 20px;
}

body .tooltip {
    white-space: nowrap;
}

ol {
    padding: 0;
    list-style-position: inside;
}

.btn-default:focus, .btn-default:hover {
    background-position: 0, 0 !important;
    background: #e2e2e2 !important;
}

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

h1.no-margin, h2.no-margin {
    margin: 0;
}

.align-left {
    text-align: left;
}

.align-right {
    text-align: right;
}

.align-center {
    text-align: center;
}

.actions.align-right {
    padding-right: 30px !important;
}

/* alerts */
.icon-circle {
    background: #bababa;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    padding: 9px 11px;
    height: 36px;
    width: 36px;
}

    .icon-circle .icon {
        color: #ffffff;
        font-size: 15px;
    }

    .icon-circle.active {
        background: #000000;
    }

        .icon-circle.active .icon {
            color: #b6b54f;
        }

.alerts .alert-icon {
    max-width: 50px;
}

.notification-count {
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: #c61414;
    color: #ffffff;
    font-size: 9px;
    text-align: center;
    padding: 4px;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    text-indent: 1px;
}

/* alert drop down menu */
.alert-drop {
    display: none;
    position: absolute;
    width: 280px;
    border: 1px solid rgba(136, 136, 136, 0.5);
    background: #ffffff;
    padding: 5px 0;
    color: #333333;
    text-align: left;
    -webkit-box-shadow: 0 4px 2px -2px rgba(136, 136, 136, 0.5);
    box-shadow: 0 4px 2px -2px rgba(136, 136, 136, 0.5);
    right: 0;
    top: 47px;
    z-index: 900;
}

    .alert-drop h2 {
        font-size: 16px;
        text-transform: uppercase;
        font-weight: 700;
        margin: 8px 5px;
        float: left;
    }

    .alert-drop .alert {
        border-bottom: 1px inset #d9d9d9;
        padding: 7px;
        border-radius: 0;
        margin: 0;
    }

        .alert-drop .alert:last-child {
            border-bottom: none;
        }

    .alert-drop .subject {
        font-size: 13px;
        margin: 0 0 5px 0;
        line-height: 17px;
    }

    .alert-drop p {
        font-size: 13px;
    }

    .alert-drop view-all {
        padding: 7px 0;
        background: #337ab7;
        text-align: center;
        max-width: 95%;
        margin: 10px auto 0 auto;
        font-size: 12px;
        -webkit-border-radius: 20px;
        border-radius: 20px;
    }

        .alert-drop view-all a, .alert-drop view-all a:visited {
            color: #ffffff;
            font-weight: 600;
        }

    .alert-drop .profile-photo {
        float: left;
        width: 16%;
        margin-right: 10px;
    }

.profile-dropdown {
    font-size: 15px;
    cursor: pointer;
}

    .profile-dropdown .dropdown-menu {
        width: 100%;
        margin-top: 8px;
        border-radius: 0;
        padding: 0;
    }

        .profile-dropdown .dropdown-menu a {
            display: block;
            padding: 10px;
            border-bottom: 1px solid #e5e5e5;
        }

            .profile-dropdown .dropdown-menu a:hover {
                color: #ffffff;
            }

        .profile-dropdown .dropdown-menu li:last-child a {
            border-bottom: none;
        }

.datepicker-dropdown {
    z-index: 1151 !important;
}

.fa.info, .info-text, .btn.info-text {
    color: #337ab7;
}

.fa.remove, .award-description .error-text, .error-text, .error-text a, .error-text a:visited {
    color: #b92c28;
}

.fa.success, .success-text, .admin a.success-text, .admin a.success-text:visited {
    color: #128812;
}

.fa.warning, .warning-text {
    color: #c1af19;
}

.modal table {
    font-size: 14px;
}

.vertical-alignment-helper {
    display: table;
    height: 100%;
    width: 100%;
    pointer-events: none;
    /* This makes sure that we can still click outside of the modal to close it */
}

    .vertical-alignment-helper .vertical-align-center {
        /* To center vertically */
        display: table-cell;
        vertical-align: middle;
        pointer-events: none;
    }

    .vertical-alignment-helper .modal-content {
        /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
        width: inherit;
        height: inherit;
        /* To center horizontally */
        margin: 0 auto;
        pointer-events: all;
    }

.btn.btn-default {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f9f9f9+0,efefef+100 */
    background: #f9f9f9;
    /* Old browsers */
    background: -moz-linear-gradient(top, #f9f9f9 0%, #efefef 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #f9f9f9 0%, #efefef 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #f9f9f9 0%, #efefef 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#efefef',GradientType=0 );
    /* IE6-9 */
}

.profile-box {
    float: left;
    width: 39%;
    margin-right: 2%;
    border: 1px solid #d6d6d6;
}

    .profile-box.widget {
        float: none;
        width: auto;
    }

    .profile-box.small {
        width: 18%;
        font-size: 100%;
    }

    .profile-box.last {
        margin-right: 0;
    }

.profile-col {
    margin-right: 2%;
    display: inline-block;
    vertical-align: top;
    width: 31%;
}

    .profile-col.wide {
        width: 60%;
    }

    .profile-col:last-child {
        margin-right: 0;
    }

.profile-details {
    margin: 0;
    padding: 0;
}

    .profile-details li {
        margin-bottom: 7px;
    }

    .profile-details .profile-label {
        font-weight: 500;
    }

    .profile-details .fa {
        margin-right: 8px;
    }

    .profile-details span {
        color: #717174;
    }

ul.profile-details > li {
    list-style-type: none;
}

.appeal-wrap, .content .appeal-wrap, .content-wrap .appeal-wrap {
    font-size: 12px;
}

    .appeal-wrap .checkbox, .content .appeal-wrap .checkbox, .content-wrap .appeal-wrap .checkbox {
        font-size: 14px;
    }

    .appeal-wrap h2, .content .appeal-wrap h2, .content-wrap .appeal-wrap h2 {
        margin: 0 0 10px 0;
        font-size: 14px;
    }

    .appeal-wrap h1, .content .appeal-wrap h1, .content-wrap .appeal-wrap h1 {
        font-size: 18px;
        font-weight: normal;
    }

    .appeal-wrap h2, .content .appeal-wrap h2, .content-wrap .appeal-wrap h2 {
        font-weight: normal;
    }

    .appeal-wrap p, .content .appeal-wrap p, .content-wrap .appeal-wrap p {
        line-height: normal;
    }

        .appeal-wrap p:last-child, .content .appeal-wrap p:last-child, .content-wrap .appeal-wrap p:last-child {
            margin-bottom: 0;
        }

    .appeal-wrap ul, .content .appeal-wrap ul, .content-wrap .appeal-wrap ul {
        padding: 0;
    }

        .appeal-wrap ul li, .content .appeal-wrap ul li, .content-wrap .appeal-wrap ul li {
            list-style-position: inside;
        }

    .appeal-wrap .corners, .content .appeal-wrap .corners, .content-wrap .appeal-wrap .corners {
        font-size: 14px;
    }

    .appeal-wrap textarea, .content .appeal-wrap textarea, .content-wrap .appeal-wrap textarea {
        min-height: 200px;
    }

.appeal-comment {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    padding: 20px;
    border: 1px solid #c7cfd9;
    position: relative;
    color: #3e4543;
    margin: 10px 0 40px 0;
}

    .appeal-comment.sent {
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,eafbff+100 */
        background: white;
        /* Old browsers */
        background: -moz-linear-gradient(top, white 0%, #eafbff 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, white 0%, #eafbff 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, white 0%, #eafbff 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eafbff',GradientType=0 );
        /* IE6-9 */
    }

        .appeal-comment.sent:after, .appeal-comment.sent:before {
            right: 100%;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
        }

        .appeal-comment.sent:after {
            border-color: rgba(199, 241, 255, 0);
            border-right-color: #F4FDFF;
            border-width: 20px;
            margin-top: -20px;
        }

        .appeal-comment.sent:before {
            border-color: rgba(199, 207, 217, 0);
            border-right-color: #c7cfd9;
            border-width: 21px;
            margin-top: -21px;
        }

    .appeal-comment.received {
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f0f0f0+100 */
        background: white;
        /* Old browsers */
        background: -moz-linear-gradient(top, white 0%, #f0f0f0 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, white 0%, #f0f0f0 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, white 0%, #f0f0f0 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f0f0f0',GradientType=0 );
        /* IE6-9 */
    }

        .appeal-comment.received:after, .appeal-comment.received:before {
            left: 100%;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
        }

        .appeal-comment.received:after {
            border-color: rgba(199, 241, 255, 0);
            border-left-color: #F7F7F7;
            border-width: 20px;
            margin-top: -20px;
        }

        .appeal-comment.received:before {
            border-color: rgba(199, 207, 217, 0);
            border-left-color: #c7cfd9;
            border-width: 21px;
            margin-top: -21px;
        }

    .appeal-comment h1 {
        margin: 0 0 5px 0;
        font-size: 16px;
    }

.appeal-response .profile, .appeal-response .response-text {
    display: inline-block;
    vertical-align: middle;
}

.appeal-response .profile {
    width: 5%;
}

    .appeal-response .profile:nth-child(odd) {
        margin-right: 3%;
    }

    .appeal-response .profile:nth-child(even) {
        margin-left: 3%;
    }

.appeal-response .response-text {
    width: 91%;
}

    .appeal-response .response-text.notification {
        width: 100%;
        margin: 0;
    }

        .appeal-response .response-text.notification .appeal-comment {
            background: #FAFFF4;
        }

.byline {
    text-transform: uppercase;
    margin-bottom: 10px;
    font-size: 10px;
}

.round-profile-icon {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    border: 1px solid #c7cfd9;
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
}

.subtext {
    text-transform: uppercase;
    font-size: 10px;
    color: #818181;
    margin-top: 3px;
}

/*.nav-tabs .spacer {
    margin-right: 30px;
}*/

.dropdown-menu li {
    font-size: 12px;
    margin: 5px 0;
}

.status-tag {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    padding: 3px 8px;
    color: #ffffff;
    display: inline-block;
    font-size: 10px;
}

    .status-tag.open {
        background: #069e09;
    }

    .status-tag.closed {
        background: #979797;
    }

    .status-tag.pending {
        background: #f0ad4e;
    }

    .status-tag.denied {
        background: #d40f0f;
    }

fieldset.highlight {
    border: 1px solid #ccc;
    padding: 10px 18px 15px 18px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}

.impersonate-user {
    background: #2e2e2e;
    padding: 10px 15px;
    color: #ffffff;
    /* position: fixed; */
    position: initial; /*testing impersonate bar staying sticky */
    z-index: 1000;
    -webkit-box-shadow: 0 3px 4px -4px rgba(0, 0, 0, 0.7);
    box-shadow: 0 3px 4px -4px rgba(0, 0, 0, 0.7);
    top: 0;
    height: auto;
    width: 100%;
}

    .impersonate-user .pull-left {
        line-height: 31px;
    }

    .impersonate-user p {
        margin: 0 8px 0 0;
        font-weight: 500;
    }

    .impersonate-user .label {
        font-size: 12px;
        line-height: 17px;
    }

    .impersonate-user p, .impersonate-user .label {
        display: inline-block;
        vertical-align: middle;
    }

    .impersonate-user.read-only {
        background: #a9312e;
    }

        .impersonate-user.read-only p {
            text-align: center;
            line-height: 35px;
            margin: 0;
            display: block;
        }

.underline-list {
    margin: 10px 0 0 0;
    padding: 0;
}

    .underline-list li {
        list-style-type: none;
        border-bottom: 1px solid #eaeaea;
        padding: 10px 0;
    }

        .underline-list li:last-child {
            border-bottom: none;
            padding: 10px 0 0 0;
        }

.bright-red {
    color: #d11010;
}

.login-wrap {
    border-top: 5px solid #1c7bbd;
    padding: 40px 0;
    min-height: 100%;
    margin-bottom: -58px;
}

    .login-wrap:after {
        content: "";
        display: block;
        height: 58px;
    }

.student-login-wrap {
    max-width: 590px;
    margin: 0 auto;
    border: 1px solid #d7d7d7;
    padding: 20px 30px 0 30px;
    background: #ffffff;
    box-shadow: 0px 0px 1px 1px #eaeaea;
}

    .student-login-wrap.create {
        max-width: 790px;
    }

.forgot-password {
    text-align: right;
    margin-top: 5px;
    display: block;
}

.create-account-link {
    text-align: center;
    margin-top: 30px;
    display: block;
    font-size: 16px;
}

.admin.login {
    background: #c6cbcc;
}

/* login page */
.flexme {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

#login-wrap {
    background: #ffffff;
    border: 1px solid #afb3b4;
    padding: 50px 30px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    margin: 0 auto;
    width: 55%;
    -webkit-box-shadow: 0 0 5px #888;
    box-shadow: 0 0 5px #888;
    height: 582px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

    #login-wrap h1 {
        text-transform: uppercase;
        font-weight: 700;
        font-size: 20px;
        text-align: center;
        margin: 25px 0;
        color: #373737;
    }

    #login-wrap .logo {
        margin: 0 auto;
        display: block;
    }

#login-form {
    margin: 0 auto;
    width: 80%;
}

    #login-form input[type="email"], #login-form input[type="password"], #login-form input[type="text"] {
        width: 100%;
        padding: 20px 10px;
        background: #fafafa;
        border: 1px solid #e4e4e4;
    }

    #login-form input[type="email"] {
        margin-bottom: 20px;
    }

    #login-form input[type="password"] {
        margin-bottom: 0;
    }

    #login-form input[type="submit"] {
        padding: 8px 25px;
        color: #ffffff;
        float: right;
        font-size: 16px;
        border: 1px solid #db6f2e;
        text-shadow: 2px 2px 3px rgba(255, 255, 255, 0.1);
        -webkit-border-radius: 3px;
        border-radius: 3px;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f79256+0,db6f2e+100 */
        background: #f79256;
        /* Old browsers */
        background: -moz-linear-gradient(top, #f79256 0%, #db6f2e 100%);
        /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f79256), color-stop(100%, #db6f2e));
        /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, #f79256 0%, #db6f2e 100%);
        /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #f79256 0%, #db6f2e 100%);
        /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #f79256 0%, #db6f2e 100%);
        /* IE10+ */
        background: linear-gradient(to bottom, #f79256 0%, #db6f2e 100%);
        /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f79256', endColorstr='#db6f2e',GradientType=0 );
        /* IE6-9 */
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

        #login-form input[type="submit"]:hover {
            background: #7da1bf;
        }

    #login-form .reset-link {
        display: block;
        margin: 3px 0 40px 0;
        text-align: right;
        font-size: 11px;
        text-transform: uppercase;
    }

/* create account page */
body.create-account {
    background: #ececec;
    font-family: 'Open Sans', sans-serif;
    height: 100%;
}

.create-account .content.account-choose {
    padding: 10px;
}

#create-account-header {
    background: #ffffff;
    padding: 20px 0 0 0;
    border-bottom: 3px solid #ffffff;
    color: #5d5e5e;
    position: relative;
    max-height: 130px;
}

    #create-account-header .page-title {
        text-align: right;
        text-transform: uppercase;
        font-size: 18px;
    }

.login-wrap h2, .login-wrap h3 {
    font-weight: 600;
}

.login-wrap h2 {
    font-size: 25px;
    color: #1c7bbd;
}

.login-wrap h3 {
    text-transform: uppercase;
    font-size: 14px;
    color: #5c5c5c;
    margin-top: 0;
}

.login-wrap .student-fields h3 {
    color: #1c7bbd;
    float: left;
}

.login-logo {
    text-align: center;
    margin-bottom: 30px;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 20px;
}

    .login-logo img {
        max-width: 102px;
        margin-right: 1%;
        z-index: 99;
        position: relative;
    }

    .login-logo.earn img {
        max-width: 200px;
    }

.create-account .login-logo h1 {
    font-size: 34px;
}

.create-account-headline {
    text-align: center;
}

.welcome-headlines {
    margin-top: 40px;
}

    .welcome-headlines h1, .welcome-headlines h2 {
        text-align: center;
    }

    .welcome-headlines h1 {
        font-family: 'Bitter', serif;
        color: #646565;
        margin-bottom: 21px;
        font-size: 64px;
    }

    .welcome-headlines h2 {
        color: #00a2a2;
        text-transform: uppercase;
        margin-bottom: 0;
        font-size: 29px;
        font-weight: 600;
    }

.account-type {
    text-align: center;
    margin: 60px 0;
}

    .account-type .account-box {
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f6f6f6+0,ffffff+100 */
        background: #f6f6f6;
        /* Old browsers */
        background: -moz-linear-gradient(top, #f6f6f6 0%, white 100%);
        /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f6f6f6), color-stop(100%, white));
        /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, #f6f6f6 0%, white 100%);
        /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #f6f6f6 0%, white 100%);
        /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #f6f6f6 0%, white 100%);
        /* IE10+ */
        background: linear-gradient(to bottom, #f6f6f6 0%, white 100%);
        /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0 );
        /* IE6-9 */
        border: 1px solid #c6c6c5;
        -webkit-border-radius: 20px;
        border-radius: 20px;
        padding: 15px;
        text-align: center;
        display: inline-block;
        vertical-align: top;
        width: 31%;
        height: 215px;
        cursor: pointer;
        margin-right: 2%;
    }

        .account-type .account-box:last-child {
            margin-right: 0;
        }

        .account-type .account-box:hover {
            background: #f6f6f6;
        }

        .account-type .account-box a:hover {
            text-decoration: none;
        }

            .account-type .account-box a:hover h3 {
                color: #000000;
            }

        .account-type .account-box.student .icon {
            margin-top: 15px;
        }

        .account-type .account-box h3 {
            color: #1c7bbd;
            font-size: 18px;
            line-height: 24px;
            float: none;
            margin-top: 14px;
        }

.push {
    height: 58px;
}

#create-account-footer {
    background: #ffffff;
    padding: 10px 0;
    height: 58px;
}

.footer-logos {
    text-align: right;
}

    .footer-logos .logo {
        display: inline-block;
        vertical-align: middle;
        margin-right: 3%;
        max-width: 30%;
    }

        .footer-logos .logo:last-child {
            margin-right: 0;
        }

            .footer-logos .logo:last-child img {
                max-height: 40px;
            }

        .footer-logos .logo:first-child img {
            max-height: 20px;
        }

        .footer-logos .logo img {
            max-width: 100%;
        }

.create-account h1 {
    font-family: 'Bitter', serif;
    color: #4b4b4b;
    font-size: 49px;
    margin: 0 0 5px 0;
}

.create-account .content h2 {
    color: #646565;
    font-size: 18px;
    text-transform: uppercase;
    margin: 0;
}

.remove-student {
    float: right;
    position: relative;
    cursor: pointer;
    color: #d51f27;
}

    .remove-student:hover {
        text-decoration: underline;
    }

.student-fields .student:first-child .remove-student {
    display: none;
}

.student-input-group {
    -webkit-border-radius: 5px;
    border-radius: 5px;
    padding: 19px;
    border: 1px solid #cccccc;
}

    .student-input-group input[type="text"], .student-input-group input[type="email"] {
        background: #ffffff;
    }

.add-btn {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,edeeee+100 */
    background: white;
    /* Old browsers */
    background: -moz-linear-gradient(top, white 0%, #edeeee 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #edeeee));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, white 0%, #edeeee 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, white 0%, #edeeee 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, white 0%, #edeeee 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, white 0%, #edeeee 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#edeeee',GradientType=0 );
    /* IE6-9 */
    border: 1px solid #70bf44;
    text-transform: uppercase;
    color: #62aa45;
    padding: 6px 14px;
    font-weight: 600;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    display: table;
    margin: 30px auto 0 auto;
    cursor: pointer;
}

    .add-btn:visited {
        color: #62aa45;
    }

    .add-btn:hover {
        background: #e0f1d9;
        text-decoration: none;
        color: #62aa45;
    }

.final-save {
    margin-top: 40px;
}

#pswd-info {
    padding: 15px;
    background: #fefefe;
    border: 1px solid #ddd;
    margin: -10px 0 20px 0;
    font-size: 12px;
    height: 181px;
}

    #pswd-info .confirm {
        text-align: center;
        font-weight: 600;
        padding: 35px 15px;
    }

        #pswd-info .confirm .fa {
            font-size: 35px;
            display: block;
            color: #0c9633;
            margin: 0 0 23px 0;
        }

    #pswd-info h4 {
        margin: 0 0 10px 0;
        padding: 0;
        font-weight: 600;
        line-height: normal;
        font-size: 14px;
    }

    #pswd-info ul {
        margin: 0;
        padding: 0;
    }

        #pswd-info ul li {
            list-style-type: none;
            list-style-position: inside;
        }

    #pswd-info .invalid {
        line-height: 24px;
        color: #ec3f41;
    }

        #pswd-info .invalid:before {
            content: "\f00d";
            font-family: "FontAwesome";
            margin-right: 8px;
        }

    #pswd-info .valid {
        line-height: 24px;
        color: #3a7d34;
    }

        #pswd-info .valid:before {
            content: "\f00c";
            font-family: "FontAwesome";
            margin-right: 8px;
        }

#update-password-form .error {
    border: 1px solid #f75a5e;
}

#update-password-form .field-instructions {
    margin: 5px;
    font-size: 12px;
    color: #f75a5e;
}

textarea.terms.form-control {
    height: 200px;
    border: 1px solid #ccc;
    background: #f2f2f2;
    font: normal 11px/15px arial;
    padding: 6px;
    color: #333;
}

html {
    min-height: 100%;
}

body.student {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    line-height: 1.8;
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

.main-wrapper {
    max-width: 1920px;
    padding: 0 3.5%;
    margin: 0 auto;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    flex: 1;
}

.wrap-text {
    white-space: normal !important;
}

h1.no-margin {
    margin: 0;
}

h1.page-title {
    margin: 0;
    font-weight: 600;
    font-size: 25px;
}

h3.no-margin {
    margin: 0 !important;
}

.title-actions {
    margin-bottom: 30px;
}

    .title-actions h1 {
        margin: 5px 0 0 0;
        font-weight: 600;
        font-size: 25px;
    }

.student .global-wrap {
    background: #f0f0f0;
}

.student .content-wrap {
    background: #ffffff;  
}

    .student .content-wrap.main {
        min-height: 400px;
    }

.student .content-wrap.med {
    max-width: 80%;
    margin: 0 auto;
}

.padding {
    padding: 30px;
}

.padding-small {
    padding: 20px;
}

/*subpage banner */
.subpage-banner {
    padding: 70px 0;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 30px;
}

    .subpage-banner.finance {
        background: url(../images/banner-finance.jpg);
    }

    .subpage-banner.gray {
        background-image: url(../images/AdultLearnersGrey.jpg);
    }

    .subpage-banner h1 {
        text-align: center;
        color: #ffffff;
        margin: 0;
        font-family: 'Bitter', serif;
    }

.med-wrap {
    max-width: 78%;
    margin: 0 auto;
}

.large-wrap {
    max-width: 95%;
    margin: 0 auto;
}

.spacer {
    margin: 20px 0;
}

.spacer-large {
    margin: 30px 0;
}

body .spacer-bottom {
    margin-bottom: 20px;
}

body .spacer-bottom-large {
    margin-bottom: 30px;
}

.gray-btn.green {
    color: #189739;
}

.gray-btn.lowercase {
    text-transform: none;
    font-weight: 600;
}

.gray-btn .fa {
    margin-right: 3px;
}

.actions-right {
    float: right;
}

    .actions-right .outline-btn {
        margin-right: 8px;
    }

        .actions-right .outline-btn:last-child {
            margin-right: 0;
        }

.item {
    border: 1px solid #e9e9e9;
    padding: 16px 20px 11px 20px;
    position: relative;
}

    .item .outline-btn {
        font-size: 12px;
    }

.inline {
    display: inline-block;
    vertical-align: middle;
}

    .inline.top {
        vertical-align: top;
    }

.margin-right {
    margin-right: 5px;
}

.right-text {
    text-align: right;
}

.blue-btn {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00afb0+0,008f90+100 */
    background: #00afb0;
    /* Old browsers */
    background: -moz-linear-gradient(top, #00afb0 0%, #008f90 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #00afb0 0%, #008f90 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #00afb0 0%, #008f90 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00afb0', endColorstr='#008f90',GradientType=0 );
    /* IE6-9 */
    padding: 9px 20px;
    text-transform: uppercase;
    text-align: center;
    display: block;
    cursor: pointer;
    font-weight: 400;
    border: none;
    color: #ffffff;
}

    .blue-btn:disabled {
        opacity: 0.6;
        cursor: not-allowed;
    }

        .blue-btn:disabled:hover {
            /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00afb0+0,008f90+100 */
            background: #00afb0;
            /* Old browsers */
            background: -moz-linear-gradient(top, #00afb0 0%, #008f90 100%);
            /* FF3.6-15 */
            background: -webkit-linear-gradient(top, #00afb0 0%, #008f90 100%);
            /* Chrome10-25,Safari5.1-6 */
            background: linear-gradient(to bottom, #00afb0 0%, #008f90 100%);
            /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00afb0', endColorstr='#008f90',GradientType=0 );
            /* IE6-9 */
        }

    .blue-btn:visited {
        color: #ffffff;
    }

    .blue-btn.large {
        padding: 9px 40px;
    }

    .blue-btn:hover {
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00afb0+0,006a6b+100 */
        background: #00afb0;
        /* Old browsers */
        background: -moz-linear-gradient(top, #00afb0 0%, #006a6b 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, #00afb0 0%, #006a6b 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, #00afb0 0%, #006a6b 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00afb0', endColorstr='#006a6b',GradientType=0 );
        /* IE6-9 */
        color: #ffffff;
        text-decoration: none;
    }

.gray-btn {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,dddddd+100 */
    background: white;
    /* Old browsers */
    background: -moz-linear-gradient(top, white 0%, #dddddd 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, white 0%, #dddddd 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, white 0%, #dddddd 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 );
    /* IE6-9 */
    padding: 9px 20px;
    text-transform: uppercase;
    text-align: center;
    display: block;
    cursor: pointer;
    font-weight: 400;
    color: #424242;
}

    .gray-btn:visited {
        color: #424242;
    }

    .gray-btn:hover {
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fafafa+0,b7b7b7+100 */
        background: #fafafa;
        /* Old browsers */
        background: -moz-linear-gradient(top, #fafafa 0%, #b7b7b7 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, #fafafa 0%, #b7b7b7 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, #fafafa 0%, #b7b7b7 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#b7b7b7',GradientType=0 );
        /* IE6-9 */
        text-decoration: none;
        color: #424242;
    }

.application-content .gray-btn, .application-content .gray-btn:visited {
    color: #424242;
}

.green-btn {
    background: #00a2a3;
    text-transform: uppercase;
    padding: 9px 20px;
    cursor: pointer;
    font-weight: 600;
    border: none;
    color: #ffffff;
}

    .green-btn:disabled {
        opacity: 0.5;
    }

    .green-btn:hover {
        color: #ffffff;
        text-decoration: none;
        background: #008687;
    }

    .green-btn:visited {
        color: #ffffff;
    }

.application-content .green-btn, .application-content .green-btn:visited {
    color: #ffffff;
}

.corners {
    -webkit-border-radius: 35px;
    border-radius: 35px;
    overflow: hidden;
    border: 4px solid #ededed;
    display: inline-block;
}

    .corners a {
        padding: 12px 20px;
        width: 100%;
        display: inline-block;
        text-align: center;
    }

    .corners.small {
        width: 75%;
        margin: 0 auto;
    }

.next-btn {
    float: right;
}

.outline-btn {
    border-width: 1px;
    border-style: solid;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    padding: 8px 15px;
    font-weight: 600;
    display: inline-block;
    cursor: pointer;
}

    .outline-btn.reduced {
        padding: 5px 15px;
        font-size: 13px;
    }

    .outline-btn.small {
        font-size: 11px;
        padding: 8px 13px;
    }

    .outline-btn .fa {
        margin-right: 4px;
    }

    .outline-btn:hover {
        text-decoration: none;
        color: #000000 !important;
        border-color: #000000 !important;
    }

    .outline-btn.info {
        color: #0866a7;
        border-color: #0866a7;
    }

    .outline-btn.default {
        color: #000000;
        border-color: #000000;
    }

    .outline-btn.success {
        color: #269426;
        border-color: #269426;
    }

.main-title h1 {
    color:#71cde1!important;
    text-transform: uppercase;
    margin: 0 0 10px 0;
    font-size: 26px;
}

.main-title h2 {
    color: #71cde1 !important;
    margin: 0;
    font-size: 16px;
}

.main-title p {
    font-size: 20px;
    margin: 11px 0;
    color: #3c3c3c;
}

.main-title.sub h1 {
    margin: 0;
    font-size: 25px;
}

.main-title.center {
    text-align: center;
    margin-bottom: 60px;
}

.alert-banner {
    background: #f9ecec;
    border: 1px solid #bfa5a5;
    color: #c21010;
    padding: 10px 20px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    margin-bottom: 30px;
    position: relative;
}

    .alert-banner a, .alert-banner a:visited, .alert-banner a:active {
        color: #c21010;
        text-decoration: underline;
    }

    .alert-banner h3 {
        font-weight: 700;
        text-transform: uppercase;
        font-size: 16px;
    }

    .alert-banner p {
        font-weight: 300;
    }

.bitter {
    font-family: 'Bitter', serif;
}

h2.blue {
    color: #00a2a3;
}

h2.inline, h1.inline, h3.inline {
    margin: 0;
}

.help-info {
    margin-top: 8px;
}

.help-answer {
    margin-top: 10px;
    font-size: 13px;
}

.help-toggle, .help-toggle:active, .help-toggle:visited, .help-toggle:focus {
    outline: none;
    text-decoration: none;
}

    .help-toggle.active {
        font-weight: 700;
        text-decoration: underline;
    }

.help-hide-link {
    font-size: 12px;
}

.bottom-bar {
    position: fixed;
    width: 100%;
    bottom: 0;
    background: #fefefe;
    border-top: 2px solid #cecece;
    padding: 8px;
    z-index: 800;
}

    .bottom-bar .button-wrap {
        text-align: right;
    }

        .bottom-bar .button-wrap .corners {
            display: inline-block;
            margin-right: 1%;
        }

            .bottom-bar .button-wrap .corners:last-child {
                margin-right: 0;
            }

        .bottom-bar .button-wrap .gray-btn, .bottom-bar .button-wrap .blue-btn {
            padding: 9px 40px;
        }

/*ul.nav-tabs > li.active > a {
    font-weight: 700;
}

.student .nav-tabs > li > a {
    border: 1px solid #cdcdcd;
}*/

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: none !important;
    border: 1px solid #ffffff !important;
}

.fa.large-icon {
    font-size: 33px;
}

h3.uppercase {
    text-transform: uppercase;
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 15px;
}

.indent {
    margin: -11px 0 25px 25px;
}

.award-select {
    max-width: 200px;
    float: right;
    margin-bottom: 20px;
}

.center-btn .round-btn {
    margin: 0 auto;
}

.round-btn {
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    -o-border-radius: 9px;
    border-radius: 9px;
    border-width: 1px;
    border-style: solid;
    padding: 6px 13px;
    font-size: 12px;
    cursor: pointer;
    display: table;
}

    .round-btn.info {
        color: #0866a7;
        border-color: #0866a7;
    }

    .round-btn:hover {
        color: #333333;
        border-color: #333333;
    }

thead.green th {
    color: #3a8d50;
}

.help-link {
    text-align: right;
}

.content-wrap h2 {
    font-size: 22px;
    font-weight: 600;
}

.content-wrap p {
    line-height: 24px;
}

.modal-body h2 {
    font-size: 16px;
    margin: 0 0 10px 0;
    font-weight: 600;
}

.modal-body p {
    margin: 0 0 20px 0;
}

.modal-body label.inline {
    margin: 0;
    font-weight: 400;
    vertical-align: top;
    width: 90%;
}

.modal-body input[type=checkbox].inline, .modal-body input[type=radio].inline {
    margin: 0 5px 0 0;
}

.expand-title.blue {
    background: #1c7bbd;
    color: #ffffff;
    padding: 10px;
    cursor: pointer;
}

    .expand-title.blue:hover {
        background: #1769a1;
    }

    .expand-title.blue h2 {
        font-size: 16px;
        float: left;
        margin: 5px 0 0 0;
    }

    .expand-title.blue .collapse-icon {
        float: right;
        border: 1px solid #ffffff;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -o-border-radius: 3px;
        border-radius: 3px;
        padding: 5px;
    }

.collapse-group {
    margin: 20px 0;
}

    .collapse-group:last-child {
        margin-bottom: 0;
    }

    .collapse-group.collapsed .collapse-body {
        display: none;
    }

.gutter-30.row {
    margin-right: -30px;
    margin-left: -30px;
}

.gutter-30 > [class^="col-"], .gutter-30 > [class^=" col-"] {
    padding-right: 30px;
    padding-left: 30px;
}

.line-list {
    padding: 0;
    margin: 10px 0 0 0;
}

    .line-list li {
        list-style-type: none;
        border-bottom: 1px solid #dadada;
        padding: 5px 0;
    }

        .line-list li:last-child {
            border-bottom: none;
        }

.arrow-list {
    padding: 0;
    margin-top: -5px;
}

    .arrow-list li {
        list-style-type: none;
        margin-bottom: 3px;
    }

        .arrow-list li:before {
            font-family: 'fontAwesome';
            content: '\f105';
            margin-right: 3px;
            color: #1c7bbd;
            font-size: 16px;
        }

.content-highlight {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    background: #f7f7f7;
    border: 1px solid #e3e3e3;
    padding: 7px 15px;
    margin-bottom: 20px;
}

    .content-highlight:last-child {
        margin-bottom: 0;
    }

    .content-highlight .logo {
        margin-right: 10px;
    }

        .content-highlight .logo img {
            max-width: 88px;
        }

    .content-highlight .resource-info .title {
        font-size: 16px;
        margin-bottom: 3px;
        display: inline-block;
    }

    .content-highlight .resource-info span {
        display: block;
    }

        .content-highlight .resource-info span a {
            color: #333333;
            text-decoration: underline;
        }

.blue-icon {
    background: #1c7bbd;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    height: 33px;
    width: 33px;
    text-align: center;
    color: #ffffff;
    font-size: 13px;
    line-height: 32px;
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}

.green-icon {
    background: #3A8D50;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    height: 33px;
    width: 33px;
    text-align: center;
    color: #ffffff;
    font-size: 13px;
    line-height: 32px;
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}

.tab-content.bordered {
    padding: 20px 15px 0 15px;
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.profile-content {
    border: 1px solid #bebebe;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    padding: 15px;
    margin-top: 14px;
}

/* Bootstrap Carousel */
#alert-slider .item {
    border: none;
    padding: 0 4%;
    height: 60px;
}

#alert-slider .carousel-control {
    width: 5%;
    text-shadow: none;
}

    #alert-slider .carousel-control.left, #alert-slider .carousel-control.right {
        background: none;
    }

#alert-slider .carousel-indicators {
    bottom: 0;
}

    #alert-slider .carousel-indicators .active {
        background-color: #e6d0d0;
    }

    #alert-slider .carousel-indicators li {
        border: 1px solid #e6d0d0;
    }

#alert-slider .glyphicon-chevron-left, #alert-slider .glyphicon-chevron-right {
    font-size: 25px;
    color: #9c9494;
    margin-top: -10px;
}

.modal-footer .btn {
    padding: 9px 17px;
}

.blue-label {
    color: #1C7BBD;
}

/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb 
*/
.carousel-fade .carousel-inner .item {
    opacity: 0;
    transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
    opacity: 1;
}

    .carousel-fade .carousel-inner .active.left,
    .carousel-fade .carousel-inner .active.right {
        left: 0;
        opacity: 0;
        z-index: 1;
    }

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
}

.carousel-fade .carousel-control {
    z-index: 2;
}

.guardian-actions {
    display: table;
    margin: 8px 0 0 0;
    font-size: 12px;
}

/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

        .carousel-fade .carousel-inner > .item.next.left,
        .carousel-fade .carousel-inner > .item.prev.right,
        .carousel-fade .carousel-inner > .item.active {
            opacity: 1;
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
        }
}

.inline-links a {
    display: inline-block;
    margin-right: 10px;
    padding-right: 14px;
    border-right: 1px solid #dfdfdf;
}

    .inline-links a:last-child {
        margin-right: 0;
        padding-right: 0;
        border-right: none;
    }

.fixed .fixed-spacer {
    margin-top: 260px !important;
}

.fixed #main-header {
    background: #ffffff;
    padding: 20px 0 0 0;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 1000;
}

    .fixed #main-header .learn-more-logo {
        -o-transform: scale(0.7);
        -ms-transform: scale(0.7);
        -moz-transform: scale(0.7);
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
        margin-right: -27px;
        min-width: 90px;
        top: -39px;
    }

    .fixed #main-header .grads-headline {
        font-size: 22px;
        padding: 18px 50px 12px 20px;
        margin: 0 0 0 104px;
    }

    .fixed #main-header .breadcrumb-bar {
        padding: 5px 0 5px 128px;
        font-size: 12px;
    }

    .fixed #main-header .blue-header {
        border-bottom: none;
        height: 51px;
        box-shadow: 0 3px 4px -4px rgba(0, 0, 0, 0.6);
    }

    .fixed #main-header .header-top {
        display: none;
    }

#main-header {
    background: url(../images/color-bar.jpg) center top #ffffff no-repeat;
    position: relative;
    margin-bottom: 30px;
}

    #main-header.impersonate {
        margin-top: 52px;
    }

    #main-header.impersonatetwice {
        margin-top: 102px;
    }

    #main-header .btn-group {
        margin: 8px 0 0 0;
    }

        #main-header .btn-group .btn {
            font-size: 13px;
        }

    #main-header .student .grads-headline {
        background: #125e92;
    }

        #main-header .student .grads-headline:after {
            right: 0;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(28, 123, 189, 0);
            border-right-color: #1c7bbd;
            border-width: 27px;
            margin-top: -27px;
        }

    #main-header .parent .grads-headline {
        background: #317b45;
    }

        #main-header .parent .grads-headline:after {
            right: 0;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(58, 141, 80, 0);
            border-right-color: #3a8d50;
            border-width: 27px;
            margin-top: -27px;
        }

    #main-header .breadcrumb-bar {
        background: #ffffff;
        border: 1px solid #dfdfdf;
        padding: 8px 0 8px 146px;
    }

        #main-header .breadcrumb-bar .breadcrumb {
            background: none;
            margin: 0;
            padding: 0;
        }

.header-bar {
    height: 55px;
}

    .header-bar.student {
        background: #1c7bbd;
    }

    .header-bar.parent {
        background: #3a8d50;
    }

    .header-bar .logo-wrap {
        position: relative;
        width: 26%;
        margin-right: 2%;
        float: left;
    }

    .header-bar .learn-more-logo {
        -o-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -webkit-transition: all 0.5s ease;
        transition: all 0.5s ease;
        top: -43px;
        position: absolute;
    }

    .header-bar .student-nav-wrap {
        float: left;
        width: 72%;
    }

#main-header .header-top {
    text-align: right;
    margin: 23px 0;
}

    #main-header .header-top .block {
        display: inline-block;
        vertical-align: middle;
        margin-right: 30px;
    }

        #main-header .header-top .block:last-child {
            margin-right: 0;
        }

#main-header #header-search button, #main-header #header-search input[type="text"] {
    display: inline-block;
}

#main-header .search {
    width: 23%;
}

#main-header #header-search input[type="text"] {
    background: #ffffff;
    border: 1px solid #d2d1d1;
    padding: 7px 15px;
    width: 81%;
    margin-right: -4px;
}

#main-header #header-search button {
    background: #6e6f71;
    padding: 8px 11px;
    text-transform: uppercase;
    font-weight: 300;
    font-size: 14px;
    border: none;
    color: #ffffff;
}

#main-header .icon-circle {
    background: none;
    padding: 0;
}

    #main-header .icon-circle .icon {
        color: #b6b54f;
        font-size: 39px;
    }

#main-header .alerts {
    float: none;
    margin-left: 0;
    top: 0;
    position: relative;
}

.notification-count {
    right: -12px;
}

.profile-photo, #main-header .profile-dropdown .profile-link {
    display: inline-block;
    vertical-align: middle;
}

.profile-photo {
    margin-right: 5px;
    width: 45px;
    height: 45px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    border: 2px solid #bbbcc0;
    background-color: #ffffff;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 10px;
    overflow: hidden;
}

    .profile-photo.bottom {
        background-position: center bottom;
    }

#profile-drop, #profile-drop:visited {
    color: #161616;
}

    #profile-drop:hover {
        text-decoration: none;
    }

.profile-dropdown .dropdown-menu a:hover {
    background: #6E6F71;
}

.grads-headline, .learn-more-logo {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    z-index: 10;
}

.header-bar .grads-headline {
    color: #ffffff;
    font-size: 27px;
    position: relative;
    padding: 13px 50px 12px 20px;
    z-index: 5;
}

.header-bar .grads-headline {
    margin: 0 0 0 124px;
}

/* nav */
#student-nav {
    text-align: right;
}

    #student-nav ul {
        margin-bottom: 0;
    }

    #student-nav .desktop-menu {
        margin: 0;
        padding: 0;
    }

        #student-nav .desktop-menu > ul > li {
            display: inline-block;
            margin-right: 3%;
            list-style-type: none;
            position: relative;
        }

            #student-nav .desktop-menu > ul > li:last-child {
                margin-right: 0;
            }

            #student-nav .desktop-menu > ul > li:hover {
                border-bottom: 3px solid #125E92;
            }

            #student-nav .desktop-menu > ul > li a {
                display: block;
                font-size: 14px;
                padding: 18px 0 13px 0;
            }

                #student-nav .desktop-menu > ul > li a, #student-nav .desktop-menu > ul > li a:visited {
                    color: #ffffff;
                }

                    #student-nav .desktop-menu > ul > li a:hover {
                        text-decoration: none;
                    }

                    #student-nav .desktop-menu > ul > li a.active {
                        font-weight: 600;
                        position: relative;
                    }

                        #student-nav .desktop-menu > ul > li a.active:after {
                            bottom: -3px;
                            left: 50%;
                            border: solid transparent;
                            content: " ";
                            height: 0;
                            width: 0;
                            position: absolute;
                            pointer-events: none;
                            border-color: rgba(255, 255, 255, 0);
                            border-bottom-color: #ffffff;
                            border-width: 5px;
                            margin-left: -5px;
                        }

            #student-nav .desktop-menu > ul > li ul {
                visibility: hidden;
                opacity: 0;
                position: absolute;
                left: -10px;
                width: 230px;
                padding: 0;
                margin: 0;
                z-index: 9000;
                text-align: left;
                background: #58595b;
                border-top: 4px solid #125E92;
                -webkit-transition: opacity 0.2s ease-in;
                -moz-transition: opacity 0.2s ease-in;
                -o-transition: opacity 0.2s ease-in;
                transition: opacity 0.2s ease-in;
                margin-top: -1px;
                -webkit-box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.1);
                box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.1);
            }

                #student-nav .desktop-menu > ul > li ul:after {
                    bottom: 103%;
                    left: 14px;
                    border: solid transparent;
                    content: " ";
                    height: 0;
                    width: 0;
                    position: absolute;
                    pointer-events: none;
                    border-color: rgba(0, 162, 163, 0);
                    border-bottom-color: #125E92;
                    border-width: 5px;
                    margin-left: -5px;
                    z-index: 9000;
                }

                #student-nav .desktop-menu > ul > li ul li {
                    list-style-type: none;
                }

                #student-nav .desktop-menu > ul > li ul a {
                    display: block;
                    padding: 15px 8px;
                    font-size: 13px;
                    line-height: normal;
                    text-transform: none;
                    font-weight: 500;
                }

                    #student-nav .desktop-menu > ul > li ul a:hover {
                        background: #727174;
                        text-decoration: none;
                    }

                    #student-nav .desktop-menu > ul > li ul a, #student-nav .desktop-menu > ul > li ul a:visited {
                        color: #ffffff;
                    }

            #student-nav .desktop-menu > ul > li:hover > ul {
                opacity: 1;
                visibility: visible;
            }

    #student-nav .mobile-menu-button {
        font-family: 'Bitter', serif;
        color: #ffffff;
        font-size: 20px;
        cursor: pointer;
        margin-top: 11px;
    }

/* mobile menu styles */
.mobile-menu-overlay {
    opacity: 0;
    position: fixed;
    width: 100%;
    height: 0;
    z-index: 12000;
    top: 0;
    overflow: hidden;
    background: #17a3a4;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

    .mobile-menu-overlay.open {
        height: 100%;
        opacity: 1;
    }

    .mobile-menu-overlay li {
        display: block;
        font-size: 16px;
        font-weight: 400;
    }

        .mobile-menu-overlay li .fa {
            margin-right: 5px;
        }

    .mobile-menu-overlay ul {
        margin: 0;
        padding: 0;
    }

        .mobile-menu-overlay ul > li > a {
            font-weight: 600;
        }

        .mobile-menu-overlay ul ul li {
            font-size: 14px;
        }

            .mobile-menu-overlay ul ul li a {
                padding: 10px 3% 10px 4%;
                border-bottom: 0;
                color: #e6e6e6;
                font-weight: 400;
            }

    .mobile-menu-overlay a, .mobile-menu-overlay a:visited {
        display: block;
        padding: 10px 2%;
        margin: 0 auto;
        color: #ffffff;
    }

    .mobile-menu-overlay a:hover {
        text-decoration: none;
        background: #1C7BBD;
        color: #ffffff;
    }

    .mobile-menu-overlay h1 {
        color: #ffffff;
        font-size: 40px;
    }

    .mobile-menu-overlay .overlay-content {
        position: relative;
        width: 100%;
        top: 3%;
        margin-top: 30px;
    }

    .mobile-menu-overlay .menu-close {
        font-size: 30px;
        cursor: pointer;
        position: absolute;
        top: 30px;
        right: 20px;
        z-index: 2001;
        color: #ffffff;
    }

        .mobile-menu-overlay .menu-close:hover {
            color: #000000;
        }

/* Footer */
#main-footer {
    background: #323232;
    padding: 30px 0;
    color: #ffffff;
    margin-top: 40px;
}

    #main-footer .grads-headline {
        font-size: 23px;
    }

    #main-footer .learn-more-logo {
        max-width: 80px;
        margin-right: 1%;
    }

    #main-footer a, #main-footer a:visited {
        color: #ffffff;
        font-weight: 300;
    }

#footer-nav ul {
    float: right;
    margin: 0 0 0 20px;
}

#footer-nav li {
    list-style-type: none;
    font-size: 13px;
    margin-bottom: 3px;
}

#footer-nav .title {
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 6px;
    font-size: 15px;
}

.footer-bottom {
    background: #ffffff;
    text-align: right;
}

    .footer-bottom .footer-color-bar {
        width: 100%;
        background-color: #298244;
        text-align: left;
        line-height: unset;
        font-size: 0px;
    }

        .footer-bottom .footer-color-bar .color-bar-item {
            display: inline-block;
            height: 15px;
        }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(1) {
                background-color: #298244;
                width: 9%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(2) {
                background-color: #6EB045;
                width: 13%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(3) {
                background-color: #D53D49;
                width: 6%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(4) {
                background-color: #E58D3E;
                width: 8%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(5) {
                background-color: #219895;
                width: 13%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(6) {
                background-color: #DACD30;
                width: 6%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(7) {
                background-color: #D53E4B;
                width: 8%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(8) {
                background-color: #249996;
                width: 13%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(9) {
                background-color: #DBCD32;
                width: 6%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(10) {
                background-color: #74C6D1;
                width: 8%;
            }

            .footer-bottom .footer-color-bar .color-bar-item:nth-child(11) {
                background-color: #3A8B52;
                width: 10%;
            }

/* financial aid estimator */
.application-sidebar, .application-content {
    float: left;
}

.application-sidebar {
    width: 26%;
    margin-right: 3.8%;
    float: left;
}

.student .application-sidebar .help-box {
    margin-top: 20px;
    padding: 0;
}

    .student .application-sidebar .help-box .corners {
        margin-bottom: 20px;
    }

    .student .application-sidebar .help-box h2 {
        color: #6e6f71;
        font-family: 'Bitter', serif;
        font-size: 24px;
        text-align: center;
    }

        .student .application-sidebar .help-box h2 .fa {
            color: #61ad49;
            font-size: 24px;
            margin-right: 5px;
        }

    .student .application-sidebar .help-box .title {
        padding: 10px 0;
        border-bottom: 4px solid #e8e8e8;
        margin-bottom: 30px;
    }

.application-content {
    width: 70%;
    font-weight: 300;
    float: right;
}

    .application-content .content-wrap {
        min-height: 600px;
    }

    .application-content a, .application-content a:visited {
        color: #5ca645;
    }

    .application-content .error-text {
        font-size: 13px;
        margin-bottom: 0;
    }

        .application-content .error-text a, .application-content .error-text a:visited {
            color: #b92c28;
        }

    .application-content .cancel-link, .application-content .cancel-link:visited {
        color: #ee0e0e;
        float: right;
        font-size: 16px;
        margin: 15px 30px 0 0;
        display: block;
    }

.application-steps {
    margin: 0;
    padding: 0;
    border: 1px solid #cecece;
}

    .application-steps li {
        list-style-type: none;
    }

        .application-steps li a, .application-steps li a:visited {
            background: #ffffff;
            width: 100%;
            border-bottom: 5px solid #dddcdc;
            padding: 15px 10px;
            font-weight: 300;
            text-transform: uppercase;
            color: #b4b4b4;
            font-size: 14px;
            display: block;
        }

        .application-steps li.previous:hover {
            color: #5da745;
        }

        .application-steps li a.active, .application-steps li a.active:visited {
            background: #5da745;
            color: #ffffff;
            position: relative;
            border-bottom: 8px solid #dddcdc;
        }

            .application-steps li a.active:after, .application-steps li a.active:visited:after {
                left: 100%;
                top: 50%;
                border: solid transparent;
                content: " ";
                height: 0;
                width: 0;
                position: absolute;
                pointer-events: none;
                border-color: rgba(93, 167, 69, 0);
                border-left-color: #5da745;
                border-width: 27px;
                margin-top: -27px;
            }

        .application-steps li a.coming {
            cursor: auto;
            text-decoration: none;
        }

        .application-steps li a.previous, .application-steps li a.previous:visited {
            color: #686868;
            cursor: pointer;
        }

        .application-steps li .fa {
            color: #5da745;
        }

.question-nav {
    border-top: 1px solid #eaeaea;
    padding-top: 30px;
    margin-top: 80px;
    margin-bottom: 40px;
}

    .question-nav.no-btn {
        padding-bottom: 30px;
    }

    .question-nav .back {
        float: left;
        font-size: 18px;
        font-weight: 300;
        margin-top: 9px;
        cursor: pointer;
        color: #626262;
    }

        .question-nav .back:visited {
            color: #626262;
        }

.application-wizard-wrap .main-title {
    margin-bottom: 16px;
}

    .application-wizard-wrap .main-title h1 {
        font-weight: 600;
    }

.application-questions h2 {
    font-weight: 400;
    margin: 0 0 30px 0;
    font-size: 18px;
    color: #3f3f3f;
    line-height: 33px;
}

.application-questions label {
    color: #5b5b5b;
}

.application-questions .radio input {
    margin-top: 10px !important;
}

radio input, .radio label {
    display: inline-block;
    vertical-align: top;
}

.radio label {
    font-size: 16px;
    max-width: 90%;
}

.input-controls fieldset {
    margin-bottom: 20px;
}

.input-controls input[type="text"], .input-controls input[type="email"], .input-controls input[type="number"], .input-controls textarea {
    padding: 11px;
    width: 100%;
}

.input-controls input[type="text"], .input-controls input[type="email"], .input-controls input[type="number"], .input-controls textarea, .input-controls select {
    border: 1px solid #71cde1;
}

    .input-controls select {
        height: 49px;
    }

.awards {
    margin: 28px 0;
}

    .awards .award {
        border: 1px solid #e2e2e2;
        padding: 28px 15px 15px 15px;
        margin-bottom: 15px;
        position: relative;
    }

        .awards .award:last-child {
            margin-bottom: 0;
        }

.award-description, .award-button {
    display: inline-block;
    vertical-align: middle;
}

.award-description {
    width: 73%;
    margin-right: 3.8%;
}

    .award-description h3 {
        margin: 0 0 6px 0;
        font-weight: 400;
        font-size: 16px;
    }

    .award-description p {
        color: #5e5e5e;
        font-size: 12px;
    }

.award-button {
    width: 22%;
    text-align: center;
}

    .award-button .corners {
        max-width: 170px;
        margin: 0 auto;
    }

    .award-button .disabled {
        opacity: 0.4;
        cursor: not-allowed;
    }

    .award-button .gray-btn, .award-button .green-btn {
        margin: 0 auto;
        font-size: 13px;
        padding: 9px 28px;
        text-align: center;
        display: inline-block;
        width: 100%;
        font-weight: 600;
    }

.not-interested {
    position: absolute;
    right: 0;
    top: -5px;
    background: #f7f6f6;
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    font-size: 12px;
    color: #f41414;
    height: 24px;
    cursor: pointer;
}

    .not-interested:hover {
        background: #e1e1e1;
    }

    .not-interested div {
        display: inline-block;
    }

        .not-interested div:first-child {
            margin-right: -11px;
            padding: 2px 10px;
            position: relative;
            bottom: 3px;
            font-size: 10px;
        }

    .not-interested .close-circle {
        background: #ffffff;
        border: 1px solid #e3e3e3;
        width: 27px;
        height: 27px;
        border-radius: 50%;
        color: #f41414;
        position: relative;
        z-index: 300;
        text-align: center;
        font-weight: bold;
        padding: 4px;
        position: relative;
        bottom: 3px;
        right: -5px;
    }

.next-btn.gray-btn {
    border: 4px solid #e5e5e5;
}

.award-complete p {
    color: #5da745;
}

.award-complete .fa {
    color: #5da745;
}

.award-complete.coming-soon p, .award-complete.coming-soon .fa {
    color: #ddcd32 !important;
}

.award-complete p, .award-pending p {
    margin: 0;
}

.award-complete .fa, .award-pending .fa {
    margin-right: 1.5%;
    font-size: 18px;
}

.award-complete.ended p, .award-complete.ended .fa {
    color: #e64554 !important;
}

.input-controls.fafsa {
    text-align: center;
    font-size: 18px;
    margin-top: 30px;
}

    .input-controls.fafsa .icheckbox_flat-green, .input-controls.fafsa label {
        display: inline-block;
        vertical-align: middle;
    }

    .input-controls.fafsa .icheckbox_flat-green {
        margin-right: 6px;
    }

.resource-links {
    margin: 30px auto 0 auto;
    max-width: 90%;
}

.resource-box {
    border: 1px solid #e2e2e2;
    padding: 20px;
    text-align: center;
    height: 275px;
}

    .resource-box img {
        max-height: 113px;
        margin: 20px 0 0 0;
    }

    .resource-box a {
        display: block;
        font-size: 16px;
        margin-top: 10px;
    }

    .resource-box p {
        margin: 13px 0 0 0;
    }

.award-status .status {
    text-transform: uppercase;
    color: #ffffff;
    padding: 4px;
    display: table;
    float: right;
    font-size: 10px;
    clear: both;
}

.award-status p {
    text-align: right;
}

    .award-status p:first-child {
        margin: 0 0 4px 0;
    }

.award-status .open {
    color: #61ad49;
    background: #e9f2e7;
    border: 1px solid #dae8d7;
}

.award-status .closed {
    color: #ad4949;
    background: #f0e6e6;
    border: 1px solid #e1d1d1;
}

.award-status .dates {
    font-size: 14px;
    margin-bottom: 0;
}

.help-text {
    font-size: 20px;
    text-align: center;
    margin-top: 88px;
}

.award-app-section .award {
    padding: 37px 15px 17px 15px;
    margin-bottom: 19px;
}

/* new */
.wizard-padding {
    padding: 4.5% 7%;
}

#apply-steps {
    margin: 0 0 7px 0;
    padding: 0;
}

    #apply-steps.six li {
        width: 17.2%;
    }

    #apply-steps.five li {
        width: 20%;
    }

    #apply-steps li {
        float: left;
        list-style-type: none;
        margin: 0;
        background: #ffffff;
        border: 1px solid #dbdbdb;
        padding: 17px 10px 17px 43px;
        position: relative;
        color: #d7d7d7;
        font-size: 12px;
    }

        #apply-steps li:first-child {
            padding: 17px 10px 17px 20px;
        }

        #apply-steps li.large-width {
            width: 21%;
        }

        #apply-steps li.small-width {
            width: 10%;
        }

        #apply-steps li:after, #apply-steps li:before {
            left: 100%;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            z-index: 20;
        }

        #apply-steps li:after {
            border-color: rgba(255, 255, 255, 0);
            border-left-color: #ffffff;
            border-width: 29px;
            margin-top: -29px;
        }

        #apply-steps li:before {
            border-color: rgba(219, 219, 219, 0);
            border-left-color: #dbdbdb;
            border-width: 30px;
            margin-top: -30px;
        }

        #apply-steps li:last-child:before, #apply-steps li:last-child:after {
            border: none;
        }

        #apply-steps li.active {
            color: #1c7bbd;
            font-weight: 600;
        }

            #apply-steps li.active .step {
                background: #1c7bbd;
            }

    #apply-steps .step {
        display: inline-block;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        width: 23px;
        height: 23px;
        line-height: 23px;
        background: #d7d7d7;
        color: #ffffff;
        text-align: center;
        margin-right: 5px;
    }

.question-progress {
    border-bottom: 1px solid #e8e8e8;
    overflow: hidden;
    height: 10px;
}

    .question-progress .progress-bar {
        padding: 10px 0;
        float: none;
        box-shadow: none;
        background: #71cde1;
    }

.green-btn .fa {
    margin-left: 5px;
}

.wizard-main.half {
    border-left: 1px solid #cfcfcf;
    float: left;
    width: 79%;
}

.wizard-sidebar {
    float: left;
    width: 21%;
    padding: 10px 0;
}

    .wizard-sidebar h2 {
        color: #3e4543;
        padding: 10px;
        font-size: 17px;
        margin: 0;
    }

    .wizard-sidebar ul, .wizard-sidebar ol {
        padding: 0;
        margin: 4px 0 0 0;
    }

        .wizard-sidebar ul li {
            list-style-type: none;
        }

    .wizard-sidebar ol {
        list-style-type: decimal;
    }

        .wizard-sidebar ol li {
            list-style-position: inside;
            list-style-type: decimal;
        }

            .wizard-sidebar ol li.active {
                color: #71cde1;
                font-weight: 600;
            }

    .wizard-sidebar li {
        margin-bottom: 6px;
        font-size: 13px;
        padding: 7px 10px;
    }

    .wizard-sidebar a, .wizard-sidebar a:visited {
        color: #3e4543;
        cursor: default;
    }

        .wizard-sidebar a:hover {
            text-decoration: none;
        }

    .wizard-sidebar .active {
        color: #1c7bbd;
        background: #e8e8e8;
        position: relative;
    }

        .wizard-sidebar .active a {
            color: #71cde1;
        }

        .wizard-sidebar .active:after {
            left: 100%;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(0, 140, 153, 0);
            border-left-color: #e8e8e8;
            border-width: 17px;
            margin-top: -17px;
        }

.appeal-header {
    padding: 20px;
    border-bottom: 1px solid #dbdbdb;
}

    .appeal-header h3 {
        margin: 0;
        font-size: 14px;
        display: inline-block;
        vertical-align: middle;
    }

/* Student Notifications */
.date-circle {
    background: #00a2a3;
    color: #ffffff;
    font-size: 17px;
    border-radius: 50%;
    text-align: center;
    width: 40px;
    height: 40px;
    line-height: 40px;
}

.notification h2 {
    margin: 0 0 7px 0;
    font-size: 18px;
}

.notification-date {
    width: 19%;
    margin-right: 3%;
}

.notification-content {
    width: 77%;
}

/* 21st Century */
.scholar-success-wrap {
    max-width: 80%;
    margin: 0 auto;
}

.grade-requirements {
    width: 68%;
    padding: 20px;
    margin-left: 31%;
}

.grade-col, .grade-requirements {
    display: inline-block;
    vertical-align: middle;
}

.grade-col {
    color: #ffffff;
    width: 28%;
    padding: 9% 17px;
    height: 100%;
    position: absolute;
}

    .grade-col h1 {
        text-transform: uppercase;
        font-weight: 700;
        margin: 0 0 5px 0;
        color: #ffffff;
    }

    .grade-col a {
        text-transform: uppercase;
        font-size: 12px;
    }

        .grade-col a, .grade-col a:visited {
            color: #ffffff;
        }

.grade9 {
    border: 1px solid #f98305;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}

    .grade9 .grade-col {
        background: #f98305;
    }

        .grade9 .grade-col:after {
            left: 100%;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(136, 183, 213, 0);
            border-left-color: #f98305;
            border-width: 20px;
            margin-top: -20px;
        }

.grade10 {
    border: 1px solid #fac81b;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}

    .grade10 .grade-col {
        background: #fac81b;
    }

        .grade10 .grade-col:after {
            left: 100%;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(136, 183, 213, 0);
            border-left-color: #fac81b;
            border-width: 20px;
            margin-top: -20px;
        }

.grade11 {
    border: 1px solid #7eb54d;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}

    .grade11 .grade-col {
        background: #7eb54d;
    }

        .grade11 .grade-col:after {
            left: 100%;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(136, 183, 213, 0);
            border-left-color: #7eb54d;
            border-width: 20px;
            margin-top: -20px;
        }

.grade12 {
    border: 1px solid #31a5ca;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}

    .grade12 .grade-col {
        background: #31a5ca;
    }

        .grade12 .grade-col:after {
            left: 100%;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(136, 183, 213, 0);
            border-left-color: #31a5ca;
            border-width: 20px;
            margin-top: -20px;
        }

.cdm {
    border: 1px solid #f98305;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}

    .cdm .grade-col {
        background: #f98305;
        padding-top: 4%;
    }

.success-steps .step {
    margin-bottom: 10px;
    display: block;
    padding: 10px;
    border: 1px solid #ffffff;
    white-space: nowrap;
}

.success-steps .step-nohover {
    margin-bottom: 10px;
    display: block;
    padding: 10px;
    border: 1px solid #ffffff;
    white-space: nowrap;
}

    .success-steps .step:last-child {
        margin-bottom: 0;
    }

    .success-steps .step:visited, .success-steps .step {
        color: #4b4b4b;
    }

        .success-steps .step:hover {
            text-decoration: none;
            border: 1px solid #ebebeb;
            color: #337ab7;
        }

        .success-steps .step p {
            margin: 0;
        }

.success-steps .step-description {
    width: 94%;
    white-space: normal;
}

.success-steps .step-check {
    background: #f7f7f7;
    border: 1px solid #d7dcde;
    background: #f7f7f7;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    margin-right: 3%;
    cursor: pointer;
}

.success-steps .step-check-nopointer {
    background: #f7f7f7;
    border: 1px solid #d7dcde;
    background: #f7f7f7;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    margin-right: 3%;

}

    .success-steps .step-check span {
        visibility: hidden;
    }

.success-steps .step-check-nopointer span {
    visibility: hidden;
}

    .success-steps .step-check:hover {
        border: 1px solid #61ad49;
    }

    .success-steps .step-check.checked {
        background: #61ad49;
        border: 1px solid #61ad49;
        color: #ffffff;
        font-size: 20px;
    }
.success-steps .step-check-nopointer.checked {
    background: #61ad49;
    border: 1px solid #61ad49;
    color: #ffffff;
    font-size: 20px;
}

        .success-steps .step-check.checked span {
            visibility: visible;
        }

.success-steps .step-check-nopointer.checked span {
    visibility: visible;
}

.success-steps ul {
    margin: 2px 0 0 0;
    padding: 0;
}

.success-steps .links li {
    list-style-type: none;
    display: inline-block;
    margin-right: 10px;
    font-size: 12px;
}

    .success-steps .links li:after {
        content: "|";
        padding-left: 10px;
    }

    .success-steps .links li:last-child {
        margin-right: 0;
    }

        .success-steps .links li:last-child:after {
            content: "";
            padding-left: 0;
        }

.questionnaire-form {
    max-width: 660px;
    margin: 0 auto;
}

    .questionnaire-form label {
        margin-bottom: 8px;
        font-size: 15px;
    }

        .questionnaire-form label.bold {
            font-weight: 600;
        }

    .questionnaire-form fieldset {
        margin-bottom: 25px;
    }

    .questionnaire-form h3 {
        color: #5da745;
        font-size: 28px;
        margin-bottom: 4px;
    }

    .questionnaire-form h4 {
        text-transform: uppercase;
        font-size: 16px;
    }

    .questionnaire-form .agreement-check {
        text-align: center;
        border: 1px solid #ccc;
        border-radius: 10px;
        padding: 5px;
    }

        .questionnaire-form .agreement-check .margin-right {
            margin-bottom: 10px;
        }

.inline-radio {
    display: inline-block;
    margin-right: 10px;
}

    .inline-radio:last-child {
        margin-right: 0;
    }

    .inline-radio label {
        font-weight: normal;
    }

.questionnaire-text {
    max-width: 90%;
    margin: 0 auto;
    line-height: 23px;
}

    .questionnaire-text ol, .questionnaire-text ul {
        margin-bottom: 30px;
        list-style-position: outside;
        padding-left: 38px;
        max-width: 80%;
    }

        .questionnaire-text ol li, .questionnaire-text ul li {
            margin: 0 0 8px 0;
        }

    .questionnaire-text p {
        margin: 0 0 20px;
    }

    .questionnaire-text h2 {
        font-size: 20px;
        color: #5da745;
        margin: 32px 0 10px 0;
        line-height: normal;
    }

    .questionnaire-text h3 {
        font-weight: 700;
        font-size: 14px;
    }

.tab-wrap {
    max-width: 91%;
    margin: 20px auto;
}

.corrections-wrap h2 {
    text-transform: uppercase;
    font-size: 19px;
    color: #3c3c3c;
    margin-bottom: 20px;
}

    .corrections-wrap h2 .fa {
        margin-right: 8px;
    }

.corrections-list {
    margin: 20px 0;
}

    .corrections-list:last-child {
        margin-bottom: 0;
    }

    .corrections-list .correction-item {
        margin: 0 0 20px 0;
    }

    .corrections-list .correction-content {
        display: inline-block;
        vertical-align: top;
    }

    .corrections-list h2 .fa {
        margin-right: 8px;
    }

    .corrections-list .help-toggle {
        font-size: 11px;
    }

.correction-icon {
    margin-right: 1%;
    text-align: center;
    width: 6%;
    display: inline-block;
    font-size: 18px;
}

    .correction-icon .fa {
        vertical-align: top;
    }

.correction-content {
    width: 90%;
}

    .correction-content h3 {
        margin: 0;
        font-size: 18px;
    }

.error-count {
    display: inline-block;
    font-size: 12px;
    margin-left: 10px;
    font-weight: 500;
    color: #555;
}

h2.name {
    margin: 0;
}

.student-info {
    width: 70%;
}

    .student-info .profile-photo {
        margin-right: 3%;
    }

    .student-info ul {
        font-size: 11px;
        margin: 10px 0 0 0;
        padding: 0;
    }

        .student-info ul li {
            margin-bottom: 5px;
            list-style-type: none;
        }

    .student-info h2.name {
        font-size: 18px;
    }

.student-header-bar {
    padding: 20px 0;
    border-bottom: 1px solid #214b6f;
    margin-bottom: 40px;
}

.detail-section {
    margin: 30px 0;
    padding-bottom: 27px;
    border-bottom: 1px solid #eaeaea;
    position: relative;
}

    .detail-section:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

.edit-section {
    position: absolute;
    top: 0;
    right: 0;
}

.correction-status p {
    margin: 0;
}

.large-wrap .tab-content {
    margin: 40px 0;
}

.right-border-sub {
    border-right: 1px solid #eeeeee;
}

.left-border-sub {
    border-left: 1px solid #eeeeee;
}

.appeal-number {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    color: #ffffff;
    line-height: 15px;
    text-align: center;
    font-size: 10px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
}

    .appeal-number.yellow {
        background: #c99006;
    }

    .appeal-number.red {
        background: #c92606;
    }

    .appeal-number.green {
        background: #069e09;
    }

.appeal .appeal-col-md, .appeal .appeal-col-sm, .appeal .appeal-actions {
    display: inline-block;
    vertical-align: middle;
}

    .appeal .appeal-col-md .right-border-sub, .appeal .appeal-col-sm .right-border-sub, .appeal .appeal-actions .right-border-sub {
        padding: 10px 4%;
    }

    .appeal .appeal-col-md:first-child, .appeal .appeal-col-sm:first-child, .appeal .appeal-actions:first-child {
        margin-right: 2%;
    }

.appeal .appeal-col-md {
    width: 27%;
}

    .appeal .appeal-col-md p {
        line-height: 16px;
        margin: 10px 0;
    }

.appeal .appeal-col-sm {
    width: 13.9%;
}

.appeal .appeal-actions {
    width: 29%;
    padding: 0 20px;
}

.appeal h3 {
    color: #1c7bbd;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 15px;
    margin: 0 0 5px 0;
}

.appeal p {
    font-size: 10px;
    margin: 0 0 13px 0;
}

.appeal h4 {
    font-size: 12px;
    margin: 0;
    display: inline-block;
    vertical-align: middle;
}

.appeal ul {
    font-size: 11px;
    padding: 0;
    margin: 10px 0 0 0;
}

    .appeal ul li {
        list-style-position: inside;
        margin-bottom: 5px;
    }

.appeal .appeal-messages {
    text-align: center;
}

    .appeal .appeal-messages p {
        font-size: 10px;
        line-height: 14px;
    }

    .appeal .appeal-messages .fa {
        font-size: 35px;
        margin-bottom: 11px;
    }

    .appeal .appeal-messages.read {
        color: #aeaeae;
    }

    .appeal .appeal-messages.unread {
        color: #c92606;
    }

.appeal .appeal-button {
    font-size: 11px;
    text-align: center;
}

    .appeal .appeal-button .corners {
        margin: 0px 8px 0px 0px;
    }

        .appeal .appeal-button .corners:last-child {
            margin: 0;
        }

#help-form {
    max-width: 800px;
    margin: 30px auto 0 auto;
}

    #help-form .next-btn {
        margin-top: 20px;
        font-size: 15px;
    }

    #help-form .green-btn {
        padding: 9px 32px;
    }

    #help-form textarea {
        min-height: 130px;
    }

.contact-text {
    max-width: 800px;
    margin: 0 auto;
}

    .contact-text h1 {
        margin: 0 0 20px 0;
        font-weight: 600;
        font-size: 28px;
        text-align: center;
    }

.account-link {
    font-size: 13px;
}

.help-links {
    padding: 0;
    color: #7b7b7b;
    font-size: 12px;
}

    .help-links li {
        list-style-type: none;
        list-style-position: outside;
        margin-bottom: 18px;
        line-height: 1.6;
    }

        .help-links li:before {
            display: table;
            float: left;
            font-size: 12px;
            content: "\f128";
            font-family: "FontAwesome";
            color: #787878;
            background: #ebebeb;
            border: 1px solid #d9d9d9;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            -o-border-radius: 50%;
            border-radius: 50%;
            width: 20px;
            height: 20px;
            line-height: 20px;
            text-align: center;
            margin-right: 10px;
        }

.info-bubble {
    background: #f8f7f7;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    padding: 18px;
    position: relative;
    text-align: left;
}

    .info-bubble.arrow:after {
        right: 100%;
        top: 50%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-color: rgba(248, 247, 247, 0);
        border-right-color: #f8f7f7;
        border-width: 15px;
        margin-top: -15px;
    }

    .info-bubble p {
        display: inline-block;
        vertical-align: middle;
        margin: 0 !important;
        max-width: 79%;
        font-size: 13px;
    }

    .info-bubble .fa {
        color: #c0c0c0;
        display: inline-block;
        vertical-align: middle;
        font-size: 28px;
        margin: 0 12px 0 0;
    }

.main-wrapper.dashboard {
    padding: 0 6%;
}

.mobile-label {
    display: none;
    color: #8a8a8a;
    font-weight: 600;
}

#hero-banner {
    position: relative;
    height: 350px;
    margin-top: -30px;
    border-bottom: 3px solid #4b4b4b;
    margin-bottom: 35px;
}

    #hero-banner .banner-image {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: left top;
    }

    #hero-banner .banner-overlay {
        position: absolute;
        right: 0;
        width: 100%;
        height: 100%;
        top: 0;
        z-index: 50;
        background-repeat: no-repeat;
        background-position: right center;
        background-size: contain;
    }

    #hero-banner .banner-gradient {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 30%;
        z-index: 70;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.65+100 */
        background: -moz-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
        /* IE6-9 */
    }

    #hero-banner .banner-welcome {
        background: #ffffff;
        padding: 35px 30px 18px 30px;
        position: absolute;
        right: 4%;
        top: 16%;
        z-index: 80;
        width: 30%;
        color: #505050;
    }

        #hero-banner .banner-welcome .welcome-title {
            text-align: center;
            font-size: 23px;
            font-weight: 600;
            margin-bottom: 15px;
        }

        #hero-banner .banner-welcome p {
            margin: 0 0 20px 0;
        }

        #hero-banner .banner-welcome:after {
            top: 0;
            left: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: transparent;
            border-top-color: #626265;
            border-width: 10px;
            margin-left: -10px;
        }

        #hero-banner .banner-welcome .corners {
            margin-top: 5px;
        }

    #hero-banner .banner-caption {
        position: absolute;
        bottom: 5px;
        z-index: 800;
        width: 92%;
        left: 4%;
        right: 4%;
        color: #ffffff;
        -webkit-text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.3);
        text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.3);
    }

        #hero-banner .banner-caption .banner-sub-title {
            font-size: 10px;
        }

.widget-padding {
    padding: 15px 30px;
}

.my-students-wrap {
    max-width: 90%;
    margin: 0 auto;
}

    .my-students-wrap h2 {
        color: #626262;
    }

    .my-students-wrap .add-students .widget-body h1 {
        margin: 6px 0 0 0;
    }

    .my-students-wrap .award-list {
        margin-bottom: 45px;
    }

        .my-students-wrap .award-list:last-child {
            margin-bottom: 0;
        }

.profile-overview {
    width: 60%;
}

    .profile-overview .round-btn {
        margin-top: 10px;
    }

    .profile-overview .profile-label {
        font-weight: 600;
    }

    .profile-overview .profile-col {
        width: 47%;
        margin-bottom: 10px;
    }

.parent-actions {
    width: 32%;
}

.widget-col {
    float: left;
    margin-right: 8%;
}

    .widget-col:last-child {
        margin-right: 0;
    }

.widget {
    background: #ffffff;
    border: 1px solid #e8e8e8;
    margin-bottom: 20px;
    position: relative;
}

    .widget table {
        margin-top: 20px;
    }

        .widget table th {
            font-weight: 600;
            font-size: 12px;
            color: #214b6f;
        }

    .widget .table > tbody > tr > td, .widget .table > tbody > tr > th, .widget .table > tfoot > tr > td, .widget .table > tfoot > tr > th {
        border-bottom: 1px solid #ebebeb;
        border-top: none;
        padding: 11px 8px;
    }

    .widget .table tbody tr:last-child td {
        border-bottom: none;
    }

    .widget .table > thead > tr > td, .widget .table > thead > tr > th {
        border: none;
        padding: 3px 8px;
    }

    .widget .widget-heading {
        border-bottom: 1px solid #e3e3e3;
    }

        .widget .widget-heading.full {
            padding: 17px 20px;
        }

            .widget .widget-heading.full h1 {
                font-size: 22px;
                margin: 10px 0 0 0;
            }

        .widget .widget-heading .student-name {
            margin: 14px 0 0 15px;
        }

        .widget .widget-heading h1 {
            margin: 0;
            font-size: 16px;
            font-weight: 600;
            display: inline-block;
        }

        .widget .widget-heading .profile-photo {
            width: 35px;
            height: 35px;
            background-size: 62%;
        }

        .widget .widget-heading .nav-tabs {
            border: none;
            float: right;
            font-size: 13px;
        }

            .widget .widget-heading .nav-tabs > li > a {
                border-left: 1px solid #e3e3e3;
                border-right: none;
                border-radius: 0;
                border-top: none;
                border-bottom: none;
                padding: 20px;
                line-height: normal;
            }

        .widget .widget-heading .nav > li > a:focus, .widget .widget-heading .nav > li > a:hover {
            background: none;
            color: #1c7bbd;
            border-left: 1px solid #e8e8e8;
            border-top: none;
            border-bottom: none;
            border-right: none;
        }

        .widget .widget-heading .active {
            border-bottom: 2px solid #1c7bbd;
        }

            .widget .widget-heading .active a, .widget .widget-heading .active a:visited {
                color: #1c7bbd;
            }

        .widget .widget-heading .icon-left {
            margin-right: 1.5%;
            font-size: 16px;
            border-style: solid;
            border-width: 1px;
            line-height: 40px;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            -o-border-radius: 50%;
            border-radius: 50%;
            width: 40px;
            height: 40px;
            display: inline-block;
            text-align: center;
            padding: 0 10px;
        }

        .widget .widget-heading.green {
            border-bottom: 1px solid #328849;
        }

            .widget .widget-heading.green .icon-left {
                border-color: #328849;
                color: #328849;
            }

        .widget .widget-heading .tab-title {
            margin: 15px 0 10px 15px;
            white-space: nowrap;
        }

    .widget .widget-body {
        padding: 25px;
    }

        .widget .widget-body .widget-section {
            margin-bottom: 40px;
        }

            .widget .widget-body .widget-section:last-child {
                margin-bottom: 0;
            }

        .widget .widget-body .table {
            margin: 20px 0;
        }

            .widget .widget-body .table .multi-line {
                margin-bottom: 8px;
                display: block;
            }

                .widget .widget-body .table .multi-line:last-child {
                    margin-bottom: 0;
                }

        .widget .widget-body .btn-group .btn {
            font-size: 13px;
        }

        .widget .widget-body h1 {
            font-size: 17px;
            font-weight: 600;
            margin: 0 0 20px 0;
        }

        .widget .widget-body .blue-title {
            color: #1c7bbd;
            font-weight: 400;
            margin: 0 0 10px 0;
            font-size: 14px;
            font-weight: 600;
            display: inline-block;
        }

        .widget .widget-body h2 {
            margin: 0 0 15px 0;
            text-transform: uppercase;
            font-weight: 600;
            font-size: 12px;
        }

            .widget .widget-body h2.name {
                text-transform: capitalize;
                font-weight: 400;
                font-size: 16px;
                margin: 0;
            }

        .widget .widget-body h3 {
            font-size: 12px;
            margin: 0 0 5px 0;
            font-weight: 600;
        }

        .widget .widget-body .nav-tabs > li.active > a {
            color: #337ab7;
        }

        .widget .widget-body p {
            line-height: 20px;
            margin-bottom: 23px;
        }

        .widget .widget-body .label {
            font-weight: 400;
            font-size: 11px;
        }

        .widget .widget-body .intro-text {
            padding: 10px 3.5%;
        }

        .widget .widget-body .line-list {
            margin: 0;
            padding: 0;
        }

            .widget .widget-body .line-list li {
                list-style-type: none;
                border-bottom: 1px solid #e3e3e3;
                padding-bottom: 9px;
                margin-bottom: 9px;
            }

                .widget .widget-body .line-list li:last-child {
                    border-bottom: none;
                    padding-bottom: 0;
                    margin-bottom: 0;
                }

            .widget .widget-body .line-list .fa {
                color: #214b6f;
            }

            .widget .widget-body .line-list .award-name {
                float: left;
            }

            .widget .widget-body .line-list .award-status {
                float: right;
            }

        .widget .widget-body .completion-chart, .widget .widget-body .completion-data {
            display: inline-block;
            vertical-align: middle;
        }

        .widget .widget-body .completion-chart {
            position: relative;
            margin-right: 4%;
        }

            .widget .widget-body .completion-chart .chart-data {
                font-weight: 600;
                font-size: 22px;
                position: absolute;
                width: 100%;
                height: 30px;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                margin: auto;
                text-align: center;
            }

                .widget .widget-body .completion-chart .chart-data.blue {
                    color: #1c7bbd;
                }

        .widget .widget-body .completion-data h1 {
            margin: 0 0 10px 0;
            font-weight: 600;
            color: #1c7bbd;
            font-size: 18px;
        }

        .widget .widget-body .completion-data p {
            margin: 0 0 3px 0;
            font-weight: 300;
        }

        .widget .widget-body .requirements-list {
            margin: 0;
            padding: 0;
            text-align: right;
        }

            .widget .widget-body .requirements-list li {
                list-style-position: inside;
                list-style-type: none;
                margin-bottom: 5px;
            }

                .widget .widget-body .requirements-list li:before {
                    font-family: 'FontAwesome';
                    content: '\f111';
                    margin: 0 5px 0 -15px;
                    color: #989898;
                }

    .widget .bottom-push {
        height: 80px;
    }

    .widget .widget-bottom {
        border-top: 1px solid #e3e3e3;
        text-align: center;
        padding: 15px;
        position: absolute;
        width: 100%;
        bottom: 0;
        left: 0;
    }

        .widget .widget-bottom .round-btn {
            margin: 0 auto;
        }

    .widget .content-highlight .logo img {
        max-width: 60px;
    }

    .widget .alert {
        display: table;
        font-size: 12px;
        padding: 10px 15px;
        margin: 0 0 30px 0;
    }

        .widget .alert .fa {
            margin-right: 10px;
        }

    .widget .outline-btn {
        font-size: 13px;
    }

    .widget .help-links {
        margin-top: 30px;
    }

.dashboard-bottom {
    margin-top: 30px;
    margin-bottom: -40px;
    border-top: 3px solid #9f9fa3;
    padding: 50px 4%;
    color: #ffffff;
    background: url(../images/gray-pattern.png) no-repeat #404040;
    background-size: cover;
}

    .dashboard-bottom a, .dashboard-bottom a:visited {
        color: #008c99;
    }

    .dashboard-bottom textarea {
        resize: none;
        min-height: 140px;
    }

    .dashboard-bottom .col-md-4 {
        max-width: 29%;
        margin-right: 3%;
    }

    .dashboard-bottom h1 {
        text-align: center;
        text-transform: uppercase;
        font-size: 35px;
        padding-bottom: 12px;
        margin-bottom: 80px;
        border-bottom: 1px dashed #ffffff;
    }

    .dashboard-bottom h2 {
        margin: 0 0 20px 0;
        font-size: 20px;
        color: #008c99;
        font-weight: 600;
    }

    .dashboard-bottom form input[type="text"], .dashboard-bottom form input[type="email"], .dashboard-bottom form textarea {
        background: #333335;
        border: 1px solid #242526;
        color: #ffffff;
    }

    .dashboard-bottom form button {
        float: right;
        padding: 5px 25px;
        background: #008c99;
        border: 1px solid #006b75;
        font-size: 12px;
    }

    .dashboard-bottom form ::-webkit-input-placeholder {
        color: #b1b1b1;
    }

    .dashboard-bottom form :-moz-placeholder {
        /* Firefox 18- */
        color: #b1b1b1;
    }

    .dashboard-bottom form ::-moz-placeholder {
        /* Firefox 19+ */
        color: #b1b1b1;
    }

    .dashboard-bottom form :-ms-input-placeholder {
        color: #b1b1b1;
    }

    .dashboard-bottom .question {
        margin-bottom: 10px;
        font-size: 13px;
    }

        .dashboard-bottom .question h3 {
            font-size: 16px;
            font-weight: 600;
        }

/* new */
.dashboard-tabs {
    margin: -35px 0 40px 0;
    background: #ffffff;
    border: 1px solid #e8e8e8;
}

    .dashboard-tabs .nav-tabs {
        border: none;
    }

        .dashboard-tabs .nav-tabs > li.active > a, .dashboard-tabs .nav-tabs > li.active > a:focus, .dashboard-tabs .nav-tabs > li.active > a:hover, .dashboard-tabs .nav-tabs > li > a, .dashboard-tabs .nav-tabs > li > a:hover {
            border-radius: 0;
            padding: 30px 27px 24px 27px;
            margin-right: 0;
            border-right: 1px solid #e8e8e8;
            border-left: none;
            border-top: none;
            border-bottom: none;
            line-height: normal;
        }

        .dashboard-tabs .nav-tabs li:first-child a, .dashboard-tabs .nav-tabs li:first-child:hover a {
            border-left: 1px solid #e8e8e8;
        }

    .dashboard-tabs li {
        border-bottom: 2px solid #ffffff;
    }

    .dashboard-tabs .active {
        border-bottom: 3px solid #3a8d50;
    }

    .dashboard-tabs a, .dashboard-tabs a:visited {
        color: #555;
    }

    .dashboard-tabs .nav > li > a:focus, .dashboard-tabs .nav > li > a:hover {
        background: none;
        color: #3a8d50;
    }

.tab-pane.widget-border .widget-section {
    border-bottom: 1px solid #e3e3e3;
    padding-bottom: 20px;
}

    .tab-pane.widget-border .widget-section:last-child {
        border-bottom: none;
        padding: 0;
    }

.widget-actions {
    text-align: right;
}

    .widget-actions .inline {
        margin-right: 2%;
    }

        .widget-actions .inline:last-child {
            margin-right: 0;
        }

    .widget-actions .outline-btn, .widget-actions .btn {
        font-size: 12px;
    }

    .widget-actions label {
        text-transform: uppercase;
        font-size: 12px;
        position: relative;
        top: 3px;
        font-weight: 600;
    }

    .widget-actions select {
        min-width: 100px;
    }

.student.dashboard-active .dataTables_length, .student.dashboard-active .dataTables_filter, .student.dashboard-active .dataTables_info, .student.dashboard-active .dataTables_paginate {
    display: none;
}

#my-awards-widget .help-link {
    margin-top: 37px;
    display: inline-block;
}

.grade-stats {
    text-align: center;
}

    .grade-stats .alert {
        margin: 0 auto 40px auto;
    }

    .grade-stats .grade-chart {
        display: inline-block;
        vertical-align: middle;
        margin-right: 5%;
    }

        .grade-stats .grade-chart:last-child {
            margin-right: 0;
        }

    .grade-stats .chart-description {
        font-size: 11px;
        margin-top: 25px;
        text-align: center;
    }

    .grade-stats .grade-label {
        display: block;
        margin-top: 5px;
        font-weight: 600;
    }

    .grade-stats .chart-data {
        color: #333;
    }

.tab-wrap {
    margin: 0 3%;
}

#state-aid-overview .widget-heading h1 {
    margin: 17px 0 0 0;
}

#state-aid-overview .tab-wrap ul.nav-tabs > li.active > a {
    background-color: #f1f5f8;
}

#state-aid-overview .tab-content h1 {
    margin: 6px 0 0 0;
}

#callout-banner {
    padding: 35px 0;
    text-align: center;
    background: url(../images/gray-pattern.png) no-repeat #404040;
    background-size: cover;
    margin-bottom: 30px;
    margin-top: -30px;
    border-bottom: 3px solid #4b4b4b;
}

    #callout-banner .corners, #callout-banner .green-btn {
        font-size: 12px;
    }

.widget .widget-body .cc-overview {
    text-align: center;
}

    .widget .widget-body .cc-overview .info-bubble.arrow {
        width: 48.5%;
    }

    .widget .widget-body .cc-overview canvas {
        width: 100%;
    }

    .widget .widget-body .cc-overview .completion-chart {
        width: 50%;
        margin-right: 0;
    }

.school-year-select {
    background: #1c7bbd;
    color: #ffffff;
    padding: 12px;
}

    .school-year-select label {
        display: block;
        margin-bottom: 15px;
        font-weight: 600;
    }

    .school-year-select .btn, .school-year-select .btn-group {
        width: 100%;
        text-align: left;
    }

    .school-year-select .caret {
        position: absolute;
        right: 10px;
        top: 12px;
    }

    .school-year-select .dropdown-menu {
        width: 100%;
    }

/* Responsive */
@media (max-width: 1600px) {
    .grade-col {
        padding: 8% 17px;
    }
}

@media (max-width: 1387px) {
    .award-complete p {
        font-size: 13px;
    }
}

@media (max-width: 1383px) {
    .user-actions .btn {
        padding: 6px 9px;
        font-size: 13px;
    }

    #users-table .user-actions {
        width: 30%;
        text-align: right;
    }

    #users-table .user-status, #users-table .user-role {
        width: 15%;
    }

    #users-table .user-info {
        width: 40%;
    }

    #users-table th.actions {
        text-align: center;
    }
}

@media (min-width: 1380px) {
    .next-btn a {
        font-size: 16px;
    }
}

@media (max-width: 1364px) {
    #apply-steps .step {
        font-size: 12px;
        width: 21px;
        height: 21px;
        margin-right: 2px;
    }

    #apply-steps li {
        padding: 17px 10px 17px 37px;
        font-size: 12px;
    }
}

@media (max-width: 1344px) {
    .notification-date {
        width: 25%;
    }

    .notification-content {
        width: 71%;
    }
}

@media (max-width: 1308px) {
    .award-button {
        width: 26%;
        text-align: center;
    }

    .award-description {
        width: 69%;
    }

    .widget-col {
        float: none;
        margin-right: 0;
    }

        .widget-col.profile-overview, .widget-col.parent-actions {
            width: 100%;
        }

    .parent-actions {
        margin-top: 25px;
    }
}

@media (max-width: 1295px) {
    .help-box .gray-btn {
        font-size: 12px;
    }

    .appeal-response .response-text {
        width: 87%;
    }

    .appeal-response .profile:nth-child(odd) {
        margin-right: 7%;
    }

    .appeal-response .profile:nth-child(even) {
        margin-left: 7%;
    }
}

@media (max-width: 1289px) {
    .award-details .doe-controls {
        width: 43%;
    }

    #doe-table .user-actions {
        width: 19%;
    }
}

@media (max-width: 1261px) {
    .appeal .appeal-col-sm:last-child {
        padding: 0;
    }
}

@media (max-width: 1257px) {
    .award-manager .col-md-3 {
        width: 35%;
    }

    .award-manager .col-md-9 {
        width: 65%;
    }

    #report-wizard .report-categories li {
        width: 46%;
    }

    .widget .widget-heading .nav-tabs > li > a {
        padding: 20px 10px;
    }
}

@media (max-width: 1247px) {
    #doe-table .user-actions .btn {
        width: 100%;
        margin-bottom: 3px;
    }
}

@media (max-width: 1232px) {
    #apply-steps li, #apply-steps li.large-width, #apply-steps li.small-width, #apply-steps.five li, #apply-steps.six li {
        width: 100%;
        float: none;
        padding: 17px 10px 17px 10px;
    }

        #apply-steps li:before, #apply-steps li:after, #apply-steps li.large-width:before, #apply-steps li.large-width:after, #apply-steps li.small-width:before, #apply-steps li.small-width:after, #apply-steps.five li:before, #apply-steps.five li:after, #apply-steps.six li:before, #apply-steps.six li:after {
            border: none;
        }
}

@media (max-width: 1195px) {
    #simSettings .span4 {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .sim-title input {
        width: 100%;
    }

    .sim-col .dashboard-widget {
        height: auto;
    }
}

@media (max-width: 1175px) {
    .ng-chart {
        max-width: 450px;
    }

    .ng-chart-legend {
        width: 39%;
    }

    .ng-chart {
        float: none;
    }
}

@media (max-width: 1172px) {
    .display-options-wrapper li {
        width: 30%;
    }

    .widget .widget-body .completion-chart {
        width: 100%;
        margin-bottom: 20px;
    }

    .cc-overview .info-bubble.arrow {
        width: 100%;
    }
}

@media (max-width: 1156px) {
    .application-sidebar, .application-content {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .application-content {
        margin-bottom: 20px;
    }

    #chartView .span10, #gridView .span10, #chartView .span2, #gridView .span2 {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    #hero-banner .banner-welcome {
        width: 40%;
    }

    #hero-banner .banner-overlay {
        right: -20%;
    }
}

@media (max-width: 1143px) {
    .student .content-wrap.med {
        max-width: 95%;
    }

    .main-title.center h1 {
        font-size: 27px;
    }

    .main-title.center p {
        font-size: 17px;
    }
}

@media (max-width: 1132px) {
    .sorting-tools .span6 {
        width: 100%;
        float: none;
        margin-right: 0;
        text-align: center;
    }

    .doe.sorting-tools .span6 {
        text-align: left;
    }

        .doe.sorting-tools .span6.right-action-buttons {
            text-align: right;
        }

    .user-search {
        margin-top: 40px;
    }

    .doe.sorting-tools .user-search {
        width: 78%;
        float: left;
    }

    .student-login-wrap {
        max-width: 80%;
    }

    .award-manager-titles .span7, .award-manager-titles .span5 {
        float: none;
        margin-right: 0;
        width: 100%;
        text-align: left;
    }

    .award-details .edit-sim-btn {
        margin: 25px 0;
    }

    .fixed #main-header .learn-more-logo {
        max-width: 100px;
        top: -25px;
    }

    #main-header.fixed .learn-more-logo {
        transform: none;
        top: -19px;
    }

    #main-header.fixed .grads-headline {
        margin: 0 0 0 91px;
    }

    .header-bar .grads-headline {
        font-size: 23px;
        padding: 16px 50px 13px 20px;
        margin: 0 0 0 93px;
    }

    #student-nav .desktop-menu > ul > li a {
        font-size: 12px;
    }
}

@media (max-width: 1126px) {
    .award-details .doe-controls {
        width: 44%;
    }

    .grade-col h1 {
        font-size: 30px;
    }

    .grade-col {
        padding: 13% 17px;
    }
}

@media (max-width: 1116px) {
    .small.span6 {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .med-wrap {
        max-width: 100%;
    }
}

@media (max-width: 1109px) {
    .dashboard-left-col, .dashboard-right-col, .student-profile-detail .span3, .student-profile-detail .span9, .profile-col {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .dashboard-widget .widget-content.claim-buttons {
        padding: 25px 11%;
    }

    .dashboard-widget .file-field input {
        width: 89%;
    }
}

@media (max-width: 1104px) {
    .widget-wrapper .student-detail-widgets, .widget-wrapper .student-detail-comments {
        width: 100%;
        float: none;
        margin: 20px 0;
    }

    .widget-wrapper .student-detail-widgets {
        padding: 0;
    }

    .widget-wrapper .student-detail-comments {
        padding-left: 15px;
    }
}

@media (max-width: 1086px) {
    #student-main-header .search {
        width: 33%;
    }
}

@media (max-width: 1087px) {
    .profile-content .span6 {
        float: none;
        width: 100%;
        margin-right: 0;
    }
}

@media (max-width: 1082px) {
    #state-aid-overview h1 {
        margin-bottom: 30px;
        display: block;
        padding-bottom: 10px;
    }

    #state-aid-overview .align-right {
        text-align: center;
    }

    #state-aid-overview .corners {
        margin: 20px 0 0 0;
    }

    #state-aid-overview .col-md-6 {
        float: none;
        width: 100%;
        clear: both;
    }

    #state-aid-overview .btn-group, #state-aid-overview .btn-group .btn {
        clear: both;
    }

    #state-aid-overview .widget-actions {
        display: block;
        margin: 20px 0;
        text-align: left;
    }

    #state-aid-overview .mobile-label {
        display: inline-block;
        margin-right: 8px;
    }

    #state-aid-overview .award-list table thead {
        display: none;
    }

    #state-aid-overview .award-list table td, #state-aid-overview .award-list table tr {
        display: block;
    }

    #state-aid-overview .award-list table td {
        border-bottom: none;
        padding: 0 8px;
    }

    #state-aid-overview .award-list table tr {
        border-bottom: 1px solid #ebebeb;
        padding: 10px 0;
    }

        #state-aid-overview .award-list table tr:last-child {
            border-bottom: none;
        }

    #state-aid-overview .award-list .align-right {
        text-align: left;
    }
}

@media (max-width: 1078px) {
    .wizard-sidebar, .wizard-main.half {
        width: 100%;
        float: none;
    }

    .wizard-main.half {
        border-left: none;
        border-top: 1px solid #cfcfcf;
    }
}

@media (max-width: 1066px) {
    #student-main-header .search {
        width: 33%;
    }

    h2.name {
        font-size: 20px;
    }

    #student-main-header.fixed .learn-more-logo {
        -o-transform: scale(0.7);
        -ms-transform: scale(0.7);
        -moz-transform: scale(0.7);
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
    }

    #student-main-header.fixed .grads-headline {
        font-size: 19px;
        margin-left: 20px;
        top: 34px;
    }
}

@media (max-width: 1045px) {
    #doe-table_filter {
        float: none;
    }

    .main-wrapper {
        padding: 0 1%;
    }
}

@media (max-width: 1031px) {
    /* admin side menu break */
    .full-menu {
        display: none !important;
    }

    #side-menu .nav-links ul {
        display: block !important;
    }

    #side-menu .icon-left {
        margin: 0;
    }

    #side-menu {
        width: 40px;
    }

        #side-menu .logo-sprite .logo {
            width: 120px;
            background-position: right center;
        }

        #side-menu .nav-links .fa {
            font-size: 16px;
        }

    #admin-right-content {
        padding-left: 40px;
    }

    #report-wizard .wizard-content {
        width: 100%;
    }

    #version-number {
        display: none;
    }

    .earn-admin #side-menu .logo {
        width: 30px;
    }
}

@media (max-width: 1038px) {
    #main-header .breadcrumb-bar {
        padding: 8px 0 8px 115px;
    }
}

@media (max-width: 991px) {
    .admin .row {
        margin: 0;
    }

    .admin .col-md-6 {
        margin-bottom: 20px;
    }

    .award-manager .col-md-3, .award-manager .col-md-9 {
        width: 100%;
    }

    .widget .widget-body .right-border-sub {
        border-bottom: 1px solid #eeeeee;
        padding-bottom: 10px;
        border-right: none;
        padding-right: 0;
    }

    .widget-section .padding {
        padding: 10px 30px;
    }

    .widget .widget-section .col-md-6, .widget .widget-section .col-md-5 {
        padding-top: 0;
    }

    .widget .widget-body .right-border:after, .widget .widget-body .right-border {
        border: none;
    }

    .widget .widget-body .requirements-list, .widget-section.border {
        text-align: center;
    }

    .widget .widget-body .requirements-list {
        margin-top: 20px;
    }

    .appeal-wrap .gutter-30 > div {
        margin-bottom: 20px;
    }

    .appeal-response .response-text, .appeal-response .profile {
        width: 100%;
        display: block;
    }

    .round-profile-icon {
        margin: 0 auto;
    }

    .appeal-comment.sent:after, .appeal-comment.sent:before, .appeal-comment.received:after, .appeal-comment.received:before {
        border: none;
    }

    .appeal-response .profile:nth-child(even), .appeal-response .profile:nth-child(odd) {
        margin: 0 0 20px 0;
    }

    .appeal-response {
        border-bottom: 1px solid #dbdbdb;
        padding-bottom: 20px;
        margin: 20px 0;
    }

    .col-md-6.right-border-sub {
        margin: 20px 0;
    }

    .col-md-6.left-border-sub {
        margin: 20px 0px 0px 0px;
        padding-top: 20px;
        border-top: 1px solid #eeeeee;
        border-left: none;
    }

    .widget-body .col-md-6 .corners {
        margin: 30px auto 20px auto;
        display: table;
    }

    .container-fluid.full {
        padding: 0 !important;
    }

    .content-wrap.main {
        margin-bottom: 20px;
    }
}

@media (max-width: 994px) {
    .dashboard-callouts .callout {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
        float: none;
    }

        .dashboard-callouts .callout:last-child {
            margin-bottom: 0;
        }

        .dashboard-callouts .callout .header h2 {
            font-size: 14px;
        }

    .correction-content h3 {
        font-size: 17px;
    }

    .correction-icon {
        font-size: 30px;
    }
}

@media (max-width: 986px) {
    .award-list .span3, .award-details .span9, .national-guard-dashboard .span9, .student-detail-widgets .dashboard-widget {
        width: 100%;
        float: none;
        margin-right: 0;
        display: block;
    }

    .award-list .span3 {
        margin-bottom: 30px;
    }

    .form-builder .add-field .span3 {
        width: 100%;
        float: none;
        margin-top: 15px;
    }
}

@media (max-width: 952px) {
    .doe-controls, .doe-buttons {
        width: 100%;
    }

    .doe-buttons {
        margin-top: 15px;
    }

    #doe-table_filter {
        width: 80%;
        margin-top: 180px;
    }

    .doe.sorting-tools .user-search, .doe.sorting-tools .right-action-buttons.top {
        display: none;
    }

        .doe.sorting-tools .right-action-buttons.top .btn {
            width: 100%;
            margin-bottom: 10px;
        }

    .doe-controls .doe-filter {
        width: 100%;
        margin-right: 0;
    }

    .doe-buttons button {
        width: 100%;
        margin-bottom: 6px;
    }

        .doe-buttons button:first-child {
            margin-right: 1%;
        }

    #doe-table_wrapper label {
        display: block;
        clear: both;
        text-align: left;
    }

    #doe-table_wrapper .col-sm-6 {
        width: 100%;
        float: none;
    }

    #doe-table_wrapper.dataTables_wrapper .dataTables_length {
        float: none;
    }
}

@media (max-width: 947px) {
    /* student mobile menu break */
    #student-nav .desktop-menu {
        display: none;
    }

    #student-nav .mobile-menu-button {
        display: block;
    }

    .blue-header .logo-wrap {
        width: 70%;
    }

    .blue-header .span8 {
        width: 30%;
        float: right;
    }
}

@media (min-width: 948px) {
    #student-nav .desktop-menu {
        display: block;
    }

    #student-nav .mobile-menu-button {
        display: none;
    }
}

@media (max-width: 936px) {
    .notification-content, .notification-date {
        width: 100%;
        float: none;
        margin: 0;
    }

    .notification-date {
        text-align: center;
        margin-bottom: 30px;
    }

    .notification-content h2 {
        text-align: center;
    }
}

@media (max-width: 931px) {
    .profile-box, .profile-box.small, .widgets-area .widget, .item .award-description, .item .award-button {
        width: 100%;
        float: none;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .item .award-button {
        margin-bottom: 0;
    }
}

@media (max-width: 904px) {
    .account-type .account-box {
        width: 100%;
        margin: 0 auto 20px auto !important;
        max-width: 400px;
        display: block;
    }
}

@media (max-width: 897px) {
    .student-profile-detail .span3, .student-profile-detail .span9 {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .student-profile-detail .profile-content {
        margin-top: 30px;
    }

    .isir-selects .styled-select {
        background-position: 98% center, left center;
    }
}

@media (max-width: 882px) {
    .award-button, .award-description {
        width: 100%;
        display: block;
        text-align: left;
        margin-top: 25px;
    }

    .award-complete {
        text-align: left;
    }

        .award-complete .fa {
            margin-right: 1%;
        }

    .awards .award {
        padding: 15px;
    }

    .dashboard-widget .file-field input {
        width: 79%;
    }

    #hero-banner .banner-welcome {
        width: 72%;
        left: 14%;
        right: 14%;
        top: 49%;
    }

    #hero-banner {
        height: 450px;
    }

        #hero-banner .banner-overlay {
            right: -80%;
            background-size: cover;
        }
}

@media (max-width: 867px) {
    .student-detail-bar {
        text-align: center;
    }

        .student-detail-bar .student-name {
            width: 100%;
            border-bottom: 1px solid #d9d9d9;
            font-size: 14px;
        }

        .student-detail-bar .student-actions {
            float: none;
        }

            .student-detail-bar .student-actions a:last-child {
                border-right: 1px solid #d9d9d9;
            }
}

@media (max-width: 841px) {
    .edit-section {
        position: relative;
        text-align: center;
        margin-top: 20px;
    }

    .detail-section .span6 {
        width: 100%;
        float: none;
        text-align: center;
    }

    .detail-section .award-select {
        margin-bottom: 20px;
    }
}

@media (max-width: 839px) {
    .user-actions .btn {
        display: block;
        width: 100%;
        margin: 7px 0;
        font-size: 10px;
    }

    #users-table .user-actions {
        width: 16%;
    }

    #users-table .user-status, #users-table .user-role {
        width: 18%;
    }

    #users-table .user-info {
        width: 45%;
    }

    .wizard-main .span8, .wizard-main .span4 {
        float: none;
        width: 100%;
        margin-right: 0;
        text-align: center;
    }

        .wizard-main .span8 .next-btn, .wizard-main .span4 .next-btn {
            float: none;
            margin-top: 20px;
        }

    .application-questions .span2, .application-questions .span4, .application-questions .span5, .application-questions .span6, .application-questions .span8, .application-questions .span10, .application-wizard-wrap .span2, .application-wizard-wrap .span4, .application-wizard-wrap .span5, .application-wizard-wrap .span6, .application-wizard-wrap .span8, .application-wizard-wrap .span10 {
        float: none;
        width: 100%;
        margin-bottom: 10px;
    }
}

@media (max-width: 837px) {
    #student-main-header #header-search {
        display: none;
    }

    .subpage-banner h1 {
        font-size: 33px;
    }

    #simSettings .modal-dialog {
        width: auto;
    }
}

@media (max-width: 810px) {
    .item {
        text-align: center;
    }

        .item > .inline {
            display: block;
            float: none;
        }

        .item .actions-right {
            margin-top: 20px;
        }

    .outline-btn {
        font-size: 11px;
        padding: 6px 20px;
        margin-top: 10px;
    }

    .student-info {
        width: 100%;
    }

    .appeal .appeal-col-md, .appeal .appeal-col-sm {
        width: 100%;
        margin: 0;
        float: none;
        border-bottom: 1px solid #eeeeee;
        padding: 10px 0;
    }

    .appeal .status-tag {
        margin: 0 auto;
    }

    .appeal .right-border-sub {
        padding: 0;
        border: none;
    }

    .appeal .appeal-messages p {
        margin: 0;
    }

    .appeal .appeal-button .corners {
        margin: 10px auto;
        max-width: 250px;
    }

    .merge-table .compare-value, table.dataTable.merge-table .compare-value,
    .merge-table .comparing, table.dataTable.merge-table .comparing,
    .merge-table td, .merge-table tr, .merge-table, .merge-table tbody {
        width: 100% !important;
        max-width: none !important;
        display: block;
    }

        .merge-table .keep-btn, table.dataTable.merge-table .keep-btn {
            position: relative;
            margin-top: 10px;
        }
}

@media (max-width: 795px) {
    #report-wizard .report-categories li {
        width: 100%;
    }
}

@media (max-width: 775px) {
    .form-builder .field .title .span8 {
        width: 45.4%;
    }

    .form-builder .field .title .span4 {
        width: 50.75%;
    }

    .ng-chart-wrapper .chart-total h1 {
        font-size: 30px;
    }

    .ng-chart-wrapper .chart-total h2 {
        font-size: 12px;
        line-height: 15px;
        margin: 9px 0 0 0;
    }

    .ng-chart-wrapper .chart-total {
        top: 38%;
    }

    .ng-chart-legend {
        width: 100%;
        display: block;
    }
}

@media (max-width: 768px) {
    .appeal-wrap .col-sm-6 {
        text-align: center;
        margin-bottom: 10px;
    }

    .display-buttons button {
        width: 100%;
        text-align: center;
    }

        .display-buttons button:first-child {
            margin-bottom: 20px;
        }

    #alert-slider .item {
        height: 110px;
    }

    .comments-btn.active:after, .comments-btn.active:before {
        right: 50%;
    }

    .right-border {
        border-right: none;
        border-bottom: 1px solid #d9d9d9;
        margin-bottom: 20px;
    }

    #state-aid-overview .nav-tabs li {
        width: 100%;
        text-align: center;
    }

        #state-aid-overview .nav-tabs li a {
            border-radius: 0;
            display: block;
        }

    #state-aid-overview .widget-padding {
        padding: 0;
    }

    #state-aid-overview .tab-content.bordered {
        padding: 0;
        border: none;
        margin-top: 20px;
    }

    #state-aid-overview .btn-group, #state-aid-overview .btn-group .btn {
        display: block;
        width: 100%;
        text-align: left;
    }

        #state-aid-overview .btn-group .btn {
            margin-bottom: 20px;
        }

        #state-aid-overview .btn-group:last-child .btn {
            margin-bottom: 0;
        }
}

@media (max-width: 753px) {
    .select-date .span6, .configuration-options .span10, .configuration-options .span2 {
        float: none;
        width: 100%;
        margin-right: 0;
    }

        .select-date .span6:first-child, .configuration-options .span10 {
            margin-bottom: 15px;
        }

    .configuration-options .btn, .award-details .btn-right {
        width: 100%;
    }

    .expand-title h1 {
        font-size: 16px;
        position: relative;
        top: 4px;
    }

    .form-builder .add-field .btn {
        width: 100%;
    }

    .form-builder .expand-title h1 {
        top: 0;
    }

    .actions-right {
        float: none;
        text-align: center;
    }

    .title-actions {
        text-align: center;
    }

        .title-actions h1 {
            margin-bottom: 20px;
        }
}

@media (max-width: 742px) {
    #chartView, #tabs-awards {
        display: none;
    }

    #gridView {
        display: block;
    }

    .widget-title .span8, .widget-title .span4 {
        float: none;
        width: 100%;
        margin-right: 0;
    }

    .widget-title .span8 {
        margin-bottom: 20px;
    }

    .award-select {
        text-align: left;
    }

    .widget-title .round-select {
        width: 100%;
        background-position: 97% center;
    }

    .college-dashboard .dataTables_wrapper .dataTables_filter {
        text-align: left;
    }

    .profile-overview .profile-col {
        width: 100%;
    }

    .my-students-wrap .tab-pane {
        padding: 0;
    }
}

@media (max-width: 737px) {
    #main-header .header-top .view-toggle {
        display: none;
    }
}

@media (max-width: 723px) {
    .main-title.sub h1 {
        font-size: 29px;
    }

    .application-questions h2 {
        font-size: 23px;
    }

    .green-btn {
        font-size: 14px;
    }
}

@media (max-width: 721px) {
    .application-content .main-title .span8, .application-content .main-title .span4 {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .application-content .main-title .next-btn {
        text-align: center;
        margin-top: 20px;
        float: none;
    }

    .correction-content {
        width: 85%;
    }

    .correction-icon {
        width: 10%;
    }

    .info-bubble {
        margin-top: 10px;
    }
}

@media (max-width: 708px) {
    .grade-col {
        height: 100%;
    }

    .resource-links .resource-box {
        width: 100%;
        float: none;
        margin-bottom: 20px;
    }

    .nav-tabs.mobile-stack {
        border-bottom: 0;
    }

        .nav-tabs.mobile-stack li {
            float: none;
            text-align: center;
            margin-bottom: 5px;
        }

            .nav-tabs.mobile-stack li.active a, .nav-tabs.mobile-stack li a {
                border: 1px solid #ddd !important;
                -webkit-border-radius: 3px;
                border-radius: 3px;
            }

    #hero-banner .banner-overlay, #hero-banner .banner-caption {
        display: none;
    }

    #hero-banner .banner-image {
        background-position: 17%, top;
    }
}

@media (max-width: 677px) {
    /* mobile table break */
    .add-user, .search-filter {
        float: none;
        margin: 0 0 20px 0;
        width: 100%;
        text-align: center;
        width: 100%;
        max-width: none;
    }

    #admin-main-header .logo {
        max-width: 200px;
    }
}

@media (max-width: 654px) {
    .student-detail-bar h1 {
        font-size: 18px;
    }

    #admin-main-header .icon-circle {
        width: 31px;
        height: 31px;
        padding: 6px 8px;
    }

        #admin-main-header .icon-circle .icon {
            font-size: 16px;
        }

    #admin-main-header .alerts, .tasks {
        width: 12%;
    }

    #admin-main-header .notification-count {
        width: 17px;
        height: 18px;
        padding: 3px;
    }

    #admin-main-header .logo {
        margin-top: 0;
    }

    .user-profile-tool .user-img {
        width: 31px;
        height: 31px;
    }

    .student-login-wrap {
        max-width: 90%;
    }

    .create-account-link {
        font-size: 14px;
    }

    .ng-chart-wrapper .chart-total h1 {
        font-size: 24px;
    }

    .ng-chart-wrapper .chart-total h2 {
        font-size: 11px;
        line-height: 14px;
        margin-top: 2px;
    }
}

@media (max-width: 625px) {
    .range-inputs .start, .range-inputs .end {
        width: 100%;
    }

    .range-inputs .middle {
        margin: 8px 0;
    }
}

@media (max-width: 587px) {

    .grade-col {
        height: auto;
    }

    .alert-banner h3 {
        font-size: 14px;
    }

    .questionnaire-text h2 {
        font-size: 18px;
    }

    .questionnaire-text ol, .questionnaire-text ul {
        max-width: 100%;
        padding-left: 24px;
    }
}

@media (max-width: 570px) {
    .dashboard-header .span6 {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .round-select {
        width: 100%;
    }

    .college-dashboard .award-select {
        text-align: left;
    }

    .dashboard-header h1 {
        text-align: center;
        margin-bottom: 20px;
    }

    h2.name {
        font-size: 14px;
    }
}

@media (max-width: 539px) {
    .next-btn {
        float: none;
        width: 100%;
        text-align: center;
        display: block;
        clear: both;
    }

        .next-btn button {
            width: 100%;
        }

    .question-nav .back {
        margin-top: 0;
        margin-bottom: 30px;
        float: none;
        display: block;
        text-align: center;
    }

    .content-highlight .inline {
        display: block;
        text-align: center;
    }

    .content-highlight .logo {
        margin-bottom: 5px;
    }
}

@media (max-width: 527px) {
    #student-main-header .grads-headline {
        font-size: 21px;
    }
}

@media (max-width: 991px) {
    #main-header .search {
        width: 36%;
    }

    .dashboard-bottom .col-md-4 {
        max-width: 100%;
    }
}

@media (max-width: 986px) {
    .main-title .span9, .main-title .span3 {
        width: 100%;
        clear: both;
        margin-right: 0;
    }

    .main-title .span9 {
        margin-bottom: 20px;
    }

    .main-title .span3 .green-btn {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 978px) {
    #login-wrap {
        width: 65%;
    }
}

@media (max-width: 954px) {
    #main-footer .span4, #main-footer .span8 {
        float: none;
        width: 100%;
        margin: 0;
    }

    #main-footer .span4 {
        margin-bottom: 20px;
        text-align: center;
        padding-bottom: 20px;
        border-bottom: 1px solid #616161;
    }

        #main-footer .span4 img {
            display: block;
            margin: 0 auto;
        }

    #footer-nav ul {
        margin: 0;
    }

    .header-bar .grads-headline {
        margin: 0 0 0 93px;
    }
}

@media (max-width: 956px) {
    .create-account-form .span6 {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .create-account-form label {
        margin-top: 20px;
    }

    .create-account-form fieldset {
        margin: 0;
    }

    .student-input-group {
        padding: 10px 27px 47px 27px;
    }

    .final-save {
        margin-top: 40px;
    }
}

@media (max-width: 928px) {
    .scholar-success-wrap {
        max-width: 100%;
    }

    .grade-col h1 {
        font-size: 26px;
    }
}

@media (max-width: 903px) {
    .user-details .nav-tabs > li {
        float: none;
    }

        .user-details .nav-tabs > li.active > a {
            border-bottom-color: #cdcdcd;
        }
}

@media (max-width: 878px) {
    .award-description {
        width: 100%;
        margin-bottom: 20px;
    }

    .award-button {
        width: 100%;
    }

    .award-complete .fa {
        width: auto;
    }

    .award-status p {
        text-align: left;
    }

    .award-status .status {
        float: none;
    }
}

@media (max-width: 846px) {
    #admin-main-header .logo {
        max-width: 210px;
    }
}

@media (max-width: 773px) {
    .widget .widget-heading {
        text-align: center;
    }

        .widget .widget-heading .col-xs-5, .widget .widget-heading .col-xs-7 {
            width: 100%;
            margin-right: 0;
            float: none;
        }

        .widget .widget-heading .student-name {
            margin: 0;
            padding: 15px 0;
            border-bottom: 1px solid #e3e3e3;
        }

        .widget .widget-heading .nav-tabs {
            float: none;
            border-top: 1px solid #e3e3e3;
        }

            .widget .widget-heading .nav-tabs li {
                width: 33.3%;
            }
}

@media (max-width: 767px) {
    .add-students h1 {
        text-align: center;
    }

    .add-students .outline-btn {
        display: table;
        margin: 30px auto 0 auto;
        text-align: center;
    }
}

@media (max-width: 707px) {
    #create-account-header .page-title {
        font-size: 15px;
    }

    #admin-main-header .learn-more-logo {
        margin-top: 14px;
    }
}

@media (max-width: 733px) {
    .display-options-wrapper li {
        width: 100%;
    }
}

@media (max-width: 662px) {
    .grade-col h1 {
        font-size: 21px;
    }

    .grade-col {
        padding: 18% 17px;
    }
}

@media (max-width: 660px) {
    .alert-drop {
        position: fixed;
        width: 100%;
    }

    .bar-headline-small h2 {
        width: auto;
    }

    .alert-drop .add-new {
        float: right;
    }

    .bottom-bar .button-wrap {
        text-align: center;
    }

        .bottom-bar .button-wrap .gray-btn, .bottom-bar .button-wrap .blue-btn {
            padding: 9px 20px;
        }
}

@media (max-width: 647px) {
    .student-search-icon {
        font-size: 14px !important;
        left: 13px;
        top: 13px;
    }

    .content {
        padding: 10px;
    }

    .tags .bootstrap-tagsinput .label {
        display: block;
        margin-bottom: 10px;
    }

    .filter-title, .tags {
        display: block;
    }
}

@media (max-width: 610px) {
    .subpage-banner h1 {
        font-size: 31px;
    }
}

@media (max-width: 604px) {
    .widget .widget-heading .nav-tabs li {
        width: 100%;
    }

        .widget .widget-heading .nav-tabs li a, .widget .widget-heading .nav-tabs li a:hover {
            border-bottom: 1px solid #e3e3e3;
        }
}

@media (max-width: 577px) {
    #admin-main-header .main-wrapper, #admin-main-header {
        padding: 5px;
    }

    #footer-nav ul {
        float: none;
        margin-bottom: 20px;
    }
}

@media (max-width: 570px) {
    .grade-col, .grade-requirements {
        display: block;
        position: relative;
        width: 100%;
    }

    .grade-col {
        padding: 20px;
    }

    .grade9 .grade-col:after, .grade10 .grade-col:after, .grade11 .grade-col:after, .grade12 .grade-col:after {
        border: none;
    }

    .grade-requirements {
        margin-left: 0;
    }
}

@media (max-width: 552px) {
    table.task-list .actions {
        width: 27%;
        text-align: left;
    }
}

@media (max-width: 563px) {
    #login-wrap {
        width: 85%;
    }

    #login-form input[type="submit"] {
        width: 100%;
        float: none;
    }

    #login-wrap {
        padding: 50px 0;
    }

    .corrections-wrap {
        max-width: 100%;
    }
}

@media (max-width: 543px) {
    .profile-dropdown {
        font-size: 12px;
    }

    #main-header .search {
        width: 46%;
    }

    .profile-photo {
        width: 35px;
        height: 35px;
        background-size: 63%;
    }

    #main-header .icon-circle .icon {
        font-size: 34px;
    }
}

@media (max-width: 539px) {
    #create-account-header .span4 {
        position: absolute;
        width: 100%;
        right: 4%;
    }

    #create-account-header .span8 {
        width: 100%;
    }

    .subpage-banner h1 {
        font-size: 27px;
    }

    .notification h2 {
        font-size: 14px;
        font-weight: 700;
    }
}

@media (max-width: 535px) {
    #admin-main-header .main-wrapper {
        padding: 0 2% 3% 2%;
    }

    #admin-main-header .alerts, #admin-main-header .tasks {
        width: 15%;
    }

    #admin-main-header .span5, #admin-main-header .span7 {
        float: none;
        width: 100%;
        margin-right: 0;
        clear: both;
    }

    #admin-main-header .span5 {
        border-top: 1px solid #d9d9d9;
    }

    .admin-actions {
        float: none;
    }

    #admin-main-header {
        height: auto;
    }

        #admin-main-header .page-title {
            margin: 21px 0 0 0;
        }
}

@media (max-width: 532px) {
    .create-account .content h1, .create-account .content h2 {
        text-align: center;
    }

    .create-account .content h1 {
        margin: 0 0 13px 0;
    }
}

@media (max-width: 526px) {
    .create-account .content h1 {
        font-size: 39px;
        margin: 0 0 12px 0;
    }

    .account-type .account-box .icon {
        max-width: 120px;
    }

    .account-type .account-box {
        height: 229px;
    }
}

@media (max-width: 521px) {
    #admin-main-header .logo {
        max-width: 200px;
    }

    .user-profile-tool {
        padding-left: 10px;
    }

        .user-profile-tool .user-img, .user-profile-tool .user-welcome {
            font-size: 12px;
        }

        .user-profile-tool .user-img {
            width: 30px;
            height: 30px;
        }

    .student .mobile-menu ul li {
        font-size: 11px;
    }

    .next-btn a {
        font-size: 14px;
    }

    .claimed-status, .paid-status, .notpaid.status {
        display: block;
        text-align: center;
        margin-bottom: 6px;
    }
}

@media (max-width: 505px) {
    .audit-log-filters .col-sm-6 {
        width: 100%;
        float: none;
        margin: 0;
    }

    .audit-log-filters .filters-dropdown {
        float: none;
        width: 100%;
        margin-bottom: 20px;
    }

    .audit-log-filters .btn-group, .audit-log-filters .btn {
        width: 100%;
        display: block;
        float: none;
    }
}

@media (max-width: 500px) {
    .header-bar .grads-headline {
        font-size: 19px;
        padding: 20px 50px 14px 20px;
        margin: 0 0 0 72px;
    }

    .header-bar .learn-more-logo {
        max-width: 80px;
        top: -13px;
    }

    #main-header .breadcrumb-bar, #main-header.fixed .breadcrumb-bar {
        padding: 19px 0 10px 4px;
        font-size: 12px;
        text-align: center;
    }

    #main-header.fixed .grads-headline {
        margin: 0 0 0 75px;
        font-size: 19px;
        padding: 20px 50px 14px 20px;
    }

    #report-wizard .wizard-content {
        padding: 20px;
    }
}

@media (max-width: 486px) {
    .ng-chart-wrapper .chart-total {
        width: 103%;
        top: 34%;
    }

    .widget .widget-body .line-list .award-name, .widget .widget-body .line-list .award-status {
        float: none;
        text-align: center;
        display: block;
    }
}

@media (max-width: 483px) {
    .dashboard-widget .file-field input {
        width: 100%;
    }

    .dashboard-widget .file-field button {
        display: block;
        width: 100%;
        margin-top: 8px;
    }
}

@media (max-width: 479px) {
    .field-configuration .option-inputs .span10 {
        width: 72.7%;
    }

    .field-configuration .option-inputs .span2 {
        width: 23.45%;
    }

    .doe.sorting-tools h1 {
        font-size: 23px;
    }

    .widget .widget-heading h1 {
        font-size: 18px;
    }

    .widget .widget-heading .icon-left {
        width: 35px;
        height: 35px;
        font-size: 14px;
        line-height: 35px;
        padding: 0 9px;
    }
}

@media (max-width: 471px) {
    #main-header .search.block {
        display: none;
    }

    #hero-banner .banner-welcome {
        width: 92%;
        left: 4%;
        right: 4%;
        bottom: 0;
    }
}

@media (max-width: 468px) {
    .title-actions .span7, .title-actions .span5 {
        float: none;
        width: 100%;
        margin: 0;
    }

    .title-actions .action-buttons {
        text-align: left;
        margin-top: 10px;
    }

    .subpage-banner {
        padding: 80px 0;
    }

        .subpage-banner h1 {
            font-size: 20px;
        }

    #student-main-header .icon-circle .icon {
        font-size: 31px;
    }

    #student-main-header .icon-circle {
        width: 35px;
    }

    .learn-more-logo {
        max-width: 90px;
    }
}

@media (max-width: 457px) {
    .account-type .account-box .icon {
        max-width: 110px;
    }

    .account-type .account-box {
        height: 216px;
    }

        .account-type .account-box h3 {
            font-size: 15px;
            line-height: 23px;
        }

    .create-account .content h1 {
        font-size: 32px;
    }

    .create-account .content h2 {
        font-size: 15px;
    }

    .create-account-form input[type="submit"] {
        width: 100%;
    }

    .main-title.sub h1 {
        font-size: 20px;
    }

    .application-questions h2 {
        font-size: 17px;
    }

    .dashboard-bottom form button {
        float: none;
        display: block;
        width: 100%;
        margin-bottom: 30px;
    }

    .dashboard-bottom h2 {
        text-align: center;
    }

    .outline-btn {
        width: 100%;
        text-align: center;
    }

    #report-wizard .report-title {
        font-size: 23px;
    }

    #report-wizard p {
        font-size: 16px;
    }

    #report-wizard .select-report {
        max-width: 100%;
        padding: 20px;
    }
}

@media (max-width: 400px) {
    .dashboard-bottom h1 {
        font-size: 28px;
    }

    .award-description h3 {
        font-size: 16px;
    }

    .user-profile-tool {
        padding-left: 6px;
    }

    table.task-list .actions {
        width: 30%;
    }

    #admin-main-header .span3 {
        width: 6.05%;
    }

    #admin-main-header .mobile-logo {
        max-width: 30px;
        margin-top: 18px;
    }

    #admin-main-header .span9 {
        width: 90.05%;
    }

    .student-input-group {
        padding: 10px 17px 47px 17px;
    }

    .main-title h1 {
        font-size: 20px;
    }

    .main-title h2 {
        font-size: 13px;
    }

    .expand-title h1 {
        font-size: 12px;
        position: relative;
        top: 7px;
    }

    .award-button .gray-btn, .award-button .green-btn, .not-interested {
        display: block;
    }

    .not-interested {
        top: -11px;
    }

    .form-builder .field .title .span8, .form-builder .field .title .span4 {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .form-builder .field .actions .field-name {
        font-size: 12px;
    }

    .form-builder .field .actions .fa {
        font-size: 16px;
    }

    .form-builder .field h2 {
        border-bottom: 1px solid #d9d9d9;
        padding-bottom: 12px;
        text-align: center;
    }

    .login-wrap h2 {
        font-size: 25px;
    }

    .correction-icon {
        font-size: 16px;
        width: 6%;
    }

    .correction-content {
        width: 90%;
    }

        .correction-content h3 {
            font-size: 15px;
        }

    .corrections-list .correction-item {
        padding: 10px;
    }

    .bottom-bar .button-wrap .gray-btn, .bottom-bar .button-wrap .blue-btn {
        padding: 9px 12px;
        font-size: 12px;
    }

    .wizard-content .step-actions .pull-left, .wizard-content .step-actions .pull-right {
        float: none !important;
        text-align: center;
        margin: 0 0 20px 0;
    }
}

@media (max-width: 390px) {
    .login-wrap {
        margin-top: 33px;
    }

    #create-account-header {
        max-height: 379px;
        padding: 20px 0 0 0;
    }

        #create-account-header .span4 {
            top: -28px;
        }

        #create-account-header .page-title {
            font-size: 13px;
        }

        #create-account-header .blue-bar {
            height: 60px;
        }

    #student-main-header .learn-more-logo {
        max-width: 80px;
        margin-right: 1%;
    }

    #create-account-header .span8 {
        position: relative;
        top: 20px;
    }

    .account-type .account-box {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
        height: auto;
    }

    .create-account .content h1 {
        font-size: 29px;
    }

    .create-account .content h2 {
        font-size: 16px;
    }
}