/*----------------------Typography----------------------------------*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
/*    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;*/
}

table {
    border-collapse: separate;
    border-spacing: 0;
}

caption, th, td {
    text-align: left;
    font-weight: normal;
}

table, td, th {
    vertical-align: middle;
}

blockquote:before, blockquote:after, q:before, q:after {
    content: "";
}

blockquote, q {
    quotes: "" "";
}

a img {
    border: none;
}

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {
    margin: 0;
}

p {
    margin: 0;
}

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

blockquote {
    margin: 1.5em;
    color: #666;
    font-style: italic;
}

strong {
    font-weight: bold;
}

em, dfn {
    font-style: italic;
}

dfn {
    font-weight: bold;
}

sup, sub {
    line-height: 0;
}

abbr, acronym {
    border-bottom: 1px dotted #666;
}

address {
    margin: 0 0 1.5em;
    font-style: italic;
}

del {
    color: #666;
}

pre {
    margin: 1.5em 0;
    white-space: pre;
}

pre, code, tt {
    font: 1em 'andale mono', 'lucida console', monospace;
    line-height: 1.5;
}

ol {
    list-style-type: decimal;
}

dl {
    margin: 0 0 1.5em 0;
}

dl dt {
    font-weight: bold;
}

dd {
    margin-left: 1.5em;
}

table {
    margin-bottom: 1.4em;
    width: 100%;
}

th {
    font-weight: bold;
}

thead th {
    background: #c3d9ff;
}

th, td, caption {
    padding: 4px 10px 4px 5px;
}

tr.even td {
    background: #f6f6f6;
}

tfoot {
    font-style: italic;
}

caption {
    background: #eee;
}

hr {
    background: #ddd;
    color: #ddd;
    clear: both;
    float: none;
    width: 100%;
    height: .1em;
    margin: 0 0 1.45em;
    border: none;
}

hr.space {
    background: #fff;
    color: #fff;
}

.clearfix:before, .clearfix:after {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    zoom: 1;
}

a:hover {
    outline: none;
    text-decoration: none;
    cursor: pointer;
    color: #999999;
}

a {
    outline: none !important;
    text-decoration: none;
    color: #000;
}

a, a:hover, a:active, a:visited, a:focus {
    text-decoration: none;
}

img {
    line-height: 0;
}

ul, li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
*:focus {
    outline: none;
}

/*------------------------Typography Ends---------------------*/
@font-face {
    font-family: 'MyriadPro-Regular';
    src: url("../font/MyriadPro-Regular.eot?#iefix") format("embedded-opentype"), url("../font/MyriadPro-Regular.otf") format("opentype"), url("../font/MyriadPro-Regular.woff") format("woff"), url("../font/MyriadPro-Regular.ttf") format("truetype"), url("../font/MyriadPro-Regular.svg#MyriadPro-Regular") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans';
    src: url("../font/OpenSans.eot?#iefix") format("embedded-opentype"), url("../font/OpenSans.woff") format("woff"), url("../font/OpenSans.ttf") format("truetype"), url("../font/OpenSans.svg#OpenSans") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans-Bold';
    src: url("../font/OpenSans-Bold.eot?#iefix") format("embedded-opentype"), url("../font/OpenSans-Bold.woff") format("woff"), url("../font/OpenSans-Bold.ttf") format("truetype"), url("../font/OpenSans-Bold.svg#OpenSans-Bold") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans-Extrabold';
    src: url("../font/OpenSans-Extrabold.eot?#iefix") format("embedded-opentype"), url("../font/OpenSans-Extrabold.woff") format("woff"), url("../font/OpenSans-Extrabold.ttf") format("truetype"), url("../font/OpenSans-Extrabold.svg#OpenSans-Extrabold") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans-Semibold';
    src: url("../font/OpenSans-Semibold.eot?#iefix") format("embedded-opentype"), url("../font/OpenSans-Semibold.woff") format("woff"), url("../font/OpenSans-Semibold.ttf") format("truetype"), url("../font/OpenSans-Semibold.svg#OpenSans-Semibold") format("svg");
    font-weight: normal;
    font-style: normal;
}

* {
    max-width: 100%;
    box-sizing: border-box;
}

body {
    font-size: 14px;
}

body.lang_en {
    font-family: 'OpenSans';
}

body.lang_ar {
    font-family: 'Droid Arabic Kufi', "OpenSans", sans-serif;
}

body.width_desktop {
    
}

body.width_mobile {
    
}

body.dir_ltr {
    
}

body.dir_rtl {
    
}

h1 {
    font-weight: 300;
    font-size: 20px;
    line-height: 100%;
    font-size: 28px;
}

::placeholder {
    color: #888888;
}

a {
    color: #257ece;
    text-decoration: underline;
}

a:hover {
    color: #000000;
    text-decoration: none;
}

label:hover {
    cursor: pointer;
}

input[type="text"], 
input[type="password"] {
    width: 100%;
    font-size: 16px;
    padding: 10px;
    background-color: #f3f7fb;
    border: 1px solid transparent;
    border-radius: 5px;
    color: #000000;
}

input[type="text"]:focus,
input[type="password"]:focus {
    border-color: #257ece;
    box-shadow: 0px 5px 3px rgba(0, 0, 0, 0.15);
}

input[type="text"][disabled],
input[type="password"][disabled] {
    cursor: not-allowed !important;
    background-color: #cccccc !important;
    opacity: 0.75 !important;
    color: #ffffff !important;
}

select {
    width: 100%;
    font-size: 16px;
    padding: 10px;
    background-color: #f3f7fb;
    border: 1px solid transparent;
    border-radius: 5px;
    color: #000000;
}

select:focus {
    border-color: #257ece;
    box-shadow: 0px 5px 3px rgba(0, 0, 0, 0.15);
}

select[disabled] {
    cursor: not-allowed !important;
    background-color: #cccccc !important;
    opacity: 0.75 !important;
    color: #ffffff !important;
}

button,
input[type="button"],
input[type="submit"] {
    width: 100%;
    font-size: 16px;
    padding: 10px;
    background-color: #257ece;
    border: 1px solid transparent;
    border-radius: 5px;
    color: #ffffff;
}

button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
    background-color: #69b1f3;
}

button:active,
input[type="button"]:active,
input[type="submit"]:active {
    background-color: #ffffff;
    border: 1px solid #257ece;
    color: #257ece;
}

button[disabled],
input[type="button"][disabled],
input[type="submit"][disabled] {
    cursor: not-allowed !important;
    background-color: #cccccc !important;
    opacity: 0.75 !important;
    color: #ffffff !important;
}

#section_main {
    max-width: 1400px;
    margin: auto;
    position: relative;
}

#section_header {
    position: absolute;
    top: 0px;
    width: 100%;
}

#holder_topLeft {
    position: absolute;
    top: 40px;
    left: 80px;
}

#holder_topRight {
    position: absolute;
    top: 40px;
    right: 80px;
}

#section_footer {
    position: absolute;
    bottom: 0px;
    width: 100%;
}

#holder_bottomLeft {
    position: absolute;
    bottom: 40px;
    left: 80px;
    color: #257ece;
    font-size: 30px;
    line-height: 100%;
}

#holder_bottomRight {
    position: absolute;
    bottom: 40px;
    right: 80px;
    color: #174796;
    font-size: 12px;
    line-height: 100%;
    margin-bottom: 16px;
}

#section_content {
    text-align: center;
}

#holder_title {
    padding-top: 40px;
}

#holder_body {
    margin: auto;
    width: 350px;
    padding-bottom: 120px;
    /*margin-top: dynmaically changed by js*/
}
body.dir_ltr #holder_body {
    text-align: left;
}
body.dir_rtl #holder_body {
    text-align: right;
}

#holder_success {
    margin-bottom: 20px;
    border-radius: 4px;
    background-color: #8BC34A;
    color: #ffffff;
    padding: 10px;
}

#holder_error {
    margin-bottom: 20px;
    border-radius: 4px;
    background-color: #F44336;
    color: #ffffff;
    padding: 10px;
}

.field_group {
    position: relative;
    margin-bottom: 15px;
}

.field_group.has_error > input[type="text"],
.field_group.has_error > input[type="password"],
.field_group.has_error > button,
.field_group.has_error > select {
    border-bottom: 2px solid #ff0000;
}

.error_holder {
    display: none;
}

.field_group.has_error > .error_holder {
    display: block;
}

.error_triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3.75px 0px 3.75px 7.5px;
    border-color: transparent transparent transparent #2b7fce;
    position: absolute;
    top: 16px;
    left: -20px;
}

.error_message {
    background-color: #2b7fce;
    display: inline-block;
    font-size: 12px;
    color: #ffffff;
    padding: 4px 10px 4px 10px;
    position: absolute;
    top: 10px;
    left: -170px;
    width: 150px;
    text-align: center;
    border-radius: 4px;
    line-height: 100%;
}

body.width_mobile .error_triangle {
    display: none;
}

body.width_mobile .error_message {
    background-color: transparent;
    display: block;
    color: #ff0000;
    position: static;
    width: 100%;
}
body.width_mobile.dir_ltr .error_message {
    text-align: left;
}
body.width_mobile.dir_rtl .error_message {
    text-align: right;
}

/*
#pt_version_question {
    background-color: #257ece;
    position: absolute;
    top: 3px;
    right: 0px;
    border-radius: 100%;
    width: 16px;
    height: 16px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    line-height: 100%;
    cursor: pointer;
}

#pt_version_question:hover {
    background-color: #69b1f3;
}

#pt_version_answer {
    background-color: #2b7fce;
    display: inline-block;
    font-size: 13px;
    color: #ffffff;
    padding: 4px 10px 4px 10px;
    position: absolute;
    top: -3px;
    right: -160px;
    width: 150px;
    text-align: center;
}

#pt_version_answer_triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent #2b7fce transparent transparent;
    border-width: 3.75px 7.5px 3.75px 0;
    position: absolute;
    top: 10px;
    left: -7px;
}
*/

#page_forgotpassword #holder_body {
    width: 304px;
}

/* override success/error message added by bootstrap, html/classes added by error_msg(...) + success_msg(...) */
.alert button.close {
    display: none;
}

.alert {
    background-color: inherit;
    color: inherit;
    border: inherit;
    padding: inherit;
    margin: 0px;
}
/* end override */


@media (max-width: 768px) {
    #section_main {
        padding-left: 20px;
        padding-right: 20px;
    }

    #section_header {
        position: static;
        margin-top: 40px;
    }

    #holder_topLeft {
        position: static;
        text-align: center;
    }

    #holder_topRight {
        position: static;
        text-align: center;
    }

    #section_footer {
        position: static;
        margin-bottom: 40px;
    }

    #holder_bottomLeft {
        position: static;
        margin-bottom: 10px;
        text-align: center;
    }

    #holder_bottomRight {
        position: static;
        text-align: center;
        margin-bottom: 0px;
    }

    #holder_body {
        padding-bottom: 70px;
    }
}