body {
    background-color: #dee2e6;
    color: #676a6c;
}

body, html {
    color: #676a6c;
}

a {
    color: #038fbd;
    -webkit-transition: all 100ms linear 0s;
    -o-transition: all 100ms linear 0s;
    transition: all 100ms linear 0s;
}

    a:hover {
        color: #0174a6;
    }

    a:focus {
        outline: 0;
        outline-offset: 0;
    }

/*********************************************
				custom
*********************************************/
/* arabic */
@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Tajawal'), local('Tajawal-Regular'), url(../fonts/tajawal/Iura6YBj_oCad4k1nzSBC45I.woff2) format('woff2');
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC;
}
/* latin */
@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Tajawal'), local('Tajawal-Regular'), url(../fonts/tajawal/Iura6YBj_oCad4k1nzGBCw.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local('Tajawal Medium'), local('Tajawal-Medium'), url(../fonts/tajawal/Iurf6YBj_oCad4k1l8KiHrRpiYlJ.woff2) format('woff2');
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC;
}
/* latin */
@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local('Tajawal Medium'), local('Tajawal-Medium'), url(../fonts/tajawal/Iurf6YBj_oCad4k1l8KiHrFpiQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Tajawal Bold'), local('Tajawal-Bold'), url(../fonts/tajawal/Iurf6YBj_oCad4k1l4qkHrRpiYlJ.woff2) format('woff2');
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC;
}
/* latin */
@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Tajawal Bold'), local('Tajawal-Bold'), url(../fonts/tajawal/Iurf6YBj_oCad4k1l4qkHrFpiQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Tajawal ExtraBold'), local('Tajawal-ExtraBold'), url(../fonts/tajawal/Iurf6YBj_oCad4k1l5anHrRpiYlJ.woff2) format('woff2');
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC;
}
/* latin */
@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Tajawal ExtraBold'), local('Tajawal-ExtraBold'), url(../fonts/tajawal/Iurf6YBj_oCad4k1l5anHrFpiQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body.rtls {
    text-align: right;
    direction: rtl;
    font-family: Tajawal !important;
}

    body.rtls h1, body.rtls h2, body.rtls h3, body.rtls h4, body.rtls h5, body.rtls h6 {
        font-weight: 700
    }

body.boxed-layout {
    background: url(../img/iu-triangle.svg);
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    position: relative;
    width: 100%;
    display: table;
}

    body.boxed-layout #wrapper {
        background-color: #005a85;
    }


.dropdown-menu.animated {
    -webkit-animation-duration: .4s;
    animation-duration: .4s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
/*********************************************
				navbar-default
*********************************************/


/*------------------------------------------------ */
/*
 *				Awesome checkbox
 *
-------------------------------------------------- */

body.rtls .abc-checkbox {
    cursor: default;
    padding-left: 4px;
}

    body.rtls .abc-checkbox label {
        padding-right: 5px;
    }

        body.rtls .abc-checkbox label::before {
            right: 0;
            margin-right: -1.25rem;
        }

        body.rtls .abc-checkbox label::after {
            right: 0;
            margin-right: -1.25rem;
            padding-right: 3px;
        }

    body.rtls .abc-checkbox input[type="checkbox"],
    body.rtls .abc-checkbox input[type="radio"] {
        position: static;
        margin-right: 0;
        margin-left: 0;
        cursor: pointer;
        opacity: 0;
        z-index: 1;
    }

        body.rtls .abc-checkbox input[type="checkbox"]:indeterminate + label::after,
        body.rtls .abc-checkbox input[type="radio"]:indeterminate + label::after {
            margin-left: -16.5px;
        }

body.rtls .abc-radio {
    padding-left: 4px;
}

    body.rtls .abc-radio label {
        padding-right: 5px;
        padding-left: 0;
    }

        body.rtls .abc-radio label::before {
            left: auto;
            right: 0;
            margin-right: -20px;
            margin-left: 0;
            border: 1px solid #ced4da;
        }

        body.rtls .abc-radio label::after {
            right: 3px;
            margin-right: -20px;
            margin-left: 0;
        }

    body.rtls .abc-radio input[type="radio"] {
        margin-left: 0;
    }

body.rtls .select2-container--bootstrap4 .select2-selection__clear {
    padding-right: .3em;
    padding-left: 0;
    float: left;
    margin-left: 1.3em;
    margin-right: 0;
}

body.rtls .bootstrap-touchspin .input-group-btn-vertical {
    left: 0;
    right: auto;
}

    body.rtls .bootstrap-touchspin .input-group-btn-vertical > .btn {
        left: 0;
        right: auto;
    }

body.rtls .bootstrap-touchspin .form-control {
    text-align: right;
}


/*------------------------------------------------ */
/*
 *				General performance
 *
-------------------------------------------------- */


body.homepage {
    background-color: #fff;
    color: #676a6c;
}

.pace .pace-progress {
    background: #129ebf;
}

.sk-spinner-wave div,
.sk-spinner-double-bounce .sk-double-bounce1, .sk-spinner-double-bounce .sk-double-bounce2,
.sk-spinner-rotating-plane.sk-spinner,
.sk-spinner-chasing-dots .sk-dot1, .sk-spinner-chasing-dots .sk-dot2,
.sk-spinner-pulse.sk-spinner,
.sk-spinner-wandering-cubes .sk-cube1, .sk-spinner-wandering-cubes .sk-cube2,
.sk-spinner-cube-grid .sk-cube,
.sk-spinner-circle .sk-circle:before,
.sk-spinner-three-bounce div,
.sk-spinner-fading-circle .sk-circle:before {
    background-color: #005a85;
}


.IUstyle .select2-container--bootstrap4.select2-container--focus .select2-selection {
    border-color: #005a85;
}

.daterangepicker .ranges li.active,
.daterangepicker .ranges li:hover {
    background: #129ebf;
    border: 1px solid #129ebf;
}

.select2-container--bootstrap4 .select2-results__option--highlighted, .select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected=true] {
    background-color: #129ebf;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #0073a6;
}

.datepicker table tr td.active:hover, .datepicker table tr td.active:hover:hover, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active.disabled:hover:hover, .datepicker table tr td.active:focus, .datepicker table tr td.active:hover:focus, .datepicker table tr td.active.disabled:focus, .datepicker table tr td.active.disabled:hover:focus, .datepicker table tr td.active:active, .datepicker table tr td.active:hover:active, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.active, .datepicker table tr td.active:hover.active, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled:hover.active, .open .dropdown-toggle.datepicker table tr td.active, .open .dropdown-toggle.datepicker table tr td.active:hover, .open .dropdown-toggle.datepicker table tr td.active.disabled, .open .dropdown-toggle.datepicker table tr td.active.disabled:hover {
    background-color: #005a85 !important;
    border-color: #005a85 !important;
}

.datepicker table tr td span.active:hover, .datepicker table tr td span.active:hover:hover, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active.disabled:hover:hover, .datepicker table tr td span.active:focus, .datepicker table tr td span.active:hover:focus, .datepicker table tr td span.active.disabled:focus, .datepicker table tr td span.active.disabled:hover:focus, .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover:active, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active.active, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled:hover.active, .open .dropdown-toggle.datepicker table tr td span.active, .open .dropdown-toggle.datepicker table tr td span.active:hover, .open .dropdown-toggle.datepicker table tr td span.active.disabled, .open .dropdown-toggle.datepicker table tr td span.active.disabled:hover {
    background-color: #005a85 !important;
    border-color: #005a85 !important;
}

.toast {
    background-color: #129ebf;
}

.toast-success {
    background-color: #129ebf;
}

.metismenu .fa.arrow:before {
    content: "\f105";
}

.abc-checkbox input[type="checkbox"]:focus + label::before,
.abc-checkbox input[type="radio"]:focus + label::before,
.abc-radio input[type="radio"]:focus + label::before,
.slick-initialized .slick-slide {
    outline: 0;
}

.ui-datepicker-calendar .ui-state-default {
    text-align: center;
}

/*------------------------------------------------ */
/*
 *					RTL Fixs
 *
-------------------------------------------------- */


body.rtls.fixed-sidebar #page-wrapper {
    margin: 0 220px 0 0;
}

body.rtls .metismenu .arrow {
    float: left;
}

body.rtls .IUstyle .navbar-top-links .dropdown-menu > li > a {
    text-align: right;
}

body.rtls .IUstyle .navbar-top-links .dropdown-menu li a i.fa {
    margin: 0 0 0 5px
}

body.rtls .IUstyle .nav.navbar-top-links .profile-element .name {
    direction: rtl;
}

body.rtls .toast-header i {
    float: left;
}

body.rtls .toast-header strong {
    margin-right: 10px !important;
    margin-left: auto;
}

body.rtls .toast-header {
    direction: rtl;
}

    body.rtls .toast-header button.close {
        margin-right: .5rem !important;
        margin-left: 0 !important;
    }

body.rtls .label-primary,
body.rtls .badge-primary {
    /*display: inline-block;*/
}

body.rtls .knob {
    direction: ltr;
}

body.rtls .noUi-ltr {
    direction: ltr;
}

body.rtls .cropper-container {
    direction: ltr;
}

.slick-slider {
    direction: ltr;
}

body.rtls .input-group.clockpicker .input-group-addon {
    border: 1px solid #E5E6E7;
    border-right: 0;
}

body.rtls .colorpicker {
    right: auto;
}

body.rtls .onoffswitch {
    direction: ltr;
    text-align: left;
}

body.rtls .select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow {
    right: auto;
    left: 3px;
}

body.rtls .custom-file-label::after {
    left: 0;
    right: auto;
}

body.rtls .lock-word {
    direction: ltr;
}

body.rtls .todo-list > li .label {
    margin-right: 10px;
    margin-left: 0;
    float: left;
}

body.rtls .input-group > .input-group-append > .btn,
body.rtls .input-group > .input-group-append > .input-group-text,
body.rtls .input-group > .input-group-prepend:first-child > .btn:not(:first-child),
body.rtls .input-group > .input-group-prepend:first-child > .input-group-text:not(:first-child),
body.rtls .input-group > .input-group-prepend:not(:first-child) > .btn,
body.rtls .input-group > .input-group-prepend:not(:first-child) > .input-group-text {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem;
}

body.rtls .breadcrumb-item + .breadcrumb-item {
    padding-right: .5rem;
    padding-left: 0;
}

    body.rtls .breadcrumb-item + .breadcrumb-item::before {
        padding-left: .5rem;
    }

body.rtls div.jtable-main-container > table.jtable > thead th.jtable-column-header-sorted-asc div.jtable-column-header-container,
body.rtls div.jtable-main-container > table.jtable > thead th.jtable-column-header-sortable div.jtable-column-header-container {
    background-position: left;
}

/** jtable RTL **/
body.rtls form.jtable-dialog-form div.jtable-checkbox-input span,
body.rtls form.jtable-dialog-form div.jtable-radio-input span {
    padding-left: 0;
    padding-right: 4px;
}

body.rtls .ui-dialog .ui-dialog-title {
    float: right;
    margin: .1em 0 .1em 16px;
}

body.rtls .ui-dialog .ui-dialog-titlebar-close {
    right: auto;
    left: .7em;
    margin: -13px 0 0 0;
}

body.rtls div.jtable-main-container > div.jtable-bottom-panel {
    text-align: right;
}

    body.rtls div.jtable-main-container > div.jtable-bottom-panel div.jtable-right-area {
        left: 0px;
    }

body.rtls div.jtable-main-container > div.jtable-title div.jtable-toolbar {
    right: auto;
    left: 0px;
}

body.rtls div.jtable-main-container div.jtable-title {
    text-align: right;
    padding-left: 0;
    padding-right: 10px;
}

    body.rtls div.jtable-main-container div.jtable-title .jtable-close-button + div.jtable-toolbar {
        margin-right: 0;
        margin-left: 30px;
    }

body.rtls div.jtable-main-container > div.jtable-title .jtable-close-button {
    right: auto;
    left: 8px;
}

body.rtls div.jtable-main-container > div.jtable-bottom-panel span.jtable-page-info {
    float: left;
}

body.rtls div.jtable-main-container div.jtable-column-selection-container ul.jtable-column-select-list li label span {
    margin-right: 4px;
    margin-left: 0;
}

body.rtls div.jtable-main-container table.jtable thead th {
    text-align: right;
}

body.rtls div.jtable-main-container > table.jtable > thead th.jtable-column-header div.jtable-column-header-container {
    margin-left: 0;
    margin-right: 4px;
}

body.rtls .navbar-top-links li:last-child {
    margin-left: 0;
}

body.rtls .metismenu .fa.arrow:before {
    content: "\f104";
}

body.rtls .metismenu .active > a > .fa.arrow:before {
    content: "\f107";
}

body.rtls .invoice {
    text-align: right;
}

body.rtls .label {
    font-family: inherit;
}

body.rtls .lock-word .first-word {
    min-width: 390px;
}

/** wizard RTL **/
body.rtls .wizard > .actions {
    text-align: left;
}

body.rtls .wizard > .steps > ul > li, .wizard > .actions > ul > li {
    float: right;
}
/** foo table RTL **/
body.rtls .footable > thead > tr > th > span.footable-sort-indicator {
    padding-right: 5px;
    padding-left: 0;
}

body.rtls .footable.breakpoint > tbody > tr > td > span.footable-toggle {
    padding-right: 0;
    padding-left: 5px;
    vertical-align: middle;
}

body.rtls .footable.breakpoint.toggle-arrow-tiny > tbody > tr > td > span.footable-toggle:before {
    content: "\e020";
}


/** center orientation **/
@media only screen and (min-width: 1170px) {
    body.rtls .center-orientation .vertical-timeline-content::before {
        right: 100%;
        border-color: transparent;
        border-right-color: white;
    }

    body.rtls .center-orientation .vertical-timeline-content .btn {
        float: right;
    }

    body.rtls .center-orientation .vertical-timeline-content .vertical-date {
        right: 122%;
    }

    body.rtls .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content {
        float: left;
    }

        body.rtls .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content::before {
            right: auto;
            left: 100%;
            border-left-color: white;
            border-right: 0;
        }

        body.rtls .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content .btn {
            float: left;
        }

        body.rtls .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content .vertical-date {
            right: auto;
            left: 122%;
            text-align: left;
        }
}

body.rtls.landing-page .comments-avatar img {
    margin-right: 0;
    margin-left: 10px;
}

body.rtls.landing-page .bubble:after {
    left: auto;
    right: 30px;
}

body.rtls.landing-page .list-inline-item:not(:last-child) {
    margin-left: .5rem;
    margin-right: 0;
}