@import url('font-awesome.css');
@import url('font-awesome.min.css');


/*********************************************************************************************

1. Common layout elements

*********************************************************************************************/
html {
    overflow-x: hidden;
}

::-moz-selection {
    background: #105194;
    color: #fff;
}

::selection {
    background: #105194;
    color: #fff;
}

input:focus::-webkit-input-placeholder {
    color: transparent;
}

input:focus:-moz-placeholder {
    color: transparent;
}
/* FF 4-18 */
input:focus::-moz-placeholder {
    color: transparent;
}
/* FF 19+ */
input:focus:-ms-input-placeholder {
    color: transparent;
}

label {
    font-size: 10pt;
}

a {
    color: #1a4167;
    text-decoration: none;
    outline: none;
}

    a:hover,
    a:focus {
        color: #a41d31;
        -webkit-transition-duration: 0.3s;
        -moz-transition-duration: 0.3s;
        transition-duration: 0.3s;
    }

    a.invert {
        color: #b9972f;
    }

        a.invert:hover,
        a.invert:focus {
            color: #a41d31;
        }

.active {
    display: block;
}

ul li {
    list-style-type: none;
}

div {
    display: block;
    text-align: left;
    font-size: 10pt;
}

.title, h3#reply-title {
    color: #262A8D;
    font-size: 20px;
    font-weight: bolder;
    margin: 0 0 1em;
    width: 100%;
}

body {
    background-clip: padding-box;
    background-image: -webkit-radial-gradient(cover, #FFFFFF, #CAA01C);
    background-image: -moz-radial-gradient(cover, #FFFFFF, #CAA01C);
    background-image: -o-radial-gradient(cover, #FFFFFF, #CAA01C);
    background-image: radial-gradient(cover, #FFFFFF, #CAA01C);
    color: #666;
    font-family: 'Roboto', Arial, Tahoma, sans-serif;
    font-size: 62.5%;
    line-height: 1.2em;
    text-align: center;
    margin: 0;
    padding: 0;
}

#container {
    text-align: center;
    width: 100%;
    background: #262988;
}

div.wrapper {
    margin: 0 auto;
    text-align: left;
    width: 1150px;
}

div.cleaner,
div.clear,
div.divider {
    margin: 0;
    clear: both;
    font-size: 1px;
    height: 1px;
    line-height: 1px;
}

div.divider {
    border-top: solid 1px #e7e7e7;
    clear: none;
    margin: 20px 0;
}

div.divider-notop {
    margin-top: 0;
}

h1, h2, h3, h4, h5, h6 {
    color: #222;
    margin: 0;
}

    h2 a {
        color: #1a4167;
    }

        h2 a:hover,
        h2 a:focus {
            color: #cf2626;
        }

.float-left {
    float: left;
}

.float-right {
    float: right;
}

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

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

.no-bg {
    background-color: rgba(255,255,255,0);
}

.absolute {
    position: absolute;
}

.UpperCase {
    text-transform: uppercase;
}

.LowerCase {
    text-transform: lowercase;
}

.form-name {
    text-transform: uppercase;
    font-weight: 900;
    font-size: 14pt;
    color: #fff;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    padding: 5px 0px;
    text-align: center;
    height: 20px;
}

.i-frame {
    width: 100%;
    position: relative;
    margin: 0px;
    min-height: 400px;
    background: rgba(255,255,255,0.5);
}

.overflow-visible {
    overflow: visible !important;
}

.no-padding {
    padding: 0 !important;
}

.img-profile {
    border-radius: 2px;
    background: #c1cfd4;
    width: 125px;
    height: 125px;
    margin: 10px 0px 0px 10px;
    padding: 5px;
}

.display-none {
    display: none;
}

.modalload {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
    min-height: 100%;
    width: 100%;
    background: rgba(255,255,255,0.8) url('../Images/loading.gif') center no-repeat;
}

.loading {
    font-family: Arial;
    font-size: 10pt;
    border: 5px solid #67CFF5;
    width: 100%;
    height: 100%;
    display: none;
    position: fixed;
    z-index: 999;
}
/*********************************************************************************************

2. Form Elemets

*********************************************************************************************/

.row {
    width: 100%;
    margin-bottom: 5px;
    display: block;
    overflow: hidden;
}

.col-1, .col-2, .col-2-5, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
    float: left;
    padding: 0px 5px;
    display: block;
    overflow-y: visible;
}

.col-1 {
    width: 8.3333%;
}

.col-2 {
    width: 16.6666%;
}

.col-2-5 {
    width: 20%;
}

.col-3 {
    width: 25%;
}

.col-4 {
    width: 33.33333333%;
}

.col-5 {
    width: 41.6666%;
}

.col-6 {
    width: 50%;
}

.col-7 {
    width: 58.3333%;
}

.col-8 {
    width: 66.6666%;
}

.col-9 {
    width: 75%;
}

.col-10 {
    width: 83.3333%;
}

.col-11 {
    width: 91.6666%;
}

.col-12 {
    width: 100%;
}

input[type=submit] {
    background-color: #303695;
    background-repeat: repeat-x;
    background-image: -moz-linear-gradient(top, #181A5A, #303695);
    background-image: -ms-linear-gradient(top, #181A5A, #303695);
    background-image: -webkit-linear-gradient(top, #181A5A, #303695);
    background-image: -o-linear-gradient(top, #181A5A, #303695);
    border-color: #b9972f #b9972f #3d773d;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    font-weight: bold;
    padding: 7px 15px;
    color: #fff;
}

    input[type=submit]:hover,
    input[type=submit]:focus {
        background-position: 0 -15px;
        text-decoration: none;
        cursor: pointer;
    }

    /* For disable submit button for duplicate value */
    input[type=submit]:disabled {
        cursor: auto;
        opacity: 0.5;
    }

input[type=text], textarea, input[type=file], input[type=password] {
    background-color: #f3f3f3;
    border: solid 1px #e9e9e9;
    color: #888;
    font-size: 12px;
    float: left;
    padding: 5px 1px;
    text-indent: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    width: 180px;
}

    input[type=text]:focus, textarea:focus, input[type=password]:focus {
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 0 10px rgba(255, 255, 255, 0.9);
        outline: none;
    }

select {
    background-color: #f3f3f3;
    border: solid 1px #e9e9e9;
    color: #888;
    font-size: 12px;
    padding: 5px 1px;
    text-indent: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    width: 180px;
    float: left;
    -webkit-appearance: none;
}

    select:focus {
        outline: none;
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 0 10px rgba(255, 255, 255, 0.9)
    }


.switch {
    min-height: 25px;
    height: auto;
    padding: 0px 2px;
    line-height: 17px;
    display: inline-block;
    color: #434248;
    text-shadow: 0 1px rgba(255, 255, 255, 0.5);
    background: white;
    border-radius: 2px;
    background-image: -webkit-linear-gradient(top, #fefefe, #eeeeee);
    background-image: -moz-linear-gradient(top, #fefefe, #eeeeee);
    background-image: -o-linear-gradient(top, #fefefe, #eeeeee);
    background-image: linear-gradient(to bottom, #fefefe, #eeeeee);
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.1);
    list-style-type: none;
}

    .switch input[type=radio] {
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        -khtml-opacity: 0;
        opacity: 0;
        padding-left: 5px;
        background: #fff;
    }

    .switch :focus {
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 0 10px rgba(255, 255, 255, 0.9)
    }

    .switch label {
        display: inline-block;
        cursor: pointer;
        position: relative;
        font-size: 13px;
        padding: 0px 7px;
    }

        .switch label:before {
            content: "";
            display: inline-block;
            width: 16px;
            height: 16px;
            border-radius: 8px;
            margin-right: 10px;
            position: absolute;
            left: -20px;
            bottom: 1px;
            background-color: #E5DFDF;
            box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .3), 0px 1px 0px 0px rgba(255, 255, 255, .8);
        }

    .switch input[type=radio]:checked + label:before {
        content: "\2022";
        color: #A9A9A9;
        font-size: 30px;
        text-align: center;
        line-height: 13px;
    }

.lnkButton {
    color: #1a4167 !important;
}

.context-menu {
    min-width: 50px;
    padding: 5px 0;
    list-style: none;
    background-color: #ffffff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    *border-right-width: 2px;
    *border-bottom-width: 2px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    text-align: center;
    transition: display 1s ease;
    -webkit-animation: fadeIn 0.5s;
    animation: fadeIn 0.5s;
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.context-menu .divider {
    *width: 100%;
    height: 1px;
    margin: 9px 1px;
    *margin: -5px 0 5px;
    overflow: hidden;
    background-color: #e5e5e5;
    border-bottom: 1px solid #ffffff;
}

.context-menu a {
    display: block;
    padding: 3px 10px;
    clear: both;
    font-weight: normal;
    line-height: 20px;
    white-space: nowrap;
    text-decoration: none;
    color: #1a4167 !important;
    text-align: left;
}

.context-menu li > a:hover, .context-menu li > a:focus, .dropdown-submenu:hover > a {
    color: #fff !important;
    text-decoration: none;
    background-color: #0088cc;
    background-color: #0081c2;
    background-repeat: repeat-x;
    background-image: linear-gradient(to bottom, #0088cc, #0077b3);
}

.context-menu .active > a, .context-menu .active > a:hover {
    color: #ffffff;
    text-decoration: none;
    background-color: #0088cc;
    background-color: #0081c2;
    background-repeat: repeat-x;
    outline: 0;
    background-image: -o-linear-gradient(top, #0088cc, #0077b3);
}

.context-menu .disabled > a, .context-menu .disabled > a:hover {
    color: #999999;
}

    .context-menu .disabled > a:hover {
        text-decoration: none;
        cursor: default;
        background-color: transparent;
    }


.completionList {
    min-width: 200px;
    width: auto !important;
    height: 200px;
    margin: 0;
    padding: 5px 0;
    list-style: none;
    background-color: #ffffff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
    *border-right-width: 2px;
    *border-bottom-width: 2px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    text-align: left;
    overflow-y: scroll;
}

.listItem {
    color: #1a4167;
    padding: 5px 2px;
}

.itemHighlighted {
    color: #fff !important;
    padding: 5px 2px;
    background-color: #0088cc;
    background-color: #0081c2;
    background-repeat: repeat-x;
    background-image: linear-gradient(to bottom, #0088cc, #0077b3);
}


.footable > thead > tr > th, .footable > thead > tr > td {
    position: relative;
    text-align: center;
    text-decoration: none;
}

.footable {
    border-spacing: 0;
    width: 95%;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: none;
    font-family: 'trebuchet MS', 'Lucida sans',Arial;
    font-size: 12px;
    color: #1a4167;
    overflow: scroll;
}

    .footable a {
        color: #333;
    }

    .footable td {
        border: #EFEFEF 1px solid;
        text-align: left !important;
        text-indent: 10px;
    }

.sort_asc {
    background: url('../Images/sort-arrows-down.png') no-repeat;
}

.sort_desc {
    background: url('../Images/sort-arrows-up.png') no-repeat;
}

.footable.breakpoint > tbody > tr > td.expand {
    background: url(Images/plus.gif) no-repeat 5px center;
    padding-left: 40px;
}

.footable.breakpoint > tbody > tr.footable-detail-show > td.expand {
    background: url(img/minus.png) no-repeat 5px center;
}

.footable.breakpoint > tbody > tr.footable-row-detail {
    background: #eee;
}

.footable tr {
    padding: 0px;
    border-bottom: #EFEFEF 1px solid;
    border-right: #EFEFEF 1px solid;
    font-size: 12px;
    color: #5a5a5a;
    text-align: center;
    line-height: 20px;
}

    .footable tr:nth-child(odd) {
        background: #F7F7F7;
    }

.footable > tbody > tr:hover {
    background: rgba(0,0,0,0.1)
}

.footable > tbody > tr:last-child {
    background: #EBEBEB;
    height: 30px;
}

    .footable > tbody > tr:last-child:hover {
        background: #EBEBEB;
    }

.footable.breakpoint > tbody > tr:hover:not(.footable-row-detail) {
    cursor: pointer;
}

.footable tr td, .footable th {
    /*padding:5px;*/
    text-align: center;
    cursor: pointer;
    border-top: #EFEFEF 1px solid;
    border-left: #EFEFEF 1px solid;
}

.footable th, .footable > thead > tr > td, .SingleHeader {
    background: #EBEBEB;
    height: 30px;
    font-size: 12px;
    color: #333;
    text-shadow: 0.1em 0.1em #FFFFFF;
    font-weight: bold;
    border: #EFEFEF 1px solid;
}

    .footable > thead > tr > th:first-child, .footable > thead > tr > td:first-child {
        -moz-border-radius: 6px 0 0;
        -webkit-border-radius: 6px 0 0;
        border-radius: 6px 0 0;
    }

    .footable > thead > tr > th:last-child, .footable > thead > tr > td:last-child {
        -moz-border-radius: 0 6px 0 0;
        -webkit-border-radius: 0 6px 0 0;
        border-radius: 0 6px 0 0;
    }

    .footable > thead > tr > th:only-child, .footable > thead > tr > td:only-child {
        -moz-border-radius: 6px 6px 0 0;
        -webkit-border-radius: 6px 6px 0 0;
        border-radius: 6px 6px 0 0;
    }

.footable > tbody img {
    vertical-align: middle;
}

.footable .fa {
    font-size: 14pt;
}

.Paging {
    background: #EBEBEB;
    height: 30px;
    margin: 2% auto;
}

    .Paging:hover {
        background: #EBEBEB;
    }

    .Paging a {
        margin: auto 1%;
        background-color: #444;
        padding: 5px 10px 5px 10px;
        color: #fff !important;
        text-decoration: none;
        -o-box-shadow: 1px 1px 1px #111;
        -moz-box-shadow: 1px 1px 1px #111;
        -webkit-box-shadow: 1px 1px 1px #111;
        box-shadow: 1px 1px 1px #111;
    }

        .Paging a:hover {
            background-color: #fff;
            color: #1a4167;
        }

    .Paging span {
        background: #fff;
        color: #1a4167;
        -o-box-shadow: 1px 1px 1px #111;
        -moz-box-shadow: 1px 1px 1px #111;
        -webkit-box-shadow: 1px 1px 1px #111;
        box-shadow: 1px 1px 1px #111;
        padding: 5px 10px 5px 10px;
    }



/**********Dynamic Grid*****************/

.DynamicGrid th, .DynamicGrid > thead > tr > td {
    position: relative;
    text-align: center;
    text-decoration: none;
}

.DynamicGrid {
    border-spacing: 0;
    width: auto;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: none;
    font-family: 'trebuchet MS', 'Lucida sans',Arial;
    font-size: 12px;
    color: #1a4167;
    overflow: scroll;
}

    .DynamicGrid tr {
        border-bottom: #EFEFEF 1px solid;
        border-right: #EFEFEF 1px solid;
    }

    .DynamicGrid a {
        color: #1a4167;
        font-size: 14pt;
        font-weight: bolder;
        text-align: center;
        margin: 2px;
    }


    .DynamicGrid.breakpoint > tbody > tr.DynamicGrid-row-detail {
        background: #eee;
    }

    .DynamicGrid > tbody > tr:first-child


    .DynamicGrid > tbody > tr:last-child:hover {
        background-color: Transparent;
    }

    .DynamicGrid.breakpoint > tbody > tr:hover:not(.DynamicGrid-row-detail) {
        cursor: pointer;
    }

    .DynamicGrid > tbody > tr > td, .DynamicGrid > thead > tr > th {
        border-left: 1px solid #EBEBEB;
        border-top: 1px solid #EBEBEB;
        text-align: center;
        cursor: pointer;
    }

    .DynamicGrid th, .DynamicGrid > thead > tr > td, .SingleHeader {
        background: #EBEBEB;
        height: 30px;
        font-size: 12px;
        color: #333;
        text-shadow: 0.1em 0.1em #FFFFFF;
        font-weight: bold;
        border-left: 1px solid #EBEBEB;
        border-top: 1px solid #EBEBEB;
    }

        .DynamicGrid > thead > tr > th:first-child, .DynamicGrid > thead > tr > td:first-child {
            -moz-border-radius: 6px 0 0;
            -webkit-border-radius: 6px 0 0;
            border-radius: 6px 0 0;
        }

        .DynamicGrid > thead > tr > th:last-child, .DynamicGrid > thead > tr > td:last-child {
            -moz-border-radius: 0 6px 0 0;
            -webkit-border-radius: 0 6px 0 0;
            border-radius: 0 6px 0 0;
        }

        .DynamicGrid > thead > tr > th:only-child, .DynamicGrid > thead > tr > td:only-child {
            -moz-border-radius: 6px 6px 0 0;
            -webkit-border-radius: 6px 6px 0 0;
            border-radius: 6px 6px 0 0;
        }

    .DynamicGrid > tbody img {
        vertical-align: middle;
    }

    .DynamicGrid input[type=text], .DynamicGrid select {
        background: #fff;
        border: inset 1px #ebebeb;
    }

    .DynamicGrid .fa {
        font-size: 14pt;
    }
/**********Grid without Header and Footer*****************/
.NoStyleGrid {
    border-spacing: 0;
    width: 100%;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: none;
    font-family: 'trebuchet MS', 'Lucida sans',Arial;
    font-size: 12px;
    color: #1a4167;
    overflow: scroll;
}

    .NoStyleGrid > tbody > tr > td {
        padding: 10px;
    }

    .NoStyleGrid > tbody > tr:hover {
        background: #F3EAD0;
    }
/**********Header and Footer*****************/

.HeaderStyle {
    background-color: #1a4167;
    border-bottom: solid 2px #C5C5C6;
    background-image: -webkit-gradient(linear,left top,left bottom,from(#E0E0E0),to(#C5C5C6));
    background-image: -webkitlinear-gradient(top,#E0E0E0,#C5C5C6);
    background-image: -moz-linear-gradient(top,#E0E0E0,#C5C5C6);
    background-image: -ms-linear-gradient(top,#E0E0E0,#C5C5C6);
    background-image: -o-linear-gradient(top,#E0E0E0,#C5C5C6);
    background-image: background-image: linear-gradient(to bottom,#C5C5C6,#E0E0E0);
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    -moz-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    border-top: 0;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
    color: #1E2375;
    padding: 10px 5px;
}

    .HeaderStyle a {
        color: #1E2375 !important;
        font-weight: 600;
    }

.FooterStyle {
    background-color: #1a4167;
    border-bottom: solid 2px #C5C5C6;
    background-image: -webkit-gradient(linear,left top,left bottom,from(#E0E0E0),to(#C5C5C6));
    background-image: -webkitlinear-gradient(top,#E0E0E0,#C5C5C6);
    background-image: -moz-linear-gradient(top,#E0E0E0,#C5C5C6);
    background-image: -ms-linear-gradient(top,#E0E0E0,#C5C5C6);
    background-image: -o-linear-gradient(top,#E0E0E0,#C5C5C6);
    background-image: background-image: linear-gradient(to top,#C5C5C6,#E0E0E0);
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    -moz-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    border-top: 0;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
    color: #1E2375;
    padding: 10px 5px;
}

    .FooterStyle a {
        margin: auto 1%;
        background-color: #444;
        padding: 5px 10px 5px 10px;
        color: #fff;
        text-decoration: none;
        -o-box-shadow: 1px 1px 1px #111;
        -moz-box-shadow: 1px 1px 1px #111;
        -webkit-box-shadow: 1px 1px 1px #111;
        box-shadow: 1px 1px 1px #111;
    }

        .FooterStyle a:hover {
            background-color: #fff;
            color: #1a4167;
        }


.LightBlue {
    background: #D8DFE6;
}


.btnSpecial {
    display: inline-block;
    position: relative;
    color: #888 !important;
    text-shadow: 0 1px 0 rgba(255,255,255, 0.8);
    text-decoration: none;
    text-align: center;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 700;
    font-family: helvetica, arial, sans-serif;
    border-radius: 4px;
    border: 1px solid #bcbcbc !important;
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12);
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
    background-image: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(239,239,239,1) 60%,rgba(225,223,226,1) 100%) !important;
    background-image: -moz-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(239,239,239,1) 60%,rgba(225,223,226,1) 100%) !important;
    background-image: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(239,239,239,1) 60%,rgba(225,223,226,1) 100%) !important;
    background-image: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(239,239,239,1) 60%,rgba(225,223,226,1) 100%) !important;
    background-image: linear-gradient(top, rgba(255,255,255,1) 0%,rgba(239,239,239,1) 60%,rgba(225,223,226,1) 100%) !important;
    width: 100px;
}

    .btnSpecial:hover, .btnSpecial:focus {
        color: #555 !important;
        background: rgba(225,223,226,1);
        background-position: center !important;
    }

mandatory {
    color: Red;
    margin: 3px;
}

.ListSearchExtenderPrompt {
    background: ();
}

.regular-checkbox {
    display: none;
}

    .regular-checkbox + label {
        background-color: #fafafa;
        border: 1px solid #cacece;
        box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
        padding: 9px;
        border-radius: 3px;
        display: inline-block;
        position: relative;
    }

        .regular-checkbox + label:active, .regular-checkbox:checked + label:active {
            box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
        }

    .regular-checkbox:checked + label {
        background-color: #e9ecee;
        border: 1px solid #adb8c0;
        box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
        color: #99a1a7;
    }

        .regular-checkbox:checked + label:after {
            content: '\2714';
            font-size: 14px;
            position: absolute;
            top: 0px;
            left: 3px;
            color: #99a1a7;
        }

/*********************************************************************************************

3. Header

*********************************************************************************************/
body {
    font-size: 9pt;
}

header {
    background-color: rgba(255,255,255,0.9);
    padding: 15px 0;
}

.head {
    background-color: #fff;
    padding: 5px 10px;
    height: auto;
    box-shadow: -5px 0px 5px #000 !important;
    min-height: 80px;
}

.header-small {
    height: 50px !important;
}

.logo {
    display: inline;
    float: left;
    min-height: 60px;
    padding: 3px 10px;
	width: 30%;
}

#header-help {
    clear: right;
    color: #696969;
    display: inline-block;
    float: right;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4em;
    height: auto;
    position: absolute;
    top: 0;
    right: 200px;
}

    #header-help .action {
        display: inline-block;
        float: left;
        line-height: 20px;
        padding: 4px 0;
    }

    #header-help .value {
        margin-left: 5px;
    }

/* ----------- Account---------*/
.nav-menu {
    float: right;
    position: absolute;
    top: 0;
    right: 50px;
}

    .nav-menu ul {
        padding: 0;
        list-style: none;
        position: relative;
        float: right;
        border-bottom: 1px solid #fff;
        margin: 5px 3px;
    }

        .nav-menu ul li {
            float: left;
            padding: 5px 0px;
            display: inline-block;
        }

            .nav-menu ul li:first {
                padding: 2px 0px !important;
            }


    .nav-menu li .profile-name {
        color: #BEBCBA;
        display: inline-block;
        line-height: 24px;
        outline: none;
        vertical-align: middle;
        margin-top: 5px;
    }

    .nav-menu li .imgProfile-small {
        /*background: #5F97F6;*/
        -webkit-background-size: 32px 32px;
        background-size: 32px 32px;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        display: block;
        margin: -1px;
        overflow: hidden;
        position: relative;
        height: 32px;
        width: 32px;
        z-index: 0;
        border: solid 1px #ccc;
    }

    .nav-menu li a {
        cursor: pointer;
    }

    .nav-menu li .col-4 {
        padding: 0;
    }


    .nav-menu li .imgProfile-large {
        background: #5F97F6;
        -webkit-background-size: 60px 60px;
        background-size: 60px 60px;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        display: block;
        margin: -1px;
        overflow: hidden;
        position: relative;
        height: 60px;
        width: 60px;
        z-index: 0;
        border: solid 1px #ccc;
        overflow: hidden;
        cursor: pointer;
    }

#changeText {
    display: none;
    position: absolute;
    top: 70%;
    text-align: center;
    color: #fff;
    font-size: 10px;
    padding-top: 1px;
    font-weight: bold;
    height: 30%;
    width: 100%;
    background: rgba(0,0,0,0.8);
}

    .nav-menu li .imgProfile-large:hover ~ #changeText, #changeText:hover {
        display: block;
    }

.nav-menu #login {
    border-right: 0px solid #ddd;
    box-shadow: 1px 0 0 #fff;
}

.nav-menu #login-trigger, .nav-menu #NotificationTrigger {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    height: 40px;
    line-height: 25px;
    padding: 0px 15px;
    text-decoration: none;
    font-size: 10pt;
    position: relative;
}

    .nav-menu #NotificationTrigger i {
        border-radius: 100%;
        padding: 8px;
        background-color: #fff;
        color: #686565;
        font-size: 12pt;
        border: solid 2px #ccc;
    }

.NotifyBadge span {
    padding: 3px 7px 3px 7px;
    background: #cc0000;
    color: #ffffff;
    font-weight: bold;
    border-radius: 50%;
    position: absolute;
    font-size: 12px;
    padding: 0px 5px;
    top: 0;
    right: 5px;
}

.glowtext {
    -webkit-animation: gold 1.5s ease-in-out infinite alternate;
    -moz-animation: gold 1.5s ease-in-out infinite alternate;
    animation: gold 1.5s ease-in-out infinite alternate;
}

    .glowtext:hover {
        -webkit-animation: none;
        -moz-animation: none;
        animation: none;
    }

@-webkit-keyframes gold {
    from {
        text-shadow: 0 0 5px #fff, 0 0 5px #fff, 0 0 8px #fff, 0 0 0.2px #dfc253, 0 0 .5px #dfc253, 0 0 1px #dfc253, 0 0 2px #dfc253, 0 0 5px #dfc253;
    }

    to {
        text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 4px #fff, 0 0 0 0px #dfc253, 0 0 0px #dfc253, 0 0 0px #dfc253, 0 0 0 #dfc253, 0 0 0 #dfc253;
    }
}

.nav-menu #login-trigger {
    border-radius: 3px 0 0 3px;
    background-color: Transparent;
}


#slider {
    display: none;
}

.login-content {
    background: #fff;
    border: 1px solid #ccc;
    min-width: 250px;
    color: #000;
    -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
    outline: none;
    position: absolute;
    right: 30px;
    top: 50px;
    margin-right: 6%;
    -webkit-animation: gb__a .2s;
    animation: gb__a .2s;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    -webkit-user-select: text;
    -webkit-animation: fadein .5s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein .5s; /* Firefox < 16 */
    -ms-animation: fadein .5s; /* Internet Explorer */
    -o-animation: fadein .5s; /* Opera < 12.1 */
    animation: fadein .5s;
    z-index: 1;
}

    .login-content:after {
        position: absolute;
        top: -6px;
        right: 12px;
        left: auto;
        display: inline-block;
        border-right: 6px solid transparent;
        border-bottom: 6px solid #fff;
        border-left: 6px solid transparent;
        content: '';
    }


    .login-content:before {
        position: absolute;
        top: -7px;
        right: 11px;
        left: auto;
        display: inline-block;
        border-right: 7px solid transparent;
        border-bottom: 7px solid #ccc;
        border-left: 7px solid transparent;
        border-bottom-color: rgba(0,0,0,0.2);
        content: '';
    }

    .login-content > .row {
        padding: 10px;
        margin: 0;
    }

    .login-content .bottom-login {
        background: #f5f5f5;
        width: 98%;
        height: auto;
        border-top: 1px solid #ccc;
        border-color: rgba(0,0,0,.2);
        padding: 10px 1%;
        overflow: auto;
    }

#ReminderNotification {
    right: 100px;
    display: none;
    z-index: 1;
}

    #ReminderNotification .Notifications {
        max-height: 200px;
        min-height: 100px;
        overflow: hidden;
    }

    #ReminderNotification .NotifyItem {
        padding: 10px 5px;
        background-color: #FFFFFF;
        border: 1px solid #d7e3f0;
        border-top: none;
        font-style: italic;
    }

        #ReminderNotification .NotifyItem .text-right {
            font-style: normal;
        }

        #ReminderNotification .NotifyItem span {
            font-size: 8pt;
        }

#slider a {
    padding: 7px 0px;
}

    #slider a:hover {
        color: #262673;
    }

#login li #login-content {
    right: 0;
    width: auto;
}

#login a:hover {
    cursor: pointer;
}

#login input[type="text"], #login input[type="password"] {
    height: 35px;
    font-size: 14px;
    color: #8e8d8d;
    font-family: "Droid Sans";
    text-indent: 50px;
    background-color: #fdfdfd;
    width: 180px;
    display: block;
    border: 1px solid #d8d8d8;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    box-shadow: inset 2px 2px 4px #f1f1f1;
    outline: none
}

.user {
    background: url(../images/user.png) no-repeat
}

.password {
    background: url(../images/password.png) no-repeat
}

/* @@@@@@ Commented for Login Black Color @@@@@@@@@@@*/
/*.user:-webkit-autofill,
.user:-webkit-autofill:hover,
.user:-webkit-autofill:focus,
.user:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
     -webkit-text-fill-color: inherits;
}

.password:-webkit-autofill,
.password:-webkit-autofill:hover,
.password:-webkit-autofill:focus,
.password:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
     -webkit-text-fill-color: inherits; 
} */
.main-login {
    margin: 0px 30%;
    min-height: 550px;
}

.login {
    margin: -30px auto;
    margin-left: 100px;
    padding: 18px 20px;
    width: 230px;
    background: #28166F;
    background-clip: padding-box;
    border: 1px solid #172b4e;
    border-bottom-color: #142647;
    border-radius: 5px;
    background-image: -webkit-radial-gradient(cover, #28166F, #645EBB);
    background-image: -moz-radial-gradient(cover, #28166F, #645EBB);
    background-image: -o-radial-gradient(cover, #28166F, #645EBB);
    background-image: radial-gradient(cover, #28166F, #645EBB);
    -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), inset 0 0 1px 1px rgba(255, 255, 255, 0.1), 0 2px 10px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), inset 0 0 1px 1px rgba(255, 255, 255, 0.1), 0 2px 10px rgba(0, 0, 0, 0.5);
}

    .login > h1 {
        margin-bottom: 20px;
        font-size: 16px;
        font-weight: bold;
        color: white;
        text-align: center;
        text-shadow: 0 -1px rgba(0, 0, 0, 0.4);
    }

.login-input {
    border-left: 1px solid #15243b !important;
    border-right: 1px solid #15243b !important;
    border-top: 1px solid #0d1827 !important;
    border-bottom: 1px solid #15243b !important;
    background-position: 0% 0%;
    display: block;
    width: 200px !important;
    height: 37px;
    margin-bottom: 20px;
    padding: 0 9px !important;
    color: #fff !important;
    text-shadow: 0 1px black;
    border-radius: 4px;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)) !important;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2) !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2) !important;
    background-color: #2b3e5d !important;
    background-repeat: repeat !important;
    background-attachment: scroll !important;
}

    .login-input:focus {
        outline: 0;
        background-color: #32486d !important;
        -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 4px 1px rgba(255, 255, 255, 0.6) !important;
        box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 4px 1px rgba(255, 255, 255, 0.6) !important;
    }

    .login-input:-webkit-autofill,
    .login-input:-webkit-autofill:hover,
    .login-input:-webkit-autofill:focus,
    .login-input:-webkit-autofill:active {
        transition: background-color 5000s ease-in-out 0s;
        -webkit-text-fill-color: inherits;
    }

.lt-ie9 .login-input {
    line-height: 35px;
}

.login input[type=submit] {
    display: block;
    width: 200px;
    height: 37px;
    margin-bottom: 15px;
    font-size: 14px;
    font-weight: bold;
    color: #294779 !important;
    text-align: center;
    text-shadow: 0 1px rgba(255, 255, 255, 0.3);
    background: #adcbfa;
    background-clip: padding-box;
    border: 1px solid #284473;
    border-bottom-color: #223b66;
    border-radius: 4px;
    cursor: pointer;
    background-image: -webkit-linear-gradient(top, #d0e1fe, #96b8ed) !important;
    background-image: -moz-linear-gradient(top, #d0e1fe, #96b8ed) !important;
    background-image: -o-linear-gradient(top, #d0e1fe, #96b8ed) !important;
    background-image: linear-gradient(to bottom, #d0e1fe, #96b8ed) !important;
    -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15) !important;
}

    .login input[type=submit]:active, .login input[type=submit]:hover {
        -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.1) !important;
        box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.1) !important;
        outline: none;
        background-image: linear-gradient(to bottom, #AABBD8, #6F92CA) !important;
    }

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

    .login-help > a {
        font-size: 11px;
        color: #d4deef;
        text-decoration: none;
        text-shadow: 0 -1px rgba(0, 0, 0, 0.4);
    }

        .login-help > a:hover {
            text-decoration: underline;
        }



/*********************************************************************************************

3. Main Menu

*********************************************************************************************/
.btn_menu {
    display: none;
}

#nav-main-menu {
    background-color: #e5e5e5;
    ;
    padding: 2px 0 0;
    position: relative;
    display: block;
    width: 100%;
    overflow-y: auto;
    padding-right: 10px;
    border-bottom: solid 5px #303695;
    min-height: 53px;
}

#menu-main {
    padding-top: 2px;
    position: relative;
    list-style-type: none;
    float: right;
    padding: 0;
    margin: 0px !important;
}


    #menu-main li {
        display: inline-block;
        float: left;
        font-size: 15px;
        padding: 0;
        position: relative;
    }

    #menu-main .cleaner {
        clear: both;
        display: block;
        height: 1px;
        float: none;
        font-size: 1px;
        line-height: 1px;
    }


    #menu-main li.cleaner {
        font-size: 1px;
        height: 1px;
        line-height: 1px;
        clear: both;
        float: none;
        display: block;
    }

    #menu-main li:hover {
        visibility: inherit; /* fixes IE7 'sticky bug' */
    }

    #menu-main li:last-child {
        border-right: 0;
    }

    #menu-main a {
        color: #303695;
        font-weight: bolder;
        padding: 10px 10px;
        display: block;
        min-width: 100px;
        position: relative;
    }

        #menu-main a:hover,
        #menu-main a:focus,
        #menu-main li.active a,
        #menu-main a:active,
        #menu-main li.active a {
            color: #FFF;
            background: #303695;
            border-bottom: solid 5px #303695;
        }


/*********************************************************************************************

3. Main Container

*********************************************************************************************/
#main-container {
    width: 100%;
    overflow: auto;
}

    #main-container .main-content {
        width: 72%;
        float: left;
        margin: 1% 2%;
    }

    #main-container .report-content {
        width: 74.5%;
        float: left;
    }

        #main-container .report-content input[type=text] {
            background: #fff;
        }

    #main-container .side-content {
        width: 20%;
        float: left;
        padding: 20px 0;
    }

    #main-container .button-content {
        background: rgba(65, 65, 126, 0.8);
        border-bottom: 1px solid #b9c7d0;
        border-top: 1px solid #b9c7d0;
        padding: 5px 10px;
        overflow: auto;
        width: 100%;
        min-height: 35px;
    }

    #main-container .content {
        width: 100%;
        background-color: #fff;
        padding: 20px;
        min-height: 500px;
        /*overflow-y: auto;
        overflow-x:hidden;*/
        overflow: hidden;
        -webkit-box-shadow: 0 0px 5px rgba(0, 0, 0, 0.3);
        box-shadow: 0 0px 5px rgba(0, 0, 0, 0.3);
        box-shadow-top: none;
    }

    #main-container .content-no-bg {
        width: 80%;
        margin: 10px 10%;
        min-height: 500px;
    }

    #main-container .content-small {
        width: 80%;
        margin: 10px 10%;
        min-height: 500px;
        background: #f5f5f5;
        padding: 10px;
        -moz-box-shadow: inset 0 0 0 0 rgba(0,0,0,.4),-2px -3px 5px -2px rgba(0,0,0,.4);
        -webkit-box-shadow: inset 0 0 0 0 rgba(0,0,0,.4),-2px -3px 5px -2px rgba(0,0,0,.4);
        box-shadow: inset 0 0 0 0 rgba(0,0,0,.4),-2px -3px 5px -2px rgba(0,0,0,.4);
    }

.box-shadow {
    -webkit-box-shadow: 0 0 1px 5px rgba(0, 0, 0, 0.3);
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
}

.white-bg {
    -webkit-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.0.5);
    -moz-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.05);
    box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.05);
    overflow: visible;
    padding: 40px 10px;
}

.widget-grey {
    background-position: center center;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    padding: 20px 10px;
}

.widget-gold {
    background: url('../Images/bg3.jpg');
    color: #675314;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    padding: 60px !important;
    min-height: 400px;
}



#findcourse select {
    background-color: #f3f3f3;
    border: solid 1px #e9e9e9;
    color: #888;
    font-size: 15px;
    padding: 8px 3px 8px 3px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    width: 100%;
}

    #findcourse select:focus {
        outline: none;
    }

#findcourse input[type=submit] {
    background-color: #4073A5;
    background-repeat: repeat-x;
    background-image: -moz-linear-gradient(top, #10406F, #4073A5);
    background-image: -ms-linear-gradient(top, #10406F, #4073A5);
    background-image: -webkit-linear-gradient(top,#10406F, #4073A5);
    background-image: -o-linear-gradient(top, #10406F, #4073A5);
    border-color: #4073A5 #4073A5 #4073A5;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    text-shadow: #fff 1px 1px 0;
    padding: 10px 20px;
    color: #fff;
}

    #findcourse input[type=submit]:hover,
    #findcourse input[type=submit]:focus {
        background-position: 0 -15px;
        text-decoration: none;
        cursor: pointer;
    }

.notepaper {
    position: relative;
    clear: both;
    padding: 20px 20px 20px 45px;
    line-height: 20px;
    color: #6D6C6C;
    text-shadow: 0 1px 1px white;
    background-image: -webkit-radial-gradient(center, cover, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.1) 90%), -webkit-repeating-linear-gradient(top, transparent, transparent 29px, rgba(255, 255, 255, 0.7) 29px, rgba(255, 255, 255, 0.7) 30px);
    background-image: -moz-radial-gradient(center, cover, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.1) 90%), -moz-repeating-linear-gradient(top, transparent, transparent 29px, rgba(255, 255, 255, 0.7) 29px, rgba(255, 255, 255, 0.7) 30px);
    background-image: -o-radial-gradient(center, cover, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.1) 90%), -o-repeating-linear-gradient(top, transparent, transparent 29px, rgba(255, 255, 255, 0.7) 29px, rgba(255, 255, 255, 0.7) 30px);
    border: 1px solid #fff;
    border-color: rgba(255, 255, 255, 0.9);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 5px #fff, 0 0 1px rgba(0, 0, 0, 0.1), 0 2px rgba(0, 0, 0, 0.02);
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 5px #fff, 0 0 1px rgba(0, 0, 0, 0.1), 0 2px rgba(0, 0, 0, 0.02);
}

    .notepaper:before, .notepaper:after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
    }

    .notepaper:before {
        left: 28px;
        width: 2px;
        border: solid #eee;
        border-width: 0 1px;
    }

    .notepaper:after {
        z-index: -1;
        left: 0;
        right: 0;
        background: rgba(242, 246, 193, 0.9);
        border: 1px solid rgba(170, 157, 134, 0.7);
        -webkit-transform: rotate(2deg);
        -moz-transform: rotate(2deg);
        -ms-transform: rotate(2deg);
        -o-transform: rotate(2deg);
        transform: rotate(2deg);
    }

.quote {
    font-family: Georgia, serif;
    font-size: 14px;
    text-align: left;
}

.curly-quotes:before, .curly-quotes:after {
    display: inline-block;
    vertical-align: top;
    height: 30px;
    line-height: 48px;
    font-size: 50px;
    opacity: .2;
}

.curly-quotes:before {
    content: '\201C';
    margin-right: 4px;
    margin-left: -8px;
}

.curly-quotes:after {
    content: '\201D';
    margin-left: 4px;
    margin-right: -8px;
}

.quote-by {
    display: block;
    padding-right: 10px;
    text-align: right;
    font-size: 13px;
    font-style: italic;
    color: #1A4167;
}

.lt-ie8 .notepaper {
    padding: 15px 25px;
}

/**** Box-Menu *****/
.box {
    display: inline-block;
    float: left;
    margin: 20px 95px 20px 30px;
}

.box-gray {
    mix-blend-mode: none;
    display: block;
    background-color: rgb(214, 218, 222);
    background-image: -webkit-linear-gradient(top, rgb(255, 255, 255), rgb(214, 218, 222));
    background-image: -moz-linear-gradient(top, rgb(255, 255, 255), rgb(214, 218, 222));
    background-image: -ms-linear-gradient(top, rgb(255, 255, 255), rgb(214, 218, 222));
    background-image: -o-linear-gradient(top, rgb(255, 255, 255), rgb(214, 218, 222));
    color: #303695;
    width: 120px;
    font-size: 10pt;
    font-weight: bold !important;
    height: 120px;
    position: relative;
    text-align: center;
    line-height: 144px;
    border-radius: 50%;
    box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #fff;
    padding: 20px 10px;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}

    .box-gray:hover {
        box-shadow: 0px 1px 4px #aaa, inset 0px 1px 2px #fff;
        -moz-transform: scale(1.05);
        -webkit-transform: scale(1.05);
        -o-transform: scale(1.05);
        transform: scale(1.05);
        border: solid 10px #e5e5e5;
        background: rgba(255, 255, 255,0.8);
    }

    .box-gray h4, .box-gray i {
        margin-bottom: 5px;
    }

    .box-gray:hover {
        color: #1a4167;
    }

.para {
    text-align: justify;
}

/*...........................................

        Footer

...............................................*/

footer,
#footer-copy {
    background-color: #f5f5f5;
    color: #333333;
    font-size: 13px;
    line-height: 1.75em;
    margin-top: 10px;
    padding: 10px 0;
}

footer {
    padding-bottom: 0;
}

    footer p,
    #footer-copy p {
        margin: 0;
    }

    footer .widget p {
        margin-bottom: 1em;
    }

    footer .widget .title {
        color: #303695;
        font-size: 15px;
        font-weight: 700;
        margin-bottom: 15px;
    }

    footer a {
        color: #303695;
    }

        footer a:hover,
        footer a:focus {
            color: #1a4167;
        }

    footer .column {
        display: inline;
        float: left;
        margin-right: 2.4561%;
        width: 23.1578%;
    }

    footer .widget {
        margin-bottom: 20px;
    }

    footer .column-last {
        margin-right: 0 !important;
    }

#footer-copy {
    background-color: rgb(255,255,255);
    margin: 0;
}

    #footer-copy .wpzoom {
        display: inline;
        float: right;
    }

        #footer-copy .wpzoom a {
            color: #303695;
        }

            #footer-copy .wpzoom a:hover,
            #footer-copy .wpzoom a:focus {
                color: #dfc253;
            }

/****************************************

    Enquiry Form
***************************************/
.transition200 {
    transition: 200ms;
    -webkit-transition: 200ms;
    -o-transition: 200ms;
}

#enquiry-wrapper {
    position: absolute;
    left: 0px;
    width: 400px;
    height: 645px;
    overflow: hidden;
    z-index: 99999;
    top: 10px;
}

#dynamic {
    cursor: pointer;
    display: none;
    width: 100%;
    text-align: center;
    font-size: large;
    font-weight: bold;
}

.floating-enquiry-inner {
    position: absolute;
    background-color: #FAF8F8;
    font: 12px Arial, Helvetica, sans-serif;
    text-shadow: 0.1px 0.1px 0.1px #000;
    border-radius: 10px 0px 0px 10px;
    text-align: left;
    right: -400px;
    overflow: hidden;
    top: 40px;
    position: absolute;
    background-color: rgba(49, 49, 154, 0.9);
    width: 400px;
    overflow: hidden;
    color: #fff;
}

#floating-enquiry {
    padding: 10px;
}


#enquiry-btn {
    position: absolute;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0)";
    right: -50px;
    top: 500px;
    background: rgba(49, 49, 154, 0.9);
    border: 0.5px solid rgb(73, 116, 159);
    color: #fff;
    animation-name: font;
    font-weight: bold;
    text-decoration: none;
    height: 28px;
    line-height: 28px;
    width: 124px;
    text-transform: none;
    padding: 0;
    text-align: center;
    font-size: 14px;
    border-radius: 0;
    overflow: hidden;
}

/********************************************
        Account Menu

*********************************************/

/***********.ca-menu{
    padding:0;
    margin:20px 0;
    width: 100%;
	font-family: 'Dosis', sans-serif;
}
.ca-menu li{
    width: 100px;
    height: 100px;
    border: 10px solid #f6f6f6;
    overflow: hidden;
    position: relative;
    float:left;
    background: #fff;
    margin-right: 50px;
    margin-bottom:20px;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -webkit-border-radius: 125px;
    -moz-border-radius: 125px;
    border-radius: 125px;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}
.ca-menu li:last-child{
    margin-right: 0px;
}
.ca-menu li a
{
    border:none;
    text-decoration:none;
    text-align: left;
    width: 100%;
    height: 100%;
    display: block;
    color: #333;
    position: relative;
    margin-top:20px;
   

}
.ca-icon{
    font-family: 'WebSymbolsRegular', cursive;
    font-size: 20px;
    color: #f6f6f6;
    line-height: 20px;
    position:relative;
    width: 100%;
    
    margin-left:40px;
    margin-top:10px;
    height: 20px;
    
    text-align: center;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}
.ca-main{
    font-size: 12px;
    position:relative;
    margin-left:0px;
    margin-top:5px;
    height: 40px;
    width: 100px;
    
    opacity: 0.9;
    text-align: center;
}
.ca-sub{
    text-align:center;
    color: #000;
    font-size: 16px;
    position: absolute;
    height: 80px;
    width: 170px;
    left: 50%;
    margin-left: -85px;
    top: 30px;
    opacity: 0;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}
.ca-menu li:hover{
    background: #f7f7f7;
    border-color: #fff;
   
    box-shadow: 0 45px 60px -50px #000000;
}
.ca-menu li:hover .ca-icon{
    color: #555;
    font-size: 25px;
}
.ca-menu li:hover .ca-main{
     opacity: 0.8;
}****/

.ca-menu {
    padding: 0;
    width: 100%;
    font-family: 'Dosis', sans-serif;
    margin: 0;
}

    .ca-menu li {
        width: 88.8px;
        height: 88.8px;
        border-right: 1.5px solid #f6f6f6;
        border-bottom: 1.5px solid #f6f6f6;
        overflow: hidden;
        position: relative;
        float: left;
        background: #fff;
        -webkit-transition: all 400ms linear;
        -moz-transition: all 400ms linear;
        -o-transition: all 400ms linear;
        -ms-transition: all 400ms linear;
        transition: all 400ms linear;
    }

        .ca-menu li:last-child {
            margin-right: 0px;
        }

        .ca-menu li a {
            border: none;
            text-decoration: none;
            text-align: left;
            width: 100%;
            height: 100%;
            display: block;
            color: #333;
            position: relative;
            padding-top: 20px;
            -moz-box-shadow: 0px 0px 3px #000000;
            -webkit-box-shadow: 0px 0px 3px #000000;
            box-shadow: 0px 0px 3px #000000;
        }

.ca-icon {
    font-family: 'WebSymbolsRegular', cursive;
    font-size: 16px;
    color: #f6f6f6;
    line-height: 20px;
    position: relative;
    width: 100%;
    margin-left: 40%;
    margin-top: 10px;
    height: 20px;
    text-align: center;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}

.ca-main {
    font-size: 10px;
    position: relative;
    margin-left: 0px;
    margin-top: 5px;
    height: 40px;
    opacity: 0.9;
    font-weight: bolder;
    text-align: center;
}

.ca-sub {
    text-align: center;
    color: #000;
    font-size: 16px;
    position: absolute;
    height: 80px;
    width: 170px;
    left: 50%;
    margin-left: -85px;
    top: 30px;
    opacity: 0;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}

.ca-menu li a:hover, #menu li a.active {
    background: #f7f7f7;
    border-right: 1.5px solid #fff;
    border-bottom: 1.5px solid #fff;
    box-shadow: 0 45px 60px -50px #000000;
    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
}

.ca-menu li:hover .ca-icon {
    color: #555;
    font-size: 20px;
}

.ca-menu li:hover .ca-main {
    opacity: 0.8;
}

.ca-content {
    padding: 0 5px;
}

/*-------------------------
Ajax Tab Style
--------------------------*/


.ajax__myTab {
    outline: none;
}

    .ajax__myTab .ajax__tab_header {
        /*box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #FFF;*/
        text-shadow: 0 1px #FFF;
        margin: 0 0;
        padding: 0 0;
        float: left;
        font-size: 10pt;
        font-weight: 500;
    }

    .ajax__myTab .ajax__tab_outer {
        line-height: 1.42857143;
        border: 1px solid transparent;
        border-radius: 4px 4px 0 0;
        border-bottom: 1px solid #ddd;
        padding: 0px 7px;
    }

    .ajax__myTab .ajax__tab_inner {
        color: #999999;
    }

    .ajax__myTab .ajax__tab_tab {
        padding: 2px;
        margin: 0;
        outline: none;
    }

    .ajax__myTab .ajax__tab_hover .ajax__tab_outer {
        color: #555;
    }

    .ajax__myTab .ajax__tab_hover .ajax__tab_inner {
        color: #555;
    }

    .ajax__myTab .ajax__tab_hover .ajax__tab_tab {
        color: #111;
    }

    .ajax__myTab .ajax__tab_active .ajax__tab_outer {
        cursor: default;
        background: rgba(255,255,255,0.5);
        border: 1px solid #ddd;
        border-bottom-color: transparent;
        color: #999999;
        outline: none;
    }

    .ajax__myTab .ajax__tab_active .ajax__tab_tab {
        color: #111;
        border-style: none;
        outline: none;
    }

    .ajax__myTab .ajax__tab_body {
        font-family: verdana,tahoma,helvetica;
        font-size: 10pt;
        border-top: 0;
        padding: 20px;
        outline: none;
        background: rgba(255,255,255,0.5);
        min-height: 100%;
        float: left;
        overflow-y: auto;
        width: 100%
    }

    .ajax__myTab .ajax__tab_panel {
        outline: none;
    }


/********************   *********************/

.ajax__MenuTab {
    outline: none;
}

    .ajax__MenuTab .ajax__tab_header {
        /*box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #FFF;*/
        text-shadow: 0 1px #FFF;
        margin: 0 0;
        padding: 0 0;
        float: left;
        font-size: 10pt;
        font-weight: 500;
    }

    .ajax__MenuTab .ajax__tab_outer {
        line-height: 1.42857143;
        border: 1px solid transparent;
        border-radius: 4px 4px 0 0;
        border-bottom: 1px solid #ddd;
        padding: 0px 10px;
    }

    .ajax__MenuTab .ajax__tab_inner {
        color: #fff;
    }

    .ajax__MenuTab .ajax__tab_tab {
        padding: 4px;
        margin: 0;
        outline: none;
        color: #fff;
    }

    .ajax__MenuTab .ajax__tab_hover .ajax__tab_outer {
        color: #fff;
    }

    .ajax__MenuTab .ajax__tab_hover .ajax__tab_inner {
        color: #fff;
    }

    .ajax__MenuTab .ajax__tab_hover .ajax__tab_tab {
        color: #fff;
    }

    .ajax__MenuTab .ajax__tab_active .ajax__tab_outer {
        cursor: default;
        background: rgb(255,255,255);
        border: 1px solid #ddd;
        border-bottom-color: transparent;
        color: #999999;
        outline: none;
    }

    .ajax__MenuTab .ajax__tab_active .ajax__tab_tab {
        color: #000;
        border-style: none;
        outline: none;
    }

    .ajax__MenuTab .ajax__tab_body {
        font-family: verdana,tahoma,helvetica;
        font-size: 10pt;
        outline: none;
        background-image: linear-gradient(to bottom,#fff,#ffffff);
        background-repeat: repeat-x;
        border-left: 1px solid #d4d4d4;
        float: left;
        width: 100%;
    }

    .ajax__MenuTab .ajax__tab_panel {
        outline: none;
    }

/*************Ajax Calender Style***************/

.cal_Theme1 .ajax__calendar_container {
    background-color: #e2e2e2;
}

.cal_Theme1 .ajax__calendar_header {
    background-color: #1a4167;
    border-bottom: solid 2px #dfc253;
    background-image: -webkit-gradient(linear,left top,left bottom,from(#ebf3fc),to(#dce9f9));
    background-image: -webkit-linear-gradient(top,#1A4167,#6487A9);
    background-image: -moz-linear-gradient(top,#1A4167,#6487A9);
    background-image: -ms-linear-gradient(top,#1A4167,#6487A9);
    background-image: -o-linear-gradient(top,#1A4167,#6487A9);
    background-image: linear-gradient(to bottom,#1A4167,#6487A9);
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    -moz-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    border-top: 0;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
    color: #fff;
    text-align: center;
}

.cal_Theme1 .ajax__calendar_title,
.cal_Theme1 .ajax__calendar_next,
.cal_Theme1 .ajax__calendar_prev {
    color: #fff;
    padding-top: 3px;
    text-align: center;
}

.cal_Theme1 .ajax__calendar_body {
    background-color: #e9e9e9;
    border: solid 1px #cccccc;
}

.cal_Theme1 .ajax__calendar_dayname {
    text-align: center;
    font-weight: bold;
    margin-bottom: 4px;
    margin-top: 2px;
}

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

.cal_Theme1 .ajax__calendar_hover .ajax__calendar_day,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_month,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_year,
.cal_Theme1 .ajax__calendar_active {
    color: #004080;
    font-weight: bold;
    background-color: #ffffff;
}

.cal_Theme1 .ajax__calendar_today {
    font-weight: bold;
    font-size: 9pt;
}

.cal_Theme1 .ajax__calendar_other,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_title {
    color: #bbbbbb;
}

.cal_Theme1 .ajax__calendar_hover .ajax__calendar_today {
    text-shadow: 2px 2px #fff;
}



/*******************************

    Panel Details

****************************/
.panel-profile {
    float: left;
    width: 23%;
    background-color: #fff;
    border-right: solid 1px #AFBDCB;
    /* min-height:800px;*/
    min-height: 300px;
}

.panelDetails {
    background-color: #e8ebee;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    padding: 10px;
    border-top: solid 2px #D8E1EB;
    /* min-height:800px;*/
    min-height: 300px;
}
/*******************************

    Modal PopUp

****************************/

.modalBackground {
    background-color: Black;
    filter: alpha(opacity=40);
    opacity: 0.6;
}

.modalPopup {
    background-color: #FFFFFF;
    width: auto;
    height: auto;
    border-radius: 10px 10px 0px 0px;
}

    .modalPopup .header {
        background-color: #EBEBEB;
        background-image: -webkit-gradient(linear,left top,left bottom,from(#EBEBEB),to(#E9E3E3));
        background-image: -webkit-linear-gradient(top,#EBEBEB,#E9E3E3);
        background-image: -moz-linear-gradient(top,#EBEBEB,#E9E3E3);
        background-image: -ms-linear-gradient(top,#EBEBEB,#E9E3E3);
        background-image: -o-linear-gradient(top,#EBEBEB,#E9E3E3);
        background-image: linear-gradient(to bottom,#EBEBEB,#E9E3E3);
        -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
        -moz-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
        box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
        border-top: 0;
        text-shadow: 0 1px 0 rgba(255,255,255,.5);
        color: #5a5a5a;
        font-weight: bold;
        text-align: center;
        border-radius: 10px 10px 0px 0px;
        padding: 10px 5px;
    }

    .modalPopup .body {
        min-height: 50px;
        line-height: 30px;
        text-align: center;
        padding: 5px;
    }


.PopupBackground {
    background-color: rgba(25,25,25,0.5);
    display: none;
    width: 100%;
    height: 100%;
    top: 0%;
    left: 0%;
    z-index: 1;
}

.Popup {
    background-color: #FFFFFF;
    width: auto;
    height: auto;
    border-radius: 10px 10px 0px 0px;
    position: fixed;
    z-index: 999999;
    top: 10%;
    left: 30%;
    max-height: 500px;
}

    .Popup .header {
        background-color: #EBEBEB;
        background-image: -webkit-gradient(linear,left top,left bottom,from(#EBEBEB),to(#E9E3E3));
        background-image: -webkit-linear-gradient(top,#EBEBEB,#E9E3E3);
        background-image: -moz-linear-gradient(top,#EBEBEB,#E9E3E3);
        background-image: -ms-linear-gradient(top,#EBEBEB,#E9E3E3);
        background-image: -o-linear-gradient(top,#EBEBEB,#E9E3E3);
        background-image: linear-gradient(to bottom,#EBEBEB,#E9E3E3);
        -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
        -moz-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
        box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
        border-top: 0;
        text-shadow: 0 1px 0 rgba(255,255,255,.5);
        color: #5a5a5a;
        font-weight: bold;
        text-align: center;
        border-radius: 10px 10px 0px 0px;
        padding: 10px 5px;
    }

    .Popup .body {
        min-height: 50px;
        line-height: 30px;
        text-align: center;
        padding: 5px;
    }

.show {
    position: fixed;
    display: block;
    transition: display 2s ease-in-out;
    -moz-transition: display 2s ease-in-out;
    -webkit-transition: display 2s ease-in-out;
}

.alert-danger {
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
}

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

.close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .2;
    filter: alpha(opacity=20);
}

.labelBold {
    margin: 20px 0px;
    font-weight: bold;
}

.Message {
    background-color: rgba(73, 116, 159,0.9);
    color: #fff;
    padding: 20px 50px;
    position: fixed;
    top: 30px;
    right: 30px;
    border-radius: 10px;
    z-index: 9;
}

.errorMessage {
    font-size: 9pt;
    color: #DC2B2A;
}

.toTop {
    width: 40px;
    height: 40px;
    background: #303695;
    -webkit-border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0;
    -moz-transition: 0.3s;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    -moz-box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4);
    box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4);
    color: #fff;
    position: fixed;
    right: 10px;
    bottom: 0px;
    display: none;
    overflow: hidden;
    text-align: center;
    text-decoration: none;
    z-index: 99999;
    display: none;
    padding: 5px;
}

    .toTop:before {
        line-height: 47px;
        font-size: 22px;
        font-weight: 700;
    }

    .toTop:focus {
        color: #fff;
        background: #1E2171;
        -moz-box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4);
        -webkit-box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4);
        box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4);
    }

    .toTop:hover {
        color: #fff;
        background: #1E2171;
        text-decoration: none;
    }
/************Phto Gallery**************/
#thumbs {
    margin: 0;
    padding: 0;
}

    #thumbs li {
        list-style-type: none;
    }

.item-thumbs {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

    .item-thumbs a + img {
        width: 100%;
        height: 100%;
        min-height: 220px;
    }

    .item-thumbs .hover-wrap {
        position: absolute;
        display: block;
        width: 100%;
        height: 100%;
        opacity: 0;
        filter: alpha(opacity=0);
        -webkit-transition: all 450ms ease-out 0s;
        -moz-transition: all 450ms ease-out 0s;
        -o-transition: all 450ms ease-out 0s;
        transition: all 450ms ease-out 0s;
        -webkit-transform: rotateY(180deg) scale(0.5,0.5);
        -moz-transform: rotateY(180deg) scale(0.5,0.5);
        -ms-transform: rotateY(180deg) scale(0.5,0.5);
        -o-transform: rotateY(180deg) scale(0.5,0.5);
        transform: rotateY(180deg) scale(0.5,0.5);
    }

    .item-thumbs:hover .hover-wrap,
    .item-thumbs.active .hover-wrap {
        opacity: 1;
        filter: alpha(opacity=100);
        -webkit-transform: rotateY(0deg) scale(1,1);
        -moz-transform: rotateY(0deg) scale(1,1);
        -ms-transform: rotateY(0deg) scale(1,1);
        -o-transform: rotateY(0deg) scale(1,1);
        transform: rotateY(0deg) scale(1,1);
    }

    .item-thumbs .hover-wrap .overlay-img {
        position: absolute;
        width: 50%;
        height: 100%;
        opacity: 0.80;
        filter: alpha(opacity=80);
        background: #000;
    }

    .item-thumbs .hover-wrap .overlay-img-thumb {
        position: absolute;
        border-radius: 60px;
        top: 50%;
        left: 50%;
        margin: -16px 0 0 -16px;
        color: #fff;
        font-size: 32px;
        line-height: 1em;
        opacity: 1;
        filter: alpha(opacity=100);
    }

.demo1 {
    margin: 0 !important;
    display: block;
    padding: 0;
}

.photo-gallery {
    padding: 0 0 0 0;
    margin: 0 0 0 0;
}

    .photo-gallery td {
        list-style: none;
        padding-bottom: 25px;
        padding-right: 3px;
    }

        .photo-gallery td img {
            cursor: pointer;
        }

        .photo-gallery td > img {
            display: none;
        }

    .photo-gallery .FooterStyle span {
        font-size: 10px;
        display: block;
        float: left;
        margin-top: 5px;
        max-width: 130px;
        word-break: break-all;
    }

    .photo-gallery .FooterStyle a {
        padding: 2px;
    }

    .photo-gallery .FooterStyle input[type=checkbox] {
        float: left;
    }

.modal-body {
    padding: 5px !important;
}

.modal-content {
    border-radius: 0;
}

.modal {
    background: rgba(25,25,25,0.3);
    overflow: hidden;
}

.modal-dialog img {
    text-align: center;
    margin: 0 auto;
}

.controls {
    width: 50px;
    display: block;
    font-size: 11px;
    padding-top: 8px;
    font-weight: bold;
}

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

.previous {
    float: left;
    text-align: left;
}
/*override modal for demo only*/
.modal-dialog {
    max-width: 900px;
    max-height: 500px;
    z-index: 1px;
}

.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05)
}

.panel-body {
    padding: 15px;
    background: rgba(255,255,255,0.9)
}

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    overflow: visible;
}

.panel-info {
    border-color: #bce8f1
}

    .panel-info > .panel-heading {
        color: #31708f;
        background-color: #d9edf7;
        border-color: #bce8f1
    }

        .panel-info > .panel-heading + .panel-collapse .panel-body {
            border-top-color: #bce8f1
        }

    .panel-info > .panel-footer + .panel-collapse .panel-body {
        border-bottom-color: #bce8f1
    }

.panel-warning {
    border-color: #faebcc
}

    .panel-warning > .panel-heading {
        color: #8a6d3b;
        background-color: #fcf8e3;
        border-color: #faebcc
    }

        .panel-warning > .panel-heading + .panel-collapse .panel-body {
            border-top-color: #faebcc
        }

    .panel-warning > .panel-footer + .panel-collapse .panel-body {
        border-bottom-color: #faebcc
    }

.panel-default {
    min-height: 500px;
}

    .panel-default > .panel-heading {
        color: #333;
        background-color: #fff;
        border-color: #ddd
    }

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.btn-primary {
    color: #fff;
    background-color: #428bca;
    border-color: #357ebd
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        color: #fff;
        background-color: #3276b1;
        border-color: #285e8e
    }


/* loading 10042016 */
.loading {
    display: block;
    box-sizing: border-box;
    margin: 0 auto;
    width: auto;
    height: auto;
    padding: 20px;
    background-color: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: inset 0px 0px 10px 0px rgba(100,100,100,0.2), 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
    border-radius: 100%;
    color: #fff;
    text-align: center;
    text-decoration: none;
    letter-spacing: 1px;
    transition: all 0.3s ease-out;
    position: fixed;
    top: 40%;
    left: 45%
}




.GScroll {
    position: relative;
    overflow: hidden;
}

    .GScroll > .GScroll-scrollable {
        position: absolute;
        width: 100%;
        top: 0px;
        left: 0px;
    }

    .GScroll > .GScroll-bar {
        position: absolute;
        width: 10px;
        min-height: 10px;
        top: 0px;
        right: 0px;
        display: none;
        background-color: rgba(255, 255, 255,0.6);
        cursor: move;
        z-index: 2
    }


/* CHECK BOX Square*/
.square-chk {
    width: 18px;
    margin: auto;
    position: relative;
}

    .square-chk label {
        cursor: pointer;
        position: absolute;
        width: 18px;
        height: 18px;
        top: 0;
        border-radius: 4px;
        -webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
        -moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
        box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
        background: #fcfff4;
        background: -webkit-linear-gradient(top, #fcfff4 0%, #FFFFFF 40%, #F9F9F9 100%);
        background: -moz-linear-gradient(top, #fcfff4 0%, #FFFFFF 40%, #F9F9F9 100%);
        background: -o-linear-gradient(top, #fcfff4 0%, #FFFFFF 40%, #F9F9F9 100%);
        background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
        background: linear-gradient(top, #fcfff4 0%, #FFFFFF 40%, #F9F9F9 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
    }

        .square-chk label:after {
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
            filter: alpha(opacity=0);
            opacity: 0;
            content: '';
            position: absolute;
            width: 9px;
            height: 5px;
            background: transparent;
            top: 4px;
            left: 4px;
            border: 3px solid #333;
            border-top: none;
            border-right: none;
            -webkit-transform: rotate(-45deg);
            -moz-transform: rotate(-45deg);
            -o-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
        }

    .square-chk input[type=checkbox] {
        display: none;
    }

    .square-chk label:hover::after {
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
        filter: alpha(opacity=30);
        opacity: 0.5;
    }

    .square-chk input[type=checkbox]:checked + label:after {
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter: alpha(opacity=100);
        opacity: 1;
    }

.input-group input, .input-group select {
    background: #fff;
}


/***********Crystal Report **********/
#ContentPlaceHolder1_crvReports__UI_mb {
    height: auto !important;
}

.crtoolbar table td table {
    width: 100%;
}

    .crtoolbar table td table td table {
        width: 5% !important;
    }

.insetBorder {
    background-color: transparent !important;
    border-bottom: none !important;
    border-right: none !important;
    border-top: none !important;
    border-left: none !important;
    -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 2s; /* Firefox < 16 */
    -ms-animation: fadein 2s; /* Internet Explorer */
    -o-animation: fadein 2s; /* Opera < 12.1 */
    animation: fadein 2s;
    overflow: hidden !important;
}

    .insetBorder > div {
        width: 100% !important;
        height: 953px;
        z-index: 1;
        border-width: 1px;
        border-style: none !important;
        background-color: transparent !important;
        text-align: left;
        border-color: transparent !important;
        margin: 0 !important;
        top: 0px !important;
    }

.dialogzone {
    width: 100% !important;
    background-color: rgba(238, 238, 238, 0.2) !important;
    color: black;
    font-family: Tahoma,sans-serif;
    font-size: 11px;
}

    .dialogzone > div {
        background-image: none !important;
    }

.hideableFrame {
    background-image: none !important;
    display: block;
    width: 120px !important;
}

.crtoolbar {
    background: #F5F5F5 url('') repeat-x 0px 0px !important;
}

.menuShadow {
    background-color: transparent !important;
}

.textinputs {
}

.crystalstyle {
    background-color: #fff !important;
}

/***** Form -Imnilne**********/
.form-inline {
    margin-bottom: 10px;
}


    .form-inline .form-group {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: middle;
        width: 100%;
    }

.input-group {
    position: relative;
    display: table;
    border-collapse: separate;
    table-layout: fixed;
}

.input-group-btn {
    position: relative;
    font-size: 0;
    white-space: nowrap;
}

.input-group-addon {
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    min-height: 28px;
    color: #555;
    text-align: center;
    background-color: #eee;
    min-width: 120px;
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
    display: table-cell;
}

    .input-group-addon:first-child {
        margin-left: 0;
    }

.input-group input, .input-group select {
    background: #fff;
    display: table-cell;
    padding: 5px 0px;
    text-indent: 5px;
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/******** Filter Buttton****************/



button.filter-button,
div.filter-button,
a.filter-button {
    position: relative;
    display: inline;
    margin-right: 30px;
    padding: 6px 12px;
    border: 1px solid #999;
    cursor: pointer;
    *cursor: hand;
    font-size: 0.88em;
    color: black !important;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: 1px 1px 3px #ccc;
    -moz-box-shadow: 1px 1px 3px #ccc;
    -ms-box-shadow: 1px 1px 3px #ccc;
    -o-box-shadow: 1px 1px 3px #ccc;
    box-shadow: 1px 1px 3px #ccc;
    /* Generated by http://www.colorzilla.com/gradient-editor/ */
    background: #ffffff; /* Old browsers */
    background: -webkit-linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* Chrome10+,Safari5.1+ */
    background: -moz-linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* FF3.6+ */
    background: -ms-linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* IE10+ */
    background: -o-linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* Opera 11.10+ */
    background: linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f9f9f9',GradientType=0 ); /* IE6-9 */
}


/* Buttons are cunning border-box sizing - we can't just use that for A and DIV due to IE6/7 */
button.filter-button {
    height: 30px;
    padding: 3px 8px;
}

.filter-button embed {
    outline: none;
}

button.filter-button:hover,
div.filter-button:hover,
a.filter-button:hover {
    border: 1px solid #666;
    text-decoration: none !important;
    -webkit-box-shadow: 1px 1px 3px #999;
    -moz-box-shadow: 1px 1px 3px #999;
    -ms-box-shadow: 1px 1px 3px #999;
    -o-box-shadow: 1px 1px 3px #999;
    box-shadow: 1px 1px 3px #999;
    background: #f3f3f3; /* Old browsers */
    background: -webkit-linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* Chrome10+,Safari5.1+ */
    background: -moz-linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* FF3.6+ */
    background: -ms-linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* IE10+ */
    background: -o-linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* Opera 11.10+ */
    background: linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f3f3', endColorstr='#f4f4f4',GradientType=0 ); /* IE6-9 */
}

button.DTTT_button:focus,
div.DTTT_button:focus,
a.DTTT_button:focus {
    border: 1px solid #426c9e;
    text-shadow: 0 1px 0 #c4def1;
    outline: none;
    background-color: #a3d0ef 100%;
    background-image: linear-gradient(top, #a3d0ef 0%, #79ace9 65%, #a3d0ef 100%);
}

button.filter-button:active,
div.filter-button:active,
a.filter-button:active {
    -webkit-box-shadow: inset 1px 1px 3px #999999;
    -moz-box-shadow: inset 1px 1px 3px #999999;
    box-shadow: inset 1px 1px 3px #999999;
}


/******** Date Box********/


.datebox {
    float: left;
    background-color: #2c7ad0;
    border: 1px solid #000000;
    color: #ffffff;
    position: relative;
    margin: 5%;
    width: 90%;
    height: 150px;
}




    .datebox .month {
        display: block;
        text-align: center;
        font-size: 30px;
        line-height: 30px;
        padding: 2px 0;
        background-color: #1e528c;
        text-transform: uppercase;
    }

    .datebox .day {
        display: block;
        text-align: center;
        font-size: 80px;
        line-height: 80px;
        font-weight: bold;
        padding: 10px;
    }

    .datebox .year {
        display: block;
        writing-mode: tb-rl;
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        transform: rotate(90deg);
        position: absolute;
        right: 0;
        bottom: 18px;
        font-size: 24px;
    }

    *:first-child + html .datebox .year {
        right: -28px;
    }
    /* IE7 positions element differently to IE6 & 8 */
    .datebox span:nth-child(3) {
        right: -8px;
        bottom: 50px;
        writing-mode: lr-tb;
    }


.toggle-radio input[type=radio] {
    display: none;
}

.toggle-radio label {
    border-left: 1px solid #e6e6e6;
    border-right: 1px solid #e6e6e6;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #b3b3b3;
    display: inline-block;
    padding: 4px 12px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
    color: #333;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255,255,255,0.75);
    vertical-align: middle;
    cursor: pointer;
    background-color: #f5f5f5;
    background-repeat: repeat-x;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    background-image: linear-gradient(to bottom,#fff,#e6e6e6);
    margin-left: -2px;
    margin-right: -2px;
    margin-top: -2px;
}

.toggle-radio input[type=radio]:checked + label {
    background-image: none;
    outline: 0;
    -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05);
    -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05);
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05);
    background-color: #e0e0e0;
}


/*****CheckBox************/
.sms-check {
    background: #fff;
    border: 1px solid #bbb;
    display: none;
    border-radius: 10px;
    padding: 0.25em;
    position: relative;
    width: 100px;
    -moz-appearance: none;
    z-index: 0;
}

    .sms-check label {
        display: inline-block;
        position: relative;
        float: left;
        padding: 2px 5px;
        cursor: pointer;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: -moz-none;
        -o-user-select: none;
        user-select: none;
    }

        .sms-check label::before {
            content: "";
            display: inline-block;
            position: absolute;
            width: 17px;
            height: 15px;
            top: 0px;
            right: 0;
            left: 100%;
            /* margin-left: -20px; */
            border: 1px solid #cccccc;
            border-radius: 50%;
            background-color: #fff;
            -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
            -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
            transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
        }

        .sms-check label::after {
            display: inline-block;
            position: absolute;
            width: 16px;
            height: 16px;
            top: 1px;
            left: 71px;
            padding-left: 5%;
            padding-top: 1%;
            font-size: 11px;
            color: #555555;
        }

.sms-float label::after {
    left: 74px;
}

.sms-check input[type="checkbox"] {
    opacity: 0;
}

    .sms-check input[type="checkbox"] + label::before {
        outline: none;
        border: solid 1px #555555;
    }

    .sms-check input[type="checkbox"]:checked + label::after {
        font-family: 'FontAwesome';
        content: "\f00c";
    }

    .sms-check input[type="checkbox"]:disabled + label {
        opacity: 0.65;
    }

        .sms-check input[type="checkbox"]:disabled + label::before {
            background-color: #eeeeee;
            cursor: not-allowed;
        }

    .sms-check input[type="checkbox"]:checked + label::before {
        background-color: #428bca;
        border-color: #428bca;
    }

    .sms-check input[type="checkbox"]:checked + label::after {
        color: #fff;
    }


/* @@@@@@@@@@--------------- 
 /****Jquery File Upload********/

.drop-zone {
    width: 100%;
    min-width: 685px;
    min-height: 150px;
    border: 3px dashed rgba(0, 0, 0, .3);
    border-radius: 5px;
    font-family: Arial;
    text-align: center;
    position: relative;
    font-size: 20px;
    color: #7E7E7E;
}

.clickHere {
    display: inline-block;
    cursor: pointer;
    color: white;
    font-size: 17px;
    width: 150px;
    border-radius: 4px;
    background-color: #4679BD;
    padding: 10px;
}

    .clickHere:hover {
        background-color: #376199;
    }

.drop-zone input {
    position: absolute;
    cursor: pointer;
    left: 0px;
    top: 0px;
    height: 0px;
    width: 0px;
    opacity: 0;
}

.drop-zone .photo-upload {
    height: 0;
    width: 0;
}

.filename {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 1.5em;
    width: 80%;
}

.file-preview {
    background: #ccc;
    border: 5px solid #fff;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
    display: inline-block;
    width: 60px;
    height: 60px;
    text-align: center;
    font-size: 14px;
    margin-top: 5px;
}

.closeBtn:hover {
    color: red;
}


/******Validation information****/
.validation-info {
    border: 3px dashed rgba(0, 0, 0, .3);
    padding: 5px;
    border-top: none;
    width: 98%;
    min-width: 675px;
}

    .validation-info ul {
        padding: 0;
        margin: 0;
    }

        .validation-info ul li {
            list-style-type: disc;
            list-style-position: inside;
        }

            .validation-info ul li span {
                line-height: 20px;
                font-size: 11px;
                color: Red;
            }

/****Bootstrap Modal****/


/****Bootstrap Modal****/


.close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .2;
    filter: alpha(opacity=20)
}

    .close:hover,
    .close:focus {
        color: #000;
        text-decoration: none;
        cursor: pointer;
        opacity: .5;
        filter: alpha(opacity=50)
    }

button.close {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none
}

.modal-open {
    overflow: hidden
}

.modal {
    display: none;
    overflow: auto;
    overflow-y: scroll;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9 !important;
    -webkit-overflow-scrolling: touch;
    outline: 0
}

    .modal.fade .modal-dialog {
        -webkit-transform: translate(0, -25%);
        -ms-transform: translate(0, -25%);
        transform: translate(0, -25%);
        -webkit-transition: -webkit-transform .3s ease-out;
        -moz-transition: -moz-transform .3s ease-out;
        -o-transition: -o-transform .3s ease-out;
        transition: transform .3s ease-out
    }

    .modal.in .modal-dialog {
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        transform: translate(0, 0)
    }

.modal-dialog {
    position: relative;
    width: auto;
    margin: 30px auto;
}

.modal-content {
    position: relative;
    background-color: #fff;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 6px;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    background-clip: padding-box;
    outline: 0
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000
}

    .modal-backdrop.fade {
        opacity: 0;
        filter: alpha(opacity=0);
        z-index: -1;
    }

    .modal-backdrop.in {
        opacity: .5;
        filter: alpha(opacity=50)
    }

.modal-header {
    padding: 15px;
    border-bottom: 1px solid #e5e5e5;
    min-height: 16.428571429px
}

    .modal-header .close {
        margin-top: -2px
    }

.modal-title {
    margin: 0;
    line-height: 1.428571429
}

.modal-body {
    position: relative;
    padding: 20px
}

.modal-footer {
    margin-top: 15px;
    padding: 19px 20px 20px;
    text-align: right;
    border-top: 1px solid #e5e5e5
}

    .modal-footer .btn + .btn {
        margin-left: 5px;
        margin-bottom: 0
    }

    .modal-footer .btn-group .btn + .btn {
        margin-left: -1px
    }

    .modal-footer .btn-block + .btn-block {
        margin-left: 0
    }

.fade.in {
    opacity: 1
}

.show {
    position: fixed;
    display: block;
    transition: display 2s ease-in-out;
    -moz-transition: display 2s ease-in-out;
    -webkit-transition: display 2s ease-in-out;
}


/*  _______ Check Box For Result and Exam _________Start____*/

span.true-false {
    position: relative;
}

.true-false input[type=checkbox] {
    cursor: pointer;
    height: 30px;
    margin: 4px 0 0;
    position: absolute;
    opacity: 0;
    width: 30px;
    z-index: 2;
}

    .true-false input[type=checkbox] + Label {
        background: #fff;
        border-radius: 50%;
        box-shadow: 0 2px 3px 0 rgba(0,0,0,.1);
        display: inline-block;
        height: 22px;
        margin: 4px 0 0;
        position: relative;
        width: 22px;
        transition: all .2s ease;
        border: solid 1px #979797;
    }

.true-false input[readonly] + Label {
    background: #e74c3c;
    border: solid 1px #e74c3c;
}

.true-false input[type=checkbox] + Label::before, .true-false input[type=checkbox] + Label::after {
    background: transparent;
    content: '';
    display: block;
    position: absolute;
    width: 4px;
    transition: all .2s ease;
}

.true-false input[readonly] + Label::before, .true-false input[readonly] + Label::after {
    background: #fff;
    content: '';
    display: block;
    position: absolute;
    width: 4px;
    transition: all .2s ease;
}

.true-false input[type=checkbox] + Label::before {
    height: 14px;
    left: 9px;
    top: 4px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.true-false input[type=checkbox] + Label::after {
    height: 14px;
    left: 9px;
    top: 4px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.true-false input[type=checkbox]:checked + Label {
    background: #2ecc71;
    border: solid 1px #2ecc71;
}

    .true-false input[type=checkbox]:checked + Label::before {
        background: #fff;
        height: 9px;
        left: 6px;
        top: 9px;
        -webkit-transform: rotate(-47deg);
        transform: rotate(-47deg);
    }

    .true-false input[type=checkbox]:checked + Label::after {
        background: #fff;
        height: 15px;
        left: 12px;
        top: 4px;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg);
    }

.true-false input[type=checkbox]:disabled + Label {
    opacity: 0.6;
}




/*  _______ Check Box For Result and Exam _________End____*/

/*  Check Box for Attendance */

.attendance-checkbox input[type=checkbox] {
    cursor: pointer;
    height: 30px;
    margin: 4px 0 0;
    position: absolute;
    opacity: 0;
    width: 30px;
    z-index: 2;
}

    .attendance-checkbox input[type=checkbox] + Label {
        border-radius: 50%;
        box-shadow: 0 2px 3px 0 rgba(0,0,0,.1);
        display: inline-block;
        height: 22px;
        margin: 4px 0 0;
        position: relative;
        width: 22px;
        transition: all .2s ease;
        background: #e74c3c;
        border: solid 1px #e74c3c;
    }

.attendance-checkbox input[readonly] + Label {
    background: #e74c3c;
    border: solid 1px #e74c3c;
}

.attendance-checkbox input[type=checkbox] + Label::before, .attendance-checkbox input[type=checkbox] + Label::after {
    content: '';
    display: block;
    position: absolute;
    width: 4px;
    transition: all .2s ease;
}

.attendance-checkbox input + Label::before, .attendance-checkbox input + Label::after {
    background: #fff;
    content: '';
    display: block;
    position: absolute;
    width: 4px;
    transition: all .2s ease;
}

.attendance-checkbox input[type=checkbox] + Label::before {
    height: 14px;
    left: 9px;
    top: 4px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.attendance-checkbox input[type=checkbox] + Label::after {
    height: 14px;
    left: 9px;
    top: 4px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.attendance-checkbox input[type=checkbox]:checked + Label {
    background: #2ecc71;
    border: solid 1px #2ecc71;
}

    .attendance-checkbox input[type=checkbox]:checked + Label::before {
        background: #fff;
        height: 9px;
        left: 6px;
        top: 9px;
        -webkit-transform: rotate(-47deg);
        transform: rotate(-47deg);
    }

    .attendance-checkbox input[type=checkbox]:checked + Label::after {
        background: #fff;
        height: 15px;
        left: 12px;
        top: 4px;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg);
    }

.attendance-checkbox input[type=checkbox]:disabled + Label {
    opacity: 0.6;
}
/*-------End Attendance------------*/





/* Help --start-*/
.help {
    border-radius: 100%;
    padding: 6px 11px;
    background-color: #fff;
    color: #686565;
    font-size: 12pt;
    border: solid 2px #ccc;
}
/* Help --end-*/



/**********Enqury Feedback Block start************/
.comment-box {
    -webkit-border-radius: 5px;
    border-color: #e8e8e8 #e8e8e8 #e8e8e8 #dadada;
    border-style: solid;
    border-width: 1px 1px 1px 2px;
    background: #F2F2F2;
    padding: 10px;
    margin: 15px 0 0 5px;
    font: 14px Roboto,sans-serif !important;
}

    .comment-box .comment-header .phone-no, .comment-box .comment-header .user {
        font: 300 15px Oswald !important;
        color: #7A7A7A;
    }

    .comment-box .comment-header .user {
        font-size: 17px !important;
        font-weight: bolder !important;
    }

    .comment-box .row {
        margin-bottom: 0;
    }

    .comment-box p {
        font: 14px Roboto,sans-serif !important;
        font-style: italic !important;
    }

    .comment-box .comment-header .sub-title {
        font: 10px Oswald;
    }

    .comment-box:before {
        border-left: 16px solid transparent;
        border-top: 12px solid #dadada;
        content: "";
        height: 0;
        margin-left: -26px;
        margin-top: 0;
        display: block;
        width: 0;
    }

    .comment-box .comment-content {
        padding: 5px 0;
        line-height: 1.4em !important;
        text-indent: 10px;
    }


/**********Enqury Feedback Block end************/



/******** Enquiry **********/
.enquiry {
    text-align: left;
    width: 95%;
}

    .enquiry > tbody > tr:not(:last-child) > td {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin-bottom: 20px;
        padding: 5px;
        border: 1px solid #dedede;
        background: #FFF;
        -moz-box-shadow: 0 0 5px #dedede;
        -webkit-box-shadow: 0 0 5px #dedede;
        box-shadow: 0 0 5px #dedede;
        position: relative;
        display: block;
    }

    .enquiry .enquiry-title {
        background-color: #1a4167;
        border-bottom: solid 2px #C5C5C6;
        background-image: -webkit-gradient(linear,left top,left bottom,from(#f7f9fd),to(#f7f9fd));
        background-image: -webkitlinear-gradient(top,#c1c0d0,#f7f9fd);
        background-image: -moz-linear-gradient(top,#c1c0d0,#f7f9fd);
        background-image: -ms-linear-gradient(top,#c1c0d0,#f7f9fd);
        background-image: -o-linear-gradient(top,#c1c0d0,#f7f9fd);
        background-image: linear-gradient(to bottom,#f7f9fd,#c1c0d0);
        -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
        -moz-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
        box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
        border-top: 0;
        text-shadow: 0 1px 0 rgba(255,255,255,.5);
        color: #1E2375;
        padding: 10px 0px;
        text-indent: 10px;
    }

    .enquiry .enquiry-details {
        background: #D8DFE6;
        padding: 10px;
    }

    .enquiry .enquiry-desc {
        margin-bottom: 20px;
        padding: 10px;
        line-height: 22px;
        font-size: 13px;
        border-bottom: 1px solid #dedede;
        color: #848991;
        word-wrap: break-word;
        text-indent: 10px;
        min-height: 30px;
    }

    .enquiry .enquiry-footer {
        background: #DBDCDE;
        padding: 10px;
    }

    .enquiry tr td .col-1, .enquiry tr td .col-2 {
        font-size: 12px;
    }

    .enquiry tr td .full-colon:before {
        content: ':';
    }

    .enquiry .panel {
        overflow-x: hiiden;
    }

    .enquiry .enquiry-button {
        color: #fff;
        background: #3c3c80;
        padding: 3px;
        border-radius: 2px;
        color: #fff;
        background: #3c3c80;
        padding: 3px;
        border-radius: 2px;
        display: block;
        width: 60px;
        text-align: center;
        margin-top: 10px;
        border: solid 2px #fff;
    }

        .enquiry .enquiry-button i {
            margin-right: 5px;
        }

    .enquiry .NoStyleGrid th {
        text-align: center;
    }


/******Radio Button Tab********/

.tab-radio input[type=radio] {
    display: none;
}

.tab-radio label {
    display: inline-block;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0;
    border-bottom: 1px solid #ddd;
    padding: 10px;
    color: #111;
}

.tab-radio input[type=radio]:checked + label {
    cursor: default;
    background: rgba(255,255,255,0.5);
    border: 1px solid #ddd;
    border-bottom-color: transparent;
    color: #111;
    outline: none;
}

/******Radio Button Tab********/

.table-addmissionfee tr {
    display: table-cell;
    width: 65px;
}

.table-addmissionfee td, .table-addmissionfee th {
    display: table-row;
    height: 32px;
    font-weight: normal;
    postion: relative;
}

.table-addmissionfee tr:first-child {
    width: 135px;
}

.table-addmissionfee td input {
    width: 50px;
    direction: rtl;
}

.table-addmissionfee tr td:first-child {
    height: 25px;
}

    .table-addmissionfee tr td:first-child span {
        font-size: 10px;
        line-height: 10px;
    }

.table-addmissionfee td:before {
    content: '+';
    float: left;
    margin-left: -12px;
    padding: 4px 0px;
}

.table-addmissionfee tr:last-child td:before {
    content: '=';
    float: left;
    margin-left: -12px;
    padding: 4px 0px;
}

.table-addmissionfee tr:nth-child(2) td:before,
.table-addmissionfee tr td:first-child:before {
    display: none;
}

/* Scrolling Style for Attendance /division allocation by Khaleefa */

#site_backtop {
    position: fixed;
    right: 30px;
    bottom: 50px;
    width: 40px;
    height: 40px;
    font-size: 16px;
    font-weight: 400;
    line-height: 38px;
    text-align: center;
    outline: medium none;
    color: #333;
    background: #ffffff;
    border: 1px solid #1c1c1c;
    cursor: pointer;
    display: none;
    z-index: 999;
    -webkit-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    border-radius: 50%;
}

    #site_backtop:hover {
        color: #ffffff;
        background: #00abc9;
        border-color: #00abc9;
    }

    #site_backtop.active {
        display: block;
        -webkit-animation: bt-slideUpEffect 1.2s both;
        -ms-animation: bt-slideUpEffect 1.2s both;
        animation: bt-slideUpEffect 1.2s both;
    }

    #site_backtop .fa {
        padding: 11px 10px 11px 12px;
    }

/* End Scrolling */



@media (max-width: 768px) {
    #main-container {
        width: 100%;
        overflow: auto;
    }

        #main-container .main-content {
            width: 100%;
            float: none;
        }

        #main-container .side-content {
            width: 100%;
            float: none;
            padding: 20px 0;
        }

        #main-container .button-content {
            background: rgba(37, 107, 161, 0.7);
            border-bottom: 1px solid #b9c7d0;
            border-top: 1px solid #b9c7d0;
            padding: 5px 10px;
            overflow: auto;
            width: 100%;
            min-height: 35px;
        }

        #main-container .content {
            width: 100%;
            background-color: #fff;
            overflow-y: auto;
            overflow-x: hidden;
            -webkit-box-shadow: 0 0px 5px rgba(0, 0, 0, 0.3);
            box-shadow: 0 0px 5px rgba(0, 0, 0, 0.3);
            box-shadow-top: none;
            margin: 0;
        }

        #main-container .content-no-bg {
            width: 100%;
            margin: 10px 0;
            min-height: 500px;
        }

    .modal-dialog {
        width: 500px;
    }
}

}

/*  ------ New Enquiry Design --------*/
@media screen and (max-width:1500px) {
    #ads {
        display: none;
    }
}

@media (max-width: 768px) {
    .i-frame {
        min-height: 435px;
    }

    .col-1, .col-2, .col-2-5, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
        float: none;
        padding: 0px 5px;
        width: 100%;
    }

    #main-container .main-content {
        float: none;
        width: 100%;
        margin: 0;
    }

    #main-container .side-content {
        float: none;
        width: 100%;
        margin: 0;
    }

    #main-container .content {
        margin: 10px 10%;
        width: 80%;
    }

    .floating-enquiry-inner {
        top: 0px;
    }

    .logo {
        max-width: 70%;
    }

    #floating-enquiry-wrap {
        position: static;
        left: 0px;
        width: 100%;
        height: 690px;
        overflow: hidden;
        display: none;
        border-radius: 0;
    }

    .floating-enquiry-inner {
        position: relative;
        font: 12px Arial, Helvetica, sans-serif;
        text-shadow: 0.1px 0.1px 0.1px #000;
        border-radius: 10px 0px 0px 10px;
        text-align: left;
        right: -400px;
        overflow: hidden;
        top: 40px;
        position: absolute;
        background-color: rgba(73, 116, 159,0.9);
        width: 400px;
        overflow: hidden;
        color: #fff;
    }

    #enquiry-btn {
        display: none;
    }

    #dynamic {
        display: inline;
        outline: none;
        position: static;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
        -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0)";
        background: rgb(73, 116, 159);
        border: 1px solid rgb(73, 116, 159);
        -webkit-box-shadow: 0 0 6px -1px rgba(0,0,0,0.2) inset;
        -moz-box-shadow: 0 0 6px -1px rgba(0,0,0,0.2) inset;
        box-shadow: 0 0 6px -1px rgba(0,0,0,0.2) inset;
        color: #fff;
        font-weight: bold;
        text-decoration: none;
        height: 40px;
        line-height: 40px;
        width: 100%;
        text-transform: none;
        padding: 0;
        text-align: center;
        font-size: large;
        border-radius: 0;
        overflow: hidden;
    }

    footer {
        margin-top: 0;
        padding-left: 30%;
    }

    #footer-copy .wpzoom {
        display: list-item;
        float: none;
    }

    .btn_menu {
        display: block;
        position: absolute !important;
        top: 45px;
        right: 20px;
        margin-bottom: 0;
        font-weight: normal;
        text-align: center;
        vertical-align: middle;
        cursor: pointer;
        background-image: none;
        border: 1px solid transparent;
        white-space: nowrap;
        padding: 8px 15px;
        font-size: 14px;
        line-height: 1.42857143;
        border-radius: 4px;
        -webkit-user-select: none;
        background: #1A4167;
        color: #fff;
    }

    #menu-main {
        padding-top: 0px;
        width: 90%;
        float: left;
        ma
    }

    .menu {
        list-style-type: none;
        max-height: 0px;
        overflow-y: hidden;
        transition: all 0.5s ease;
        -webkit-transition: all 0.5s ease;
        -moz--transition: all 0.5s ease;
    }

    .menu-visible {
        max-height: 600px;
        overflow-y: visible;
        transition: all 0.5s ease;
        -webkit-transition: all 0.5s ease;
        -moz--transition: all 0.5s ease;
        margin: 0;
        padding: 0;
    }

    #menu-main li {
        display: block;
        float: none;
        font-size: 15px;
        border-bottom: 0.5px solid dfc253;
        padding: 0;
        margin: 0;
        position: relative;
    }

    #menu-main .cleaner {
        clear: both;
        display: block;
        height: 1px;
        float: none;
        font-size: 1px;
        line-height: 1px;
    }


    #menu-main li.cleaner {
        font-size: 1px;
        height: 1px;
        line-height: 1px;
        clear: both;
        float: none;
        display: block;
    }

    #menu-main li:hover {
        visibility: inherit; /* fixes IE7 'sticky bug' */
    }

    #menu-main li:last-child {
        border-right: 0;
    }

    #menu-main a {
        color: #fff;
        padding: 18px 10px 23px;
        display: block;
        position: relative;
        text-align: left;
        min-width: 0px;
    }

        #menu-main a:hover,
        #menu-main a:focus,
        #menu-main li.active a {
            color: #dfc253;
            border-bottom: none;
        }

    .footable {
        font-size: 6px;
    }
}

@media (max-width: 640px) {

    .i-frame {
        min-height: 360px;
    }

    .logo {
        max-width: 65%;
    }

    #main-container .main-content, #main-container .side-content {
        float: none;
        width: 100%;
        margin: 0;
    }
}

@media (max-width: 480px) {
    .i-frame {
        min-height: 270px;
    }

    .logo {
        max-width: 55%;
    }
}


@media (max-width: 1280px) {
    #main-container .content-no-bg {
        width: 82%;
        margin: 10px 8%;
        min-height: 77vh;
    }
}

.MSRS-RVC div[role=main] > div > table {
    margin: auto;
    margin-top: 20px;
}

.MSRS-RVC input[type=text], .MSRS-RVC select, .MSRS-RVC textarea, .MSRS-RVC input[type=file], .MSRS-RVC input[type=password] {
    width: auto;
}