@font-face {
    font-family: 'Poppins';
    src: local('Poppins Regular'), local('Poppins-Regular'), url('fonts/Poppins-Regular.woff2') format('woff2'), url('fonts/Poppins-Regular.woff') format('woff'), url('fonts/Poppins-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Madani Arabic';
    src: local('Madani Arabic Regular'), local('Madani-Arabic-Regular'), url('fonts/MadaniArabic-Regular.woff2') format('woff2'), url('fonts/MadaniArabic-Regular.woff') format('woff'), url('fonts/MadaniArabic-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

body {
    margin: 0px auto;
    font-family: 'Poppins', 'Madani Arabic', Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    width: 1000px;
}

h1 {
    font-size: 1.8em;
    padding: 10px 0 0 0px;
    color: #002D58;
}

h2 {
    font-size: 1.6em;
    padding: 10px 0 0 0px;
    color: #002D58;
}

a {
    color: #002D58;
    text-decoration: underline;
}

input[type="text"], select, textarea, input[type="radio"] + label, input[type="checkbox"] + label {
    font-family: Arial, Helvetica, sans-serif;
    border: 1px #194C44 solid;
    padding: 3px;
    font-size: 1.1em;
}

input[type="radio"] + label, input[type="checkbox"] + label {
    border: none;
    font-size: 1.1em;
}

.divMenu {
    background-repeat: repeat-x;
    font-size: .85em;
    font-weight: bold;
    text-decoration: none;
}

.ModulesMenuItem {
    color: white;
    display: block;
    float: left;
    background: #002D58;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-right: 4px solid #194C44;
    border-left: 4px solid #194C44;
    border-top: 4px solid #194C44;
    border-bottom: 4px solid #194C44;
}

.ModulesMenuHover {
    color: #002D58;
    display: block;
    float: left;
    background: white;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-right: 4px solid #194C44;
    border-left: 4px solid #194C44;
    border-top: 4px solid #194C44;
    border-bottom: 4px solid white;
}

.ModulesMenuSelected {
    color: #002D58;
    background: white;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-right: 4px solid #194C44;
    border-left: 4px solid #194C44;
    border-top: 4px solid #194C44;
    border-bottom: 4px solid white;
}

.divPageHeader {
    background-position: white;
    text-decoration: none;
    background: white;
    border-color: #194C44;
    border-width: 1px 1px 1px 1px;
    color: #002D58;
    border-style: solid solid solid solid;
    zcursor: pointer;
    padding: 5px 0px;
}

.panelHowToUse {
    border: 1px solid #194C44;
    background-color: #FCFAF0;
    width: 640px;
    padding: 5px;
    margin-bottom: 10px;
}

    .panelHowToUse a {
        color: #002D58;
    }

        .panelHowToUse a:hover {
            text-decoration: none;
        }

.wrapper {
    border: 1px solid #194C44;
    border-top: 0px;
}

.MasterPageLeftTd {
    /*background: transparent url("../images/sbg.gif");*/
    background-color: #FCFAF0;
    height: 500px;
    width: 250px;
    border-right: solid 1px #194C44;
}

.ContentPage {
    padding: 5px 10px 20px 10px;
    text-align: left;
}

.panel {
    border: 1px solid #194C44;
    padding: 15px;
    margin: 15px 15px 10px 15px;
    min-width: 620px;
}

.panelheader {
    background: white;
    position: absolute;
    margin-top: -28px;
    color: #002D58;
    padding: 3px;
    border: 1px solid #194C44;
    font-weight: bold;
    display: block;
}

.panelheader274 /* Receipt */ {
    background: #002D58;
    position: absolute;
    margin-top: -28px;
    color: White;
    padding: 3px;
    border: 1px solid #194C44;
    font-weight: bold;
}

.panelheader275 /* Receipt */ {
    background: #A11A16;
    position: absolute;
    margin-top: -28px;
    color: White;
    padding: 3px;
    border: 1px solid #194C44;
    font-weight: bold;
}

.panelheader276 /* Debit/Credit Note */ {
    background: #007635;
    position: absolute;
    margin-top: -28px;
    color: White;
    padding: 3px;
    border: 1px solid #194C44;
    font-weight: bold;
}

.panelheader277 /* Transfer */ {
    background: #A64167;
    position: absolute;
    margin-top: -28px;
    color: White;
    padding: 3px;
    border: 1px solid #194C44;
    font-weight: bold;
}

.DetailsPanel {
    border: 2px solid #194C44;
    padding: 15px;
}

.SearchPanel {
    border: 1px solid #194C44;
    padding: 15px;
    background-color: #FCFAF0;
}

.hidden {
    display: none;
}

.app_code {
    margin-bottom: 20px;
    text-align: right;
}

table.alternating tr:nth-child(odd) {
    background: #FCFAF0;
}

table.alternating tr th:first-child,
table.alternating tr td:first-child {
    width: 200px;
}

table.alternatingWithCondition tr:nth-child(odd) {
    background: #FCFAF0;
}

.odd {
    background: white;
}

.even {
    background: #FCFAF0;
}

/*.selected, .selected a { background-position: #0075ba; background: #0075ba; font-weight: bold; color: #FFFFFF; }*/

.panelAttention {
    border: 2px solid #A11A16;
    padding: 15px;
    margin: 15px 15px 10px 15px;
}

.panelheaderAttention {
    background: white;
    position: absolute;
    margin-top: -28px;
    color: #A11A16;
    padding: 3px;
    border: 1px solid #A11A16;
    font-weight: bold;
}


.BorderLessPanel {
    margin-left: 20px;
    margin-right: 20px;
}

.CellButtonPadding {
    padding: 0px 18px 5px 15px;
    margin: 0px 25px 0px 25px;
}

.DivAccordion {
    padding: 15px;
}

.PageTitlePanel {
    padding: 5px 5px 5px 5px;
    border: 2px solid #194C44;
    background-color: #FCFAF0;
    margin: 20px 20px 10px 20px;
}

.FilledPanel {
    border: 1px solid #194C44;
    padding: 15px;
    margin: 5px 20px 5px 20px;
    background-color: #FCFAF0;
    color: #002D58;
}

.ButtonPanel {
    margin-right: 20px;
    margin-bottom: 20px;
    margin-left: 20px;
}

.Image {
    padding: 4px;
    margin: 4px;
    border: thin solid #194C44;
}

.GridViewSophisticatedCell {
    padding: 4px;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
}

.GridViewCell {
    padding: 4px;
    text-align: center;
    vertical-align: middle;
}

.panelheaderborderless {
    display: block;
    background: white;
    position: absolute;
    margin-top: -28px;
    font-weight: bold;
    color: #002D58;
    padding-left: 3px;
    padding-right: 3px;
    padding-bottom: 3px;
    padding-top: 3px;
    font-weight: bold;
    font-size: .9em;
}

.smallPanelHeader {
    display: block;
    background: white;
    position: absolute;
    margin-top: -28px;
    font-weight: bold;
    color: #002D58;
    padding-left: 5px;
    padding-right: 5px;
    font-size: .9em;
    border: 1px solid #194C44;
}


.panelheader a {
    color: #002D58;
}

.title {
    font-weight: bold;
}



.ButtonStyle {
    font-weight: bold;
    color: white;
    background: #002D58;
    padding: 1px 5px;
    cursor: pointer;
    border: 1px solid #194C44;
    font-family: 'Poppins', 'Madani Arabic', Verdana, Arial, Helvetica, sans-serif;
}

    .ButtonStyle:Hover {
        background-color: White;
        color: #194C44;
    }

a.btn {
    font-weight: bold;
    color: white;
    background: #002D58;
    padding: 1px;
    cursor: pointer;
    text-decoration: none;
    box-sizing: border-box;
    border-width: 2px;
    border-style: outset;
    border-color: buttonface;
    border-image: initial;
}

    a.btn:Hover {
        background-color: #194C44;
        /*color: #007635;*/
    }

.HighlightedButton {
    font-weight: bold;
    color: white;
    background: #007635;
    padding: 1px;
    cursor: pointer;
}

    .HighlightedButton:Hover {
        background-color: #F3B200;
        color: #000;
    }


.right-header {
    width: 464px;
    height: 134px;
    background-image: url('../images/Header.gif');
}


#menu a:hover, #menu a.selected {
    color: #194C44;
    background: white;
    padding-left: 15px;
    padding-right: 15px;
    border-right: 4px solid #194C44;
    border-left: 4px solid #194C44;
    border-top: 4px solid #194C44;
    border-bottom: 4px solid white;
    height: 24px;
    line-height: 24px;
}


.MasterPageSide {
}

.NestedMasterPageLeftTD {
    padding: 0px;
    /*background: transparent url("../images/sbg.gif");*/
    background-color: #FCFAF0;
    vertical-align: top;
    height: 100%;
    margin: 0px;
}


.side {
    /*background: transparent url("../images/sbg.gif");*/
    background-color: #FCFAF0;
    padding: 10px;
}


.grid {
    font-size: 1em;
}

    .grid td {
        padding: 2px;
    }

    .grid th {
        padding: 3px 5px;
        background: #002D58;
        color: #fff;
    }

        .grid th a {
            color: #fff;
            text-decoration: underline;
        }

    .grid .selected {
        background-color: skyblue;
    }


    .grid input {
        text-align: center;
    }

.panelgrid {
    padding: 1px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.FormviewFooter {
    text-align: right;
}



.divPrint {
    text-align: right;
    padding-right: 10px;
}

.HeaderUserNameRow {
    padding: 10px;
    background-color: #194C44;
    text-align: right;
    font-weight: bold;
    vertical-align: top;
}

.HeaderUserProfileRow {
    padding: 10px;
    background-color: #194C44;
    text-align: Left;
    font-weight: bold;
}

.LoginHeader {
    padding: 10px;
    background-color: #002D58;
}

.divProfile {
    font-size: 1em;
    position: relative;
    /*left: 466px;
    top: 25px;*/
    background: url("../images/aou_banner.jpg") top left no-repeat #FCFAF0;
}

    .divProfile .wlc {
        font-size: 1.2em;
    }

.ProfileFormViewTemplate {
    margin-top: 2px;
}


th {
    background-color: #FFC;
    white-space: nowrap;
    text-align: center;
    padding-left: 4px;
    padding-right: 4px;
}

/*div.DetailsPanel table tr:nth-child(even) { background: #FCFAF0; }
div.DetailsPanel table tr:nth-child(odd) { background: white; }*/

table.list, td.details table.list {
    width: 100%;
    border: 1px solid #000;
}

    table.list tr th, td.details table.list tr th {
        text-align: left;
        background-color: #666;
        color: #FFF;
        font-size: 100%;
        border-style: none;
        padding: 2px 20px 2px 2px;
    }

    table.list tr td, td.details table.list tr td {
        border-bottom: 1px solid #999;
        padding: 2px 20px 2px 2px;
    }

    table.list tr {
        background-color: #FFC;
    }

        table.list tr.odd {
            background-color: #CCC;
        }

table.bordered tr:nth-child(odd) {
    background: #FCFAF0;
}

table.bordered tr td {
    border: 1px solid #002D58;
    padding: 4px 10px;
}

    table.bordered tr td a {
        color: #009;
        text-decoration: none;
    }

        table.bordered tr td a:hover {
            color: #900;
            text-decoration: underline;
        }

table.webparts tr th {
    background-color: #194C44;
    color: #FFF;
    border: 1px solid #194C44;
    font-size: 11px;
}

table.webparts {
}

td.details div table tr td, td.details div table tr td.detailheader {
    border-style: none;
}

td.detailheader {
    text-align: right;
    font-weight: bold;
    white-space: nowrap;
    border-style: none;
    padding: 3px 10px 3px 0px;
}

td.details div table {
    border-style: none;
}

    td.details div table tr td.detailitem {
        width: 100%;
        padding: 3px 10px 3px 0px;
    }

td.details {
    border: 2px solid #194C44;
    padding: 10px;
    /*background: transparent url("../images/sbg.gif");*/
    background-color: #FCFAF0;
}

.alert {
    color: #C00;
    font-weight: bold;
}

.TrHidden {
    visibility: hidden;
}


.watermark {
    background: #FFAAFF;
}


.modalBackground {
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.modalPopup {
    border-width: 3px;
    border-style: solid;
    border-color: Gray;
    padding: 3px;
}

.accordionHeader {
    border: 1px solid #194C44;
    color: white;
    background-color: #194C44;
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
    text-align: center;
}

.accordionHeaderSelected {
    border: 1px solid #194C44;
    color: white;
    background-color: #194C44;
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
    text-align: center;
}

.accordionContent {
    border: 1px dashed #2F4F4F;
    border-top: none;
    padding: 5px;
    padding-top: 15px;
}

.gridColumnSortImage {
    vertical-align: middle;
    padding-left: 2px;
    padding-top: 2px;
}

.divPasswordExpiry {
    color: red;
    font-size: 14px;
    font-weight: bold;
    padding-left: 10px;
}

    .divPasswordExpiry a {
        color: red;
    }


.HPModulesMenu {
    display: block;
    margin: 0px;
    padding: 20px 0px 0px 1px;
    width: 500px;
}


#hp-menu ul {
    margin: 0px;
    padding: 0px;
    width: 100%;
}

    #hp-menu ul li {
        display: inline;
        position: relative;
        float: left;
        width: 200px;
        height: 120px;
        margin: 0 25px 25px 0;
        color: white;
        background: #002D58;
        border: 4px solid #194C44;
        text-align: center;
        font-weight: bold;
    }

        #hp-menu ul li:hover {
            /*color: #0075ba;*/
            background: white;
        }

        #hp-menu ul li a {
            color: white;
            text-decoration: none;
        }

        #hp-menu ul li:hover a {
            color: #194C44;
        }



#main-menu ul {
    margin: 0px;
    padding: 0px 0 3px 0;
    width: 100%;
    font-size: .95em;
}

    #main-menu ul li {
        display: inline;
        position: relative;
        float: left;
        margin: 2px 1px;
        color: white;
        background-color: #002D58;
        border-right: 1px solid #194C44;
        border-left: 1px solid #194C44;
        border-top: 1px solid #194C44;
        border-bottom: 1px solid #194C44;
        text-align: center;
        font-weight: bold;
        padding: 3px 2px;
    }

        #main-menu ul li:hover, #main-menu ul li.selecteditem {
            background-color: white;
        }

        #main-menu ul li a {
            color: white;
            text-decoration: none;
        }

        #main-menu ul li:hover a, #main-menu ul li.selecteditem a {
            color: #194C44;
        }

.error {
    color: red;
}

fieldset {
    border: 1px solid #194C44;
    border-radius: 5px;
    padding: 15px;
    margin-top: 20px;
}

    fieldset legend {
        border: 1px solid #194C44;
        padding: 5px 10px;
        font-size: 1em;
        border-radius: 5px;
        margin-left: 5px;
        font-weight: bold;
    }

.smallStudentPhoto {
    width: 50px;
    border: 1px solid #002D58;
}

.largeStudentPhoto {
    width: 150px;
    border: 1px solid #002D58;
}

a.nounderline {
    text-decoration: none;
}

.arabic {
    font-family: Tahoma;
}

.divPreview {
    width: 100%;
    font-size: 18px;
    margin-top: 20px;
    padding: 10px 0;
    border: dashed 1px;
}

    .divPreview span {
        padding-left: 10px;
    }



div.icon {
    display: inline;
    position: relative;
    float: left;
    width: 100px;
    height: 100px;
    margin: 0 25px 25px 0;
    color: white;
    background: #41a1da;
    border: 2px solid #194C44;
    text-align: center;
    font-weight: bold;
}

    div.icon:hover {
        color: #007635;
        background: white;
    }

    div.icon a {
        color: white;
        text-decoration: none;
    }

    div.icon:hover a {
        color: #007635;
    }

    div.icon input[type=submit] {
        background: none!important;
        color: inherit;
        border: none;
        padding: 0!important;
        font: inherit;
        cursor: pointer;
        white-space: normal;
        width: 100px;
    }

    div.icon label {
        color: black;
        font-weight: normal;
    }

.blink_me {
    animation: blinker 3s linear infinite;
}

@keyframes blinker {
    10% {
        color: white;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    /*fieldset { border: 1px solid #0075ba; border-radius: 5px; padding: 15px; margin-bottom: 20px; }
    fieldset legend { border: 1px solid #0075ba; padding: 5px 10px; font-size: 1em; border-radius: 5px; margin-left: 5px; font-weight: bold; }*/
}

/*.collapsiblePanelContainer > div:first-child {
    padding-bottom: 20px !important;
}*/