* { font-family: Roboto; }
.addJob h2 { color: red; }
.clearfix{clear:both;width: 100%;height: 0;}
/* Custom Checkbox */
.customcheckbox { display: inline-block; position: relative; padding-left: 29px; margin-bottom: 12px; cursor: pointer; font-size: 22px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.focusactive{ border: 1px solid #f7a823 !important; }
/* Hide the browser's default checkbox */
.customcheckbox input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
/* Create a custom checkbox */
.checkmark { position: absolute; top: -3px; left: 0; height: 18px; width: 18px; border: 2px solid #d8d8d8; border-radius: 2px; }
.company_details_next small { font-size: 100%; }
/* On mouse-over, add a grey background color */
.customcheckbox:hover input ~ .checkmark {
    /* background-color: #d8d8d8;
    border: 2px solid #d8d8d8; */
}
/* When the checkbox is checked, add a blue background */
.customcheckbox input:checked ~ .checkmark { background-color: #f7a823; border: 2px solid #f7a823; }
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after { content: ""; position: absolute; display: none; }
/* Show the checkmark when checked */
.customcheckbox input:checked ~ .checkmark:after { display: block; }
/* Style the checkmark/indicator */
.customcheckbox .checkmark:after { left: 3.5px; top: 0px; width: 7px; height: 11px; border: solid white; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
/* Custom Checkbox */
select { background: #fff; }
label { font-family: Roboto; font-size: 12px; color: #9ca8ae; margin-top: 15px; display: block; font-weight: normal; }
.mul_icon.closeicon { display: flex; align-items: center; justify-content: center; }
div#company_details { padding-left: 0 !important; padding-right: 0 !important;    padding-bottom: 35px; }
.company_details_next a#next_btn { color: #fff !important; background: transparent !important; }
label:before { content: ""; width: 6px; height: 6px; background: #06b9dd; display: inline-block; border-radius: 10px; margin-right: 9px; vertical-align: middle; }
.pagetitle h2 { font-family: Roboto; font-size: 28px; font-weight: 700; margin-bottom: 5px; }
select.disabled + span { background: #F9FAFB; cursor: not-allowed; pointer-events: none; }
.pagetitle h6 { font-family: Roboto; font-size: 12px; margin-bottom: 55px; color: #9aa8af; }
.flexgrow { flex-grow: 1; }
.physicaladress { font-size: 12px; color: #9aa8af; font-weight: 400; }
.yellowcontent .title_under_line { background-color: #f7a823; }
.yellowcontent label:before { background: #f7a823; }
.yellowcontent .dont_show_yellow_content:before {display: none; }
label.noCircle:before { display: none; }
button.savebtn.yellow { border-color: #f7a823; color: #f7a823 !important; }
.yellowcontent .title { color: #f7a823 !important; }
.btn.btn-primary.yellow { background: #f7a823; }
.whiteBox { border-radius: 3px; box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; margin-bottom: 30px !important; position: relative; z-index: 3; }
.manimg { position: absolute; right: -150px; top: -150px; z-index: -1; }
.whiteBox .content { padding: 3px 30px 44px 30px; }
.loadericon{ display: none; }
.dw_loadericon{ display: none; }
.finish_loadericon{ display: none; }
.save_loadericon{ display: none; }
.btnpr{ position: relative; }
span.loadericon.loadergreen.loadershow { background: #c3d836; }
span.loadericon.loaderblue.loadershow { background: #03badd; }
span.loadericon.loaderred.loadershow { background: #f15d67; }
.loadershow.loadericon i { font-size: 24px; }
.loadershow.dw_loadericon i { font-size: 24px; }
.loadershow.finish_loadericon i { font-size: 24px; margin: -11px; color: black; }
.loadershow.save_loadericon i { font-size: 24px; margin: -11px; color: black; }
.send_pledgepr{ position: relative; margin: 0 !important; height: 100%; display: flex; align-items: center; justify-content: center; }
.loadershow.loadericon { display: flex; position: absolute; left: 0; top: 0; bottom: 0; right: 0; background: #f7a823; align-items: center; justify-content: center; }
.loadershow.dw_loadericon { display: flex; position: absolute; left: 0; top: 0; bottom: 0; right: 0; background: #f7a823; align-items: center; justify-content: center; }
.loadershow.finish_loadericon { display: initial; left: 0; top: 0; bottom: 0; right: 0; background: #c3d836; align-items: center; justify-content: center; }
.loadershow.save_loadericon { display: initial; left: 0; top: 0; bottom: 0; right: 0; background: #c3d836; background-color: white; align-items: center; justify-content: center; }
/**** Login Page ****/
.userpage{ background: #f4f6f9; height: 100vh; }
.userheader { padding: 35px 40px 0 100px; }
.signupbtn a{ float: right; }
/**** Login Page ****/
.bluecontent .title { color: #06b9dd !important; }
.whiteBox .title { font-family: Roboto; font-size: 20px; font-weight: bold; padding-left: 30px; padding-top: 18px; padding-bottom: 18px; padding-right: 30px; border-bottom: 1px solid #e3e7eb; min-height: 60px; text-align: left; color: #f6a723; line-height: normal; }
.title_under_line { width: 72px; height: 2px; background-color: #03badd; margin-left: 30px; margin-top: -2px; }
.form-control:focus { color: #000; }
.form-control { height: 46px; border-radius: 2px; border: 1px solid #e3e7eb; width: 100%; padding: 15px 13px 13px 20px; color: #000000; font-family: Roboto; font-size: 15px; }
select.form-control { background-image: url(/img/caret.svg); background-repeat: no-repeat; background-position-x: calc(100% - 20px); background-position-y: 18px; height: 46px; border-radius: 2px; border: 1px solid #e3e7eb; width: 100%; padding: 12px 13px 13px 20px; color: #000000; font-family: Roboto; font-size: 15px; -moz-appearance: none; -webkit-appearance: none; appearance: none;line-height: 1.2; }
.dark-content{ color: #3d4953 !important; }
.light-content{ color: #9ca8ae !important; }
.table td { font-size: 15px; font-weight: normal; font-style: normal; line-height: normal; letter-spacing: normal; /* color: #000; */ vertical-align: middle; padding: 19px 22px; }
.table th { font-size: 12px; font-weight: bold; line-height: normal; letter-spacing: normal; color: #9ca8ae; padding: 20px 22px; vertical-align: middle; border: 0; text-align: left; }
button.btn.ico-btn { padding: 0; }
.newJob .table td { color: #000; }
.mainRightCol { margin-left: 300px; }
.smallContainer { max-width: 810px; padding-top: 84px; }
a.btn.btn-primary, a.btn.btn-secondary { color: #fff !important;}
.pseudonone:before { display: none;}
.btn.btn-primary, .btn.btn-secondary, .btn.btn-success { border-radius: 3px; padding: 15px 21px; line-height: normal; width: auto; height: 46px; border: 0; font-size: 12px; font-weight: 500; outline: 0; text-decoration: none;text-transform: uppercase;}
.btn.btn-secondary { background: none; border: 1px solid #03badd; color: #03badd; cursor: pointer; padding: 14px 20px;}
.btn.sameLineBtn { margin-right: 25px;}
.mainRightColInner { padding: 0 15px; }
.pageContent { padding-top: 20px; }
.pageHeader { padding-top: 45px; }
.pageHeader h2 { min-width: 229px; /*height: 33px;*/ font-size: 28px; font-weight: bold; font-style: normal; line-height: normal; color: black; padding-top: 5px; }
.dot { border: none; width: 10px; height: 10px; border-radius: 50%; margin-left: 0; display: inline-block; }
.pr-11 { padding-right: 30px !important; }
.pr-25 { padding-right: 13px !important; }
.mainRightCol.blueinput ~ .select2-container--open .select2-dropdown--below { border-color: #06b9dd; }
.table th:last-child, .table td:last-child { padding-right: 30px; }
.blueinput .select2.select2-container.select2-container--default.select2-container--below.select2-container--open { border: 1px solid #06b9dd; }
.blueinput .select2-container--open .select2-dropdown--below { border: 1px solid #f7a823 !important; }
.custom-control.custom-checkbox { min-height: 18px; padding-left: 0; }
.dot.grey { background: #637381; }
.dot.green { background: #4cd964; }
.dot.yellow { background: #ff9500; }
.dot.blue { background: #03badd; }
.dot.pink { background: #f15b67; }
.custom-checkbox .custom-control-label::before { border-radius: 3px; }
.custom-control-label::before { width: 18px; height: 18px; border: #d8d8d8 solid 2px; left: 0; top: 0; }
.custom-control-label::after { width: 18px; height: 18px; top: 0; left: 0; }
.custom-control-label { margin-top: 0; }
/******* Contact Detail   *******/
.contact-man img#man_image { top: 62px; }
.titleRight { float: right; margin-top: -8px; }
label { transition: all 0.1s ease 0.1s; }
label.labelfocus { color: #000; }
.calculate_go { margin-top: 27px; }
.calculate_go_non { margin-top: 27px; }
.calc-btn { max-width: 12%; }
/******* Side Menu *******/
.sidemenucstm { padding: 0; }
.progresscanvas { position: relative; width: 70px; height: 70px;}
.progresscanvas canvas { height: 70px; position: absolute; object-fit: cover;/* left: -35px; */ right: 0;}
.progresstext { position: absolute; top: 50%; left: 50% !important; margin: 0; transform: translate(-50%, -50%); font-size: 22px; color: #fff; font-family: 'Roboto', sans-serif; margin-top: 4px; font-weight: 700;}
.progresscontent p { font-size: 18px; font-weight: 700; color: #fff; line-height: 20px; margin: 0; }
.progresscontent { padding-top: 12px; padding-left: 10px; }
.dashboard_menu li a { padding: 0; }
.dashboard_menu ul { margin: 0 !important; }
.logosidemenu { display: inline-block; }
.dashboard_menu .dropdown-toggle::before { border-top: 0.5em solid; border-right: 0.5em solid transparent; border-left: 0.5em solid transparent; position: absolute; right: 35px; top: 50%; transform: translate(0, -50%); }
.dropdown-menu a.dropdown-item { padding: 0.25rem 1.5rem; }
.dashboard_menu .dropdown-menu.show { display: block; left: 100% !important; margin-left: -50px; }
.pledgepending h3 { font-size: 12px; color: #fff; font-weight: 700; margin: 0; }
.pledgepending .pledgecontent { font-size: 15px; margin-top: 0px; color: #fff; margin-bottom: 0; }
#download_invoice .payment_alert { position: absolute; bottom: 0; width: 780px; height: 72px; border-radius: 3px; border-top-left-radius: 0; border-top-right-radius: 0; padding: 19px 30px 17px 30px; background-color: #f7a823; }
.pb-70 { padding-bottom: 70px; }
/******* Side Menu *******/
#yes_commitment .content { padding-top: 25px; }
.focusFieldCol { color: #000; }
.select_commitment.selectCommitmentStyle { overflow: initial; }
.select_commitment.selectCommitmentStyle::before, .select_commitment.selectCommitmentStyle::after { content: ""; display: block; clear: both; }
#company_details_form .calc_r_div { padding-top: 13px; }
.check_yes_commitment.checkStyle label { position: relative; color: #fff; }
.checkStyle input { position: absolute; opacity: 0; left: 0; }
.checkStyle .checkmark { border: none; }
#company_details .content,
.implementation_list .content { padding: 25px 30px; }
#ceo_pledge .content .send_pledge { margin-top: 40px; }
label.simpleLbl::before { display: none; }
#ceo_pledge .content, #download_invoice .content { padding: 25px 30px !important; }
#placement_stats .new_work_exp.btnTopStyle { padding: 0; }
#placement_stats .new_work_exp.btnTopStyle a { color: #fff !important; text-align: center; }
.yellowcontent p.title.green-bar { color: #ffffff !important; }
#company_details p.title.blue-bar { color: #ffffff !important; }
.btn.btn-primary.next.green small { font-size: 100%; }
.btn.btn-primary.next.green, .btn.btn-primary.back { height: auto; }
.sidebaroverlay { position: fixed; }
.error label { color: red; }
.error input { border: 1px solid red; }
/*************** Register ***************/
.registerleft { height: 100vh; align-items: center; background: #fff; }
.createcompanysec { max-width: 400px; margin: 0 auto; }
.registerpage .userheader {/* position: absolute; width: 100%; top: 0; z-index: 9; */}
.registerbg { height: 100vh; width: 100%; background-position: center; background-size: cover;}
.registerleft { height: 70vh;  align-items: center; background: #fff; max-width: 600px; padding: 0 100px; float: left; }
.registerright { max-width: calc(100% - 600px); height: 70vh; width: 100%; float: left; }
.greencontent input:focus { border-color: #c3d836 !important; }
.bluecontent input:focus { border-color: #06b9dd !important; }
.redcontent input:focus{ border-color: #f15d67 !important; }
.mt-20 { margin-top: 20px; }
.create_company_title { color: rgb(247, 168, 35); font-size: 28px; font-weight: bold; margin-bottom: 0px; margin-top: 0; }
.mt-40{ margin-top: 20px; }
.experiencebtn { line-height: inherit !important; }
.registerpage label { color: #000; font-size: 14px; }
.registerpage label:before { display: none; }

/*************** Register **************/
label.error { margin: 0px; }
.login_dialog { margin: 100px auto; max-width: 460px; }
.login_dialog .content{ margin-top: 17px; }
.yellow_line { width: 72px; height: 2px; background-color: #f7a823; margin-left: 30px; margin-top: -2px; }
.mh-100vh { min-height: 100vh; }
.whiteBox.postaladdress { margin-top: 30px; }
.youthContent{ padding: 20px 0px; }
.btn.btn-primary.next.orange{ background-color: #f6a723; }
.rmv-validate:before{ content: none; }
.bbeee_level{ font-size: 15px; color: black; font-weight: 400;}
.levelcheckbox { display: inline-block; position: relative; padding-left: 29px; margin-bottom: 12px; font-size: 15px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin-left: 18px; color:#000 !important}
.checkbox_marketing,
.checkbox_bbeee_level,
.checkbox_industry,
.checkbox_multinational{ position: absolute; cursor: pointer; top: 2px; left: 0; height: 18px; width: 18px; border: 2px solid #d8d8d8; border-radius: 2px;}
/* On mouse-over, add a grey background color */
.levelcheckbox:hover input ~ .checkbox_bbeee_level {
    /* background-color: #d8d8d8;
    border: 2px solid #d8d8d8; */
}
/* When the checkbox is checked, add a blue background */
.levelcheckbox input:checked ~ .checkbox_marketing,
.levelcheckbox input:checked ~ .checkbox_bbeee_level,
.levelcheckbox input:checked ~ .checkbox_industry,
.levelcheckbox input:checked ~ .checkbox_multinational { background-color: #f7a823; border: 2px solid #f7a823; }
/* Create the checkbox_bbeee_level/indicator (hidden when not checked) */
.checkbox_marketing:after,
.checkbox_bbeee_level:after,
.checkbox_industry:after,
.checkbox_multinational:after { content: ""; position: absolute; display: none; }
/* Show the checkbox_bbeee_level when checked */
.levelcheckbox input:checked ~ .checkbox_marketing:after,
.levelcheckbox input:checked ~ .checkbox_bbeee_level:after,
.levelcheckbox input:checked ~ .checkbox_industry:after,
.levelcheckbox input:checked ~ .checkbox_multinational:after { display: block; }
/* Style the checkbox_bbeee_level/indicator */
.levelcheckbox .checkbox_marketing:after,
.levelcheckbox .checkbox_bbeee_level:after,
.levelcheckbox .checkbox_industry:after,
.levelcheckbox .checkbox_multinational:after { left: 3.5px; top: 0px; width: 7px; height: 11px; border: solid white; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
/* Hide the browser's default checkbox */
.levelcheckbox input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.clickble-row{ cursor: pointer;}
.iframe-report{ width: 1079px; height: 904px; border: solid 1px #979797; background-color: #d8d8d8;}
.title-url{ font-family: Roboto; font-size: 28px; font-weight: bold; font-style: normal;}
.auth-corner-label{ margin-top: 17px; float:left; color: #000000; font-size: 12px !important;font-weight: normal; cursor: pointer; }
.auth-sing-button { float:left; margin-left:28px; height: 46px; width: 120px; border: none;  border-radius: 2px; background-color:#2A3549;  }
.auth-sing-button-small { font-size: 12px; font-weight: 500; }
.login-round-img{ width:10px; height:10px; margin-left: 24px; margin-top: -1px; }
.login-box-content { width: 400px; height: 32px; font-family: Roboto; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; color: #000000; margin-bottom: 20px; }
.remember-me{ font-family: Roboto; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; color: #000000; align-self:center; margin:0; }
.error { color: red; }
.paidnote{width: 60px;height: 20px; border-radius: 20px; font-family: Roboto; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: center; color: #ffffff; padding-top: 1px; background-color: #4cd963;    margin-left: 5px;
          margin-right: 5px;}
.company_registration{color: rgb(247, 168, 35); font-size: 28px; font-weight: bold; margin-bottom: 10px;margin-top: 0; }
/*.message-content{position:fixed;}*/
.message-body{/*width: 734px;*//*height: 110px;*/background-color: #fff;border: 1px solid rgba(1, -1, 0, 0.2);border-radius: 0px;box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);background-clip: padding-box;outline: 3;font-family:'Roboto';font-size: 18px;font-weight: normal;font-style: normal;font-stretch: normal;line-height: normal;letter-spacing: normal;text-align: center;padding: 32px;}
.message-dialog{width: 600px;margin: 350px auto;}
.message-modal{display: none;overflow: visible;position:fixed;top: 0;right: 0;bottom: 0;left: 0;z-index: 1050;outline: 0;color: #555;overflow-x: hidden;overflow-y: auto;}
.message-modal .message-footer{margin-top:20px;}
.disable_loading .loader-inner {position: absolute; top: 50%; left: 50%; margin: 0; font-size: 30px; font-weight: bold; color: #000000; letter-spacing: 2px; transform: translate(-50%,-50%);}
.disable_loading{position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;  background: transparent;  text-align: center; cursor: not-allowed; }
.vat_num_title:before{display:none;}


.customuploader h3{font-size: 1.6em;font-weight: 400;letter-spacing: normal;line-height: 24px;}
.customuploader h4{font-size: 1.3em;font-weight: 400;letter-spacing: normal;line-height: 27px;}
.customuploader .text-justify {text-align: justify;}
.customuploader a.btn{color:#FFF !important;}
.customuploader hr.short {margin: 11px 0 11px 0;}
.customuploader hr {
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0));
    background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0));
    background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0));
    margin: 22px 0 22px 0;
}
form .input-group {flex-wrap: wrap;}
.input-group-addon, .input-group-btn, .input-group .form-control {display: -ms-flexbox;display: flex;-ms-flex-align: center;align-items: center;}
.input-group-addon, .input-group-btn {white-space: nowrap;}
.input-group-btn {position: relative;-ms-flex-align: stretch;align-items: stretch;font-size: 0;white-space: nowrap;}
.input-group .input-group-btn:not(:last-child) > .btn, .input-group-btn:not(:last-child) > .btn-group {
    margin-right: -1px;
    border-radius: 0.25rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;border: 1px solid #CCC;background:#FFF}



.form-control:disabled, .form-control[readonly] {
    background-color: #e9ecef;
    opacity: 1;
    border: 1px solid #ccc;
}

.input-group .form-control {
    position: relative;
    z-index: 2;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 1%;
    margin-bottom: 0;
}

/*.form-control:not(.form-control-lg) {
    font-size: 0.75rem;
    line-height: 1.3;
}*/

.input-group .form-control:not(:last-child), .input-group-addon:not(:last-child), .input-group-btn:not(:last-child) > .btn, .input-group-btn:not(:last-child) > .btn-group > .btn, .input-group-btn:not(:last-child) > .dropdown-toggle, .input-group-btn:not(:first-child) > .btn:not(:last-child):not(.dropdown-toggle), .input-group-btn:not(:first-child) > .btn-group:not(:last-child) > .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group .form-control:not(:first-child), .input-group-addon:not(:first-child), 
.input-group-btn:not(:first-child) > .btn, 
.input-group-btn:not(:first-child) > .btn-group > .btn, 
.input-group-btn:not(:first-child) > .dropdown-toggle, 
.input-group-btn:not(:last-child) > .btn:not(:first-child), 
.input-group-btn:not(:last-child) > .btn-group:not(:first-child) > .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;border: 1px solid #ccc;
}
/*
.form-control:not(.form-control-sm):not(.form-control-lg) {
    font-size: 0.85rem;
    line-height: 1.85;
    min-height: 2.4rem;
}*/

.input-group-addon:not(:first-child):not(:last-child), .input-group-btn:not(:first-child):not(:last-child), .input-group .form-control:not(:first-child):not(:last-child) {
    border-radius: 0;
}

.input-group-btn > .btn {position: relative;}
.input-group-btn .btn {padding-top: 0.5rem;padding-bottom: 0.5rem;}
.btn:disabled {cursor: not-allowed !important;}
.input-group .form-control:not(:first-child), .input-group-addon:not(:first-child), .input-group-btn:not(:first-child) > .btn, .input-group-btn:not(:first-child) > .btn-group > .btn, .input-group-btn:not(:first-child) > .dropdown-toggle, .input-group-btn:not(:last-child) > .btn:not(:first-child), .input-group-btn:not(:last-child) > .btn-group:not(:first-child) > .btn {border-top-left-radius: 0;border-bottom-left-radius: 0;}
.input-group-btn:not(:first-child) > .btn, .input-group-btn:not(:first-child) > .btn-group {z-index: 2;margin-left: 0;}
.input-group-btn:not(:first-child) > .btn:first-child, .input-group-btn:not(:first-child) > .btn-group:first-child {
    margin-left: -1px;background:#FFF
}

.calculatordiv{min-height: 160px;}
.calculatordiv .warning_message{display:none;}

#demandshapedateform .datepicker-inline {
    width: 100%;
}
#demandshapedateform  .datepicker table {
    width: 100%;
}
/* Loading Overlay */
.loading-overlay-showing {
    overflow: hidden;
}

.loading-overlay-showing > .loading-overlay {
    opacity: 1;
    visibility: visible;
}

.loading-overlay .overlay-box {
  position: absolute;
    left: 0;
    top: 50%;
    /* bottom: 0; */  
    right: 0;
    margin: auto;
    text-align: center;
}

.loading-overlay .overlay-text {
  color: #fff;
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 7px;
}

.loading-overlay {
    transition: visibility 0s ease-in-out 0.5s, opacity 0.5s ease-in-out;
    bottom: 0;
    left: 0;
    position: absolute;
    opacity: 0;
    right: 0;
    top: 0;
    visibility: hidden;
    background: #555555bd;
}

body > .loading-overlay {
    position: fixed;
    z-index: 999999;
}

.overlay-box .bounce-loader {
  margin: -9px 0px 0px -35px; 
    text-align: center;
    width: 70px;
    height: 20px;
    line-height: 20px;
    left: 0;
    position: relative;
    top: 0;
    z-index: 10000;
    display: inline-block;
}

/* Bounce Loading */
.bounce-loader {
    transition: all 0.2;
    margin: -9px 0 0 -35px;
    text-align: center;
    width: 70px;
    height: 20px;
    line-height: 20px;
    left: 50%;
    position: absolute;
    top: 50%;
    z-index: 10000;
}

.bounce-loader .bounce1,
.bounce-loader .bounce2,
.bounce-loader .bounce3 {
    animation: 1.4s ease-in-out 0s normal both infinite running bouncedelay;
    background-color: #CCC;
    border-radius: 100%;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);
    display: inline-block;
    height: 18px;
    width: 18px;
}

.bounce-loader .bounce1 {
    animation-delay: -0.32s;
}

.bounce-loader .bounce2 {
    animation-delay: -0.16s;
}

@keyframes bouncedelay {
    0%, 80%, 100% {
        transform: scale(0);
    }

    40% {
        transform: scale(1);
    }
}

.topfixed{position: absolute;left: 330px;top: 15px;font-size: 16px;font-style: italic;}
input.commitment-radio-button {position: absolute;left: -9999px;}
.yes-card {min-height: 210px;padding: 2px;text-align: center;border: solid #ccc 1px;width: 100%;border-radius: 5px;}
.commitment-radio-button ~ label {display: block;margin-top:0;margin-bottom:15px;}
.commitment-radio-button ~ label:before{display:none;}
input.commitment-radio-button[type="radio"]:checked+label .yes-card {border-color: #f7b327;background: #f7b327;}
input.commitment-radio-button[type="radio"]:checked+label .yes-card .card-body {background: linear-gradient(#f7b327,#e89c17);color: #fff;box-shadow: none;}
input.commitment-radio-button[type="radio"]:checked+label .yes-card .card-footer {background: #f7b327;color: #fff;}
input.commitment-radio-button[type="radio"]:checked+label .SelectedCommit {    
    opacity: 1;
    transition: 500ms all;
}
.yes-card h3{margin-top: 20px;margin-bottom: 20px;font-size:20px}
.yes-card .card-body {
    padding:5px;
}
.yes-card .card-header1 {    background: #ccd60d;
                             border-bottom: 1px solid #ccd60d;
                             color: #fff;
                             padding: 0;
                             min-height: 58px;border-radius: 5px 5px 0 0;}

.yes-card .card-header {    background: #00b3db;
                            border-bottom: 1px solid #00b3db;
                            color: #fff;
                            padding: 0;
                            min-height: 58px;border-radius: 5px 5px 0 0;}

.img-sm {
    height: 36px;
    width: 36px;
    object-fit: cover;
}
.img-yes-commit {
    max-height: 126px;
    object-fit: cover;
}
.SelectedCommit {
    background-color: #f8cc2b;
    position: absolute;
    z-index: 0;
    opacity: 0;
    transition: 500ms all;
    font-size: 20px;
    right: -3px;
    border-radius: 5px;
    top: -3px;
}
.SelectedCommit i {
    padding: 20%;
}

.whiteBox.non-bbbee{margin:30px 0;}
.year-two-notice{padding:20px;}

table.dataTable {
    clear: both;
    margin-top: 6px !important;
    margin-bottom: 6px !important;
    max-width: none !important;
    border-collapse: separate !important;
    width: 100% !important;
}
table.dataTable td,
table.dataTable th {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}
table.dataTable td.dataTables_empty,
table.dataTable th.dataTables_empty {
    text-align: center;
}
table.dataTable.nowrap th,
table.dataTable.nowrap td {
    white-space: nowrap;
}

div.dataTables_wrapper div.dataTables_length label {
    font-weight: normal;
    text-align: left;
    white-space: nowrap;
}
div.dataTables_wrapper div.dataTables_filter,
div.dataTables_wrapper div.dataTables_length{padding:0 10px;}
div.dataTables_wrapper div.dataTables_filter label:before,
div.dataTables_wrapper div.dataTables_length label:before{display:none}
div.dataTables_wrapper div.dataTables_length select {
    width: 75px;
	display: inline-block;
	border: 1px solid #CCC;
	padding: 5px 10px;
	height: 30px;
	background-position-x: calc(100% - 10px);
	background-position-y: 10px;
}
div.dataTables_wrapper .dataTables_paginate .paginate_button{padding: 0 0.2em 0.5em 0.2em;}
div.dataTables_wrapper .dataTables_paginate .paginate_button:hover{border: 1px solid transparent;background: transparent;}
div.dataTables_wrapper div.dataTables_filter input{border:1px solid #CCC;padding:5px;height: 30px;}

div.dataTables_wrapper div.dataTables_filter {
    text-align: right;
}
div.dataTables_wrapper div.dataTables_filter label {
    font-weight: normal;
    white-space: nowrap;
    text-align: left;
}
div.dataTables_wrapper div.dataTables_filter input {
    margin-left: 0.5em;
    display: inline-block;
    width: auto;
}
div.dataTables_wrapper div.dataTables_info {
    padding-top: 0.85em;
    white-space: nowrap;
    padding-left: 15px;
    padding-bottom: 15px;
}
div.dataTables_wrapper div.dataTables_paginate {
    margin: 0;
    white-space: nowrap;
    text-align: right;
    padding-right: 15px;
}
div.dataTables_wrapper div.dataTables_paginate ul.pagination {
    margin: 2px 0;
    white-space: nowrap;
    justify-content: flex-end;
}

div.dataTables_wrapper .page-link{font-size: 14px;}
div.dataTables_wrapper .page-item .page-link:hover,
div.dataTables_wrapper .page-item.active .page-link{background-color:#f7a823;border-color:#f7a823;color:#FFF !important}
div.dataTables_wrapper .page-link:focus{box-shadow:none}
div.dataTables_wrapper .dataTables_paginate .paginate_button:active{background: none;box-shadow: none;}
div.dataTables_wrapper div.dataTables_processing {
    top: 0;
	border-radius: 0;
	height: 100%;
	color: #F1F1F1;
	font-size: 22px;
	background:rgba(0,0,0,0.5);
	margin-top:0
}

table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting,
table.dataTable thead > tr > td.sorting_asc,
table.dataTable thead > tr > td.sorting_desc,
table.dataTable thead > tr > td.sorting {
    padding-right: 30px;
}
table.dataTable thead > tr > th:active,
table.dataTable thead > tr > td:active {
    outline: none;
}
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    cursor: pointer;
    position: relative;
}
table.dataTable thead .sorting:before, table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:before,
table.dataTable thead .sorting_desc_disabled:after {
    position: absolute;
    bottom: 0.9em;
    display: block;
    opacity: 0.3;
}
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:after {
    opacity: 1;
}
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc_disabled:after {
    opacity: 0;
}

div.dataTables_scrollHead table.dataTable {
    margin-bottom: 0 !important;
}

div.dataTables_scrollBody table {
    border-top: none;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
div.dataTables_scrollBody table thead .sorting:after,
div.dataTables_scrollBody table thead .sorting_asc:after,
div.dataTables_scrollBody table thead .sorting_desc:after {
    display: none;
}
div.dataTables_scrollBody table tbody tr:first-child th,
div.dataTables_scrollBody table tbody tr:first-child td {
    border-top: none;
}

div.dataTables_scrollFoot > .dataTables_scrollFootInner {
    box-sizing: content-box;
}
div.dataTables_scrollFoot > .dataTables_scrollFootInner > table {
    margin-top: 0 !important;
    border-top: none;
}

@media screen and (max-width: 767px) {
    div.dataTables_wrapper div.dataTables_length,
    div.dataTables_wrapper div.dataTables_filter,
    div.dataTables_wrapper div.dataTables_info,
    div.dataTables_wrapper div.dataTables_paginate {
        text-align: center;
    }
}
table.dataTable.table-sm > thead > tr > th {
    padding-right: 20px;
}
table.dataTable.table-sm .sorting:before,
table.dataTable.table-sm .sorting_asc:before,
table.dataTable.table-sm .sorting_desc:before {
    top: 5px;
    right: 0.85em;
}
table.dataTable.table-sm .sorting:after,
table.dataTable.table-sm .sorting_asc:after,
table.dataTable.table-sm .sorting_desc:after {
    top: 5px;
}

table.table-bordered.dataTable th,
table.table-bordered.dataTable td {
    border-left-width: 0;
}
table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable th:last-child,
table.table-bordered.dataTable td:last-child,
table.table-bordered.dataTable td:last-child {
    border-right-width: 0;
}
table.table-bordered.dataTable tbody th,
table.table-bordered.dataTable tbody td {
    border-bottom-width: 0;
}

div.dataTables_scrollHead table.table-bordered {
    border-bottom-width: 0;
}

div.table-responsive > div.dataTables_wrapper > div.row {
    margin: 0;
}
div.table-responsive > div.dataTables_wrapper > div.row > div[class^="col-"]:first-child {
    padding-left: 0;
}
div.table-responsive > div.dataTables_wrapper > div.row > div[class^="col-"]:last-child {
    padding-right: 0;
}


table.dataTable th{vertical-align: middle;text-transform:uppercase}
table .dot{
    margin: 0 5px;
}
table.dataTable tbody th, table.dataTable tbody td {
    padding: 19px 15px;
}
table.dataTable tbody th, table.dataTable tbody td .substituted{
    margin-top: -5px;
}

.signup_process{color:#000}
.signup_process .corporate,
.signup_process .hostcompany{display:none;}
.signupprocess{padding-left: 30px;}
.signup_process label{position: relative;}
.signup_process label input[type=radio] {position: absolute;left: -30px;top: 2px;margin: 0;}
.signup_process p{color: #000;font-size: 14px;font-weight: 400;}
.signup_process ul{list-style: initial}
.signup_process ul li{color: #000;font-size: 14px;font-weight: 400;margin: 0 0 9px;}
/*Tab*/
ul.tabs{
    background: #f7a823;
    margin: 0px;
    padding: 0px;
    list-style: none;
}
ul.tabs li {
/*    background: #637381;*/
    color: #fff;
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
}
ul.tabs li a{
    color: #fff !important;;
}
ul.tabs li.current{
    background: rgb(248, 246, 241);
    /*background: #637381;*/
    color: #000;
}
ul.tabs li.current a{
    color: #000 !important;;
}
.tab-content{
    /*display: none;
    background: rgba(247, 168, 35, 0.05);
    padding: 15px;*/
}

.tab-content.current{
    display: inherit;
}

.footer-content{display: inline-block;text-align: right;width: 100%;margin-bottom: 20px;padding-right: 20px;}
.footer-content ul{display: inline;width: 100%;text-align: right;}
.footer-content ul li{display: inline;padding: 5px 10px;position:relative}
.footer-content ul li:after{position:absolute;content:"|";width:14px;}
.footer-content ul li:last-child:after{display:none}
.footer-content li a{color:#000 !important;
-webkit-transition: all 0.1s ease-in;
-moz-transition: all .1s ease-in;
-o-transition: all .1s ease-in;
transition: all .1s ease-in;}
.footer-content li a:hover{color:#f7a823 !important;text-decoration:none;}
.dashboard_menu select#year{padding:12px 13px 12px 20px}
.dashboard_menu .menu .item svg {width: 20px;height: 20px;}
.dashboard_menu .menu .item:hover {background-color: rgba(247, 168, 35, 0.1);}
.dashboard_menu .menu .item:hover .left_bar {background-color: #f7a823;}
.dashboard_menu .menu .item:hover svg path {fill: #f7a823;}
#ui-datepicker-div{display:none;}


/*************** toggle button */
.switch-field{display:inline-block;width:100%;}
.switch-field input {
    position: absolute !important;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    border: 0;
    overflow: hidden;
}

.switch-field label {
    float: left;
}
.switch-field p.requiredP {font-family: Roboto;
    font-size: 12px;
    color: #9ca8ae;
    margin-top: 15px;
    display: block;
    font-weight: normal;}
.switch-field p.requiredP:before{content: "";
    width: 6px;
    height: 6px;
    background: #f7a823;
    display: inline-block;
    border-radius: 10px;
    margin-right: 9px;
    vertical-align: middle;}

.switch-field label {
    display: inline-block;
    width: 60px;
    background-color: #e4e4e4;
    color: rgba(0, 0, 0, 0.6);
    font-size: 14px;
    font-weight: normal;
    text-align: center;
    text-shadow: none;
    padding: 6px 14px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition:    all 0.1s ease-in-out;
    -ms-transition:     all 0.1s ease-in-out;
    -o-transition:      all 0.1s ease-in-out;
    transition:         all 0.1s ease-in-out;
	margin: 0;
}
.switch-field label:before{display:none}

.switch-field label:hover {
    cursor: pointer;
}

.switch-field input:checked + label {
    background-color: #f79923;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.switch-field label:first-of-type {
    border-radius: 4px 0 0 4px;
}

.switch-field label:last-of-type {
    border-radius: 0 4px 4px 0;
}

.multinationalOrigin{display:none;}

#hear_about_modal .levelcheckbox:before{display:none;}
#hear_about_modal label.levelcheckbox {width: 28.5%;vertical-align: top;}
#hear_about_modal label.levelcheckbox.bbbeebox{width: 50%;}
#hear_about_modal label.levelcheckbox.other{padding-left: 0;width: 55%;margin: 11px;}
#hear_about_modal label.levelcheckbox.other #otherText{    display: block;width: 100%;}
#hear_about_modal label.levelcheckbox.other #otherText textarea{width: 100%;height:28px;}

label.levelcheckbox #other_text{height: 28px;width: 100%;}
.addSpace{padding: 30px;}
.create_company_title_text { color: rgb(247, 168, 35);font-weight: bold; margin-bottom: 0px; margin-top: 0; }
.pageContent .accordion .card{border-bottom : 1px solid rgba(0, 0, 0, 0.125);margin-bottom: 30px;border-radius: 20px;}
.pageContent .accordion .card .card-body .row .cols-outer{}
.pageContent .accordion .card .card-body .row .cols{border-bottom : 1px solid rgba(0, 0, 0, 0.125);padding-bottom: 0.5rem;padding-top: 0.5rem;
    display: inline-block;
    width: 100%;}
.pageContent .accordion .card .card-body .row .cols .pull-left{line-height:3.5em}
.pageContent .accordion .card .card-body .row .last .cols{border-bottom:none;padding-bottom: 0;}
#ceo_pledge .pledge_completed .upload_pledge {
    border-radius: 3px;
    background-color: #f7a823;
    margin-top: 18px;
    text-align: center;
    padding: 10px;
    margin: 5px;
    color: #FFF;
    font-weight: 500;
    font-size: 12px;
    cursor: pointer;
}
#ceo_pledge .pledge_completed .upload_pledge:hover{background-color: #ae6f06;}


#ceo_certificate {
    padding: 15px 13px 13px 20px;
	height: auto;
}

#ceo_certificate p {
    font-family: Roboto;
    font-size: 15px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #000000;
    margin: 0;
    width: calc(100% - 35px);
    overflow: hidden;
    text-overflow: ellipsis;
}

#ceo_certificate span.error{color:red}
.dropzone.dz-started .dz-message.dz-error{display:block}
.card-header h2 button.btn-link {
    width: 100%;
    text-align: left;
	position:relative;
	text-align: left;
	font-size:18px;
	letter-spacing: 0;
	color: #18212B;
	opacity: 1;
	text-decoration:none;
	padding-left:45px;
}
.card-header h2 button.btn-link:before{
	position:absolute;
	content:"";
	left:0;
	top:0px;
	width:40px;
	height:40px;
	background:url('../img/certificate-icon.svg') transparent no-repeat top center
}
.accordion .card-body{padding-left: 65px;}

.Addbtn_back{
    margin: 20px 0;
    display: inline-block;
    text-align: left;
    width: 100%;
}

#download_pledge_modal label { font-family: Roboto; font-size: 12px; color: #9ca8ae; margin-top: 15px; display: block; font-weight: normal; }
#download_pledge_modal label:before { content: ""; width: 6px; height: 6px; background: #f7a823; display: inline-block; border-radius: 10px; margin-right: 9px; vertical-align: middle; }
label#ceo_first_name-error:before,label#ceo_email-error:before{display:none;}
#download_pledge_modal label.error{color:red;margin-top:0}
#download_pledge_modal input.error{border:1px solid red}
#radioData .levelcheckbox:before {display: none;}
.dashboard_menu .menu a#reports.item svg {
    width: 34px;
    height: 19px;
}
.dashboard_menu .menu a#reports.item svg g{
    fill: rgb(154, 168, 175);
}

.yothSupervisorsize{font-size: 18px;}
.spaceSupervisor{height: 20px;}

.removecolor:before {background: none !important;}

.process_chart_boost {
  /*background-color: #2a3549;
  padding: 5px;
  height: 100px;
  width: 100%;*/
  float:right
}

.process_chart_boost p {
  font-family: Roboto;
  font-size: 12px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.2px;
  text-align: center;
  color: #000;
  width: 90px;
  margin: auto;
  margin-top: 8px;
}

.process_chart_boost .chart_text {
	position: absolute;
    font-family: Roboto;
    font-size: 1.2em;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.3px;
    text-align: center;
    color: #000;
    top: 50%;
    left: 0;
    right: 0;
    margin: auto;
    transform: translateY(-50%);
}

.process_chart_boost canvas {
  margin: auto;
  margin-top: 2px;
}

.process_chart_boost #youth_purchased {
  /*width: 50%;
  float: left;
  margin: 0;*/
  position: relative;
}

#chat-widget-container{left:0 !important}
.implementation_list #package_container.content { padding:0px; }
.implementation_list #package_container.content .rowcustom.whiteBox{ padding: 25px 30px; }
#package_container{
    float: left;
    width: 100%;
}
#package_container .row{margin:10px 0;}
#package_container .boxcontainer.whiteBox {margin-bottom:0 !important}
#package_container .rowcustom{
    float: left;
    width: 100%;margin-bottom: 30px;
}
.boxcontainer {
    /*margin: 0 -10px;*/float:left;width:100%;padding: 15px;
}
.boxcontainer .form-group{margin-bottom:0}
#accordion h3 {
    background: #00b3db;
    padding: 15px 25px;
    font-size: 20px;
    margin: 0;
	cursor:pointer;
	outline: none;
	position:relative
}
#accordion h3:after{
    border: solid #FFF;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;
    content: "";
    right: 25px;
    width: 20px;
    position: absolute;
    height: 20px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-webkit-transition: all .3s ease-in-out; 
	-moz-transition: all .3s ease-in-out;  
	-o-transition: all .3s ease-in-out;  
	transition: all .3s ease-in-out;
	top:18px;
}
#accordion h3.ui-state-active:after{
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	top:14px;
}

#accordion h3 a {
    color: #FFF !important;
    text-decoration: none !important;
}
#package_container .accountname{font-size:18px;}
#package_container .boxmain{    float: left;
    width: 33.33%;
    padding: 10px;
}
#package_container .boxinner {float: left;
    float: left;
    width: 100%;
    border: 1px solid #ddd;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.09);min-height: 255px;}
#package_container .description {
    margin-bottom: 20px;
}
.package-container label.industry{cursor:pointer;width: 100%;}
div#livechat-eye-catcher {
    display: none;
}

.greenCount{
	color: #008000;
}

.redCount{
	color: #ff0000;
}

.select2.select2-container.select2-container--default{background: #FFF;}
#youthlist_wrapper table.dataTable tbody th,#youthlist_wrapper table.dataTable tbody td{padding: 10px 10px;}
.sunervisor_name {padding-top: 20px;display: inline-block;}
#ReplaceSupervisorSelection .levelcheckbox {width: 100%;cursor: pointer;}

.supervisor_notes ul li {list-style-type: disc;}

label.nolabel:before { display: none; }

.orders_table table thead tr td{text-transform:uppercase}

  .alert-danger ul{
      margin-bottom: 0px !important;
  }
#placement_stats .placement_orders .orders_table table.dataTable td{padding:19px 15px}
.verification-date .ui-datepicker-calendar{display:none}
.verification-date .ui-datepicker-buttonpane .ui-datepicker-current{display:none;}


.cvs-download.dropdown-menu.show{padding:0}
.cvs-download.dropdown-menu.show li a {display: inline-block;width: 100%;padding: 5px 20px;border-bottom: 1px solid #CCC;}

.home-banner{margin-bottom:30px;float: left;width: 100%;background: rgba(0 ,0,0, 0.1);}
.new_work_exp_wrap{display:inline-block;text-align:right;margin-bottom:20px;width:100%}
#placement_stats .new_work_exp {
    position: relative;
	top:auto;
	right:auto
}
#errorModal .modal-content .modal-body .text p{text-align: left;color: red;font-size:16px;margin:0 20px 10px}
#errorModal .modal-content .modal-body .text ul{text-align: left;color: red;margin:0 20px 10px}
#errorModal .modal-content .modal-body .text {text-align: left;color: red;font-size: 16px;}
#errorModal .modal-content .modal-body .text p {margin-bottom: 2px;}
#errorModal .modal-content .modal-body .text h2 {text-align: center;}
#errorModal .modal-content .modal-body .text hr:first-child {display: none;}
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}
label.switch::before {
    display: none;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.15);
  -webkit-transition: .4s;
  transition: .4s;
  line-height: 1.7;
padding: 5px;
	border-radius: 5px;
	width:65px;
	color:#FFF
}

.slider:before {
  position: absolute;
  content: "";
  height: 30px;
  width: 30px;
  left: 3px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 5px;
}
input:checked + .slider:before{left: 6px;}

input:checked + .slider {
  background-color: rgb(247, 168, 35);
}

input:focus + .slider {
  box-shadow: 0 0 1px rgb(247, 168, 35);
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
#marketing_optin_modal .slider, .switch.profile .slider {
    padding: 7px 9px;
}

.marketing-note .levelcheckbox{margin-bottom:5px;}
.newagency,.bbeee_agent_details{display:none;}

#bbeee_certi.form-control-file{padding:10px;border-radius: 2px;border: 1px solid #e3e7eb;height:45px;}
a.btn.btn-secondary.reupload-bbbee{background-color: #6c757d;border:none;}

.salary_div {
    display: inline-block;
    width: 100%;
    border: 1px solid #e3e7eb;
}
.salary_div .cur {
    float: left;
    width: 16%;
    border-right: 1px solid #e3e7eb;
    padding: 11px;
    text-align: right;
    margin: 0 !important;
    vertical-align: top;
    min-height: 46px;
}
.salary_div input {
    float: left;
    width: 84%;
    text-align: left;
    border: 0;
    padding-left: 10px;
}
.card.pledge_upload_card{border-radius: 10px;background: orange;}
.card.pledge_upload_card .card-body{padding:10px;}
.card.pledge_upload_card .card-body a.btn{padding: 5px 25px;height: auto;border-radius: 7px;background: #FFF;color: #000 !important;}
#upload_pledge_modal .form-control-file{padding: 10px;border-radius: 2px;border: 1px solid #e3e7eb;height: 45px;}
#upload_pledge_modal label.error:before{display:none}
#upload_pledge_modal input.error{
    border-color: red !important;
}
#accordionExample.accordion .card-body{padding:1.25rem}
.youthTable .dataTables_wrapper .dataTables_paginate a.paginate_button,
.youthTable .dataTables_wrapper .dataTables_paginate .ellipsis {
    padding: 0.35rem 0.75rem;
    border: 1px solid #dee2e6;
    color: #f7a823 !important;
    margin: 0 0.3rem;
}
.youthTable .dataTables_wrapper .dataTables_paginate a.paginate_button.previous {margin-left: 0;
border-top-left-radius: 0.25rem;
border-bottom-left-radius: 0.25rem;}
.youthTable .dataTables_wrapper .dataTables_paginate a.paginate_button.next {
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}
.youthTable .dataTables_wrapper .dataTables_paginate a.paginate_button:hover,
.youthTable .dataTables_wrapper .dataTables_paginate a.paginate_button.current{
	background:#f7a823;
	border-color:#f7a823;
	color:#FFF !important
}

.youthTable .dataTables_wrapper  select {
    background-image: url('../img/caret.svg');
    background-repeat: no-repeat;
    border-radius: 2px;
    appearance: none;
    line-height: 1.2;
	font-size: 15px;
}
.youthTable .dataTables_wrapper select option {
    white-space: normal;
  }

.dashboard_menu .menu.navmenu ul{padding:0;margin:0}
.dashboard_menu .menu.navmenu ul li{list-style:none;padding-left: 20px;float: left;width: 100%;}
.dashboard_menu .menu.navmenu ul li.item{min-height:inherit}
.dashboard_menu .menu.navmenu ul li.item > a {padding: 0;width: 100%;float: left;line-height: 2;}
.dashboard_menu .menu.navmenu ul li.item .text{margin-top: 5px;margin-left: 5px;margin-bottom: 5px;}
.dashboard_menu .menu.navmenu ul li.item svg{margin-top:0}
.dashboard_menu .menu.navmenu ul ul {padding: 0;margin-left: -40px !important;display:none}
.dashboard_menu .menu.navmenu ul ul.sub-active{display:block !important}
.dashboard_menu .menu.navmenu ul li.item li.item{min-height:inherit;padding-left: 90px;}
.dashboard_menu .menu.navmenu ul li.item li.item a{float: left;width: 76%;}
.dashboard_menu .menu.navmenu ul li.item li.item a .text{margin:0;text-transform: none;}
.dashboard_menu .menu.navmenu .new-prog{
  background-color: #f7a823;
}
.dashboard_menu .menu.navmenu .new-prog a .text{color:#000}
.pageContent .nav-tabs-custom ul li
{
    display: block;
    width: 100%;
}
.pageContent .nav-tabs-custom .nav-tabs {
    border-bottom: none;
}

.pageContent .nav-tabs-custom .nav-tabs li{
	border-bottom: 1px solid #f7a823;
}
.pageContent .nav-tabs-custom .nav-tabs li a{padding: 10px;float:left;width:100%;}
.pageContent .nav-tabs-custom .nav-tabs li.active a{background:#FFF;}
.pageContent .nav-tabs-custom .nav-tabs li a:hover{background:#FFF;text-decoration:none;}
.pageContent .tab-content label.nobefore::before{display:none}

.btn.custombutton{height:auto;padding:10px;}
.progressstep .step-p{display: block;width: 100%;text-align: center;font-size: 14px;font-style: italic;color: #f7a823;letter-spacing: 1px;line-height: 1.2;margin-top: 20px;}
.browser_notification{background: #FCEBA3;box-shadow: 0px 5px 5px grey;padding:10px 40px 10px 100px;font-weight: 300;font-size: 17px;color: black; line-height:2;display:none;z-index:9999;position:relative}
.fixed .browser_notification{position:fixed;width:100%;}
.browser_notification a.btn{padding: 15px 25px;height: auto;background: #FFF;color: #000 !important;text-transform: none;font-size: 18px;font-weight: normal;font-family: Raleway;border-radius:5px;margin-right:15px;margin-left:15px;}
.browser_notification  a.ignore{color: red !important}
.browser_notification .icon{width:50px;margin-right:15px;}
.browser_notification span.text{display: inline-block;padding-top: 10px;}
.mr0{margin-right:0 !important}
.registerpage {
background: url('../img/bg.png') no-repeat calc(100% + 600px) 0;
height: 100vh;
background-size:cover;
background-color: #fff;}


.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
  float: left;
}

.col-xs-1 {
  width: 8.3333333333%;
}

.col-xs-2 {
  width: 16.6666666667%;
}

.col-xs-3 {
  width: 25%;
}

.col-xs-4 {
  width: 33.3333333333%;
}

.col-xs-5 {
  width: 41.6666666667%;
}

.col-xs-6 {
  width: 50%;
}

.col-xs-7 {
  width: 58.3333333333%;
}

.col-xs-8 {
  width: 66.6666666667%;
}

.col-xs-9 {
  width: 75%;
}

.col-xs-10 {
  width: 83.3333333333%;
}

.col-xs-11 {
  width: 91.6666666667%;
}

.col-xs-12 {
  width: 100%;
}

.col-xs-pull-0 {
  right: auto;
}

.col-xs-pull-1 {
  right: 8.3333333333%;
}

.col-xs-pull-2 {
  right: 16.6666666667%;
}

.col-xs-pull-3 {
  right: 25%;
}

.col-xs-pull-4 {
  right: 33.3333333333%;
}

.col-xs-pull-5 {
  right: 41.6666666667%;
}

.col-xs-pull-6 {
  right: 50%;
}

.col-xs-pull-7 {
  right: 58.3333333333%;
}

.col-xs-pull-8 {
  right: 66.6666666667%;
}

.col-xs-pull-9 {
  right: 75%;
}

.col-xs-pull-10 {
  right: 83.3333333333%;
}

.col-xs-pull-11 {
  right: 91.6666666667%;
}

.col-xs-pull-12 {
  right: 100%;
}

.col-xs-push-0 {
  left: auto;
}

.col-xs-push-1 {
  left: 8.3333333333%;
}

.col-xs-push-2 {
  left: 16.6666666667%;
}

.col-xs-push-3 {
  left: 25%;
}

.col-xs-push-4 {
  left: 33.3333333333%;
}

.col-xs-push-5 {
  left: 41.6666666667%;
}

.col-xs-push-6 {
  left: 50%;
}

.col-xs-push-7 {
  left: 58.3333333333%;
}

.col-xs-push-8 {
  left: 66.6666666667%;
}

.col-xs-push-9 {
  left: 75%;
}

.col-xs-push-10 {
  left: 83.3333333333%;
}

.col-xs-push-11 {
  left: 91.6666666667%;
}

.col-xs-push-12 {
  left: 100%;
}

.col-xs-offset-0 {
  margin-left: 0%;
}

.col-xs-offset-1 {
  margin-left: 8.3333333333%;
}

.col-xs-offset-2 {
  margin-left: 16.6666666667%;
}

.col-xs-offset-3 {
  margin-left: 25%;
}

.col-xs-offset-4 {
  margin-left: 33.3333333333%;
}

.col-xs-offset-5 {
  margin-left: 41.6666666667%;
}

.col-xs-offset-6 {
  margin-left: 50%;
}

.col-xs-offset-7 {
  margin-left: 58.3333333333%;
}

.col-xs-offset-8 {
  margin-left: 66.6666666667%;
}

.col-xs-offset-9 {
  margin-left: 75%;
}

.col-xs-offset-10 {
  margin-left: 83.3333333333%;
}

.col-xs-offset-11 {
  margin-left: 91.6666666667%;
}

.col-xs-offset-12 {
  margin-left: 100%;
}

@media (min-width: 768px) {
  .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
    float: left;
  }
  .col-sm-1 {
    width: 8.3333333333%;
  }
  .col-sm-2 {
    width: 16.6666666667%;
  }
  .col-sm-3 {
    width: 25%;
  }
  .col-sm-4 {
    width: 33.3333333333%;
  }
  .col-sm-5 {
    width: 41.6666666667%;
  }
  .col-sm-6 {
    width: 50%;
  }
  .col-sm-7 {
    width: 58.3333333333%;
  }
  .col-sm-8 {
    width: 66.6666666667%;
  }
  .col-sm-9 {
    width: 75%;
  }
  .col-sm-10 {
    width: 83.3333333333%;
  }
  .col-sm-11 {
    width: 91.6666666667%;
  }
  .col-sm-12 {
    width: 100%;
  }
  .col-sm-pull-0 {
    right: auto;
  }
  .col-sm-pull-1 {
    right: 8.3333333333%;
  }
  .col-sm-pull-2 {
    right: 16.6666666667%;
  }
  .col-sm-pull-3 {
    right: 25%;
  }
  .col-sm-pull-4 {
    right: 33.3333333333%;
  }
  .col-sm-pull-5 {
    right: 41.6666666667%;
  }
  .col-sm-pull-6 {
    right: 50%;
  }
  .col-sm-pull-7 {
    right: 58.3333333333%;
  }
  .col-sm-pull-8 {
    right: 66.6666666667%;
  }
  .col-sm-pull-9 {
    right: 75%;
  }
  .col-sm-pull-10 {
    right: 83.3333333333%;
  }
  .col-sm-pull-11 {
    right: 91.6666666667%;
  }
  .col-sm-pull-12 {
    right: 100%;
  }
  .col-sm-push-0 {
    left: auto;
  }
  .col-sm-push-1 {
    left: 8.3333333333%;
  }
  .col-sm-push-2 {
    left: 16.6666666667%;
  }
  .col-sm-push-3 {
    left: 25%;
  }
  .col-sm-push-4 {
    left: 33.3333333333%;
  }
  .col-sm-push-5 {
    left: 41.6666666667%;
  }
  .col-sm-push-6 {
    left: 50%;
  }
  .col-sm-push-7 {
    left: 58.3333333333%;
  }
  .col-sm-push-8 {
    left: 66.6666666667%;
  }
  .col-sm-push-9 {
    left: 75%;
  }
  .col-sm-push-10 {
    left: 83.3333333333%;
  }
  .col-sm-push-11 {
    left: 91.6666666667%;
  }
  .col-sm-push-12 {
    left: 100%;
  }
  .col-sm-offset-0 {
    margin-left: 0%;
  }
  .col-sm-offset-1 {
    margin-left: 8.3333333333%;
  }
  .col-sm-offset-2 {
    margin-left: 16.6666666667%;
  }
  .col-sm-offset-3 {
    margin-left: 25%;
  }
  .col-sm-offset-4 {
    margin-left: 33.3333333333%;
  }
  .col-sm-offset-5 {
    margin-left: 41.6666666667%;
  }
  .col-sm-offset-6 {
    margin-left: 50%;
  }
  .col-sm-offset-7 {
    margin-left: 58.3333333333%;
  }
  .col-sm-offset-8 {
    margin-left: 66.6666666667%;
  }
  .col-sm-offset-9 {
    margin-left: 75%;
  }
  .col-sm-offset-10 {
    margin-left: 83.3333333333%;
  }
  .col-sm-offset-11 {
    margin-left: 91.6666666667%;
  }
  .col-sm-offset-12 {
    margin-left: 100%;
  }
}

@media (min-width: 992px) {
  .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
    float: left;
  }
  .col-md-1 {
    width: 8.3333333333%;
  }
  .col-md-2 {
    width: 16.6666666667%;
  }
  .col-md-3 {
    width: 25%;
  }
  .col-md-4 {
    width: 33.3333333333%;
  }
  .col-md-5 {
    width: 41.6666666667%;
  }
  .col-md-6 {
    width: 50%;
  }
  .col-md-7 {
    width: 58.3333333333%;
  }
  .col-md-8 {
    width: 66.6666666667%;
  }
  .col-md-9 {
    width: 75%;
  }
  .col-md-10 {
    width: 83.3333333333%;
  }
  .col-md-11 {
    width: 91.6666666667%;
  }
  .col-md-12 {
    width: 100%;
  }
  .col-md-pull-0 {
    right: auto;
  }
  .col-md-pull-1 {
    right: 8.3333333333%;
  }
  .col-md-pull-2 {
    right: 16.6666666667%;
  }
  .col-md-pull-3 {
    right: 25%;
  }
  .col-md-pull-4 {
    right: 33.3333333333%;
  }
  .col-md-pull-5 {
    right: 41.6666666667%;
  }
  .col-md-pull-6 {
    right: 50%;
  }
  .col-md-pull-7 {
    right: 58.3333333333%;
  }
  .col-md-pull-8 {
    right: 66.6666666667%;
  }
  .col-md-pull-9 {
    right: 75%;
  }
  .col-md-pull-10 {
    right: 83.3333333333%;
  }
  .col-md-pull-11 {
    right: 91.6666666667%;
  }
  .col-md-pull-12 {
    right: 100%;
  }
  .col-md-push-0 {
    left: auto;
  }
  .col-md-push-1 {
    left: 8.3333333333%;
  }
  .col-md-push-2 {
    left: 16.6666666667%;
  }
  .col-md-push-3 {
    left: 25%;
  }
  .col-md-push-4 {
    left: 33.3333333333%;
  }
  .col-md-push-5 {
    left: 41.6666666667%;
  }
  .col-md-push-6 {
    left: 50%;
  }
  .col-md-push-7 {
    left: 58.3333333333%;
  }
  .col-md-push-8 {
    left: 66.6666666667%;
  }
  .col-md-push-9 {
    left: 75%;
  }
  .col-md-push-10 {
    left: 83.3333333333%;
  }
  .col-md-push-11 {
    left: 91.6666666667%;
  }
  .col-md-push-12 {
    left: 100%;
  }
  .col-md-offset-0 {
    margin-left: 0%;
  }
  .col-md-offset-1 {
    margin-left: 8.3333333333%;
  }
  .col-md-offset-2 {
    margin-left: 16.6666666667%;
  }
  .col-md-offset-3 {
    margin-left: 25%;
  }
  .col-md-offset-4 {
    margin-left: 33.3333333333%;
  }
  .col-md-offset-5 {
    margin-left: 41.6666666667%;
  }
  .col-md-offset-6 {
    margin-left: 50%;
  }
  .col-md-offset-7 {
    margin-left: 58.3333333333%;
  }
  .col-md-offset-8 {
    margin-left: 66.6666666667%;
  }
  .col-md-offset-9 {
    margin-left: 75%;
  }
  .col-md-offset-10 {
    margin-left: 83.3333333333%;
  }
  .col-md-offset-11 {
    margin-left: 91.6666666667%;
  }
  .col-md-offset-12 {
    margin-left: 100%;
  }
}

@media (min-width: 1200px) {
  .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
    float: left;
  }
  .col-lg-1 {
    width: 8.3333333333%;
  }
  .col-lg-2 {
    width: 16.6666666667%;
  }
  .col-lg-3 {
    width: 25%;
  }
  .col-lg-4 {
    width: 33.3333333333%;
  }
  .col-lg-5 {
    width: 41.6666666667%;
  }
  .col-lg-6 {
    width: 50%;
  }
  .col-lg-7 {
    width: 58.3333333333%;
  }
  .col-lg-8 {
    width: 66.6666666667%;
  }
  .col-lg-9 {
    width: 75%;
  }
  .col-lg-10 {
    width: 83.3333333333%;
  }
  .col-lg-11 {
    width: 91.6666666667%;
  }
  .col-lg-12 {
    width: 100%;
  }
  .col-lg-pull-0 {
    right: auto;
  }
  .col-lg-pull-1 {
    right: 8.3333333333%;
  }
  .col-lg-pull-2 {
    right: 16.6666666667%;
  }
  .col-lg-pull-3 {
    right: 25%;
  }
  .col-lg-pull-4 {
    right: 33.3333333333%;
  }
  .col-lg-pull-5 {
    right: 41.6666666667%;
  }
  .col-lg-pull-6 {
    right: 50%;
  }
  .col-lg-pull-7 {
    right: 58.3333333333%;
  }
  .col-lg-pull-8 {
    right: 66.6666666667%;
  }
  .col-lg-pull-9 {
    right: 75%;
  }
  .col-lg-pull-10 {
    right: 83.3333333333%;
  }
  .col-lg-pull-11 {
    right: 91.6666666667%;
  }
  .col-lg-pull-12 {
    right: 100%;
  }
  .col-lg-push-0 {
    left: auto;
  }
  .col-lg-push-1 {
    left: 8.3333333333%;
  }
  .col-lg-push-2 {
    left: 16.6666666667%;
  }
  .col-lg-push-3 {
    left: 25%;
  }
  .col-lg-push-4 {
    left: 33.3333333333%;
  }
  .col-lg-push-5 {
    left: 41.6666666667%;
  }
  .col-lg-push-6 {
    left: 50%;
  }
  .col-lg-push-7 {
    left: 58.3333333333%;
  }
  .col-lg-push-8 {
    left: 66.6666666667%;
  }
  .col-lg-push-9 {
    left: 75%;
  }
  .col-lg-push-10 {
    left: 83.3333333333%;
  }
  .col-lg-push-11 {
    left: 91.6666666667%;
  }
  .col-lg-push-12 {
    left: 100%;
  }
  .col-lg-offset-0 {
    margin-left: 0%;
  }
  .col-lg-offset-1 {
    margin-left: 8.3333333333%;
  }
  .col-lg-offset-2 {
    margin-left: 16.6666666667%;
  }
  .col-lg-offset-3 {
    margin-left: 25%;
  }
  .col-lg-offset-4 {
    margin-left: 33.3333333333%;
  }
  .col-lg-offset-5 {
    margin-left: 41.6666666667%;
  }
  .col-lg-offset-6 {
    margin-left: 50%;
  }
  .col-lg-offset-7 {
    margin-left: 58.3333333333%;
  }
  .col-lg-offset-8 {
    margin-left: 66.6666666667%;
  }
  .col-lg-offset-9 {
    margin-left: 75%;
  }
  .col-lg-offset-10 {
    margin-left: 83.3333333333%;
  }
  .col-lg-offset-11 {
    margin-left: 91.6666666667%;
  }
  .col-lg-offset-12 {
    margin-left: 100%;
  }
}
.tooltip2 {
  position: relative;
  display: inline-block;
  cursor:pointer;
}

.tooltip2 .tooltiptext {
  visibility: hidden;
  width: 185px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  line-height:1.3
}
.saparate-tooltip-text{
  position: absolute;
  right: -6px;
  top: 12px;
}
.saparate-tooltip-text .tooltiptext {
  width:500px;
  z-index:10;
  padding:16px;
}
.saparate-tooltip-text .tooltiptext li::before{
  display:none;
}
.saparate-tooltip-text .tooltiptext li{
  padding-left:0 !important;
}
/* #company_details .content p{
  font-weight:bold;
} */
.tooltip2:hover .tooltiptext {
  visibility: visible;
}
.registerpage .fixed .browser_notification,
.loginpage .fixed .browser_notification{position:relative;width:auto;}

.youthTable table.dataTable > tbody > tr.child span.dtr-title:after{content: " :"}
.youthTable table.dataTable > tbody > tr.child span.dtr-title {min-width: 400px;}

.select_commitment .item .select_commitment_title {
    min-height: 57px;
}
.select_commitment .item .select_commitment_title p {
  height: auto;
}

@media (min-width: 768px) and (max-width:1366px) {
	.fixed .browser_notification{padding:10px;}
	.browser_notification .icon{width: 30px;margin-right: 10px;}
	.fixed .browser_notification .col-md-9{padding-right: 0;width: 70%;float: left;}
	.browser_notification .icon {width: 33px;margin-right: 10px;float: left;margin-top: 14px;}
	.browser_notification span.text{font-size: 14px;float: left;width: 90%;}
	.fixed .browser_notification .col-md-3{padding-right: 0;float: left;width: 30%;padding-left: 0;margin-top: 15px;}
	.browser_notification a.btn{padding: 10px;font-size: 13px;margin-right: 0px;}
	
	.loginpage .userheader,
	.registerpage .userheader,
	.mainhome .userheader {padding: 35px 35px 35px 35px;}
	.loginpage .userheader .col-md-6,
	.registerpage .userheader .col-md-6,
	.mainhome .userheader .col-md-6{float: left;width: 50%;}
	.loginpage .userheader .col-md-6.signupbtn,
	.registerpage .userheader .col-md-6.signupbtn,
	.mainhome .userheader .col-md-6.signupbtn{margin-top: 35px;}
  .registerpage {
    height: auto;
    float: left;
    width: 100%;
  }
  .registerleft {height: auto; padding: 0 60px; max-width: 37%; padding-bottom: 80px;}
  .signupbtn a {
    margin-right: 81px;
  }
	
	/* .registerpage{background-position:-30px 0px} */
}

.date_picker_img{
  background-image: url('../images/calendar.png');
  background-position: center right 15px;
  background-repeat: no-repeat;
  background-size: 20px;
}

label[for="office_phone"]:before {
  visibility: hidden;
}
.delivery-person-email-div label::before,
.delivery-person-smartphone-div label::before,
.delivery-person-firtname-div label::before,
.delivery-person-lastname-div label::before,
.delivery-person-phone-div label::before,
.delivery-address-div label::before {
  background: transparent !important;
}