/* Minification failed. Returning unminified contents.
(2037,13): run-time error CSS1035: Expected colon, found 'for'
(2038,13): run-time error CSS1035: Expected colon, found 'for'
(2039,13): run-time error CSS1035: Expected colon, found 'for'
(2040,13): run-time error CSS1035: Expected colon, found 'for'
(2059,13): run-time error CSS1035: Expected colon, found 'for'
(2060,13): run-time error CSS1035: Expected colon, found 'for'
(2061,13): run-time error CSS1035: Expected colon, found 'for'
(2062,13): run-time error CSS1035: Expected colon, found 'for'
(2082,13): run-time error CSS1035: Expected colon, found 'for'
(2083,13): run-time error CSS1035: Expected colon, found 'for'
(2084,13): run-time error CSS1035: Expected colon, found 'for'
(2085,13): run-time error CSS1035: Expected colon, found 'for'
(2119,25): run-time error CSS1046: Expect comma, found '255'
(2119,32): run-time error CSS1046: Expect comma, found ')'
(2656,1): run-time error CSS1019: Unexpected token, found '}'
(3232,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(3233,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(3338,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3339,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3340,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3349,45): run-time error CSS1039: Token not allowed after unary operator: '-rotateY'
(3349,69): run-time error CSS1039: Token not allowed after unary operator: '-rotateX'
(3349,96): run-time error CSS1039: Token not allowed after unary operator: '-translateZ'
(3350,37): run-time error CSS1039: Token not allowed after unary operator: '-rotateY'
(3350,61): run-time error CSS1039: Token not allowed after unary operator: '-rotateX'
(3350,88): run-time error CSS1039: Token not allowed after unary operator: '-translateZ'
(3362,17): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3367,17): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3374,17): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3381,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(3382,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(3391,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(3392,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(3405,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(3406,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(3415,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(3416,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(3578,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(3579,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(3982,17): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(3987,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(4263,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(4265,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(4606,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(4607,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
 */
@media print {
    .no-print, .no-print * {
        display: none !important;
    }
}

html {
    background-color: #EBEAE8;
    margin: 0;
    padding: 0;
}

body {
    background-color: #fff;
    border-top: solid 10px #fff;
    color: #333;
    font-size: .85em;
    font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
}

html, body {
    height: 100%;
    display: flex;
    flex-direction: column;
}

#body {
    flex: 1;
}

a {
    color: #333;
    outline: none;
    padding-left: 3px;
    padding-right: 3px;
    text-decoration: underline;
}

    a:link, a:visited,
    a:active, a:hover {
        color: #333;
    }

    a:hover {
        background-color: #c7d1d6;
        opacity: 0.7;
    }

    a.site-logo {
        background: url("Images/Portico/Branding/CampusIvy_PoweredByLRG.svg") no-repeat top left;
        display: block;
        width: 250px; /**/
        height: 70px; /**/
        text-indent: -9999px; /* hides the link text */
    }



header, footer, hgroup,
nav, section {
    display: block;
}

mark {
    background-color: #a6dbed;
    padding-left: 5px;
    padding-right: 5px;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.clear-fix:after {
    content: ".";
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
}

h1, h2, h3,
h4, h5, h6 {
    color: #000;
    margin-bottom: 0;
    padding-bottom: 0;
}

h1 {
    font-size: 2em;
}

h2 {
    font-size: 1.75em;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

    h5 a:link, h5 a:visited, h5 a:active {
        /*padding: 0;*/
        text-decoration: none;
    }


/* main layout
----------------------------------------------------------*/
.required::after {
    content: " *";
    font-weight: bold;
}

.content-wrapper {
    margin: 0 auto;
    max-width: 1280px;
}

#body {
    background-color: #EBEAE8;
    clear: both;
    padding-bottom: 35px;
}

.main-content {
    /* background: url("../Content/Images/accent.png") no-repeat;*/
    padding-left: 10px;
    padding-top: 20px;
}

.featured + .main-content {
    /*background: url("../Content/Images/heroAccent.png") no-repeat;*/
}

header .content-wrapper {
    padding-top: 20px;
}

footer {
    clear: both;
    background-color: #CECCCA;
    font-size: .8em;
    height: 100px;
}


/* site title
----------------------------------------------------------*/
.site-title {
    color: #c8c8c8;
    font-family: Rockwell, Consolas, "Courier New", Courier, monospace;
    font-size: 2.3em;
    margin: 0;
}

    .site-title a, .site-title a:hover, .site-title a:active {
        background: none;
        color: #c8c8c8;
        outline: none;
        text-decoration: none;
    }


/* login
----------------------------------------------------------*/
#login {
    display: block;
    font-size: .85em;
    margin: 0 0 10px;
    text-align: right;
}

    #login a {
        background-color: #d3dce0;
        margin-left: 10px;
        margin-right: 3px;
        padding: 2px 3px;
        text-decoration: none;
    }

        #login a.username {
            background: none;
            margin: 0;
            padding: 0;
            text-decoration: underline;
        }

    #login ul {
        margin: 0;
    }

    #login li {
        display: inline;
        list-style: none;
    }


/* menu
----------------------------------------------------------*/
ul#menu {
    font-size: 1.3em;
    font-weight: 600;
    margin: 0 0 5px;
    padding: 0;
    text-align: right;
}

    ul#menu li {
        display: inline;
        list-style: none;
        padding-left: 15px;
    }

        ul#menu li a {
            background: none;
            color: #999;
            text-decoration: none;
        }

            ul#menu li a:hover {
                color: #333;
                text-decoration: none;
            }


/* page elements
----------------------------------------------------------*/
/* featured */
.featured {
    background-color: #fff;
}

    .featured .content-wrapper {
        background-color: #7ac0da;
        background-image: -ms-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        background-image: -o-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #7ac0da), color-stop(1, #a4d4e6));
        background-image: -webkit-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        background-image: linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        color: #3e5667;
        padding: 20px 40px 30px 40px;
    }

    .featured hgroup.title h1, .featured hgroup.title h2 {
        color: #fff;
    }

    .featured p {
        font-size: 1.1em;
    }

/* page titles */
hgroup.title {
    margin-bottom: 10px;
}

    hgroup.title h1, hgroup.title h2 {
        display: inline;
    }

    hgroup.title h2 {
        font-weight: normal;
        margin-left: 3px;
    }

/* features */
section.feature {
    width: 300px;
    float: left;
    padding: 10px;
}

/* ordered list */
ol.round {
    list-style-type: none;
    padding-left: 0;
}

    ol.round li {
        margin: 25px 0;
        padding-left: 45px;
    }

        ol.round li.zero {
            background: url("../Content/Images/orderedList0.png") no-repeat;
        }

        ol.round li.one {
            background: url("../Content/Images/orderedList1.png") no-repeat;
        }

        ol.round li.two {
            background: url("../Content/Images/orderedList2.png") no-repeat;
        }

        ol.round li.three {
            background: url("../Content/Images/orderedList3.png") no-repeat;
        }

        ol.round li.four {
            background: url("../Content/Images/orderedList4.png") no-repeat;
        }

        ol.round li.five {
            background: url("../Content/Images/orderedList5.png") no-repeat;
        }

        ol.round li.six {
            background: url("../Content/Images/orderedList6.png") no-repeat;
        }

        ol.round li.seven {
            background: url("../Content/Images/orderedList7.png") no-repeat;
        }

        ol.round li.eight {
            background: url("../Content/Images/orderedList8.png") no-repeat;
        }

        ol.round li.nine {
            background: url("../Content/Images/orderedList9.png") no-repeat;
        }

/* content */
article {
    float: left;
    width: 70%;
}

aside {
    float: right;
    width: 25%;
}

    aside ul {
        list-style: none;
        padding: 0;
    }

        aside ul li {
            background: url("../Content/Images/bullet.png") no-repeat 0 50%;
            padding: 2px 0 2px 20px;
        }

.label {
    font-weight: 700;
}

/* login page */

#loginForm {
    border-right: solid 2px #c8c8c8;
    float: left;
    background: white;
    background-position: right;
    background-size: 841px;
    background-repeat: no-repeat;
    width: 100%;
    border-width: 2px;
    border-color: #e5e9e000;
    border-style: solid;
    border-radius: 6px;
}

    #loginForm .validation-error {
        display: block;
        margin-left: 15px;
    }

    #loginForm .validation-summary-errors ul {
        margin: 0;
        padding: 0;
    }

    #loginForm .validation-summary-errors li {
        display: inline;
        list-style: none;
        margin: 0;
    }

    #loginForm input {
        width: 250px;
        border: solid 1px #f4ecec;
        border-radius: 6px;
        padding: 2%;
    }

        #loginForm input[type="checkbox"],
        #loginForm input[type="submit"],
        #loginForm input[type="button"],
        #loginForm button {
            width: auto;
        }

#socialLoginForm {
    margin-left: 40px;
    float: left;
    width: 40%;
}

    #socialLoginForm h2 {
        margin-bottom: 5px;
    }

#socialLoginList button {
    margin-bottom: 12px;
}

#logoutForm {
    display: inline;
}

/* contact */
.contact h3 {
    font-size: 1.2em;
}

.contact p {
    margin: 5px 0 0 10px;
}

.contact iframe {
    border: 1px solid #333;
    margin: 5px 0 0 10px;
}

/* forms */
fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

    fieldset legend {
        display: none;
    }

    fieldset ol {
        padding: 0;
        list-style: none;
    }

        fieldset ol li {
            padding-bottom: 5px;
        }

label {
    display: block;
    font-size: 1.2em;
    font-weight: 600;
}

    label.checkbox {
        display: inline;
    }

input, textarea {
    border: 1px solid #EBEAE8;
    background: #fff;
    color: #333;
    font-size: 1.2em;
    margin: 5px 0 6px 0;
    padding: 5px;
    width: 300px;
}

    input.readonly {
        color: #aaa;
        cursor: default;
        background-color: #eee;
    }


textarea {
    font-family: inherit;
    width: 500px;
}

    input:focus, textarea:focus {
        border: 1px solid #7ac0da;
    }

    input:disabled, textarea:disabled {
        background: #ddd;
        color: #aaa;
    }

input[type="checkbox"] {
    background: transparent;
    border: inherit;
    width: auto;
}

input[type="radio"] {
    background: transparent;
    border: inherit;
    width: auto;
}

input[type="submit"],
input[type="button"],
button {
    background-color: #d3dce0;
    border: 1px solid #787878;
    cursor: pointer;
    font-size: 1.2em;
    font-weight: 600;
    padding: 7px;
    margin-right: 8px;
    width: auto;
}

td input[type="submit"],
td input[type="button"],
td button {
    font-size: 1em;
    padding: 4px;
    margin-right: 4px;
}

/* info and errors */
.message-info {
    border: 1px solid;
    clear: both;
    padding: 10px 20px;
}

.message-error {
    clear: both;
    color: #e80c4d;
    font-size: 1.1em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.message-success {
    color: #7ac0da;
    font-size: 1.3em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.error {
    color: #e80c4d;
}

/* styles for validation helpers */
.field-validation-error {
    color: #e80c4d;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}


/* tables
----------------------------------------------------------*/

table {
    border-radius: 4px;
    border-collapse: separate;
    border-spacing: 0;
    margin-top: 0.75em;
    border: 0 none;
    /*overflow: auto;*/
    overflow: hidden;
}

th {
    font-size: 1.2em;
    text-align: left;
    border: none 0px;
    padding-left: 0;
}

    th a {
        display: block;
        position: relative;
    }

        th a:link, th a:visited, th a:active, th a:hover {
            color: #333;
            font-weight: 600;
            text-decoration: none;
            padding: 0;
        }

        th a:hover {
            color: #000;
        }

    th.asc a, th.desc a {
        margin-right: .75em;
    }

        th.asc a:after, th.desc a:after {
            display: block;
            position: absolute;
            right: 0em;
            top: 0;
            font-size: 0.75em;
        }

        th.asc a:after {
            content: '▲';
        }

        th.desc a:after {
            content: '▼';
        }

td {
    padding: -1.75em 2em 0.25em 0em;
    border: 0 none;
}

tr.pager td {
    padding: 0 0.25em 0 0;
}


/********************
*   Mobile Styles   *
********************/
@media only screen and (max-width: 850px) {

    /* header
    ----------------------------------------------------------*/
    header .float-left,
    header .float-right {
        float: none;
    }

    /* logo */
    header .site-title {
        margin: 10px;
        text-align: center;
    }

    /* login */
    #login {
        font-size: .85em;
        margin: 0 0 12px;
        text-align: center;
    }

        #login ul {
            margin: 5px 0;
            padding: 0;
        }

        #login li {
            display: inline;
            list-style: none;
            margin: 0;
            padding: 0;
        }

        #login a {
            background: none;
            color: #999;
            font-weight: 600;
            margin: 2px;
            padding: 0;
        }

            #login a:hover {
                color: #333;
            }

    /* menu */
    nav {
        margin-bottom: 5px;
    }

    ul#menu {
        margin: 0;
        padding: 0;
        text-align: center;
    }

        ul#menu li {
            margin: 0;
            padding: 0;
        }


    /* main layout
    ----------------------------------------------------------*/
    .main-content,
    .featured + .main-content {
        background-position: 10px 0;
    }

    .content-wrapper {
        padding-right: 10px;
        padding-left: 10px;
    }

    .featured .content-wrapper {
        padding: 10px;
    }

    /* page content */
    article, aside {
        float: none;
        width: 100%;
    }

    /* ordered list */
    ol.round {
        list-style-type: none;
        padding-left: 0;
    }

        ol.round li {
            padding-left: 10px;
            margin: 25px 0;
        }

            ol.round li.zero,
            ol.round li.one,
            ol.round li.two,
            ol.round li.three,
            ol.round li.four,
            ol.round li.five,
            ol.round li.six,
            ol.round li.seven,
            ol.round li.eight,
            ol.round li.nine {
                background: none;
            }

    /* features */
    section.feature {
        float: none;
        padding: 10px;
        width: auto;
    }

        section.feature img {
            color: #999;
            content: attr(alt);
            font-size: 1.5em;
            font-weight: 600;
        }

    /* forms */
    input {
        width: 90%;
    }

    /* login page */
    #loginForm {
        border-right: none;
        float: none;
        width: auto;
    }

        #loginForm .validation-error {
            display: block;
            margin-left: 15px;
        }

    #socialLoginForm {
        margin-left: 0;
        float: none;
        width: auto;
    }


    /* footer
    ----------------------------------------------------------*/
    footer .float-left,
    footer .float-right {
        float: none;
    }

    footer {
        text-align: center;
        height: auto;
        padding: 10px 0;
    }

        footer p {
            margin: 0;
        }
}

/************************ Custom Style **************************************************************/

/******************** ADMINISTRATION DASHBOARD **************************/

.Successful {
    background-color: limegreen !important;
}

.SuccessfulText {
    color: #00856F;
    font-weight: bold;
}

.Successful_transition {
    background-color: #00856F !important;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.bgGray {
    background-color: gray;
}

.AddForm input, .EditForm input {
    width: auto;
}

.AddForm label, .EditForm label {
    display: inline;
}

.AddForm table, .EditForm table {
    display: inline;
}

.Section .Header {
    display: inline;
    width: 75%;
}

.Section .AddButtonWrapper {
    display: inline-block;
    width: 25%;
    text-align: right;
}

.SchoolHomePage .SchoolWork {
    display: inline-block;
    /*width:70%;*/
}

.SchoolHomePage .SchoolMisc {
    display: inline-block;
    /*width:23% ;*/
}

.ObjectList {
    width: 100%;
    border-top: solid 2px #c8c8c8;
}

    .ObjectList .ActionLinks {
        text-align: right;
        cursor: pointer;
    }

    .ObjectList tr:hover {
        background-color: #00856F;
    }

    .ObjectList td, .ObjectList th {
        padding: 2px;
    }

.hilite {
    background-color: #00856F !important;
    font-weight: bolder;
}

.SideBySideView .Left, .SideBySideView .Right {
    display: inline-block;
    vertical-align: top;
}

.SideBySideView .Left {
    width: 60%;
}

.SideBySideView .Right {
    width: 93%;
}

.BorderRight {
    border-right: solid 2px #c8c8c8;
}

.BorderLeft {
    border-left: solid 2px #c8c8c8;
}

.BorderTop {
    border-top: solid 2px #c8c8c8;
}

.BorderBottom {
    border-bottom: solid 2px #c8c8c8;
}

.NoBorder {
    border: 0 !important;
}

#AdminPortal_SchoolList {
    float: left;
    width: 100%;
    margin-right: 25px;
}

    #AdminPortal_SchoolList .list {
        border-top: solid 2px #c8c8c8;
    }

    #AdminPortal_SchoolList .School {
    }

        /*#AdminPortal_SchoolList h2 {
        display:inline-block;
        width:75%;
    }

    #AdminPortal_SchoolList .AddButtonWrapper {
        display:inline-block;
        width:25%;
        text-align:right;
    }*/

        #AdminPortal_SchoolList .School .ContactInfo {
            /*border-right: solid 2px #c8c8c8;*/
            display: inline-block;
            width: 40%;
            margin-right: 25px;
            margin-bottom: 25px;
        }

            #AdminPortal_SchoolList .School .ContactInfo .Name {
                font-weight: bold;
            }

    #AdminPortal_SchoolList .list .Highlights {
        display: inline-block;
        width: 20%;
    }

    #AdminPortal_SchoolList .list .ActivityStream {
        display: inline-block;
        width: 20%;
    }

#AdminPortal_School_Users .list {
    border-top: solid 2px #c8c8c8;
}

/*#AdminPortal_School_Users h3 {
        display:inline-block;
        width:75%;
    }

    #AdminPortal_School_Users .AddButtonWrapper {
        display:inline-block;
        width:25%;
        text-align:right;
    }*/

#AdminPortal_School_Users #divUserProfileList section.UserProfile {
    margin-bottom: 20px;
}

    #AdminPortal_School_Users #divUserProfileList section.UserProfile .UserInfo {
        display: inline-block;
        width: 25%;
    }

    #AdminPortal_School_Users #divUserProfileList section.UserProfile .Misc {
        display: inline-block;
        width: 10%;
    }

.InActive {
    color: maroon;
    font-weight: bold;
    font-style: italic;
}

#AdminPortal_School_OPEIDs .OPEID .Misc span, #AdminPortal_School_OPEIDs .OPEID .Misc .label {
    width: 15%;
    display: inline-block;
}

#AdminPortal_School_OPEIDs .OPEID .Misc .label {
    font-size: 8pt !important;
    font-weight: bold;
}

#AdminPortal_School_OPEIDs .OPEID .LocationList {
    display: none;
}


.InstitutionEntityLocationList {
    width: 100%;
}

    .InstitutionEntityLocationList .Name {
        font-weight: bold;
    }

    .InstitutionEntityLocationList .Address, .InstitutionEntityLocationList .PhoneNo {
        font-size: xx-small;
    }

.SchoolConfiguration .tile, .SchoolWork .tile, .SchoolMisc .tile {
    display: inline-block;
    border: solid 2px #c8c8c8;
    width: 110px;
    text-align: center;
}

.SchoolHomePage .tilePlaceHolder {
    display: inline-block;
    border-color: transparent;
}

.SchoolConfiguration .UnderConstruction, .SchoolWork .UnderConstruction {
    background-color: gray;
}

.SchoolWork .tile {
}

.SchoolWork .tileX2 {
    /*width:408px;*/
}

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

.SchoolHomePage .WFHeader {
    font-size: 13px !important;
    font-weight: bold;
    width: 200px;
}

.SchoolHomePage .tile {
    /*opacity:0.6;*/
    cursor: pointer;
    border-radius: 0px;
}

    .SchoolHomePage .tile:hover {
        opacity: 0.9;
    }

    .SchoolHomePage .tile span {
        color: black;
        opacity: 1.0;
    }

.SchoolMisc .ul {
    margin: 0;
    padding: 0;
}

.SchoolHomePage .tile span {
    display: block;
}

.SchoolHomePage .tile .stat {
    font-size: large;
    display: inline;
    font-weight: bold;
}

.SchoolHomePage .tile .substat {
    font-size: small;
}

.SchoolHomePage .tile .label {
    font-size: small;
}

.EditForm fieldset {
    border: solid;
    border-width: 1px;
    margin: 0;
    padding: 5px;
}

    .EditForm fieldset legend {
        display: block;
    }

.width5px {
    width: 5px !important;
}

.width10px {
    width: 10px !important;
}

.width75px {
    width: 75px !important;
}

.width65px {
    width: 65px !important;
}

.width60px {
    width: 60px !important;
}

.width55px {
    width: 55px !important;
}

.width200px {
    width: 200px !important;
}

.width100px {
    width: 100px !important;
}

.width150px {
    width: 150px !important;
}

.width300px {
    width: 300px !important;
}

.width100percent {
    width: 100% !important;
}

.width90percent {
    width: 90% !important;
}

.width80percent {
    width: 80% !important;
}

.width75percent {
    width: 75% !important;
}

.width70percent {
    width: 70% !important;
}

.width66percent {
    width: 66% !important;
}

.width60percent {
    width: 60% !important;
}

.width50percent {
    width: 50% !important;
}

.width45percent {
    width: 45% !important;
}

.width40percent {
    width: 40% !important;
}

.width33percent {
    width: 33% !important;
}

.width15percent {
    width: 15% !important;
}

.width5percent {
    width: 5% !important;
}

.width10percent {
    width: 10% !important;
}

.width25percent {
    width: 25% !important;
}


.width75percent {
    width: 75% !important;
}

.width30percent {
    width: 30% !important;
}

.width40percent {
    width: 40% !important;
}

.width45percent {
    width: 40% !important;
}

.width20percent {
    width: 20% !important;
}

.width25px {
    width: 25px !important;
}

.width35px {
    width: 35px !important;
}

.width50px {
    width: 50px !important;
}

.width80px {
    width: 80px !important;
}

.width85px {
    width: 85px !important;
}

.widthAuto {
    width: auto !important;
}

.paddingTop10px {
    padding-top: 10px;
}

.paddingTop50px {
    padding-top: 50px;
}

.paddingTop75px {
    padding-top: 75px;
}

.paddingLeft10px {
    padding-left: 10px;
}

.paddingLeft10percent {
    padding-left: 10%;
}

.paddingLeft25percent {
    padding-left: 25%;
}

.paddingLeft35percent {
    padding-left: 35%;
}

.paddingLeft60percent {
    padding-left: 60%;
}

.paddingLeft2px {
    padding-left: 10px;
}


.paddingLeft20px {
    padding-left: 20px;
}

.paddingLeft10px {
    padding-left: 10px;
}


.paddingRight2px {
    padding-right: 2px;
    padding-left: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.padding2px {
    padding: 2px;
}

.padding5px {
    padding: 5px;
}

.padding10px {
    padding: 10px;
}

.padding20px {
    padding: 20px;
}

.padding0px {
    padding: 0px;
}


.alignRight {
    text-align: right;
}

.alignLeft {
    text-align: left;
}

.alignBottom {
    vertical-align: bottom;
}

.alignMiddle {
    vertical-align: middle !important;
}

.alignCenter {
    text-align: center;
}

.alignTop {
    vertical-align: top;
}

.alignMiddle {
    vertical-align: middle !important;
}

.underline {
    text-decoration: underline !important;
}

.GeneralFileImport .Step {
    width: 32%;
    height: 250px;
    display: inline-table;
    vertical-align: top
}

    .GeneralFileImport .Step .Note {
        font-size: .8em;
    }

.emphasis70em {
    font-size: .7em;
}


.emphasis75em {
    font-size: .75em;
}

.emphasis80em {
    font-size: .8em;
}

.emphasis90em {
    font-size: .9em;
}

.emphasis1_1em {
    font-size: 1.1em;
}

.emphasis1_4em {
    font-size: 1.4em;
}

.emphasis2_0em {
    font-size: 2em;
}

.k-grid-header th.k-header > .k-link {
    margin: 0px !important;
    padding: 0px !important;
    overflow: visible !important;
}

.k-header-column-menu {
    margin: 0px -12px 0px 0px !important;
    padding: 0px !important;
    top: 1px;
}

.StudentLookupCriteria fieldset {
    border: solid;
    border-width: 1px;
    margin: 0;
    padding: 5px;
}

    .StudentLookupCriteria fieldset legend {
        display: block;
    }


#secStudent {
    font-size: 24px;
    font-weight: bold;
}


.import_feedback {
    font-size: 0.7em;
    padding: 5px;
    background-position-y: 3px;
    background-size: 12px;
    padding-left: 25px;
    padding-bottom: 5px
    /*padding-top:2px;
      padding-bottom:2px;*/
}

.import_error {
    background: url('Images/red_x.png') no-repeat;
    background-size: 15px;
}

.import_warning {
    background: url('Images/yellow_caution.png') no-repeat;
    background-size: 15px;
}

.FileTemplateItem {
    background: url('../Content/Images/Bullets/bullet_red.gif') no-repeat;
    background-position-y: 3px;
    background-position-x: 15px;
    padding-left: 25px;
}

.listItem {
    background: url('../Content/Images/Bullets/bullet_red.gif') no-repeat;
    background-position-y: 3px;
    background-position-x: 3px;
    padding-left: 25px;
}

.feedback-fail {
    background-color: maroon;
}

.feedback-warning {
    background-color: yellow;
}

.feedback-success {
    background-color: limegreen;
}

.feedback-fail-text {
    color: maroon !important;
    font-weight: bold;
}

.feedback-warning-text {
    color: gold !important;
    font-weight: bold;
}

.feedback-success-text {
    color: limegreen !important;
    font-weight: bold;
}

.ActionLinks_ColumnHeader {
    width: 10%;
}

.ActionLinks_Column {
    text-align: right
}


.gradient_GreenToRed_LeftToRight {
    background: -webkit-linear-gradient(left, limegreen, red); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, limegreen, red); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, limegreen, red); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, limegreen, red); /* Standard syntax */
}

.StudentDocStatus_RECEIVED, .GeneralStatus_PENDING, .StudentImportStatus_IP, .DisbursementStatus_P, .TransmissionStatus_SUBMITTED, .TransmissionStatus_QUEUED, .QuestionStatus_IN_PROGRESS, .R2T4Status_Submitted, .R2T4Status_Rework, .R2T4Status_ExemptionRequested {
    background-color: yellow !important;
    opacity: 0.6;
    font-weight: bold;
    width: 5px;
}

.StudentDocStatus_APPROVED, .GeneralStatus_PROCESSED, .GeneralStatus_SUBMITTED, .GeneralStatus_COMPLETED, .StudentImportStatus_S, .DisbursementStatus_D, .TransmissionStatus_IMPORTED, .TransmissionStatus_RECEIVED, .TransmissionStatus_TRANSMITTED, .TransmissionStatus_NA, .QuestionStatus_ANSWERED, .R2T4Status_Approved {
    background-color: limegreen !important;
    opacity: 0.6;
    font-weight: bold;
    width: 5px;
}

.StudentDocStatus_REJECTED, .StudentDocStatus_NEEDED, .GeneralStatus_IN_PROGRESS, .StudentImportStatus_F, .DisbursementStatus_I, .TransmissionStatus_FAILED, .QuestionStatus_QUEUED, .R2T4Status_Pending {
    background-color: maroon !important;
    opacity: 0.6;
    font-weight: bold;
    width: 5px;
}

.ProcessingBatchRecordErrorStatus_IGNORE, .TransmissionStatus_HOLD, .R2T4Status_Exempted {
    background-color: black !important;
    opacity: 0.6;
    width: 5px;
}

.ProcessingBatchRecordErrorStatus_TRUE {
    background-color: maroon !important;
    opacity: 0.6;
    width: 5px;
}

.ProcessingBatchRecordWarningStatus_TRUE {
    background-color: yellow !important;
    opacity: 0.6;
    width: 5px;
}

.LocationAssignment_User {
    background-color: gray;
    height: 60px;
    padding: 2px;
    border-radius: 5px;
    margin-bottom: 5px;
}


    .LocationAssignment_User:hover {
        background-color: silver;
    }

.readOnlyTextBox {
    border: 0px;
    background-color: transparent;
    width: auto !important;
    margin: 0;
    padding: 0;
}

.textNoWrap {
    white-space: nowrap;
}

.icon_col {
    text-align: center;
    width: 20px;
}

.icon_10X10 {
    width: 10px;
    height: 10px;
}

    .icon_10X10:hover {
        width: 20px;
        height: 20px;
    }

.icon_20X20 {
    width: 20px;
    height: 20px;
}

    .icon_20X20:hover {
        width: 30px;
        height: 30px;
    }

.psuedolink {
    color: #333;
    outline: none;
    padding-left: 3px;
    padding-right: 3px;
    text-decoration: underline;
    cursor: pointer;
}


.DataGrid {
    border-collapse: collapse;
}

    /*.DataGrid td {
        border-width: 1px;
        border-color: #CECCCA*/ /*red*//*;
        border-style: solid;
    }*/

    .DataGrid td, .DataGrid th {
        border: 0.5px solid #CECCCA;
        padding: 4px 6px;
    }


    .DataGrid .FieldLabel {
        border: none;
        background-color: #96D7ED;
        vertical-align: top;
        /*padding:2px 5px 2px 5px;*/
        padding-left: 5px;
    }

    .DataGrid .FieldLabel2 {
        border: none;
        background-color: #99E3D7;
        vertical-align: top;
        /*padding:2px 5px 2px 5px;*/
        padding-left: 5px;
        font-weight: 700;
    }

    .DataGrid .Field {
        background-color: #fff;
        padding-left: 5px;
        /*padding:2px;
    margin:2px;*/
    }

.TabStripLabel {
    font-weight: bold;
    font-size: 10px;
    height: 21px;
    width: 30%;
    vertical-align: middle !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-radius: 7px !important;
    background-color: #bfbfbf !important;
    color: #424242 !important;
}

.TabStripField {
    font-size: 10px;
}

    .TabStripField select {
        width: 165px;
    }

.TabStripText {
    position: relative;
}

.TabStripInput {
    width: 155px;
}

.Region {
    border-color: silver !important;
}

.BorderStyle_Solid {
    border-style: solid !important;
}

.Opacity_White_90 {
    background: White;
    background: rgba(255,255,255,0.9);
}

.Opacity_White_80 {
    background: White;
    background: rgba(255,255,255,0.8);
}

.Opacity_White_70 {
    background: White;
    background: rgba(255,255,255,0.7);
}

.Opacity_White_60 {
    background: White;
    background: rgba(255,255,255,0.6);
}

.OPEIDContainer {
    width: 250px;
    display: inline-block;
    vertical-align: top;
    border-radius: 5px;
    margin-bottom: 20px;
}

    .OPEIDContainer .OPEID {
    }

    .OPEIDContainer .Location {
        padding: 1px;
    }

.wrappable {
    white-space: -o-pre-wrap;
    word-wrap: break-word;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
}

.ellipsis {
    white-space: nowrap !important;
    overflow: hidden !important;
    -webkit-line-clamp: 3;
    text-overflow: ellipsis !important;
    -o-text-overflow: ellipsis !important;
    -ms-text-overflow: ellipsis !important;
    cursor: pointer;
}

.ellipsis2 {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    -o-text-overflow: ellipsis !important;
    -ms-text-overflow: ellipsis !important;
    cursor: pointer;
}

    .ellipsis2:hover {
        white-space: normal !important;
        overflow: initial !important;
    }

.ellipsis_3lines {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    -o-text-overflow: ellipsis !important;
    -ms-text-overflow: ellipsis !important;
    line-height: 1em;
    height: 3em;
    cursor: pointer;
}

    .ellipsis_3lines:hover {
        white-space: normal !important;
        overflow: initial !important;
        line-height: 1em;
        height: auto;
    }

.ellipsis_2lines {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    -o-text-overflow: ellipsis !important;
    -ms-text-overflow: ellipsis !important;
    line-height: 1em;
    height: 2em;
    cursor: pointer;
}

    .ellipsis_2lines:hover {
        white-space: normal !important;
        overflow: initial !important;
        line-height: 1em;
        height: auto;
    }

.hide {
    display: none;
}

.show {
    display: normal;
}

.ISIR_ASSUMPTION {
}

.ISIR_HIGHLIGHT {
}

.ISIR_CORRECTION_CURRENT {
}

.ISIR_CORRECTION_PREVIOUS {
}

.LeftBorderHightlight_5Gray {
    border-left-width: 5px;
    border-left-style: solid;
}

.instructions {
    font-style: italic;
}

.rotate270 {
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg);
}

/* The overlay effect - lays on top of the container and over the image */
.overlay {
    position: fixed; /* Sit on top of the page content */
    display: none; /* Hidden by default */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.2); /* Black background with opacity */
    z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer; /* Add a pointer on hover */
}

.historyLogButtonIcon {
    /*background-image: url('Images/historyLogo.png');*/
    background-image: url('Images/icons-png/clock-black.png');
    background-size: 15px;
    background-repeat: no-repeat;
    background-position: center;
    width: 20px;
    height: 20px;
    text-decoration: none;
    border-radius: 50%;
    transition: background-size 0.2s;
}

.isMasterIcon {
    /*background-image: url('Images/starLogo.png');*/
    background-image: url('Images/icons-png/star-black.png');
    /*background-size: 20px;*/
    background-repeat: no-repeat;
    background-position: center; /*
    /*width: 25px;
    height: 25px;
    text-decoration: none;
    border-radius: 50%;
    transition: background-size 0.2s;*/
}

.expandIcon {
    background-image: url('Images/icons-png/carat-d-black.png');
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
    width: 25px;
    height: 25px;
    text-decoration: none;
    border-radius: 50%;
    transition: background-size 0.2s;
}

.collapseIcon {
    background-image: url('Images/icons-png/carat-u-black.png');
    /*    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
    width: 25px;
    height: 25px;
    text-decoration: none;
    border-radius: 50%;
    transition: background-size 0.2s;*/
}

.collapseIcon {
    background-image: url('Images/icons-png/carat-u-black.png');
    /*    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
    width: 25px;
    height: 25px;
    text-decoration: none;
    border-radius: 50%;
    transition: background-size 0.2s;*/
}

.checkBlackIcon {
    background-image: url('Images/icons-png/check-black.png');
    /*    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
    width: 25px;
    height: 25px;
    text-decoration: none;
    border-radius: 50%;
    transition: background-size 0.2s;*/
}

/*Created stop display defs History*/
.blackEyeIcon {
    background-image: url('Images/icons-png/eye-black.png');
    /*    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
    width: 25px;
    height: 25px;
    text-decoration: none;
    border-radius: 50%;
    transition: background-size 0.2s;*/
}

.searchCriteriaDiv {
    padding: 25px;
    max-height: 30%;
    font-size: .85em;
}

.searchCriteriaPanel {
    padding: 10px;
    font-size: .8em;
    max-width: 30%;
}

.searchCriteriaRow {
    margin: 0px !important;
    display: flex;
}

.searchCriteriaItemGroup {
    padding: 10px 20px 20px 20px;
    width: 280px;
    margin: 0px !important;
}

    .searchCriteriaItemGroup .dateRangeFilter {
        display: inline-flex;
        align-items: baseline;
    }

.k-dialog .k-content, .k-dialog .k-window-content, .k-dialog .k-dialog-content {
    white-space: pre-wrap
}

.k-dialog .k-window-actions.k-dialog-actions {
    display: none;
}

.k-dialog .k-window-titlebar, .k-dialog .k-dialog-titlebar, .k-dialog .k-header {
    background-color: silver;
    text-align: center;
}

.k-dialog div > .k-button {
    border-radius: 0;
    border-color: #dbdbdb;
    color: #000;
    background-color: #fff;
    background-position: 50% 50%;
}

    .k-dialog div > .k-button:hover {
        color: #fff;
        border-color: #4E4A46;
        background-color: #4E4A46;
    }

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url('truetype/MaterialIcons-Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'Material Icons Two Tone';
    font-style: normal;
    font-weight: 400;
    src: url('truetype/MaterialIconsTwoTone-Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'Material Icons Outlined';
    font-style: normal;
    font-weight: 400;
    src: url('truetype/MaterialIcons-Outlined.woff2') format('woff2');
}

.material-icons {
    font-family: 'Material Icons Outlined';
    font-weight: normal;
    color: #424A46; /*!important;*/
    font-style: normal;
    font-size: 22px; /*Preferred icon size*/
    display: inline-block;
    line-height: 1;
    vertical-align: sub;
    text-transform: none;
    text-decoration: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    Support for all WebKit browsers. -webkit-font-smoothing: antialiased;
    Support for Safari and Chrome. text-rendering: optimizeLegibility;
    Support for Firefox. -moz-osx-font-smoothing: grayscale;
    Support for IE. font-feature-settings: 'liga';
}

.material-buttons {
    font-family: 'Material Icons Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px; /*Preferred icon size*/
    color: #424A46; /*!important;*/
    border-color: lightgray !important;
    display: inline-block;
    line-height: 1;
    vertical-align: sub;
    text-transform: none;
    text-decoration: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    Support for all WebKit browsers. -webkit-font-smoothing: antialiased;
    Support for Safari and Chrome. text-rendering: optimizeLegibility;
    Support for Firefox. -moz-osx-font-smoothing: grayscale;
    Support for IE. font-feature-settings: 'liga';
}


.material-images {
    font-family: 'Material Icons Outlined';
    font-weight: 400;
    font-style: normal;
    font-size: 34px; /*Preferred icon size*/
    color: #00856F; /*!important;*/
    /*text-shadow: 0px 0px 0px #000;*/
    display: inline-block;
    line-height: 1;
    vertical-align: sub;
    text-transform: none;
    text-decoration: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    Support for all WebKit browsers. -webkit-font-smoothing: antialiased;
    Support for Safari and Chrome. text-rendering: optimizeLegibility;
    Support for Firefox. -moz-osx-font-smoothing: grayscale;
    Support for IE. font-feature-settings: 'liga';
    cursor: not-allowed
}

.material-icons-two-tone {
    font-family: 'Material Icons Two Tone';
    font-weight: bolder;
    font-style: normal;
    color: #424A46; /*!important;*/
    font-size: 18px;
    display: inline-block;
    line-height: 1;
    vertical-align: sub;
    letter-spacing: normal;
    text-transform: none;
    text-decoration: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

.widgetHeadingHolder {
    background: #FFFFFF;
    border-radius: 5px;
    width: 250px;
    height: 28px;
    text-align: center;
    position: relative;
    top: 45px;
}

.widgetActionsButtonHolder {
    background: rgb(255 255 255);
    border-radius: 7px;
    float: right;
    padding-right: 10px;
    padding-left: 10px;
    border-spacing: 5px;
    border-collapse: initial;
}

.Iconcolor {
    color: #424A46 !important;
    font-size: 24px;
    cursor: pointer;
}

    .Iconcolor:hover {
        background: none;
    }

.Iconcolorclass {
    font-family: 'Material Icons Two Tone';
    color: #424A46 !important;
    font-size: 24px;
    text-shadow: 0px 0px 0px #999;
}

    .Iconcolorclass:hover {
        background: #cbf743d1;
    }




.removeHighlight {
}

    .removeHighlight:hover {
        background-color: none !important;
    }

.Iconcolor3 {
    color: #cbf743d1;
    font-size: 28px;
    text-shadow: 0px 0px 0px #000;
    cursor: not-allowed;
}

.widgetDoc {
    background: white;
    border-radius: 5px;
    margin-left: 0;
    position: relative;
    height: 34px;
    width: 176px;
    left: 87%;
    align-items: flex-end;
    top: 3px;
}


.colorChange {
}

    .colorChange:hover {
        background: none;
    }


.widgetIsir {
    background: white;
    border-radius: 7px;
    margin-left: 2px;
    position: relative;
    left: 73%;
    align-items: flex-end;
    height: 40px;
    padding-bottom: 10px;
    font-size: 13px;
    font-weight: 400;
    padding-left: 10px;
}

.widgetIsir2 {
    background: white;
    border-radius: 7px;
    margin-left: 2px;
    position: relative;
    left: 0;
    align-items: flex-end;
    height: 20px;
    padding-bottom: 10px;
    font-size: 13px;
    font-weight: 400;
    color: blue
}


.widget22 {
    background: white;
    border-radius: 5px;
    margin-left: 33px;
    position: relative;
    left: 67%;
    align-items: flex-end;
    height: 42px;
    padding-bottom: 10px;
    font-size: 13px;
    font-weight: 400;
    padding-left: 10px;
}



.contactInfoWidget {
    background: #FFFFFF;
    border-radius: 5px;
    width: 250px;
    height: 28px;
    text-align: center;
    left: 7px;
}

.inboxWidget {
    background: white;
    border-radius: 4px;
    text-align: center;
    float: right;
    /*border: solid 1px #cae9f4;*/
    top: -0.5pc;
    width: 41%;
    padding: 1%;
}

.StudentInfoWidget {
    background: white;
    border-radius: 7px;
    width: 87%;
    float: left;
    margin: 9%;
    margin-top: 7px;
    margin-left: 0px;
    position: relative;
    font-weight: 400;
    text-align: left;
    /*border: solid 1px #42a5fe;*/
}

.DisbursementsWidget {
    background: white;
    border-radius: 7px;
    margin: 9%;
    margin-top: 0;
    margin-left: -3px;
    text-align: left;
}


.enrollmentInfoDiv {
    background: white;
    border-radius: 7px;
    width: 100%;
    margin-top: 7px;
    position: relative;
    font-weight: 400;
    text-align: left;
    /*padding-bottom: 2%;*/
}

.buttonStyle {
    background: white;
    border-radius: 7px;
    margin-top: 7px;
    position: relative;
    font-weight: 400;
    text-align: left;
    padding-bottom: 2%;
}

.buttonStyleBasic {
    background: white;
    border-radius: 4px;
    margin-top: 7px;
    padding-bottom: 2%;
    border: solid 1px #b09468;
    font-size: .9em;
    font-weight: 700 !important;
}

.Awardbutton {
    background: white;
    width: 19%;
}

.DisbursementTableDiv {
    background: white;
    border-radius: 22px;
    width: 98%;
    position: relative;
    font-weight: 400;
    text-align: left;
    padding-bottom: 3%;
    padding-left: 1%;
    padding-right: 3%;
    padding-top: 1%;
}

.buttonWidget {
    background: white;
    border-radius: 5px;
    width: 120px;
    height: 20px;
    float: left;
    margin: 110px;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 5px;
    margin-left: 0px;
}

.PackagingTable {
    text-align: left;
    font-weight: 100;
    height: 26px;
    margin-top: 0px;
    margin: 0;
    width: 100%;
    font-weight: 600;
    color: #003346;
}

.DocumentTrackingTable {
    text-align: center;
    font-weight: 100;
    background: white;
    height: 26px;
    margin-top: 0px;
    margin: 10px;
    width: 100%;
    font-weight: 600;
    text-align: left;
    font-size: 13.88px;
    color: #003346;
}


.ReferenceTable {
    align-content: flex-start;
    text-align: center;
    font-weight: 400;
    background: none;
    width: 100%;
    text-align: center;
    position: relative;
    right: 120px;
    font-weight: 600;
    font-size: 10.88px;
    color: #003346;
}

.CodResponseTable {
    align-content: flex-start;
    background: none;
    width: 100%;
    position: relative;
    right: -1%;
    font-weight: 600;
    font-size: 10.88px;
}

.AddDocTable {
}

    .AddDocTable:hover {
        background-color: none;
    }

.awardLetterListHeading {
    background: #FFFFFF;
    border-radius: 5px;
    width: 250px;
    height: 28px;
    text-align: center;
    left: 7px;
    width: 100%;
    font-size: 13px;
    padding: 5px;
    position: relative;
    left: -575px;
    top: 26px;
    font-weight: 400
}

.awardLetterListButton {
    left: 7px;
    border-radius: 5px;
    width: 123px;
    height: 28px;
    text-align: center;
    left: 59px;
    position: relative;
    top: -6px;
    font-size: 9.88px;
}

.PnNoTesHeading {
    border-radius: 5px;
    height: 28px;
    text-align: center;
    width: 100%;
    font-size: 13px;
    padding: 5px;
    position: relative;
    top: 12px;
    font-weight: 400
}

.CodResponseHeading {
    border-radius: 5px;
    height: 28px;
    text-align: center;
    width: 100%;
    font-size: 13px;
    padding: 5px;
    position: relative;
    left: -532px;
    top: 0px;
    font-weight: 400
}

.SubUsageHeading {
    border-radius: 5px;
    height: 28px;
    text-align: center;
    width: 100%;
    font-size: 13px;
    padding: 5px;
    position: relative;
    left: -549px;
    top: 0px;
    font-weight: 400
}

.CreditStatusHeading {
    background: #FFFFFF;
    border-radius: 5px;
    width: 250px;
    height: 28px;
    text-align: center;
    left: 7px;
    width: 100%;
    font-size: 13px;
    padding: 5px;
    position: relative;
    left: -506px;
    top: 0px;
    font-weight: 400
}

.CreditStatus {
    border-radius: 5px;
    height: 28px;
    text-align: center;
    width: 100%;
    font-size: 13px;
    padding: 5px;
    position: relative;
    left: -503px;
    top: 14px;
    font-weight: 400
}

.IBListHeading {
    border-radius: 5px;
    height: 28px;
    text-align: center;
    width: 100%;
    font-size: 13px;
    padding: 5px;
    position: relative;
    left: -557px;
    top: 14px;
    font-weight: 400
}

.Test2 {
    font-size: 28px;
    color: #00856f;
    font-weight: 300;
    text-shadow: -1px 0px 0px #cdff33;
}

    .Test2:hover {
        color: #14835a;
    }

.backGroundColor {
    background-color: white;
    border: solid 1px #eeeeee !important;
    box-shadow: 1px 0.1pc 0.6pc #c3bcbcab;
}

.notificationTableIcon {
    text-align: center;
    font-weight: 100;
    background: white;
    height: 24px;
    width: 24px;
    color: #424A46;
    font-size: 22px;
    border-color: #f0eff1;
}

    .notificationTableIcon:hover {
        background: #cbf743d1;
    }

.notificationTable {
    text-align: center;
    font-weight: 100;
    height: 26px;
    margin-top: 0px;
    margin: 10px;
    width: 80px;
    font-weight: 600;
    color: #003346;
}

.notificationWidget {
    background: #FFFFFF;
    border-radius: 5px;
    width: 10px;
    height: 20px;
    float: left;
    text-align: center;
    opacity: 0.89;
    margin-top: 0px;
    margin-bottom: 3px;
}

.ColumnNames {
    font-size: 10px;
    font-weight: 500;
    position: center;
    padding-left: 30px;
    padding-bottom: 10px;
}

.AwardsTable {
    text-align: center;
    font-weight: 100;
    height: 26px;
    margin-top: 0px;
    width: 100%;
    font-weight: 600;
    color: #003346;
}

.contactInformationWidget {
    background: #FFFFFF;
    border-radius: 5px;
    width: 250px;
    height: 28px;
    text-align: center;
    position: relative;
    top: 5px;
    font-weight: 700;
}

.hrTag {
    background-color: #00856F;
    width: 98%;
    height: 0.6px;
}

.StudentInfoSection {
    width: 34%;
    display: inline-block;
    vertical-align: top
}

.UserNotificationSection {
    width: 65%;
    display: inline-block;
    vertical-align: top;
    max-height: 170px;
}

.ContactInfoDiv {
    padding-bottom: 16px;
}

.ContactInfoSection {
    position: relative;
    left: -3px;
}

.AddresStyle {
    position: relative;
    top: -15px;
}

.AddressSpanStyle {
    font-weight: 300;
    position: relative;
    top: 13px;
    font-size: 15px;
}



.AddressListStyle {
    font-weight: 500;
    position: relative;
    top: 20px;
    left: -5px
}

.emailListSectionStyle {
    font-weight: 400;
    position: relative;
    left: 100%;
    font-size: 15px;
}

.EmaillListExpand {
    font-weight: 500;
    position: relative;
    left: 290px
}

.PhoneListStyle {
    position: relative;
    left: 440%;
    font-weight: 400;
    font-size: 15px;
}

}

.PhoneListExpandMore {
    font-weight: 500;
    position: relative;
    left: 620px
}

.OtherAddressSectionStyle {
    position: relative;
    right: -1%;
}

.OtherAddressSpanStyle {
    font-weight: 400;
    padding-bottom: 10px;
    font-size: 13px;
}

.OtherAddressHrStyle {
    width: 11%;
    position: relative;
    left: -570px;
}

.EnrollmentInfoHeading {
    /*background: linear-gradient(190deg, rgba(196,243,178) -135%, rgba(255,255,255,0.88) 82%, rgba(196,241,255) 116%);*/
    border-radius: 5px;
    width: 250px;
    height: 28px;
    text-align: center;
    color: #4e7c7c;
    position: relative;
    top: 53px;
}

.OtheremailListSectionStyle {
    position: relative;
    left: 543px;
}

.OtherEmailHrStyle {
    width: 27%;
    position: relative;
    left: -468px;
}

.OtherPhoneSectionStyle {
    position: relative;
    left: 82%;
}

.OtherPhoneSpanStyle {
    font-weight: 400;
    font-size: 13px;
}

.OtherPhoneHrStyle {
    width: 12%;
    position: relative;
    left: -565px;
}

.IsirHeadingStyle {
    background: #FFFFFF;
    border-radius: 5px;
    width: 250px;
    height: 28px;
    text-align: center;
    position: relative;
    top: 45px;
}

.AwardYearSmallTagStyle {
    font-size: 16px;
    font-weight: bold;
    padding-left: 20px;
    position: relative;
    left: 10px;
    text-align: center;
    top: 0px;
    color: #007be8
}

.AwardYearIcon {
    margin-right: .60em;
    margin-left: .60em;
}

.UploadNewFilesStyle {
    text-align: left;
    padding-bottom: 10px;
    font-size: 13px;
}

.UploadNewFilesSpanStyle {
    font-size: 15px;
    border-radius: 6px;
    background-color: unset
}

.UploadFilesIconBorderStyle {
    border-radius: 6px;
}

.DocIconStyle {
    color: #424A46 !important;
    font-size: 22px;
    text-shadow: 0px 0px 0px #999
}

.DocChangeHistoryIcon {
    color: #424A46;
    font-size: 22px;
    text-shadow: 0px 0px 0px #999;
}

.DocTrackingTableStyle {
    text-align: center;
    font-weight: 100;
    background: white;
    height: 26px;
    margin-top: 0px;
    margin: 10px;
    width: 100%;
    font-weight: 600;
    text-align: left;
    font-size: 13.88px;
    text-align: left;
    font-weight: bold;
    font-size: 13.88px;
}

.saveIconClass {
    border-radius: 7px;
    position: relative;
    left: 160%;
}

.CancelIconClass {
    border-radius: 7px;
    position: relative;
    left: 160%;
}

.blueIconClass {
    color: #424A46;
    font-size: 24px;
}

.DocUploadTdStyle {
    border-style: none;
    border-radius: 12px;
    border-width: thin;
    background-color: #ffffff;
    padding-bottom: 28px;
    box-shadow: 2px 3px 10px #888888;
    padding: 10px;
}

AddNeededDocTableStyle {
    position: relative;
    top: 34px;
}

.StudentDetailPartialViewStyle {
    position: relative;
    left: 10px;
    width: 99%;
    border: none
}

.CODResponsePNListPartialViewStyle {
    position: relative;
    left: 10px;
    width: 99%;
    border: none;
    position: relative;
    top: 9px;
}

.RefereneHistoryIcon {
    color: #424A46;
    font-size: 22px;
    text-shadow: -1px 0px 0px #dbdbdb
}

.ReferencesWidgetStyle {
    background: #FFFFFF;
    border-radius: 5px;
    width: 250px;
    height: 28px;
    text-align: center;
    left: 7px;
    width: 100%;
    font-size: 14px;
    padding: 3px;
    position: relative;
    left: -119px;
    top: 23px
}

.UnreadSpanStyle {
    position: relative;
    left: 2px;
    font-weight: 500;
    position: relative;
    top: 3px;
    font-size: 15px
}


.WhiteBackGroundSStyle {
    background-color: white;
}

.MiscallaneousTableStyle {
    position: relative;
    left: 12px;
    top: 11px;
}

.MiscallaneousButtonStyle {
    border: none;
    font-weight: 500;
    position: relative;
    left: 111px;
    height: 28px;
    font-weight: bold
}

.MiscTdStyle {
}

.IndexColumnNamesStyle {
    font-size: 10px;
    font-weight: 500;
    position: center;
    padding-left: 30px;
    padding-bottom: 10px;
}

.IndexnotificationTableStyle {
    text-align: center;
    font-weight: 100;
    height: 26px;
    margin-top: 0px;
    margin: 10px;
    width: 80px;
    font-weight: 600;
    text-align: center
}

.IndexnotificationTableIconStyle {
    text-align: center;
    font-weight: 100;
    background: white;
    height: 24px;
    width: 24px;
    color: #424A46;
    font-size: 22px;
    border-color: #f0eff1;
}

    .IndexnotificationTableIconStyle:hover {
        background: #cbf743d1;
    }

.IndexNotificationWidgetStyle {
    position: relative;
    right: -190px;
    top: -3px
}

IndexNotificationWidgetDivStyle {
    width: 75%;
    display: inline-block;
    vertical-align: top
}

.AwardLetterWidget {
    background: white;
    border-radius: 5px;
    margin-left: 0;
    position: relative;
    height: 34px;
    width: 7%;
    left: 93%;
    align-items: flex-end;
}


.HeaderFixedPositionStyle {
    height: 20px;
    color: black;
    position: sticky;
    top: 0;
}

.NotesWidgetStyle {
    border-radius: 5px;
    margin-left: 0;
    position: relative;
    height: 34px;
    width: 176px;
    left: 1116px;
    align-items: flex-end;
    text-align: center;
    position: relative;
    left: 1087px;
    top: -6px;
    width: 190px;
}

.tdNoteStyle {
    padding: -5.75em 2em 0.25em 0em;
    border: 0 none;
}


#Iconcolor {
    color: #424A46;
    font-size: 24px;
}

    #Iconcolor:hover {
        background: none;
    }

.ReferenceTableBackGroundColor {
}

.StudentSectionButtonPosition {
    position: relative;
    left: 78%;
    top: -18px;
}

.AwardWidget {
    background: #FFFFFF;
    border-radius: 5px;
    width: 210px;
    height: 24px;
    text-align: center;
    position: relative;
    left: 2%;
}


.disbursementAwardHeadingFormat {
    position: relative;
    /*left: -1px;*/
    /*top: 12px;*/
    padding: .5%
}

.DisbursementHeadingFormat {
    position: relative;
    left: -1%;
    top: 12px;
}

.DisbTransactionHeadingFormat {
    position: relative;
    left: 0%;
    top: 16px;
    width: 23% !important;
}

.isPaidHeading {
    position: relative;
    top: -6px;
    left: 0px;
}

.DisbursementButtonTableFormat {
    position: relative;
    left: 80%;
    top: -22px;
}

.DisbursemenntTransactionButtonFormat {
    position: relative;
    left: 58%;
    top: 7px
}

.StudentAwardEditButtonFormat {
    position: relative;
    left: 69%;
    top: -10px;
}

.createDisbursementButtonFormat {
    position: relative;
    left: 61%;
    top: 10px;
}

.noteWidget {
    background: #FFFFFF;
    border-radius: 5px;
    width: 120px;
    height: 28px;
    text-align: center;
    position: relative;
    left: 8px;
}



.NotesTable {
    text-align: center;
    font-weight: 100;
    height: 26px;
    margin-top: 0px;
    margin: 10px;
    width: 100%;
    font-weight: 600;
    color: #003346;
}



.dropdown {
    font-size: 9pt;
    width: 90%;
    color: black;
}

.awardButtonFormat {
    position: relative;
    left: 88%;
    top: -5px;
}

.notesTable {
    text-align: center;
    border-left-style: groove;
    background: white;
    height: 7px;
    color: black;
}

.NotesWidget {
    background: white;
    border-radius: 5px;
    margin-left: 0;
    position: relative;
    height: 34px;
    width: 176px;
    left: 1116px;
    align-items: flex-end;
}

.notseSectionFormat {
    padding: -5.75em 2em 0.25em 0em;
    border: 0 none;
}

.NotesPartialViewFomat {
    width: 100%;
    display: inline-block;
    vertical-align: top;
    max-height: 300px;
    max-width: 1400px;
    position: relative;
}

.k-button {
    cursor: pointer !important;
    border-radius: 8px !important;
}

.ContactInfoFormat {
    padding-right: 2%;
    padding-left: 7%;
    padding-top: 1%;
    width: 91%;
    position: relative;
    top: 23px;
}


.otherAddressFormat {
    display: block;
    width: 13%;
    padding-right: 1%;
    padding-left: 3%;
    padding-top: 1%;
}

.otherAddressHeader {
    color: #424A46;
    font-weight: bold;
    width: 73%;
    padding-bottom: 3%;
    padding-right: 1%;
    padding-left: 7%;
}

.otherEmailSection {
    display: block;
    width: 21%;
    padding-right: 1%;
    padding-left: 3%;
    padding-top: 1%;
}

.otherEmailHeader {
    color: #424A46;
    font-weight: bold;
    width: 70%;
    padding-left: 25%
}

.otherPhoneSection {
    display: block;
    width: 13%;
    padding-right: 1%;
    padding-left: 2%;
    padding-top: 1%;
}

.otherPhoneHeader {
    color: #424A46;
    font-weight: bold;
    width: 100%;
    padding-left: 1%
}

.gradientBackground {
    /*background: linear-gradient(190deg, rgba(196,243,178) -135%, rgba(255,255,255,0.88) 82%, rgba(196,241,255) 116%);*/
}

.awardYearText {
    font-size: 16px;
    font-weight: bold;
    padding-left: 20px;
    position: relative;
    left: 10px;
    text-align: center;
    top: 0px;
    color: #424A46
}

.searchPanelFormat {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: stretch;
    align-items: flex-start;
}

.searchBarWithIcon {
    box-sizing: border-box;
    border: none;
    border-bottom: 1px solid #ccc;
    font-size: 16px;
    background-color: none;
    outline: none;
    font-size: 12px;
}

.emailandPhoneNotification {
    font-style: initial;
    padding-left: 1%;
    padding-top: 1%;
    color: red;
    font-weight: 600;
}

.blink {
    animation: blink 3s infinite;
}

@keyframes blink {
    0% {
        color: yellow;
    }

    20% {
        color: black;
    }

    40% {
        color: yellow;
    }

    60% {
        color: black;
    }
}

.newButtonStyle {
    background-color: white !important;
    font-weight: bold !important;
    color: #232121 !important;
    height: 24px !important;
    cursor: pointer !important;
    border-radius: 7px;
    border: 1px solid #dbdbdb !important;
}

.clockIcon {
    content: url('Images/clock.png');
    height: 20px;
    width: 20px;
    display: -webkit-inline-box;
}

.chartIcon {
    content: url('Images/chart.png');
    height: 20px;
    width: 20px;
    display: -webkit-inline-box;
}

.menuNewItemIcon {
    content: url('Images/icons-png/playlist_add_black.png');
    height: 20px;
    width: 20px;
    display: -webkit-inline-box;
}

.boxes {
    height: 32px;
    width: 32px;
    position: relative;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    margin-top: 32px;
    -webkit-transform: rotateX(60deg) rotateZ(45deg) rotateY(0deg) translateZ(0px);
    transform: rotateX(60deg) rotateZ(45deg) rotateY(0deg) translateZ(0px);
}

    .boxes .box {
        width: 32px;
        height: 32px;
        top: 0px;
        left: 0;
        position: absolute;
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
    }



        .boxes .box:nth-child(1) {
            -webkit-transform: translate(100%, 0);
            transform: translate(100%, 0);
            -webkit-animation: box1 1s linear infinite;
            animation: box1 1s linear infinite;
        }

        .boxes .box:nth-child(2) {
            -webkit-transform: translate(0, 100%);
            transform: translate(0, 100%);
            -webkit-animation: box2 1s linear infinite;
            animation: box2 1s linear infinite;
        }

        .boxes .box:nth-child(3) {
            -webkit-transform: translate(100%, 100%);
            transform: translate(100%, 100%);
            -webkit-animation: box3 1s linear infinite;
            animation: box3 1s linear infinite;
        }

        .boxes .box:nth-child(4) {
            -webkit-transform: translate(200%, 0);
            transform: translate(200%, 0);
            -webkit-animation: box4 1s linear infinite;
            animation: box4 1s linear infinite;
        }



        .boxes .box > div {
            background: #5C8DF6;
            --translateZ: 15.5px;
            --rotateY: 0deg;
            --rotateX: 0deg;
            position: absolute;
            width: 100%;
            height: 100%;
            background: #5C8DF6;
            top: auto;
            right: auto;
            bottom: auto;
            left: auto;
            -webkit-transform: rotateY(var(--rotateY)) rotateX(var(--rotateX)) translateZ(var(--translateZ));
            transform: rotateY(var(--rotateY)) rotateX(var(--rotateX)) translateZ(var(--translateZ));
        }

            .boxes .box > div:nth-child(1) {
                top: 0;
                left: 0;
                /*background: linear-gradient(190deg, rgba(196,243,178) -135%, rgba(255,255,255,0.88) 82%, rgba(196,241,255) 116%);*/
            }

            .boxes .box > div:nth-child(2) {
                background: #89c2f3;
                right: 0;
                --rotateY: 90deg;
            }

            .boxes .box > div:nth-child(3) {
                background: #b1e383;
                --rotateX: -90deg;
            }

            .boxes .box > div:nth-child(4) {
                background: #DBE3F4;
                top: 0;
                left: 0;
                --translateZ: -90px;
            }





@keyframes box1 {
    0%, 50% {
        transform: translate(100%, 0);
    }

    100% {
        transform: translate(200%, 0);
    }
}

@keyframes box2 {
    0% {
        transform: translate(0, 100%);
    }

    50% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(100%, 0);
    }
}

@keyframes box3 {
    0%, 50% {
        transform: translate(100%, 100%);
    }

    100% {
        transform: translate(0, 100%);
    }
}

@keyframes box4 {
    0% {
        transform: translate(200%, 0);
    }

    50% {
        transform: translate(200%, 100%);
    }

    100% {
        transform: translate(100%, 100%);
    }
}

/* CID-6122 */
.studentNotificationCenterSearchInput {
    width: 200px !important;
}

.recentEnrollmentHeader {
    font-weight: 700;
    font-size: 12px;
}

.referenceAccessHeader {
    font-weight: 700;
    font-size: 12px;
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

    /* Hide default HTML checkbox */
    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #b6d768;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

.header {
    position: relative;
    text-align: center;
    color: white;
}

.logo {
    width: 50px;
    fill: white;
    padding-right: 15px;
    display: inline-block;
    vertical-align: middle;
}

.inner-header {
    height: 21vh;
    width: 100%;
    margin: 0;
    padding: 0;
    margin-bottom: -6%;
}

.flex { /*Flexbox for containers*/
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.waves {
    position: relative;
    width: 100%;
    height: 15vh;
    margin-bottom: -7px; /*Fix for safari gap*/
    min-height: 100px;
    max-height: 150px;
}

.content {
    position: relative;
    height: 20vh;
    text-align: center;
    background-color: white;
}

/* Animation */

.parallax > use {
    animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;
}

    .parallax > use:nth-child(1) {
        animation-delay: -2s;
        animation-duration: 7s;
    }

    .parallax > use:nth-child(2) {
        animation-delay: -3s;
        animation-duration: 10s;
    }

    .parallax > use:nth-child(3) {
        animation-delay: -4s;
        animation-duration: 13s;
    }

    .parallax > use:nth-child(4) {
        animation-delay: -5s;
        animation-duration: 20s;
    }

@keyframes move-forever {
    0% {
        transform: translate3d(-90px,0,0);
    }

    100% {
        transform: translate3d(85px,0,0);
    }
}
/*Shrinking for mobile*/
@media (max-width: 768px) {
    .waves {
        height: 40px;
        min-height: 40px;
    }

    .content {
        height: 30vh;
    }

    h1 {
        font-size: 24px;
    }
}

.container {
    width: 600px;
}

    .container::before, .row::before {
        display: table;
        content: " ";
    }

    .container::after, .row::after {
        clear: both;
        display: table;
        content: " ";
    }

.block-row {
}

.block-col {
    width: 50%;
    float: left;
    position: relative;
    min-height: 1px;
}

.block {
    width: 300px;
    height: 200px;
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
}

    .block .mask,
    .block .content {
        width: 300px;
        height: 200px;
        position: absolute;
        overflow: hidden;
        top: 0;
        left: 0;
    }

    .block div.block-slide-in {
        display: block;
        position: relative;
    }

    .block h2 {
        color: #00154d;
        text-align: center;
        position: relative;
        font-size: 20px;
    }

    .block p {
        font-size: 14px;
        position: relative;
    }

    .block a.info {
        display: inline-block;
        text-decoration: none;
        text-transform: uppercase;
        text-align: center;
        padding: 7px 14px;
        background: transparent;
        color: #fff;
        border: 1px solid #ffffff;
        font-size: 16px;
        position: absolute;
        left: 30%;
        top: 37%;
        width: auto;
    }

.block-slide-in div.description {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.block-slide-in .mask {
    /*background: linear-gradient(91deg, rgb(95 102 98 / 57%), rgb(14 33 85)) background !important;*/
    border-radius: 6px;
    box-shadow: 0px 12px 24px grey;
    -webkit-transform: translateX(-300px);
    -moz-transform: translateX(-300px);
    -o-transform: translateX(-300px);
    -ms-transform: translateX(-300px);
    transform: translateX(-300px);
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.block-slide-in:active .mask {
    box-shadow: 0px 12px 24px grey;
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -o-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
}

.block-slide-in:active div.description {
    -webkit-transform: translateX(300px);
    -moz-transform: translateX(300px);
    -o-transform: translateX(300px);
    -ms-transform: translateX(300px);
    transform: translateX(300px);
}

.grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
}


.loginPageDivFormat {
    background-position: bottom right;
    background-image: url(images/Portico/Branding/Portico_Pattern2-06-flip.jpg);
    background-size: 100% !important;
    background-repeat: no-repeat;
    /*box-shadow: 1px 1px 5px 1px #E56A54;*/
    padding: 10px;
    min-height: 530px;
}

.loginPageForm {
    padding: 4%;
    margin: 20px;
    background: #F6F6F6;
    border-radius: 4px;
    border: solid 1px #dbddd2;
}

    .loginPageForm label,
    .loginPageForm input,
    .loginPageForm p,
    .loginPageForm h3,
    .loginPageForm a {
        color: black !important;
    }

.loginiconStyle {
    font-size: 6em;
    margin-left: 9%;
    -webkit-text-fill-color: transparent;
}

.loginPageButton {
    background: #00856F;
    margin-left: 10%;
    font-weight: bold;
    color: white;
    width: 82% !important;
    text-align: revert;
}

.loginPageLabelText {
    background: white;
    margin-left: 10%;
    font-weight: bold;
    color: black;
    width: 82% !important;
    text-align: revert;
}

.loginPageLogoImage {
    height: 150px;
    background-image: url('Images/Portico/Branding/CampusIvy_PoweredByLRG.svg');
    background-size: contain; /* Ensures the whole image fits */
    background-repeat: no-repeat;
    background-position: center;
    display: block; /* Ensures it behaves properly */
}

.header {
    position: relative;
    text-align: left;
    background: none;
    color: white;
}

.app {
}

.with-tooltip {
    position: relative;
}

    .with-tooltip::after {
        content: attr(data-tooltip-content);
        padding: 8px;
        border-radius: 4px;
        position: absolute;
        color: white;
        bottom: 155%;
        right: 50%;
        left: 50%;
        font-weight: bold;
        width: max-content;
        background-color: gray !important;
        opacity: 0;
        font-size: 1.2em;
        visibility: hidden;
        transform: translate(-50%, 18px) scale(0.8);
        transition: visibility, opacity, transform 200ms;
    }

    .with-tooltip:hover::after {
        visibility: visible;
        opacity: 1;
        transform: translate(-50%, 0);
    }

.k-button.k-state-hover, .k-button:hover {
    color: #FFFFFF !important;
    border-color: #4E4A46 !important;
    background-color: #4E4A46 !important;
}

.k-header > .k-grid-filter, .k-header > .k-header-column-menu {
    float: right;
    margin: -0.5em -0.6em -0.4em 0;
    padding: 0.5em 0.2em 0.4em;
    position: relative;
    z-index: 7;
    color: inherit;
}

.k-header > .k-grid-filter, .k-header > .k-header-column-menu {
    /*z-index: 0 !important;*/
}

.DashboardGeneralNotesDiv {
    border-width: 1px;
    border-style: groove;
    opacity: 0.9;
    min-height: 180px;
    max-height: 673px;
    padding: 0px;
    overflow-x: auto;
    border-radius: 4px !important;
    background: white !important;
    width: 96% !important;
    margin-top: 1pc;
}

.DashboardGeneralNotesText {
    padding: 14px;
}

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

    .tooltip .tooltiptext {
        visibility: hidden;
        margin-left: -24px;
        position: absolute;
        width: 120px;
        color: black !important;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;
        top: 25%;
        z-index: 1;
        opacity: 0;
        transition: opacity .6s;
    }

.tooltip-right {
    top: -5px;
    left: 125%;
}

.tooltip-pending-right {
    top: -6px !important;
    left: 50px;
    width: 114px !important;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

.tooltip .tooltiptext::after {
    content: " ";
    position: absolute;
    top: 50%;
    right: 100%; /* To the left of the tooltip */
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #777777 transparent transparent;
}

.newItemIcon {
    background-image: url('../../Content/Images/icons-png/playlist_add_black.png');
    width: 100%;
    padding-right: 12px;
    padding-left: 11px;
    background-repeat: no-repeat;
}

.with-tooltip::after {
    left: -97%;
    font-size: .9em;
}

.k-stockchart, div.k-chart, div.k-gauge, span.k-sparkline {
    background-color: transparent;
    transform: scale(0.89);
}

.financialAnalysisDiv {
    display: flex;
    flex-direction: column;
    background: white;
    border: solid 1px #3b7a6e;
    text-align: center;
    width: 50%;
    height: 50%;
    transform: scale(.8);
    padding: 2%;
    border-radius: 12px;
}

.spaceInBetween {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 1%;
}

.financialAnalysisDropdown {
    border: solid 1px #cfc8c8;
    border-radius: 2px;
    transform: scale(1.3);
    margin-left: -32%;
    margin-top: 7%;
    color: #134419;
    font-weight: bold;
}

.financialAnalysisLabelsDiv {
    background: #efefef;
    border-radius: 2px;
    padding: 2%;
    border: solid 1px #dfd7d7;
}

.moneyLabel {
    font-weight: bolder;
    color: green;
}

.widgetOutline {
    display: flex;
    flex-direction: row;
    border: solid 1px #74f9cd;
    border-radius: 6px;
    background: white;
}

.material-icons {
    cursor: pointer;
    color: var(--icon-color, black); /* Default color black */
}

.material-icons-white {
    cursor: pointer;
    --icon-color: white; /* Override with white color */
}

.financialAnalysisHeader {
    border: solid 1px #ddd3d3;
    border-radius: 4px;
    margin-bottom: 6%;
}

.actionsHolder {
    border: solid 1px #e5dede;
    border-radius: 6px;
    margin-top: 18%;
    padding: 2%;
}

.largeIcon {
    font-size: 2.2em;
}

.boldFontWeight {
    font-weight: bold;
}

.widgetHeader {
    font-weight: normal;
    font-size: 1.7em;
    color: #727272;
    margin-top: -1%;
}

.barGraphWidget {
    background: white;
    padding: 1%;
    border: solid 1px gray;
    border-radius: 2px;
    width: 189%;
    margin-left: -49%;
}

.lineGraphWidgetContainer {
    border-radius: 53px !important;
    background: white;
}

.dashBoardParentContainers {
    padding: 1% !important;
    background: none !important;
    border: none !important;
    display: flex !important;
    flex-direction: row !important;
    width: 269% !important;
    margin-left: -182.3% !important;
    margin-top: -5%;
}


.dashBoardParentContainerShowingWidgets {
    padding: 1%;
    background: none;
    border: none;
    display: flex;
    flex-direction: row;
    width: 269% !important;
    margin-left: -162.3% !important;
    margin-top: -5%;
    position: relative;
    left: -20% !important;
}


.calendarWidgetWrapper {
    margin-left: 1%;
    margin-top: 4%;
    padding: 22%;
    background: white;
    border: solid 1px #edecec;
    border-radius: 6px;
}

.widgetDivs {
    margin-top: 6%;
}


.notification {
    text-decoration: none;
    padding: 4%;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    margin-top: -9%;
}

    .notification:hover {
        color: #efd628;
    }

    .notification .badge {
        position: absolute;
        top: -18px;
        right: -28px;
        padding: 6px 14px;
        border-radius: 50%;
        color: white;
        font-weight: bolder;
        font-size: 1.4em;
        border: solid 1px #c8ff16;
    }

.bucketsWrapper {
    padding: 4%;
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-end;
    width: 219.3%;
    background: none;
    border: none;
    border-radius: 2px;
    margin-left: -29.8%;
    margin-top: -95%;
    padding-right: 10%;
}


.bucket {
    display: flex;
    flex-direction: column;
    text-align: center;
    margin-right: 3%;
    width: 50%;
    margin-bottom: 16%;
}

.innerBucketContainer {
    display: flex;
    flex-direction: column;
    border: solid 1px #5f9900 !important;
    padding: 11%;
    width: 147%;
    border-radius: 13px;
}

.displayColumn {
    display: flex;
    flex-direction: column;
    text-align: center;
    border-bottom: solid 2px #afa9a9;
    padding: 9%;
}


.bucketHeading {
    width: 189%;
    font-size: 1.3em;
    margin-bottom: 8%;
    margin-left: -14%;
    -webkit-text-fill-color: transparent;
    transform: scale(1.1);
    font-weight: bold;
}

.grow-on-hover {
    display: inline-block;
    vertical-align: middle;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
}

    .grow-on-hover:hover, .grow-on-hover:focus, .grow-on-hover:active {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        z-index: 30000;
    }

.notificationTile {
    width: 178%;
    margin-bottom: -2%;
    transform: scale(0.55);
    margin-left: -43%;
    font-size: 2em;
    display: flex;
    flex-direction: row;
    padding-bottom: 4%;
    margin-top: -3%;
    padding: 3%;
}

.notificationTileInnerDiv {
    display: flex;
    background: #00856F;
    width: 20%;
    padding: 1%;
    border-radius: 8px;
    border: solid 1px #d5cccc;
}

.welcomeWrapper {
    margin-bottom: 13%;
    margin-left: -61.4%;
    margin-top: -41%;
}

.welcomeDiv {
    width: 40%;
    padding: 1%;
    padding-bottom: 100%;
    margin-top: 0%;
    margin-bottom: -79%;
    margin-left: -17.4%;
    margin-top: 4%;
}

.redBucketColor {
    background: #aa5454 !important;
    cursor: pointer !important;
    border: solid 1px #d98000;
    transform: translateZ(0);
    backface-visibility: hidden;
}

    .redBucketColorr:hover, .redBucketColor:focus, .redBucketColor:active {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }


.yellowBucketColor {
    background: #ffff54 !important;
    cursor: pointer !important;
    border: solid 1px #d6ff70;
    position: relative;
    z-index: 10;
    transform: translateZ(0);
    backface-visibility: hidden;
}



.greenBucketColor {
    background: #76dd76 !important;
    cursor: pointer !important;
    border: solid 1px #0db700;
    transform: translateZ(0);
    backface-visibility: hidden;
}


.pointer {
    cursor: pointer;
}

.dashboardLeftSidePanel {
    width: 24%;
    padding: 1%;
    border-radius: 56px 50px 59px 40px;
    position: relative;
    z-index: 1;
    left: -9%;
    padding-right: 3%;
    margin-right: -16%;
    margin-left: -9%;
    -webkit-animation-fill-mode: forwards !important;
    transition: ease-in-out 1.8s;
}

    .dashboardLeftSidePanel:hover {
        transition: ease-in-out 0.5s;
        animation: dashboardLeftSidePanel .5s;
        margin-left: -5%;
    }



@keyframes dashboardLeftSidePanel {

    0% {
        left: -10%;
    }

    20% {
        left: -12%;
    }

    40% {
        left: -15%;
    }

    60% {
        left: -17%;
    }

    100% {
        left: -22%;
        border: solid 5px #d7ff38;
    }
}


.dashboardMiddlePanel {
    padding: 1%;
    width: 75%;
    border: none;
    border-radius: 29px 2px 1px 42px;
    border-right: none;
    position: relative;
    z-index: 2;
    margin-left: -8%;
    min-width: 545px;
    left: -16%;
    background: none !important;
    top: 1pc;
}



.dashboardRightPanel {
    padding: 1%;
    width: 72%;
    border-radius: 2px 7px 25px 7px;
    border: none;
    margin-right: -40%;
    position: relative;
    z-index: 4;
    min-width: 1342px;
    margin-top: 2%;
    left: -13%;
    background: none !important;
    top: 1pc;
}

.addWidgetIcon {
    transform: scale(6.5);
    background: #4e4a46;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 8em;
    filter: drop-shadow(0 0 0.75rem #F1F1F1);
}

.grayGradientTextColor {
    margin-top: 6%;
    font-size: 4em;
    font-weight: normal;
    line-height: 10px;
}

.WhiteText {
    color: white !important;
}

#panel-holder {
}


/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

    /* Hide default HTML checkbox */
    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc !important;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white !important;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #b6d768 !important;
}

input:focus + .slider {
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }


.outerDivWidgetPicker {
    display: flex;
    justify-content: space-between;
    overflow-x: auto;
    padding: 17%;
    width: 99%;
    margin-left: -17%;
    -webkit-tap-highlight-color: transparent;
    outline-style: none;
    position: relative;
    top: -45pc;
}

.innerWidgetPicker {
    border: solid 1px #f7fbed;
    padding: 3% 14%;
    margin-right: 58%;
    cursor: pointer !important;
    transform: scale(2.5);
    background: white;
    border-radius: 19px;
    -webkit-tap-highlight-color: transparent;
    outline-style: none;
}


.widgetPickerHeader {
    font-size: 2.3em;
    /*background: linear-gradient(208deg, rgb(0 0 0), rgb(0 185 251)) background;*/
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    -webkit-tap-highlight-color: transparent;
    outline-style: none;
}

.actionsContainer {
    display: flex;
    flex-direction: row;
    width: 126%;
    margin-left: -98%;
    -webkit-tap-highlight-color: transparent;
    outline-style: none;
}

#items-containerLabel {
    margin-top: -14%;
    margin-bottom: 15%;
    -webkit-tap-highlight-color: transparent;
    outline-style: none;
}

    #items-containerLabel label {
        font-size: 9em;
        -webkit-tap-highlight-color: transparent;
        outline-style: none;
    }

.CircleEdit {
    position: relative;
    left: 24pc;
    top: -0.7pc;
    background: white;
    width: 5%;
    padding: 3px;
    border-radius: 1pc;
    transform: scale(1.2);
}

.ConfigurationLabel {
    padding: 5px;
    color: #00506d;
    font-weight: 600;
    font-size: 1.3em;
    min-height: 30px;
}


.NewDescription input {
    border: solid 3px #d7f4ff;
    position: relative;
    left: 1%;
    border-radius: 4px;
    font-weight: bold;
    color: #4d4c4c;
}


.LoadConfigFloatingIcon {
    font-size: 2.2em;
    background: white;
    padding: 8px;
    border-radius: 3pc;
    position: relative;
    top: 22px;
    margin-right: 14px;
    left: 4%;
}

.DeleteIcon {
    position: relative;
    top: -3.7pc;
    left: 3.3pc;
    color: red;
}

.AwardLetterErrorBanner {
    background: white;
    position: relative;
    left: 8%;
    width: 64%;
    margin-top: 0%;
    padding: 3%;
    border-radius: 7px;
    border: solid 1px #cbcbcb;
    background-position: right;
    background-image: url(../../../content/images/CI_LoginImage.png);
    background-size: 901px !important;
    margin-right: 3%;
    background-repeat: no-repeat;
    max-height: 1677px;
    top: 1.7pc;
}
    .AwardLetterErrorBanner h3 {
        color: #424242;
        font-family: 'rubik';
        font-weight: bold;
        font-size: 3em;
        width: 44%;
        border-radius: 5px;
        text-shadow: 2px 0px #b8bcc1;
    }
    .AwardLetterErrorBanner ol {
        padding: 1%;
        text-align: left;
        background: white;
        width: 100%;
        border-radius: 5px;
        font-size: 1.5em;
        font-family: 'rubik';
    }

    .AwardLetterErrorBanner li {
        position: relative;
        left: 3%;
    }

.helpTag {
    position: relative;
    z-index: 44;
}

.CIbuttonStyle {
    border-radius: 7px;
    background: white;
    color: black;
    border: solid 1px #9d9898;
}

.infoIconStyle {
    display: inline;
    font-size: 15px;
    position: relative;
    left: 1%;
    cursor: pointer;
    color: lightgray !important;
}
.Space-Between {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.MaskContainer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 33%;
    align-items: center;
    padding: 2%;
    border-radius: 4px;
    position: relative;
    left: 49%;
}

    .MaskContainer label {
        color: #343536;
        font-weight: 500;
        font-size: .9em;
    }

.bounce {

}

    .bounce:hover {
        animation: bounce 2s ease infinite;
    }

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-30px);
    }

    60% {
        transform: translateY(-15px);
    }
}


.DisabledInput {
    background: #bbb9b973;
    border: solid 1px #bab6b6;
    color: gray;
    cursor: not-allowed;
}

.GridTable {
    margin: 3px;
    background: #dedede;
    border: solid 3px #c8c4c4;
    border-radius: 4px;
}

.GridTableFirstTd {
    border: solid 1px #b2b2b2;
}

.GridTableColumnLabels {
    text-align: center;
    color: #625c5c
}

.GridTableRowLabels {
    color: #625c5c;
    min-width: max-content;
}

.GridTable input {
    position: relative;
    left: 3px;
    border: solid 1px #d6cece;
    border-radius: 3px;
    box-shadow: none;
    max-width: min-content;
}


.Space-Between {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.BlackDivider {
    background: #000000;
    color: white;
}

.unmaskAllContainer {
    display: flex;
    justify-content: space-around;
    width: 7%;
    background: white;
    padding: .5%;
    border-radius: 8px;
    position: relative;
}



.OverrideButtonStyle {
    font-size: 1em !important;
    width: 81px !important;
    background: white !important;
    border: solid 1px #cfc6c6 !important;
    color: #3c4042 !important;
}

.unmaskAllContainer {
    background: white;
    padding: 1%;
    border: solid 1px #c9c9c9;
    border-radius: 6px;
    box-shadow: 0px 2px 5px #cbc9c9;
    transform: scale(.88);
    cursor: pointer;
}

.BatchActionContainer {
    border-radius: 1px !important;
    width: 100% !important;
    border: solid 1px #d3d1d1 !important;
    height: 70px !important;
}

    .BatchActionContainer div {
        padding: 5px !important;
        font-weight: 600 !important;
        color: #4d4747 !important;
    }

    .BatchActionContainer select {
        border: solid 1px #424A46 !important;
        height: 31px !important;
        padding: 4% !important;
        border-radius: 4px !important;
    }

    .BatchActionContainer button {
        background: none;
        border: none;
    }

.k-window-content input {
    background-color: #ffffff !important;
    color: #3992f3 !important;
    border: solid 1px #c1baba !important;
}

#txtUpdateAmount {
    width: 80px !important;
    height: 27px !important;
    border-radius: 5px !important;
    padding: 7px !important;
}

.BatchActionContainer td {
    border: none !important;
}

.RoleDivider {
    background: #b7dce9;
    border: solid 2px white;
}

    .RoleDivider td {
        padding: .4%;
    }

.CopyContainer {
    display: flex;
    align-items: flex-start;
    flex-direction: row;
    width: 114%;
    justify-content: space-around;
    border: solid 1px #79c9ff;
    padding: 6%;
    border-radius: 5px;
}

.ISIRSectionHeader h3 {
    color: #000000;
    font-weight: 500;
    position: relative;
    top: -5px;
    font-size: 1.3em;
    left: 1%;
}

.TilaPrintButton {
    display: inline-block;
    border: solid 1px #c9c5c5;
    width: 112px;
    background: white;
    border-radius: 4px;
}

.TilaPrintContainer {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: flex-end;
}

    .TilaPrintContainer label {
        font-size: 12px;
        position: relative;
        font-weight: 400;
        left: -12px;
        border-bottom: solid 1px #424A46;
        color: #5f5c5c;
    }



.EformEditSection {
    background-color: #ffffff;
    padding: 2%;
    border: solid 1px #cfc6c6;
    border-radius: 7px;
    overflow: auto;
    top: -2pc;
    position: relative;
}

.MainContainer {
    padding: 2%;
    background: white;
    border-radius: 6px;
    /*border: solid 1px #42a5fe;*/
    max-height: 398px;
    overflow: auto;
}

.LightSubHeading {
    font-weight: 400;
    position: relative;
    top: -0.4pc;
    left: 1%;
    text-decoration: underline;
    color: #2f2727;
    font-size: 1.3em;
}

.push-notification {
    padding-left: 5px;
    padding-right: 5px;
    max-width: 300px;
    white-space: normal;
}

.push-notification .title{
    font-weight: bold;
}

.push-notification img {
    padding-right: 20px;
    height: 30px;
}

.push-notification td {
    vertical-align: top;
}

.push-notification-prompt {
    background-color: lightgoldenrodyellow;
    padding-top: 2px;
    padding-bottom: 2px;
    text-align: center;
    margin-bottom: 5px;
}

.push-notification-prompt a {
    cursor: pointer;
}

#push-notification-ios-instructions {
    text-align: center;
}

#push-notification-ios-instructions h4 {
    text-align: center;
}

#push-notification-ios-instructions ol {
    text-align: left;
    display: inline-block;
}

.FlexBaselineFlexStart {
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
}

.reflection-container {
    position: relative;
}

.reflection {
    position: absolute;
    bottom: -50%;
    left: 0;
    width: 100%;
    transform: scaleY(-1);
    opacity: 0.5; /* Adjust opacity as needed */
    /*background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);*/ /* Gradient fade */
}

.announcementBanner {
    background-color: rgb(229, 106, 84); /* Your orange */
    color: #ffffff;
    padding: 10px 20px;
    font-family: "Roboto", sans-serif;
    font-size: 14px;
    text-align: center;
    position: relative;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease; /* Smooth shift */
}

.announcementBannerCloseBtn {
    position: absolute;
    top: 8px;
    right: 16px;
    background: none;
    border: none;
    color: #ffffff;
    font-size: 16px;
    cursor: pointer;
    line-height: 1;
}

.announcementLink {
    color: #fffacd;
    text-decoration: underline;
    font-weight: 500;
}

.portico-info-message {
    color: #212721;
    background-color: #ffa300;
    border-color: #ffecb5;
    position: relative;
    padding: 1rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}