@charset "utf-8";
/* CSS Document */

:root {
    --orange-color:#f47920;
    --red-color: #ef3d23;
    --blue-color: #097591;
    --green-color: #8dc63f;
    --add-color: #0b6623;
    --delete-color: #ef3d23;
    --warning-color: #f0ad4e;
    --gray-color: #999999;
  }

@font-face {
    font-family: 'tekosemibold';
    src: url('../fonts/teko-semibold-webfont.woff2') format('woff2'),
        url('../fonts/teko-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'tekoregular';
    src: url('../fonts/teko-regular-webfont.woff2') format('woff2'),
        url('../fonts/teko-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

html {
    overflow-x: hidden;
}

html.touch, html.touch *, .touch body, .touch body * {
    cursor: auto !important;
}

html, body { 
    font-size: 16px;
    line-height: 1.4; 
    font-family: 'Tajawal', sans-serif;
    color:#30333a;
    font-weight: 500; 
    position: relative;
}

html, body, div, span, applet, object, iframe, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
}


/*
input[readonly], input[disabled], input[readonly]:hover, input[disabled]:hover, textarea[disabled], textarea[readonly] {
    background: none!important;
    border: none;
    cursor:default!important;
    box-shadow:none;
    /* color:#000000!important;
    -webkit-text-fill-color:#000000;
    opacity:1;
    /* padding-left: 0px;
}
*/


.teko {
    font-family: 'Teko', sans-serif;
}

p { font-size: 16px; text-align: left;}

h1, h2, h3, h4, h5, h6 {margin: 0; color: #474c55}
/* h1 {font-size: 8em; color: #ffffff; font-weight: bold; text-transform: uppercase; } */
h1.title {font-family: 'Teko', sans-serif; font-size: 60px; font-weight: 800; color: #f47920}
h2.title {font-family: 'Teko', sans-serif; font-size: 57px; font-weight: 700; color: #f47920}
h3.title {font-family: 'Teko', sans-serif; font-size: 54px; font-weight: 700; margin-bottom: 30px;}
h4.title {font-family: 'Teko', sans-serif; font-size: 36px; font-weight: 600; line-height: 1.2; margin-top: 20px; }
h5.title {font-family: 'Teko', sans-serif; font-size: 24px; font-weight: 500; line-height: 1.3; margin-bottom: 15px; text-transform: uppercase; color: #6f7576;}
h6.title {font-family: 'Teko', sans-serif; font-size: 18px; font-weight: 500; text-transform:uppercase; margin-bottom: 5px;}

.title-h5 {font-family: 'Teko', sans-serif; font-size: 24px; font-weight: 500; line-height: 1.3; margin-bottom: 15px; text-transform: uppercase; color: #6f7576;}

h4.section-title {font-family: 'Teko', sans-serif; font-size: 36px; font-weight: 600;}

.big-label label {font-size: 24px; font-family: 'Teko', sans-serif;}

.orange {
    color: #f47920;
}

/* Background Color */
.orange-bg {background-color: #f47920 !important;}
.teal-bg {background-color: #00aca0 !important;}
.shiraz-bg {background-color: #8a1538 !important;}
.darkblue-bg {background-color: #1d252d !important;}
.light-gray-bg {background-color: #f8f8f8 !important;}
.yellow-bg {background-color: #ffa300 !important;}
.bg-transparent {background-color: transparent !important;}

.high-bg {background-color:var(--green-color) !important;}
.med-bg {background-color:var(--blue-color) !important;}
.low-bg {background-color: var(--red-color) !important;}
.die-bg {background-color: #000000 !important;}
/* Background Color End*/

/* Color */
.orange-col {color: #f47920 !important;}
.teal-col {color: #00aca0 !important;}
.shiraz-col {color: #8a1538 !important;}
.darkblue-col {color: #1d252d !important;}
.ligh-gray-col {color: #f8f8f8 !important;}
.yellow-col {color: #ffa300 !important;}
.gray-col { color: #999999 !important;}
.add-col {color: var(--add-color) !important;} /* Used for add icons */
.delete-col {color: var(--delete-color) !important;} /* Used for delete icons */
/* Color End*/

/* Scorecard */
.exceeds-bg { background-color: #8dc349 !important; }
.meets-bg { background-color: #00aca0 !important; }
.cond-meets-bg { background-color: #ffa300 !important; }
.doesnt-meet-bg { background-color: #8b1538 !important; }
.fails-bg { background-color: #8b1538 !important; }

.exceeds-col { color: #8dc349 !important; }
.meets-col { color: #00aca0 !important; }
.cond-meets-col { color: #ffa300 !important; }
.doesnt-meet-col { color: #8b1538 !important; }
.fails-col { color: #8b1538 !important; }
/* Scorecard End */


/* Won/Lost/Pending */
.won-bg{background-color: #f47920 !important;}
.lost-bg{background-color: #8a1538 !important;}
.pending-bg{background-color: #00aca0 !important;}


.won-col{color: #f47920 !important;}
.lost-col{color: #8a1538 !important;}
.pending-col{color: #00aca0 !important;}
/* Won/Loss/Pending End */



.form-label {
    color: #6F7576;
    font-size: 18px;
    font-family: 'Tajawal', sans-serif;
}

.form-group label {
    color: #6F7576;
    font-size: 18px;
    font-family: 'Tajawal', sans-serif;
}

.container-fluid {
    max-width: 1700px;
    width: 100%;
    padding: 0 20px;
}

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

.login-content {
    padding: 0px;
}

.main-content-container {
    padding: 10px 20px 10px 20px;
    background-color: #ffffff;
}


.row.no-gutters{ margin-right:0; margin-left:0; }
.row.no-gutters > [class^="col-"],.row.no-gutters > [class*=" col-"]{ padding-right:0; padding-left:0; }




/* Login Panels */
.login-section .container-fluid { border-top: none; }
.login-section .form-group{ position: relative; margin-bottom: 15px; }
.login-section .form-group label { font-family: 'Tajawal', sans-serif; font-weight: normal;font-size: 18px;margin: 6px 0;color: #fff;display: block;letter-spacing: 0;}

.login-section .form-control { display: block; width: 100%; height: 40px; line-height: 1.5; background-color: #fff; background-clip: padding-box; border-radius: .25rem; transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; outline: none !important; box-shadow: none; border-radius: 0; background-color: #ffffff; color: #000; border: 0; font-size: 16px; resize: none; font-weight: normal; letter-spacing: normal; -webkit-appearance: none; appearance: none; -ms-appearance: none; }
.login-section .form-control:focus {outline: 0;-webkit-box-shadow: none;box-shadow:none;border-color: #0154a4;box-shadow: 0 0 10px rgb(171, 173, 176);}

.login-section .checkbox {position: relative;padding-left: 35px;font-size: 0;font-weight: 500;line-height: normal;display: inline-block !important;margin: 10px 0 20px 0;cursor: pointer;}
.login-section .checkbox input.input-checkbox {position: absolute;left: 0;top: 0;height: 25px;width: 25px;margin: 0;opacity: 0;}
.login-section .checkbox > span {font-family: 'Tajawal', sans-serif; font-size: 18px;color: #fff;font-weight: normal;line-height: 25px;padding: 0 0;display: inline-block;}
.login-section .checkbox > span:before {content: "";display: block;position: absolute;height: 25px;width: 25px;border: transparent;top: 0;left: 0;border-radius: 0;background: #fff;}
.login-section .checkbox > span:after {content: "";position: absolute;left: 5px;top: 5px;opacity: 0;width: 15px;height: 15px;background-image: url(/assets/img/check.svg);background-size: 15px 15px;}
.login-section label.checkbox input:checked~span:before { background: #f57921;}
.login-section label.checkbox input:checked~span:after {opacity: 1;}

.login-section .login-background {background-size: cover !important;background-position: center center !important;width: 100%;height: 100vh;display: flex;flex-wrap: wrap;align-items: center;padding: 30px 30px;overflow-y: auto;}
.login-section .login-background .login-main-box { max-width: 550px; margin: 0 auto; padding: 40px; background: linear-gradient(225deg, transparent 30px, rgba(71, 76, 85, 0.8) 0) top right; margin: 25px auto;}
.login-section .login-background .login-main-box .logo-box {text-align: center;padding-bottom: 30px;}
.login-section .login-background .login-main-box .button {min-width: 139px;}

.login-section .button {display: inline-block;text-align: center;line-height: 1;cursor: pointer;-webkit-appearance: none;transition: background-color 0.25s ease-out, color 0.25s ease-out;vertical-align: middle;border: 1px solid transparent;border-radius: 0;padding: 0.85em 1em;margin: 0 0 0 0;font-size: 0.9rem;background-color: #F47920;color: #ffffff;border: 0;text-decoration: none;}
.login-section .button, .footer-menu-1-item-button a {font-size: 1rem;font-weight: bold;font-family: "teko";text-transform: uppercase;letter-spacing: 2px;margin-right: .8rem;background-size: cover;padding: 16px 20px 12px 30px;}
.login-section .button.primary {position: relative;background: url(/assets/img/primary-left.svg) no-repeat;}
.login-section .button.primary:after, .footer-menu-1-item-button a.primary:after {background: url(/assets/img/primary-right.svg) no-repeat;position: absolute;top: 0;right: -10px;bottom: -7px;content: '';width: 15px;height: 44px;}
.login-section .button.primary:hover, .button.primary:focus {background-color: #d25e0a;color: #ffffff;    text-decoration: none;}
.login-section .button.primary:hover, .button.primary:focus, .footer-menu-1-item-button a.primary:hover, .footer-menu-1-item-button a.primary:focus {    background: url(/assets/img/primary-left-hover.svg) no-repeat;    color: #F47920;}
.login-section .button.primary:hover:after, .button.primary:focus:after, .footer-menu-1-item-button a.primary:hover:after, .footer-menu-1-item-button a.primary:focus:after {background: url(/assets/img/primary-right-hover.svg) no-repeat;position: absolute;top: 0;right: -10px;content: '';width: 15px;height: 44px;}

.login-footer { padding-top: 10px; text-align: center; }
.login-footer span {font-family: 'Tajawal', sans-serif; font-weight: normal; font-size: 18px; margin: 6px 0; color: #fff; display: inline; letter-spacing: 0;}

.login-footer a {transition: ease-in-out all 0.2s; -webkit-transition: ease-in-out all 0.2s; -ms-transition: ease-in-out all 0.2s; -o-transition: ease-in-out all 0.2s; text-decoration:none; color:#30333a;}
.login-footer a:active, .login-footer a:hover, .login-footer a:focus {outline: 0; text-decoration:none; color: #f06400;}

.login-message { padding-top: 10px; padding-bottom: 10px; text-align: center; }
.login-message span {font-family: 'Tajawal', sans-serif; font-weight: normal; font-size: 18px; margin: 6px 0; color: #fff; display: inline; letter-spacing: 0;}
.login-message p {font-family: 'Tajawal', sans-serif; font-weight: normal; font-size: 18px; margin: 6px 0; color: #fff; letter-spacing: 0;}
.login-message .muted{font-family: 'Tajawal', sans-serif; font-weight: normal; font-size: 16px; margin: 6px 0; color: #dedede; letter-spacing: 0;}
.login-message h3 {font-family: 'Tajawal', sans-serif; font-weight: normal; color: #fff; }

.login-section .two-col-left { padding-left: 0px; padding-right: 10px;}
.login-section .two-col-right { padding-left: 10px; padding-right: 0px;}

.login-section .password-validation  {font-family: 'Tajawal', sans-serif; font-weight: normal; font-size: 18px; margin: 6px 0; color: #dedede; display: inline; letter-spacing: 0;}
/* Login Panels End */

/* UL LI No border */
.li-noborder li {border-bottom: none !important;}
/* UL LI No border End*/

/* Display Table*/
.dtable {display: table; width: 100%}
.dtable-cell {display: table-cell; vertical-align: middle;}
/* Display Table End*/


/* Check Box */
.checkbox-container {display: block;position: relative;-webkit-user-select: none;-moz-user-select: none;-ms-user-select:none;user-select: none;margin-right: 15px;margin-bottom: 15px;}
.checkbox-container-inline {display: inline-block;position: relative;margin-bottom: 12px;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select:none;user-select: none;margin-right: 15px;margin-bottom: 15px;}
.checkbox-inline {padding-left: 30px;}
.checkbox-container span, .checkbox-container-inline span {position: absolute;top: 2px;left: 0;height: 20px;width: 20px;border-radius: 2px;border: 1px solid #d3d3d3;transition: 0.3s;}
.checkbox-container input, .checkbox-container-inline input {opacity: 0;position: absolute;top: 0;width: 100%;height: 100%;z-index: 9;margin: 0 !important;left: 0;bottom: 0;cursor: pointer;}
.checkbox-container span:after, .checkbox-container-inline span:after {content: "";opacity: 0;display: inline-block;transition: 0.2s;overflow: hidden;height: 0px;width: 0px;border-left: 2px solid #00ACA0;border-bottom: 2px solid #00ACA0;transform: rotate(-45deg);-webkit-transform: rotate(-45deg);top: -7px;left: 5px;right: 0;position: absolute;margin: auto;bottom: 0;}
.checkbox-container input:checked ~ span,.checkbox-container-inline input:checked ~ span {border-color: #00aca0;}
.checkbox-container input:checked ~ span:after, .checkbox-container-inline input:checked ~ span:after {display: block;opacity: 1;width: 14px;height: 7px;}
/* Check Box End*/

/* side bar */
.sidebar {font-family: 'Teko', sans-serif;}
.sidebar.sidebar-big-height { min-height: 700px; }
.sidebar { background-color: #f8f8f8; overflow: hidden; position: relative}
.sidebar + .sidebar { margin-top: 1em; }
.sidebar.sidebar-big-height ul li {border-bottom: 1px solid #e1e1e1}
.sidebar ul li {position: relative;border-bottom: 1px solid #e1e1e1}
.sidebar ul li:last-child {border-bottom: none;}
.sidebar ul li form {width: 100%;padding: 15px 40px;}
.sidebar ul li a {display: block; color: #6f7576; font-size: 24px;padding: 15px 40px 12px 40px;text-transform: uppercase;}
.sidebar ul li a:hover { color: #f47920;}
.two-cut-sidebox:before,.two-cut-sidebox:after {width: 0;height: 0;content: '';border-style: solid;border-width: 0 40px 40px 0;border-color: transparent #ffffff transparent transparent;position: absolute;right: 0;}
.two-cut-sidebox:after {bottom: 0;left: 0;border-color: transparent transparent #ffffff;}
.sidebar.sidebar-big-gutters ul li a {padding: 23px 40px 19px 40px;}
/* side bar End*/

/* Box Sidebar */
.box-sidebar {padding: 15px;}
.box-sidebar h5.hm-title3 {margin-bottom: 0;}
.min-height-220 {min-height: 220px;}
.min-height-120 {min-height: 120px;}
/* Box Sidebar End*/

.single-cut-sidebox:before,.single-cut-sidebox:after {width: 0; height: 0; content: ''; border-style: solid; border-width: 0 40px 40px 0; border-color: transparent #ffffff transparent transparent; position: absolute; right: 0;}

/* Chart List */
.chart-list .media-left {height: 35px;width: 55px;background-color: #151b26;padding: 0;}
.chart-list .media-body {width: auto; padding-left: 18px;}
.chart-list .media-body label {text-transform: uppercase;}
.chart-list li + li {margin-top: 5px;}
/* Chart List End*/

/* Chart CSS */
.donu-chartbox {position: relative;}
.donu-chartbox h5.hm-title3 {position: absolute; top: -130px;bottom: 0;margin: auto; height: 26px;left: 0;right: 0;text-align: center;z-index: 1;}
/* Chart CSS End*/

/*Small Chart List */
.chart-list.small-chart-list .media-left {height: 25px; width: 40px;}
.chart-list.small-chart-list .media-body label {font-size: 18px;}
.chart-list.small-chart-list .media-body { padding-left: 10px;}
/*Small Chart List End*/

/*icon list*/
.icon-list li + li {margin-top: 30px;}
.icon-list li img + img {margin-left: 35px;}
/*icon list End*/



/* Table CSS */
/* .table>thead>tr>th {font-family: 'Teko', sans-serif; vertical-align: bottom; border-top: none; border-bottom: 2px solid #1d252d; color: #1d252d; font-size: 18px; text-transform: uppercase; font-weight: 500; padding: 0px 8px;}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td{padding: 10px 8px;line-height: 1.42857143;vertical-align: top;border-bottom: 1px solid #dddfdf;border-top: 0;position: relative;}
.table>tbody>tr>td label, .table>tfoot>tr>td label {display: block;}
.table>tbody>tr>td:first-child label {font-weight: 700;} */
/* .table>tbody>tr>td span, .table>tfoot>tr>td span {color: rgba(48,51,58,0.34);} */
.table>thead>tr>th { font-family: 'Teko', sans-serif; vertical-align: bottom; border-top: none; border-bottom: 2px solid #1d252d; color: #1d252d; font-size: 18px; text-transform: uppercase; font-weight: 500; padding-bottom: 6px;}
.table>tbody>tr>td label, .table>tfoot>tr>td label {display: block;}

/* Table CSS End */

.table>tbody>tr>td.condensed {
    padding: 2px 4px 4px 4px;
}

.table>tbody>tr>td.border-right {
    border-right:1px solid #dddddd;
}

.table>tbody>tr>td.projection{
    padding: 5px 4px 5px 4px;
}

.table>tbody>tr>td.money{
    text-align: right; 
}

.sticky-header{
    position: sticky;
    top: 76px;
    background-color: #ffffff;
}




/* Button */
/* Exhisting site css start ====================*/
.button + .button {margin-left: 2.8em;}
.button {display: inline-block;text-align: center;line-height: 1;cursor: pointer;-webkit-appearance: none;transition: background-color 0.25s ease-out, color 0.25s ease-out;vertical-align: middle;border: 1px solid transparent;border-radius: 0;padding: 0.85em 1em;margin: 0 0 0 0;font-size: 0.9rem;background-color: #F47920;color: #ffffff;border: 0;text-decoration: none;}
.button, .footer-menu-1-item-button a {font-size: 1rem;font-weight: bold;font-family: "teko";text-transform: uppercase;letter-spacing: 2px;background-size: cover;padding: 16px 20px 12px 30px;}
/* Button primary*/
.button.primary {position: relative;background: url(../img/primary-left.svg) no-repeat;}
.button.primary:after, .footer-menu-1-item-button a.primary:after {background: url(../img/primary-right.svg) no-repeat;position: absolute;top: 0;right: -10px;bottom: -7px;content: '';width: 15px;height: 100%;}
.button.primary:hover, .button.primary:focus {background-color: #d25e0a;color: #ffffff;    text-decoration: none;}
.button.primary:hover, .button.primary:focus, .footer-menu-1-item-button a.primary:hover, .footer-menu-1-item-button a.primary:focus {    background: url(../img/primary-left-hover.svg) no-repeat;    color: #F47920;}
.button.primary:hover:after, .button.primary:focus:after, .footer-menu-1-item-button a.primary:hover:after, .footer-menu-1-item-button a.primary:focus:after {background: url(../img/primary-right-hover.svg) no-repeat;position: absolute;top: 0;right: -10px;content: '';width: 15px;height: 100%;}
/* Button primary invert-btn*/
.button.primary.invert-btn {background: url(../img/primary-left-hover.svg) no-repeat;color: #F47920;}
.button.primary.invert-btn:after {background: url(../img/primary-right-hover.svg) no-repeat;}
.button.invert-btn:hover, .button.invert-btn:focus, .footer-menu-1-item-button a.invert-btn:hover, .footer-menu-1-item-button a.invert-btn:focus {position: relative;background: url(../img/primary-left.svg) no-repeat;color: #ffffff;}
.button.invert-btn:hover:after, .button.invert-btn:focus:after, .footer-menu-1-item-button a.invert-btn:hover:after, .footer-menu-1-item-button a.invert-btn:focus:after {background: url(../img/primary-right.svg) no-repeat;}
/* Button left secondary*/
.button.left.secondary {background-color: #00ACA0;color: #ffffff;}
.button.left.secondary, .footer-menu-1-item-button a.left.secondary {background: url(../img/secondary-left.svg) no-repeat;position: relative;}
.button.left.secondary:after, .footer-menu-1-item-button a.left.secondary:after {background: url(../img/secondary-right.svg) no-repeat;position: absolute;top: 0px;right: -10px;content: '';width: 15px;height: 100%;}
.button.left.secondary:hover:after, .button.left.secondary:focus:after, .footer-menu-1-item-button a.left.secondary:hover:after, .footer-menu-1-item-button a.left.secondary:focus:after {background: url(../img/secondary-right-hover.svg) no-repeat;position: absolute;top: -0px;right: -10px;content: '';width: 15px;height: 100%;}
.button.left.secondary:hover, .button.left.secondary:focus, .footer-menu-1-item-button a.left.secondary:hover, .footer-menu-1-item-button a.left.secondary:focus {background: url(../img/secondary-left-hover.svg) no-repeat;content: '';color: #00ACA0;}
/* Button left secondary invert-btn*/
.button.left.secondary.invert-btn {background: url(../img/secondary-left-hover.svg) no-repeat;color: #00aca0;}
.button.left.secondary.invert-btn:after {background: url(../img/secondary-right-hover.svg) no-repeat;}
.button.left.secondary.invert-btn:hover, .button.left.secondary.invert-btn:focus, .footer-menu-1-item-button a.left.secondary.invert-btn:hover, .footer-menu-1-item-button a.left.secondary.invert-btn:focus {position: relative;background: url(../img/secondary-left.svg) no-repeat;color: #ffffff;}
.button.left.secondary.invert-btn:hover:after, .button.left.secondary.invert-btn:focus:after, .footer-menu-1-item-button a.left.secondary.invert-btn:hover:after, .footer-menu-1-item-button a.left.secondary.invert-btn:focus:after {background: url(../img/secondary-right.svg) no-repeat;}
/* Button right secondary*/
.button.right.secondary, .footer-menu-1-item-button a.right.secondary {background: url(../img/secondary-left-1.svg) no-repeat;position: relative;color: #474c55;background-size: contain;background-position: center;}
.button.right.invert-btn.secondary, .footer-menu-1-item-button a.right.invert-btn.secondary {background: url(../img/secondary-left-1-hover.svg) no-repeat;position: relative;color: #474c55;background-size: contain;background-position: center;}
.button.right.secondary:after, .footer-menu-1-item-button a.right.secondary:after {display: none}
/* Button right secondary invert-btn*/
.button.right.secondary:hover, .button.right.secondary:focus, .footer-menu-1-item-button a.right.secondary:hover, .footer-menu-1-item-button a.right.secondary:focus {background: url(../img/secondary-left-1-hover.svg) no-repeat;content: "";    background-size: contain;background-position: center;}
.button.right.secondary.invert-btn:hover, .button.right.secondary.invert-btn:focus, .footer-menu-1-item-button a.right.secondary.invert-btn:hover, .footer-menu-1-item-button a.right.secondary.invert-btn:focus {background: url(../img/secondary-left-1.svg) no-repeat;content: "";background-size: contain;background-position: center;}


/*
.custom-checkbox .custom-control-input:checked~.custom-control-label::before{
    background-color: #f47920;
    border: 1px solid #f47920;
}  */

/* This is the default state
.custom-checkboxx .custom-control-label::before {
    background-color: darkorange;  /* orange 
} */

/* This is the checked state
.custom-checkbox .custom-control-input:checked~.custom-control-label::before{
    background-color: #f47920;
    border: 1px solid #f47920;
} */

/*
.custom-radio .custom-control-input:checked~.custom-control-label::before{
    background-color: #f47920;
    border: 1px solid #f47920;
} */

/* active state i.e. displayed while the mouse is being pressed down*/
.custom-checkbox .custom-control-input:active ~ .custom-control-label::before {
    color: #fff;
    background-color: #f47920;
} 
    
/* the shadow; displayed while the element is in focus  */
.custom-checkbox .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #f47920 
}

.custom-radio .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #f47920 
}

.custom-control-input:checked~.custom-control-label::before
{
  border-color: #f47920 !important;
  background-color: #f47920 !important;
}

.custom-control-input:checked:disabled~.custom-control-label::before
{
  border-color: #ccc !important;
  background-color: #cccc !important;
}




/* Footer CSS Start */
footer.hm-section {background-color: #474C55;overflow-x: hidden;}
footer.hm-section .big-gutters>.col-sm-6 {padding-top: 60px;padding-bottom: 60px;}
footer.hm-section a {color: #f7f6f2;font-family: 'Tajawal', sans-serif;display: inline-block;z-index: 1;position: relative;}
footer.hm-section .big-gutters>.col-sm-6 ul {margin-top: 30px;z-index: 1;position: relative;}
footer.hm-section span {color: #ffffff;margin-right: 3px;font-size: 16px;}
footer.hm-section h5.hm-title3 {color: #dddfdf;display: table-cell;vertical-align: bottom;position: relative;z-index: 1;}
footer.hm-section h5.hm-title3 ~ a {margin-top: 15px;}
footer.hm-section .big-gutters>.col-sm-6.site-map ul {margin-top: 10px;column-count: 2;position: relative;}
footer.hm-section .site-map ul li {line-height: 30px;}
footer.hm-section .site-map ul li:last-child {margin-top: 2em;}
footer.hm-section .site-map ul .footer-secondary-link {font-weight: 700;}
.site-map:before {content: "";position: absolute;left: 0;top: 0;bottom: 0;right: 0;background-color: #60656d;width: 1000%;}
.site-map:after {content: "";width: 0;height: 0;border-style: solid;border-width: 0 70px 70px 0;border-color: transparent #60656d transparent transparent;position: absolute;top: 0;left: -70px;}
/* Footer END */

/* Footer Copy Right */
.copyright {background-color: #30333a;padding: 25px 0 20px 0;}
.social-box li {display: inline-block;}
.social-box li + li {margin-left: 34px;}
.copyright .text-right p, .copyright .text-right a {display: inline-block;font-size: 15px;}
.copyright .text-right p{color: #ffffff;margin-right: 10px;}
.copyright .text-right a {text-decoration: underline;}
/* Footer Copy Right END */

.header-link:hover { cursor: pointer; }

.gridItem-link { text-decoration: underline; }
.gridItem-link:hover { cursor: pointer; }

.grid-text-link{ text-decoration: underline; }
.grid-text-link:hover { cursor: pointer; }

.text-link { text-decoration: underline; }
.text-link:hover { cursor: pointer; }

.text-underline-link:hover { text-decoration: underline; cursor: pointer; }

.wpIcons { width: 160px; }


a { color: #d25e0a; }
a:hover { color:#474C55; }

.icon-link:hover {  cursor: pointer; }
.icon-default { color: #999999; }
.icon-orange { color: #d25e0a; }

.icon-disabled{ color: #e8e8e8; }
.icon-default{ color: #999999; }
.icon-active{ color: #f47920; }
.icon-error{ color: var(--red-color); }
.icon-no-error{ color: var(--green-color); }


.statsBarOld{
    display: inline-block;
    width: 10px;
    background:gray;
    height: 20px;
    float: left;
    margin: 2px 0 10px; 
    padding:0;
    /* cursor:pointer; */
}


/* Bootstrap 4 Buttons */
.btn-primary{ color:#fff; background-color:var(--orange-color); border-color:var(--orange-color); }
.btn-primary:active{ color:#fff; background-color:var(--orange-color); border-color:var(--orange-color); }
.btn-primary:hover{ color:#fff; background-color:#d25e0a; border-color:#d25e0a; }
.btn-primary:focus{ color:#fff; background-color:var(--orange-color); border-color:var(--orange-color);box-shadow:0 0 0 .2rem rgba(190,94,10,0.5);}
.btn-primary:disabled { color:#fff; background-color:var(--gray-color); border-color:var(--gray-color); }
.btn-primary.disabled { color:#fff; background-color:var(--gray-color); border-color:var(--gray-color); }

.btn-outline-primary{ color:var(--orange-color); background-color:transparent; background-image:none; border-color:var(--orange-color);}
.btn-outline-primary:active{ color:var(--orange-color); background-color:transparent; background-image:none; border-color:var(--orange-color);}
.btn-outline-primary:hover{ color:#fff; background-color:var(--orange-color); border-color:var(--orange-color); }
.btn-outline-primary:focus{ color:#fff; background-color:var(--orange-color); border-color:var(--orange-color);box-shadow:0 0 0 .2rem rgba(190,94,10,0.5);}
.btn-outline-primary:disabled { color:var(--orange-color); background-color:transparent; background-image:none; border-color:var(--orange-color);}
.btn-outline-primary.disabled { color:var(--orange-color); background-color:transparent; background-image:none; border-color:var(--orange-color);}

/*Bootstrap 4 Buttons*/


.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
    background-color:rgba(244, 121, 32, .3);
}

/* Project Table */
.w-20 {
    width: 20px;
}

/* Revenue/Margin Columns */
.rev-margin-col { width: 190px; }
.money-col { text-align: right; vertical-align: middle; }
.total-row { border-top: 2px solid #1d252d; color: #1d252d; font-weight: bold;}

.strategic-col { width: 160px; }

.prj-total-row { border-top: 2px solid rgb(184, 184, 184);}
.dev-total-row { border-top: 2px solid rgb(184, 184, 184); font-weight: bold;}

@media (min-width:1200px) {
    /*.nav-md-height { height:76px; }*/
    .wpSearchBar {width: 400px;}
}

@media (min-width:992px) {
    /*.nav-md-height {height:76px; }*/

    .wpSearchBar {width: 360px;}
    .wpIcons { width: 120px; }
}

@media (min-width:768px) {

    .col-sm-height { display:table-cell; float:none; height:100%; }
    .col-sm-top { vertical-align:top; }
    .col-sm-middle { vertical-align:middle; }
    .col-sm-bottom { vertical-align:bottom; }
    .col-sm-3 { width: 33%; }
    .row-sm-height{ display:table; table-layout:fixed; height:100%; width:100%; }

    /*.nav-sm-height { height:76px; }*/

    
}

@media (min-width:0) {
    .row-xs-height { display:table; table-layout:fixed; height:100%; width:100%; }
    .col-xs-height { display:table-cell; float:none; height:100%; }
    .col-xs-top { vertical-align:top; }
    .col-xs-middle { vertical-align:middle; }
    .col-xs-bottom { vertical-align:bottom; }

    /*.nav-xs-height {height:76px; }*/
}

@media only screen and (min-width: 992px) {

    /* Nav goes to hamburger
    .wp-projects .table>tbody>tr>td:first-child::before { content: ""; left: 0; position: absolute; height: 100%; width: 15px; top: 0; bottom: 0; margin: auto; background-color: #f47920; }
    .wp-projects .table>tbody>tr>td:first-child { padding-left: 25px; }
     */

    /*
    .wp-projects .table>tbody>tr>td.high:first-child::before { background-color: #8dc63f; }
    .wp-projects .table>tbody>tr>td.med:first-child::before { background-color: #097591; }
    .wp-projects .table>tbody>tr>td.low:first-child::before { background-color: #ef3d23; }
    .wp-projects .table>tbody>tr>td.die:first-child::before { background-color: #000000; }
    */
}




/* Max Widths */

@media only screen and (max-width: 1600px) {
    /* 
    .menu ul li {padding: 0 26px;}
    .menu>ul>li>a { font-size: 20px; padding: 24px 30px;}
    .menu>ul>li.has-submenu>a:before {border-width: 0 6px 6px 0; right: 18px; top: 29px;}
    */

}

@media only screen and (max-width:1400px){
    
    .rev-margin-col { width: 160px; }
}

@media only screen and (max-width: 1199px) {

    h2.title { font-size: 45px; }
    h3.title {font-size: 38px; margin-bottom: 20px;}
    h4.title { font-size: 28px; margin-bottom: 15px; }
    h5.title { font-size: 20px; margin-bottom: 8px; }

    .sidebar.sidebar-big-height {min-height: 500px;}
    .sidebar ul li a {font-size: 22px;padding: 12px 30px 10px 30px;}
    .sidebar ul li form {padding: 12px 30px;}
    .sidebar.sidebar-big-gutters ul li a {padding: 16px 40px 12px 40px;}

    .box-sidebar {padding: 25px 15px;}
    .min-height-220 {min-height: 160px;}
    .min-height-120 {min-height: 160px;}

    .chart-list.small-chart-list .media-body label {font-size: 16px;}

    .rev-margin-col{ width: 140px;}  

    .hideXLarge { display: none; }
    .wpIcons { width: 140px; }

}

@media only screen and (max-width: 991px) {

    h3.title {font-size: 36px; margin-bottom: 15px;}

    

    .login-section .two-col-left { padding-left: 0px; padding-right: 0px;}
    .login-section .two-col-right { padding-left: 0px; padding-right: 0px;}

    .hideLarge { display: none; }
    .wpPrjBtns {padding-top: 10px;}

    

    
    /*
    .wp-projects .table thead {display: none;}
    .wp-projects .table tbody tr td { display: block;text-align: left; padding-left: calc(40% + 20px);position: relative;overflow: hidden;height: auto;border-right: 1px solid #dddfdf;}
    .wp-projects .table tbody tr td:after {content: attr(data-title);display: block;position: absolute;left: 0px;top: 0;padding: 8px 10px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;width: 40%;height: 100%;background-color: #f57921;color: #ffffff;font-size: 18px;text-transform: uppercase;font-weight: 500;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
    .wp-projects .table>tbody>tr>td label br, .table>tfoot>tr>td label br {display: none;}
    .wp-projects .table tbody tr:first-child td:first-child {border-top: 1px solid #dddfdf;} 
    */
}

@media only screen and (max-width: 768px) {

    h2.title { font-size: 35px; }
    h3.title { font-size: 30px; margin-bottom: 10px; } 
    h4.title { font-size: 24px; margin-bottom: 12px; }

    .sidebar {margin-bottom: 1.5em;}
    .sidebar + .sidebar {margin-top: 0;margin-bottom: 1em;}

    .sidebar.sidebar-big-height {min-height: auto;}
    .sidebar ul li a {font-size: 18px;padding: 11px 30px 8px 30px;}
    .sidebar.sidebar-big-gutters ul li a {padding: 14px 30px 9px 30px}

    .hideMedium {display: none;}
}

@media only screen and (max-width: 576px) {

    .hideSmall {display: none;}
    
}

@media only screen and (max-width: 390px) {
    .hideXSmall { display: none; }
}