/* Add here all your css styles (customizations) */

:root {
  --primaryColor: #10866e;
  --secondaryColor: #2e7ac0;
  --tertiaryColor: #65419d;
  --quaternaryColor: #657f42;
}

/* Body */
body {
    color: #474747;
}
/* End Body */

/* Headers */
h1 {
    font-family: 'Libre Franklin', sans-serif;
    font-weight: 200;
    font-size: 40px;
}

h2 {
    font-family: 'Libre Franklin', sans-serif;
    font-weight: 300;
    font-size: 24px;
}

h3 {
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
}

h4 {
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 14px;
}
/* End Headers */

/* Colors */
/* Font Colors */
.ffj-color-primary {
    color: var(--primaryColor) !important;
}

.ffj-color-secondary {
    color: var(--secondaryColor) !important;
}

.ffj-color-tertiary {
    color: var(--tertiaryColor) !important;
}

.ffj-color-quaternary {
    color: var(--quaternaryColor) !important;
}

/* End Font Colors */

/* Background Colors */
.ffj-background-primary {
    background-color: var(--primaryColor);
}

.ffj-background-secondary {
    background-color: var(--secondaryColor);
}

.ffj-background-tertiary {
    background-color: var(--tertiaryColor);
}

.ffj-background-quaternary {
    background-color: var(--quaternaryColor);
}
/* End Background Colors */
/* End Colors */

/* Main content body */
div.mainbody {
    background-color: #f7f8f9;
}

/* Main content div */
div.maincontent {
    padding: 20px;
}

/* Navigation Logo */
#logo_nav {
  line-height: 90px;
  max-height: 90px;
}

#logo_nav img {
  max-height: 45px;
  max-width: 200px;
  display: inline-block;
  vertical-align: middle;
}

/* Canada wordmark */
img.canada {
    width: 45px;
    padding-bottom: 5px;
}

/* Buttons */
/* FFJ White button */
.btn-white { 
  color: var(--quaternaryColor); 
  background-color: #FFFFFF; 
  border-color: var(--quaternaryColor); 
  border-radius: 0 !important;
} 
 
.btn-white:hover, 
.btn-white:focus, 
.btn-white:active, 
.btn-white.active, 
.open .dropdown-toggle.btn-white { 
  color: var(--quaternaryColor); 
  background-color: #F5F5F5; 
  border-color: var(--quaternaryColor); 
} 
 
.btn-white:active, 
.btn-white.active, 
.open .dropdown-toggle.btn-white { 
  background-image: none; 
} 
 
.btn-white.disabled, 
.btn-white[disabled], 
fieldset[disabled] .btn-white, 
.btn-white.disabled:hover, 
.btn-white[disabled]:hover, 
fieldset[disabled] .btn-white:hover, 
.btn-white.disabled:focus, 
.btn-white[disabled]:focus, 
fieldset[disabled] .btn-white:focus, 
.btn-white.disabled:active, 
.btn-white[disabled]:active, 
fieldset[disabled] .btn-white:active, 
.btn-white.disabled.active, 
.btn-white[disabled].active, 
fieldset[disabled] .btn-white.active { 
  background-color: #FFFFFF; 
  border-color: var(--quaternaryColor); 
} 
 
.btn-white .badge { 
  color: #FFFFFF; 
  background-color: var(--quaternaryColor); 
}
/* End FFJ White Button*/

/* FFJ Primary Button */
.btn-primary { 
  color: #ffffff; 
  background-color: var(--primaryColor); 
  border-color: var(--primaryColor);
  border-radius: 6px !important;
} 
 
.btn-primary:hover, 
.btn-primary:focus, 
.btn-primary:active, 
.btn-primary.active, 
.open .dropdown-toggle.btn-primary { 
  color: #ffffff; 
  box-shadow:0 0 0 2px rgba(255,255,255, 0.9) !important; 
  border-color:#ffffff !important;
  background-color:var(--primaryColor) !important; 
} 
 
.btn-primary:active, 
.btn-primary.active, 
.open .dropdown-toggle.btn-primary { 
  background-image: none; 
} 
 
.btn-primary.disabled, 
.btn-primary[disabled], 
fieldset[disabled] .btn-primary, 
.btn-primary.disabled:hover, 
.btn-primary[disabled]:hover, 
fieldset[disabled] .btn-primary:hover, 
.btn-primary.disabled:focus, 
.btn-primary[disabled]:focus, 
fieldset[disabled] .btn-primary:focus, 
.btn-primary.disabled:active, 
.btn-primary[disabled]:active, 
fieldset[disabled] .btn-primary:active, 
.btn-primary.disabled.active, 
.btn-primary[disabled].active, 
fieldset[disabled] .btn-primary.active { 
  background-color: var(--primaryColor); 
  border-color: var(--primaryColor); 
} 
 
.btn-primary .badge { 
  color: var(--primaryColor); 
  background-color: #ffffff; 
}
/* End FFJ Primary Button */

/* FFJ Secondary Button */
.btn-secondary { 
  color: #ffffff; 
  background-color: var(--secondaryColor); 
  border-color: var(--secondaryColor);
  border-radius: 6px !important;
} 
 
.btn-secondary:hover, 
.btn-secondary:focus, 
.btn-secondary:active, 
.btn-secondary.active, 
.open .dropdown-toggle.btn-secondary { 
  color: #ffffff; 
  background-color: var(--secondaryColor);
  box-shadow:0 0 0 2px rgba(255,255,255, 0.9) !important; 
  border-color: #FFF; 
} 

.btn-secondary:active, 
.btn-secondary.active, 
.open .dropdown-toggle.btn-secondary { 
  background-image: none; 
} 
 
.btn-secondary.disabled, 
.btn-secondary[disabled], 
fieldset[disabled] .btn-secondary, 
.btn-secondary.disabled:hover, 
.btn-secondary[disabled]:hover, 
fieldset[disabled] .btn-secondary:hover, 
.btn-secondary.disabled:focus, 
.btn-secondary[disabled]:focus, 
fieldset[disabled] .btn-secondary:focus, 
.btn-secondary.disabled:active, 
.btn-secondary[disabled]:active, 
fieldset[disabled] .btn-secondary:active, 
.btn-secondary.disabled.active, 
.btn-secondary[disabled].active, 
fieldset[disabled] .btn-secondary.active { 
  background-color: var(--secondaryColor); 
  border-color: var(--secondaryColor); 
} 
 
.btn-secondary .badge { 
  color: var(--secondaryColor); 
  background-color: #ffffff; 
}
/* End FFJ Secondary Button */

/* FFJ Tertiary Button */
.btn-tertiary { 
  color: #ffffff; 
  background-color: var(--tertiaryColor); 
  border-color: var(--tertiaryColor); 
  border-radius: 6px !important;
} 
 
.btn-tertiary:hover, 
.btn-tertiary:focus, 
.btn-tertiary:active, 
.btn-tertiary.active, 
.open .dropdown-toggle.btn-tertiary { 
  color: #ffffff; 
  /*background-color: #543585;*/
  box-shadow:0 0 0 2px rgba(255,255,255, 0.9) !important; 
  border-color:#FFF; 
} 
 
.btn-tertiary:active, 
.btn-tertiary.active, 
.open .dropdown-toggle.btn-tertiary { 
  background-image: none; 
} 
 
.btn-tertiary.disabled, 
.btn-tertiary[disabled], 
fieldset[disabled] .btn-tertiary, 
.btn-tertiary.disabled:hover, 
.btn-tertiary[disabled]:hover, 
fieldset[disabled] .btn-tertiary:hover, 
.btn-tertiary.disabled:focus, 
.btn-tertiary[disabled]:focus, 
fieldset[disabled] .btn-tertiary:focus, 
.btn-tertiary.disabled:active, 
.btn-tertiary[disabled]:active, 
fieldset[disabled] .btn-tertiary:active, 
.btn-tertiary.disabled.active, 
.btn-tertiary[disabled].active, 
fieldset[disabled] .btn-tertiary.active { 
  background-color: var(--tertiaryColor); 
  border-color: var(--tertiaryColor); 
} 
 
.btn-tertiary .badge { 
  color: var(--tertiaryColor); 
  background-color: #ffffff; 
}
/* End FFJ Tertiary Button */

/* FFJ Quaternary Button */
.btn-quaternary { 
  color: #ffffff; 
  background-color: var(--quaternaryColor); 
  border-color: var(--quaternaryColor); 
  border-radius: 6px !important;
} 
 
.btn-quaternary:hover, 
.btn-quaternary:focus, 
.btn-quaternary:active, 
.btn-quaternary.active, 
.open .dropdown-toggle.btn-quaternary { 
  color: #ffffff; 
/*  background-color: #8FBD44; */
  box-shadow:0 0 0 2px rgba(255,255,255, 0.9) !important; 
  border-color:#FFF; 
} 
 
.btn-quaternary:active, 
.btn-quaternary.active, 
.open .dropdown-toggle.btn-quaternary { 
  background-image: none; 
} 
 
.btn-quaternary.disabled, 
.btn-quaternary[disabled], 
fieldset[disabled] .btn-quaternary, 
.btn-quaternary.disabled:hover, 
.btn-quaternary[disabled]:hover, 
fieldset[disabled] .btn-quaternary:hover, 
.btn-quaternary.disabled:focus, 
.btn-quaternary[disabled]:focus, 
fieldset[disabled] .btn-quaternary:focus, 
.btn-quaternary.disabled:active, 
.btn-quaternary[disabled]:active, 
fieldset[disabled] .btn-quaternary:active, 
.btn-quaternary.disabled.active, 
.btn-quaternary[disabled].active, 
fieldset[disabled] .btn-quaternary.active { 
  background-color: var(--quaternaryColor); 
  border-color: var(--quaternaryColor); 
} 
 
.btn-quaternary .badge { 
  color: var(--quaternaryColor); 
  background-color: #ffffff; 
}
/* End FFJ Quaternary Button */

/* Footer */
#footer {
    font-size: 0.8rem;
}
/* End Footer */

/* Assessment Style Buttons and Radios */
.btn-assess {
    background-color: #ddd; 
    border-color: var(--primaryColor);
    font-weight: bold;
}
.btn-assess:hover, .btn-assess:focus, .btn-assess:active, .open > .dropdown-toggle.btn-assess {
    background: var(--primaryColor); 
    border-color: var(--primaryColor);
    color: white;
}
.btn-assess.active{
    background: var(--primaryColor); 
    border: 1px solid #FFFFFF;
    color: white;
}


.questionStyle {
    background-color: #428bca;
    border-color: #428bca;
}

/* Assessment Table */
.assessTable {
    background-color: white;
    padding-top: 0px;
    padding-bottom: 0px;
    margin-bottom: 20px;
}

/* Cognitive Styles */
.cogQuestionWell {
    font-size: 12pt;
    
}

.cogQuestionBlock {
    margin-left: 30px;
    font-weight: bold;
    
}

.answerBlock {
    margin-left: 50px;
    margin-top: 10px;
    
}

.questionNumber {
    float: left;
    font-weight: bold;
}
/* End Cognitive Styles */

/* Dashboard styles start */
div.dash-component {
    min-height: 300px;
    max-height: 500px;
    overflow: auto;
    background-color: white;
    background-clip: content-box;
}

/* Height of dashboard component / 2 - (height of progress bar - / 2)*/
/* 400 / 2 - (14 / 2)*/
div.dash-progress {
    margin-top: 143px;
}

/*#available-jobs {
    min-height: 100px;
    max-height: 300px;
    overflow: auto;
}*/
/* Dashboard styles end */

/* General styles start */
div.general-component {
    background-color: white;
}
/* General styles end */

/* Custom override of Unify navigation bar for the profile drop down, the width can be too small if the display name is short */
@media (min-width: 992px) {
  .g-width-60x--lg {
    width: 60% !important;
    /* J */
  }
  .g-width-100x--lg {
     /* Override Unify */ 
     width: auto !important;
    /* P */
  }
  .g-width-155--lg {
    width: 155px !important;
    /* O */
  }
  .g-width-165--lg {
    width: 165px !important;
  }
  .g-width-200--lg {
    width: 200px !important;
    /* O */
    max-width: 100%;
  }
  .g-width-250--lg {
    /* RG-Q */
    width: 250px !important;
    /* P */
    max-width: 100%;
  }
  .g-width-485--lg {
    width: 485px !important;
    /* O */
    max-width: 100%;
  }
  .g-width-auto--lg {
    width: auto !important;
    /* P */
  }
  .g-max-width-200--lg {
    max-width: 200px;
  }
}
/* End custom override of Unify navigation bar for the profile drop down, the width can be too small if the display name is short */




/* Override to increase the height of Bootstrap navbar */
 .navbar {
  min-height: 80px;
}

.navbar-brand {
  padding: 0 15px;
  height: 80px;
  line-height: 80px;
}

.navbar-toggle {
  /* (80px - button height 34px) / 2 = 23px */
  margin-top: 23px;
  padding: 9px 10px !important;
}

@media (min-width: 768px) {
  .navbar-nav > li > a {
    /* (80px - line-height of 27px) / 2 = 26.5px */
    padding-top: 26.5px;
    padding-bottom: 26.5px;
    line-height: 27px;
  }
}

.u-header-logo-toggler {
    height: 80px;
}
/* End override to increase the height of Bootstrap navbar */


/*------------------------------------
  Header Top Nav Logged In
------------------------------------*/
.u-header__section--admin-ffj .u-header-logo-toggler {
  background-color: #ffffff;
}

.u-header__section--admin-ffj {
  background-color: #ffffff;
  color: #fff;
}

.u-header__section--admin-ffj a {
  color: #8294b9;
}

.u-header__section--admin-ffj a .hs-admin-align-left{
  color: #000033;
}

.u-header__section--admin-ffj a:hover,
.u-header__section--admin-ffj a .hs-admin-align-left:hover {
  text-decoration: none;
  color: #e62154;
}

.u-header__section--admin-ffj [data-dropdown-target] {
  color: var(--primaryColor);
  text-decoration: none;
}

.u-header__section--admin-ffj [data-dropdown-target] i {
  color: #6d7c9f;
  text-decoration: none;
}

.u-header__section--admin-ffj [data-dropdown-target]:hover {
  color: var(--primaryColor);
  text-decoration: none;
}

.u-header__section--admin-ffj [data-dropdown-target].active i {
  color: var(--primaryColor);
  text-decoration: none;
}

.u-header__section--admin-ffj [aria-labelledby] {
  background-color: #2e3c56;
  color: #d4dade;
}

.u-header__section--admin-ffj [aria-labelledby] a {
  color: #d4dade;
}

.u-header__section--admin-ffj [aria-labelledby] i {
  color: #7484a8;
}

.u-header__section--admin-ffj [aria-labelledby] .u-header-dropdown-icon-v1 i {
  color: #1cc9e4;
}

.u-header__section--admin-ffj .u-header-dropdown-bordered-v1 {
  border-bottom-color: #4b5770;
}

.u-header__section--admin-ffj .u-header-dropdown-bordered-v2 {
  border-bottom-color: #4b5770;
}

.u-header__section--admin-ffj .u-header-dropdown-item-v1:hover {
  background-color: #222e44;
}

.u-header__section--admin-ffj .u-header-dropdown-item-v1:hover .u-header-dropdown-icon-v1 {
  background-color: #2e3c56;
}

.u-header__section--admin-ffj .u-header-dropdown-icon-v1 {
  background-color: #222e44;
}
/*------------------------------------
  End Header Top Nav Logged In
------------------------------------*/

/*------------------------------------
  Header Side Nav Logged In
------------------------------------*/
.u-sidebar-navigation--ffj {
  background-color: var(--primaryColor);
  color: #d4dade;
}

.u-sidebar-navigation--ffj .u-side-nav--top-level-menu-item:hover {
 /*// background-color: #25AD8D;*/

}

.u-sidebar-navigation--ffj .u-side-nav--top-level-menu-link {
  color: #FFFFFF;
  text-decoration: none !important;
}

.u-sidebar-navigation--ffj .u-side-nav--top-level-menu-link i {
  color: #FFFFFF;
  text-decoration: none !important;
}
.u-sidebar-navigation--ffj .u-side-nav--top-level-menu-link .u-side-nav--control-icon i {
  color: #FFFFFF;
  text-decoration: none !important;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--top-level-menu-link:not(.collapsed) .u-side-nav--control-icon i {
  color: #FFFFFF;
}

.u-sidebar-navigation--ffj .u-side-nav--top-level-menu-link:hover {
  color: white;
   /*color: #286a6a;*/
}

.u-sidebar-navigation--ffj .u-side-nav--top-level-menu-link:hover i {
  color: white;
   /*color: #286a6a;*/
}

.u-sidebar-navigation--ffj .u-side-nav--top-level-menu-link.active {
  color: white;
   /*color: #286a6a;*/
}

.u-sidebar-navigation--ffj .u-side-nav--top-level-menu-link.active i {
  color: white;
   /*color: #286a6a;*/
}

.u-sidebar-navigation--ffj.u-sidebar-navigation-v1--mini .u-side-nav--second-level-menu {
  background-color: #29364d;
}

.u-sidebar-navigation--ffj .u-side-nav--second-level-menu-link {
  color: #FFFFFF;
}

.u-sidebar-navigation--ffj .u-side-nav--second-level-menu-link i {
  color: #FFFFFF;
}

.u-sidebar-navigation--ffj .u-side-nav--second-level-menu-link .u-side-nav--control-icon i {
  color: #FFFFFF;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--second-level-menu-link:not(.collapsed) {
  color: #FFFFFF;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--second-level-menu-link:not(.collapsed) i {
  color: #FFFFFF;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--second-level-menu-link:not(.collapsed) .u-side-nav--control-icon i {
  color: #FFFFFF;
}

.u-sidebar-navigation--ffj .u-side-nav--second-level-menu-link:hover {
   color:white;
   background-color:var(--primaryColor);
  /*color: #286a6a;*/
}
.u-sidebar-navigation--ffj .u-side-nav--second-level-menu-link:hover {
   color:white;
   background-color:var(--primaryColor);
  /*color: #286a6a;*/
}

.u-sidebar-navigation--ffj .u-side-nav--second-level-menu-link:hover i {
   color:white;
  /*color: #286a6a;*/
}

.u-sidebar-navigation--ffj .u-side-nav--second-level-menu-link.active {
   color:white;
  /*color: #286a6a;*/
}

.u-sidebar-navigation--ffj .u-side-nav--second-level-menu-link.active i {
    color:white;
  /*color: #286a6a;*/
}

.u-sidebar-navigation--ffj .u-side-nav--third-level-menu-link {
  color: #d4dade;
}

.u-sidebar-navigation--ffj .u-side-nav--third-level-menu-link i {
  color: #7484a8;
}

.u-sidebar-navigation--ffj .u-side-nav--third-level-menu-link .u-side-nav--control-icon i {
  color: #d4dade;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--third-level-menu-link:not(.collapsed) {
  color: #fff;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--third-level-menu-link:not(.collapsed) i {
  color: #fff;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--third-level-menu-link:not(.collapsed) .u-side-nav--control-icon i {
  color: #fff;
}


.u-sidebar-navigation--ffj .u-side-nav--third-level-menu-link:hover {
  color: #e62154;
}

.u-sidebar-navigation--ffj .u-side-nav--third-level-menu-link:hover i {
  color: #e62154;
}

.u-sidebar-navigation--ffj .u-side-nav--fourth-level-menu-link {
  color: #d4dade;
}

.u-sidebar-navigation--ffj .u-side-nav--fourth-level-menu-link i {
  color: #7484a8;
}

.u-sidebar-navigation--ffj .u-side-nav--fourth-level-menu-link .u-side-nav--control-icon i {
  color: #d4dade;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--fourth-level-menu-link:not(.collapsed) {
  color: #fff;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--fourth-level-menu-link:not(.collapsed) i {
  color: #fff;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu > .u-side-nav--fourth-level-menu-link:not(.collapsed) .u-side-nav--control-icon i {
  color: #fff;
}

.u-sidebar-navigation--ffj .u-side-nav--fourth-level-menu-link:hover {
  color: #e62154;
}

.u-sidebar-navigation--ffj .u-side-nav--fourth-level-menu-link:hover i {
  color: #e62154;
}

.u-sidebar-navigation--ffj .u-side-nav--has-sub-menu.u-side-nav-opened {
  background-color: #25AD8D;
}

/* Has Active */
.u-sidebar-navigation--ffj .has-active {
  background-color: var(--primaryColor);
}

.u-sidebar-navigation--ffj .has-active > a {
  color: #FFFFFF;
}

.u-sidebar-navigation--ffj .has-active > a i {
  color: #FFFFFF;
}
/*------------------------------------
  End Header Side Nav Logged In
------------------------------------*/

/*------------------------------------
  Header Nav Toggler
------------------------------------*/
.u-header__section--admin-dark .u-header__nav-toggler i {
  color: #fff;
}
/*------------------------------------
  End Header Nav Toggler
------------------------------------*/
#headerText{
padding-top: 10px;
padding-bottom: 10px;
}


.dashboardContainerHeader{
    color:#e60303;
}

.dashContainer{
    padding-top:10px;
    padding-bottom:5px;
}
.strongtext{
    color:#e60303;
}

#dashboardContainer{
    margin-left: 0px
}

#promoted-jobs{
    overflow:hidden;
}

#promoted-jobs-accordion, #promoted-jobs-dashList{
    max-height: 238px;
    overflow:auto;
}

#superpowerList{

}

#signature-traits{
    overflow: hidden;
}

#yesterYearLoaded > img{
    /*(on dashboard) originals are 1200 x 630 */
    width: 90%;
    max-width: 400px;
    max-height: 210px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1rem;
}

#share{
    padding-left:0px;
    padding-right: 5px;
}

#signupFormDiv{
    padding-top:15px;
}

.searchForm{
    background-color:white;
    padding-top:15px;
    margin-left:0px;
}

.jobSearchHeader{
    text-decoration: underline;
}

#btnJobSearch{
    width:100%;
}

#btnJobSearchSidenav{
    min-height: 31px;
}

#sidenavSearch{
    max-width: 180px;
}

#updateProfileDiv{
    text-align: center;
}

#uploadContentDiv{
    margin-left:0px;
    padding-left:0px;
    padding-right:0px;
}
#uploadTitleDiv{
    padding-top:15px;
}
#mainEducationDiv{
    margin-left:0px;
}

#eduTitleDiv{
    padding-top:20px;
}

#addBtnDiv{
    padding-bottom: 5px;
    text-align:right;
    padding-right:5px;
    margin-bottom: 5px;
}

#AddWorkExperience{
   margin-bottom: 5px;
}

#workExpTitleDiv{
    padding-top: 15px;
}

#mainSkillsDiv{
    margin-left:0px;
    margin-top:5px;
}

#btnSaveChanges{
    position:relative;
    left:45%;
}

#progBar{
    position: relative;
    float:right;
}

#MainBlock{
    padding-top:15px;
}

.assessBlock{
    padding-left:15px;
    
}

.questionTitle{
     padding-top:0.5%;
}

.mainprogDiv{
    width:100%;
}

#changeStatusContentDiv{
    padding-left:20px;
}

#noWorkExp{
    text-align: center;
}
#noEdu{
    text-align: center;
}

#progressbarDiv{
    padding-top:25px;
    
}

#dashboardHeaderDiv{
    padding-top:25px;
    padding-left:20px;
}


#dashboardContainerFFJ{
    margin-left: 0px;
    margin-right: 0px;
    padding:30px;
}

#profileBoostersContainerFFJ{
    margin-left: 0px;
    margin-top:15px;
    padding: 30px;
}
#profileBoostersContainerFFJ{
    margin-top:15px;
}

.jobmatchButtons{
    background-color: #ffffff !important;
    color:#000000 !important;
    padding-top:5px !important;
    padding-bottom:5px !important;
    padding-right:20px !important;
    padding-left:20px !important;
    margin-left:9px !important;
    margin-right:9px !important;
    border-color: var(--primaryColor);
} 


.total_progress{
    background-color:var(--primaryColor) !important;
}

.progressCircle{
    width: 150px;
    height: 150px;
    line-height: 150px;
    background: none;
    margin: 0 auto;
    box-shadow: none;
    position: relative;
}
.progressCircle:after{
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 12px solid #fff;
    position: absolute;
    top: 0;
    left: 0;
}
.progressCircle > span{
    width: 50%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    z-index: 1;
}
.progressCircle .progress-left{
    left: 0;
}
.progressCircle .progress-bar{
    width: 100%;
    height: 100%;
    background: none;
    border-width: 12px;
    border-style: solid;
    position: absolute;
    top: 0;
}
.progressCircle .progress-left .progress-bar{
    left: 100%;
    border-top-right-radius: 80px;
    border-bottom-right-radius: 80px;
    border-left: 0;
    -webkit-transform-origin: center left;
    transform-origin: center left;
}
.progressCircle .progress-right{
    right: 0;
}
.progressCircle .progress-right .progress-bar{
    left: -100%;
    border-top-left-radius: 80px;
    border-bottom-left-radius: 80px;
    border-right: 0;
    -webkit-transform-origin: center right;
    transform-origin: center right;
    animation: loading-1 1.8s linear forwards;
}
.progressCircle .progress-value{
    width: 90%;
    height: 90%;
    border-radius: 50%;
    background: #fff;
    font-size: 30px;
    color: #000000;
    line-height: 135px;
    text-align: center;
    position: absolute;
    top: 5%;
    left: 5%;
}
.progressCircle.blue .progress-bar{
    border-color: var(--primaryColor);
}
.progressCircle.blue .progress-left .progress-bar{
    animation: loading-2 1.5s linear forwards 1.8s;
}
.progressCircle.interests .progress-bar{
    border-color: var(--primaryColor);
}
.progressCircle.interests .progress-left .progress-bar{
    animation: loading-3 1s linear forwards 1.8s;
}
.progressCircle.skills .progress-bar{
    border-color: var(--primaryColor);
}
.progressCircle.skills .progress-left .progress-bar{
    animation: loading-4 1.5s linear forwards 1.8s;
}

@keyframes loading-1{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}
@keyframes loading-2{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }
}
@keyframes loading-3{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}
@keyframes loading-4{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}
@keyframes loading-5{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(126deg);
        transform: rotate(126deg);
    }
}
@media only screen and (max-width: 990px){
    .progressCircle{ margin-bottom: 20px; }
}

#profileBoostersContainerFFJ2{
     margin-left: 0px;
    margin-top:15px;
    padding: 30px;
}

#jobMatchHead{
    margin-top: 15px;
}

#progressbarDiv{
    padding-bottom:35px;
}

.comingsoon {
    color: grey !important;
}


#assessmentBodyDiv{
    padding:20px;
}

a.disabled {
   pointer-events: none;
   cursor: default;
   opacity: 0.4;
}

#ResetPasswordHeader{
    padding-top:15px;
}

#ResetPasswordHeaderText{
    padding-left:0px;
}

#resetPasswordBodyDiv{
    padding-bottom:15px;
}

#ProfileDetailsDiv{
    padding-top:10px;
}

#mainAccountSettingsDiv{
    padding-bottom:10px;
}

#AccountProfileTabs{
    margin-bottom:10px;
}
.RequiredAst{
    color:#FF0000;
}

.attachments{
    width:230px;
}

.interestBtns{
    padding-top:10px;
        width:100%;
}

.interestSpan{
    font-size:18px;
}

#CurrentJobsDiv{
    margin-top: 15px;
}

#JobPickerMainDiv{
    padding-top:20px;
    padding-bottom:20px;
}

.radioButtonLabel{
    width:150px;
    border:1px solid #dddddd;
}

.titleTD{
    width:40%;
    font-size: 15px;
}

#interestsTableDiv{
    max-height:650px;
    overflow:auto;
}

#interestTable td{
   vertical-align: middle;
}

#collapseTableHeader{
    padding-top:10px;
    padding-bottom:5px;
    
}

#collapseTableButtonHeader{
    padding-bottom:5px;
    text-align:right;
}

#hideTableButton{
    width:50px;
}

.interestTH{
    border-top:none !important;
}

#JobPickerOuterDiv{
    padding:20px;
    padding-top:30px;
}

#InterestIntroDiv{
    padding-top:20px;
}

#howItWorksDiv{
    padding-bottom:20px;
    margin-bottom:20px
}

.likeDislikeBtns{
    color: #696969;
}
.likeDislikeBtns:hover{
    color: #FFFFFF;
}

.roundedIcon:hover{
    background-color: var(--tertiaryColor);
}
.likeDislikeBtns::selection{
    background-color:#696969 !important;
}

.ffj-page-title{
    padding-left: 0px;
    margin-bottom: 5px;
    position: relative;
    left: -1px;
}


.form-control:focus, .custom-select:focus {
    border-color: var(--primaryColor) ;
    box-shadow: none;
}

#workExpTitleDiv .media-body{
    padding-right: 0;
}

.graduated-options{
    background-color: var(--primaryColor);
    border-color: var(--primaryColor);
    color: #ffffff;
}
.graduated-options:hover, .graduated-options:focus, .graduated-options:active, .graduated-options.active {
    color: #ffffff;
    background-color: #25AD8D;
    border-color: var(--primaryColor);
}

::selection {
    background-color: var(--primaryColor);
    color: #fff;
}

.timelineContent{
    padding-left:40px;
}

.dateContent{
    padding-left:40px;
}

#assessmentReportsNotCompleteDiv{
    padding-top:15px;
    padding-bottom:15px;
}

#doesThisInterestHeader{
    padding-left:40px;
}

#landingMainDiv{
    margin-left:0px;
    padding-left:0px;
    margin-right:0px;
    padding-right:0px;
    max-width: 100%;
}

.employerJobseekerDiv{
    padding-right:30px;
}
#signupDiv{
/*    margin-left:25px;*/ 
}

#loginContainer{
    padding-top:20px;
     padding-bottom:20px;
}

#loginBtn{
    margin-bottom: 10px;
}

#lowerText{
    text-align: center;
}

#landingPageImageDiv{
    margin-left:0px;
}

#applicantCurrentStatusSelect{
    padding-left:0px !important;
}

.graduated-options.active{
    color:#FFFFFF !important;
    background-color: var(--tertiaryColor) !important;
    
}

.ffj-overall-profile-title{
    padding-left: 0px;
    margin-bottom: 15px;
    position: relative;
    left: -1px;
}

#goToAssessmentBtn:hover{
    background-color:var(--tertiaryColor);
}

#IndividualReportBtn:hover{
   background-color:var(--tertiaryColor);
}

.IconBlockDiv{
    min-width: 300px;
    width:300px;
    height:300px
}

#CareerPlanningReportBtn:hover{
    background-color:var(--secondaryColor);
}

.ffj-overall-profile-title{
    padding-left: 0px;
    margin-bottom: 15px;
    position: relative;
    left: -1px;
}

.IconBlockDivReports{
    min-width: 300px;
    width:300px;
    height:300px;
    margin: auto;
}

#assessmentBodyDiv{
    padding-top: 30px;
}

.searchForm{
    padding-bottom:10px;
} 

.occupationalHead{
    padding-left:15px;
}

.widget-dashboard{
    padding-top:5px;
}

#yesterYearFBShareBtn{
    height: 28px;
}

/*.colheader{
    padding-left:15px;
}*/

.topJobMatch{
    color:black;
    font-weight: normal;
}
.topJobMatch:hover{
    color:var(--tertiaryColor);
}

.topJobMatchSelected{
    color:#FFFFFF !important;
    font-weight: bold;
}
.topJobMatchSelected:hover{
    color:#DCDCDC  !important;
}

.criticalTraitsSubDiv{
    padding:0px;
}
.interestsTraitsSubDiv{
    border: 1px solid black;
    text-align:center;
}

.skillTraitsSubDiv{
    border: 1px solid black;
    text-align:center;
}
#topJobsRow{
    padding-top: 10px;
    min-height: 500px;
    padding-bottom:100px;
}

.criticalTraitsDiv{
    margin-top:10px;
    margin-bottom:10px;
    margin-left:0px;
    margin-right:0px;
}

.statTextBlack{
    color:#474747;
    padding-left:5px;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-size: 15px;
}

.promoted-jobs-body-div{
    padding-top:15px;
    padding-bottom:20px;
}

#careerExplorerDiv{
    margin-left:0px;
    padding-left:0px;
    padding-right:0px;
}

#searchJobFromCE_Btn{
    margin-left:15px;
}

.topJobMatchHeader{
    font-size: 20px;
    margin-top:5px;
}

.ce-job-subsection-header{
    padding-top:10px;
    margin-left:5px;
}

#btnCareerExp{
    margin-top:20px;
    margin-bottom:10px;
}

.scoreWeak{
   color:#db4c4c;
   
}

.scoreMedium{
    color:#f1db87;
}

.scoreStrong{
   color:#aedf70;
}

.sigTraitHeader{
    padding-top:5px;
    text-align: center;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-size: 15px;
    
}

.jobSigTraitHeader{
    text-align: center;
}

#coreTraitCollapse{
    
}

#traitsDivPersonAssess{
    padding-top:15px !important;
}

#otherTraitsDivPersonAssess{
    padding-top:15px !important;
}

.traitsAccordion{
    max-width: 380px;
}

.otherTraitHeader{
    padding-top:5px;
    text-align: center;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-size: 15px;
}

#searchHeaderProfileExplorer, #topJobHeaderProfileExplorer{
    padding-top:15px;
}

.profileDescription{
    margin-left:5px;
    padding-top:5px;
    
}

.chevIcon{
    float:right !important;
    
}


.chevronSpan{
    padding-top:10px;
}

#mainBody_HeaderDiv{
    padding:0px !important;
    
}

.profDescriptDashDiv{
    padding-left:5px;
    padding-right:5px;
}

.fitIconDiv{
    float:right;
    height:40px;
    width:40px;
    border:1px transparent;
    background-color:#FFFFFF;
    border-radius: 20px;
}

@media only screen and (max-width: 600px) {
    .fitIconDiv{
        float:Left;
        margin-left:45px;
    }
}

.jobAccordionDiv{ 
    padding-left:0px;
    padding-right:0px;
    
    animation: fadein 2s;
    -moz-animation: fadein 2s;
    /* Firefox */
    -webkit-animation: fadein 2s;
    /* Safari and Chrome */
    -o-animation: fadein 2s;
    /* Opera */
}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein {
    /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein {
    /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein {
    /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}

.fitLegendRow{
      
}

.legendIcons{
    margin-right:5px;
}

#legendGreen{
      color:#aedf70;
}

#legendYellow{
      color:#f1db87;
}

#legendRed{
      color:#db4c4c;
}


#CE_introDIv{
    margin-left:0px;
    margin-right:0px;
    padding-right:0px;
    padding-left:0px;
}

#introRow{
    padding-top:10px;
    margin-bottom:15px !important;
}

#SearchExplorerDiv{
    padding-top:10px;
    margin-top:15px !important;
    
}
#searchRow{
    padding-bottom:15px !important;
    padding-left:0px !important;
    padding-right:0px !important;
}

#completeProfileRow{
    padding-top:10px;
    margin-bottom:15px !important;  
}

.missingQuestion-border{
   border: 2px solid var(--primaryColor);
}

.missingQuestion-background{
    background-color: #FFCCCC !important;
}

.missingQuestion-background-warning:not(.missingQuestion-background){
    background-color: #f7f87e !important;  /* Light Yellow */
}

.modalDialog{
    max-width: 600px !important;
    
}

.traitTag1{
    color:var(--quaternaryColor) !important;
    border-color:var(--quaternaryColor) !important;
    background-color:#FFFFFF !important;
}

.traitTag2{
    color:var(--secondaryColor) !important;
    border-color:var(--secondaryColor) !important;
    background-color:#FFFFFF !important;
}

.traitTag3{
    color:var(--tertiaryColor) !important;
    border-color:var(--tertiaryColor) !important;
    background-color:#FFFFFF !important;
}

.traitTag4{
    color:var(--primaryColor) !important;
    border-color:var(--primaryColor) !important;
    background-color:#FFFFFF !important;
}

.traitTag5{
    color:#002b75 !important;
    border-color:#002b75 !important;
    background-color:#FFFFFF !important;
}

.traitDiv{
    padding-top:15px;
    padding-bottom:15px;
}

.traitTag1Core{
    color:#FFFFFF !important;
    border-color:var(--quaternaryColor) !important;
    background-color:var(--quaternaryColor) !important;
}

.traitTag2Core{
    color:#FFFFFF !important;
    border-color:var(--secondaryColor) !important;
    background-color:var(--secondaryColor) !important;
}

.traitTag3Core{
    color:#FFFFFF !important;
    border-color:var(--tertiaryColor) !important;
    background-color:var(--tertiaryColor) !important;
}

.traitTag4Core{
    color:#FFFFFF !important;
    border-color:var(--primaryColor) !important;
    background-color:var(--primaryColor) !important;
}

.traitTag5Core{
    color:#FFFFFF !important;
    border-color:#002b75 !important;
    background-color:#002b75 !important;
}
.list-inline-item{
    margin-right:28px !important;
    margin-bottom:20px !important;
}

.infoButton:hover{
    color:black !important;
    cursor:context-menu !important;
}

.jobTrait{
    width:200px;
}

.jobTraitInfo{
    float:left;
    margin-top:3px;
}

.traitTags{
    font-weight:bold;
}

.noJobAlert{
    margin-top:40px;
}
.topJobExpanded{
    background-color: var(--tertiaryColor) !important;
    color:#FFFFFF !important;
}

.fitScoreDiv{
    padding-bottom:50px;
    border: 1px solid #DCDCDC;
}

.jobSumIcon{
    padding-bottom:10px;
}

.jobSubTitle{
    font-size:18px;
}

#infoRow{
    margin-bottom:15px !important;
    padding-top:20px;
    padding-bottom:10px;
}

.personalityAssessTraits{
    margin-right: 20px !important;
}

#CE_Tabs{
    border-bottom: 1px solid #eee;
}

.jobSumButton{
    
}

.jobSumButton:hover{
    color:var(--tertiaryColor) !important;
    text-decoration: none;
}

#questionDiv{
    font-weight: bold;
    font-size:18px;
    color:var(--tertiaryColor);
    text-align: center;
    padding-bottom:20px;
    padding-top:20px;
}

#rateInterestDiv{
    padding:20px;
    padding-bottom: 30px;
    min-height:130px;
}

.interestRadioSelected{
    background-color: var(--primaryColor) !important;
    color:#FFFFFF !important;
}


.interestSpan:hover{
    background-color: var(--tertiaryColor) !important;
    color:#FFFFFF !important;
}

#interestProgressDiv{
    padding-top:50px;
}

.traitSubHeader{
    font-size:18px !important;
}

#interestProgressGraphDiv{
    padding-top:20px;
    padding-bottom:20px;
}

.interestGraph{
    padding-left:40px;
    padding-right:40px;
}

@media only screen and (max-width: 1500px) {
    .interestGraph {
        padding-left:20px;
        padding-right:20px;
    }
}
@media only screen and (max-width: 633px) {
    .interestGraph {
        padding-left:0px;
        padding-right:0px;
    }
}

@media only screen and (max-width: 545px) {
    .interestGraph {
        padding-left:100px;
        padding-right:100px;
    }
}

.interest-icon{
    font-size:35px !important;
}

.interestBtnLabel{
    font-size:14px !important;
}

.interestButtonSpan{
    font-size:18px; 
}


@media only screen and (max-width: 710px) {
    .interestBtnLabel {
        width:100%;
    }
}

.interestBarDiv{
    padding-bottom:15px !important;
}

.intLegendIcons{
    margin-left:10px !important;
    margin-right:4px !important;
}

.nestedDonutChart-wrapper {
  width: 300px;
  height: 200px;
  position: relative;
  margin-left: auto;
  margin-right: auto; }
  .nestedDonutChart-wrapper svg path {
    stroke-linecap: round; }
  .nestedDonutChart-wrapper--small {
    width: 50px;
    height: 50px; }
    .nestedDonutChart-wrapper--small .nestedDonutChart-outerDonut {
      width: 43px;
      height: 43px; }
    .nestedDonutChart-wrapper--small .nestedDonutChart-middleDonut {
      width: 34px;
      height: 34px; }
    .nestedDonutChart-wrapper--small .nestedDonutChart-innerDonut {
      width: 24px;
      height: 24px; }

.nestedDonutChart-outerDonut, .nestedDonutChart-middleDonut, .nestedDonutChart-innerDonut {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

.nestedDonutChart-outerDonut-skeleton, .nestedDonutChart-middleDonut-skeleton, .nestedDonutChart-innerDonut-skeleton {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

.nestedDonutChart-outerDonut {
  width: 195px;
  height: 195px; }

.nestedDonutChart-middleDonut {
  width: 153px;
  height: 153px; }

.nestedDonutChart-innerDonut {
  width: 108px;
  height: 108px; }

.nestedDonutChart-outerDonut-skeleton {
  width: 195px;
  height: 195px; }

.nestedDonutChart-middleDonut-skeleton {
  width: 153px;
  height: 153px; }

.nestedDonutChart-innerDonut-skeleton {
  width: 108px;
  height: 108px; }

.nestedDonutChart-pourcentage {
  display: inline-block;
  font-family: "Fira Sans", sans-serif;
  font-size: 14px;
  font-weight: 300;
  text-align: center;
  color: #ffffff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0; }
  .nestedDonutChart-pourcentage--secondary {
    color: #444444; }

/* @media (max-width: 844px) {
  .nestedonutChart-wrapper:not(.nestedDonutChart-wrapper--small) {
    width: 150px;
    height: 150px; }
  .nestedDonutChart-outerDonut {
    width: 150px;
    height: 150px; }
  .nestedDonutChart-middleDonut {
    width: 120px;
    height: 120px; }
  .nestedDonutChart-innerDonut {
    width: 86px;
    height: 86px; } 
 }*/

@media (max-width: 1350px) {
  .nestedDonutChart-wrapper:not(.nestedDonutChart-wrapper--small) {
    width: 150px;
    height: 150px; }
  .nestedDonutChart-outerDonut {
    width: 150px;
    height: 150px; }
  .nestedDonutChart-middleDonut {
    width: 120px;
    height: 120px; }
  .nestedDonutChart-innerDonut {
    width: 86px;
    height: 86px; } }


.skillLabel{
    width: 200px !important;
}

.skillSelected{
    border-color:var(--secondaryColor) !important;
}

.iconSkillSelected::after{
    background-color:var(--secondaryColor) !important;
}

.careerReportBtnAssess{
    background-color: #999999 !important;
    border-color: #999999 !important; 
}



.intIconSpan{
    white-space: nowrap;
}  

.interestProgressOuterDiv{
    margin-bottom:20px;
    padding-bottom:40px;
}

@media (max-width: 633px) {
    #navTopSearch{
        display:none;
    }
    #navTopSearchPadding{
        display:none;
    }
}

@media (min-width: 633px) {
    #navSidebarSearch{
        display:none;
    }
}

#saveChangesBtn{
    margin-bottom:10px;
}
.interestInfoAccordion{
   background-color: #EEEEEE;
}

#interestDefinitionDiv{
    padding-bottom:20px;
    margin-bottom:20px
}
#intQuestionRow{
    text-align:center;
    padding-bottom:10px;
    padding-top:10px;
    border-radius: 5px;
    display: flex;
    align-items: center;
}

/* On mobile, allow space for long questions without shifting page */
@media (max-width: 400px) {
    #intQuestionRow{
        min-height: 95px;
    }
}

#interestSelectionDiv{
    padding-top:15px;
    margin-top:15px;
}

.interestBtnIconLabel{
    text-align:center;
    margin-bottom: 0px !important;
    padding-bottom:0px !important;
}

@media (max-width: 575px) {
    .interestBtnIconLabelOuter{
        width:100%;
    }

    .interestBtnIconLabelInner{
        width:32%;
    }
}
#interestRadioGroupDiv{
    text-align:center;
}


.innerInterestIconCircle{
    background-color:#EEEEEE;
}

.innerInterestIconCircleHover{
    background-color:#9370DB;
}
.interestIconTextHover{
    color:#9370DB;
}

.innerInterestIconCircleClick{
    background-color:var(--tertiaryColor);
}
.interestIconTextClick{
    color:var(--tertiaryColor);
}
#termsAndCondLink:hover{
    text-decoration:none !important;
}

.topRightMenuItem{
    text-decoration: none !important;
}
.topRightMenuItem:hover{
    color:var(--primaryColor) !important;
    
}

.CE_TabLinks_Active{
    background-color:var(--primaryColor) !important;
    color:#FFFFFF !important;
}

#adminAppHeaderDiv{
    padding-right:0px;
}

.adminStatBoxes{
    display: inline-block;
}

.adminStatsDiv{

    margin-bottom:20px !important;
    margin-left:5px;
    margin-right:5px;
}

.search-boxAdmin {
    position: relative;        
    float: right;
}
.search-boxAdmin input {
    height: 34px;
    border-radius: 20px;
    padding-left: 35px;
    border-color: #ddd;
    box-shadow: none;
}
    .search-boxAdmin input:focus {
            border-color: #3FBAE4;
    }
.search-boxAdmin i {
    color: #a0a5b1;
    position: absolute;
    font-size: 19px;
    top: 8px;
    left: 10px;
}

.dataTables_paginate{
    display:inline;
}

.ui-datepicker{
    background-color:#FFFFFF !important;
    padding:10px;
}

.btnViewNots{
    cursor: pointer;
}

.applicantReminderDateLink{
    font-weight: bold;
    text-decoration: none !important;
}
.applicantReminderDateLink:hover{
    text-decoration: none !important;
}

.btnViewApplicant:hover, .applicantReminderDateLink:hover{
    color:var(--tertiaryColor) !important;
}

.viewAttach:focus, .CA_ReportViewBtn:focus{
    border: 2px solid var(--tertiaryColor) !important;
}

.viewAttach{
    text-decoration: none !important;
}

.disabled{
    text-decoration:none !important;
}

.btnViewDetails{
    text-decoration: none !important;
}

.btnViewDetails:focus{
    border: 2px solid #15d3b2 !important;
}

.adminAsApplicantBanner{
    text-align: center;
    background-color: var(--tertiaryColor);
    color:#FFFFFF;
}

#guiderSelectBox:focus{
    border: 1px solid var(--primaryColor) !important;
}

#guiderSelectBox:focus{
    border: 1px solid var(--primaryColor) !important;
}

#addGuiderSelectBox:focus{
    border: 1px solid var(--primaryColor) !important;
}

#addGuiderSelectBox:focus{
    border: 1px solid var(--primaryColor) !important; 
}

#dataTableSearch:focus{
    border: 1px solid var(--primaryColor) !important; 
}

.btnViewNotes{
    color:black !important;
    cursor: pointer;
    text-decoration: none !important;
}
.btnViewNotes:hover{
    color:var(--primaryColor) !important;
    text-decoration: none !important;
}

.btnViewNotes:focus{
    color:var(--primaryColor) !important;
    text-decoration: none !important;
}

.adminDownloadAttach{
    color:var(--primaryColor);
}

.adminDownloadAttach:hover{
    text-decoration: none;
}

.btnViewApplicant{
    color:var(--primaryColor) !important; 
    font-weight: bold;
    text-decoration: none !important;
}
.btnViewApplicant:hover{
   text-decoration: none !important;
}

#viewApplicantsDiv{
    font-size: 18px;
}

#noteSaved{
    font-weight: bold;
}
#noteSavedDiv{
    height:20px;
}

#bottomwNoteRow{
    height:30px;
}

.NoteSaveSuccess{
    color:#339933 !important;
}

.NoteSaveFail{
    color:#ff6666 !important;
}

.dateColumn{
    width:120px !important;
    text-align: center;
}

.DangerAnchor{
    color:var(--secondaryColor);
}
.DangerAnchor:hover{
    color:var(--secondaryColor);
}

.deleteNoteBtn{
    color:black !important;
    cursor: pointer;
    text-decoration: none !important;
}

.deleteNoteBtn:hover, .deleteNoteBtn:focus{
    color:#15d3b2 !important;
    text-decoration: none !important;
}

.noteModalBody{
    max-height: 600px;
    overflow:auto;
}

.u-check input[type="checkbox"]:checked + .u-check-icon-checkbox-v6 i{
    color: #fff;
    background-color:var(--primaryColor) !important;
    border-color:var(--primaryColor) !important;
}

#invCandidateLabel, #invLinkLabel{
    font-weight: bold;
}

#guiderSelectBox{
    border: 1px solid #ced4da !important;
    height:34px!important;
}
#addGuiderSelectBox{
    border: 1px solid #ced4da !important;
    height:34px!important;
    min-width:60%;
}

#guiderSelectBox:hover{
    color:var(--primaryColor) !important;
}

@media (max-width: 767px){
    [data-tabs-mobile-type="slide-up-down"], [data-tabs-mobile-type="accordion"] {
        display:flex !important;
    }
    .CE_tabLinkLabel{
        display:none !important;
    }
    .fitIconOuterDiv{
        display:none !important;
    }
    
    .topJobMatchHeader{
        font-size: 14px;
        font-weight: bold;
    }
}

@media (max-width: 575px){
    #spinnerDiv{
        text-align: center !important;
    }
}

@media (max-width: 575px){
    .assessBtnBreak{
        display:none;
    }
    .btn-assess-q{
        width:100%;
    }
    .assessBlock{
        padding-bottom:10px;
    }
    .qDivider{
        margin-right:0px !important;
    }
}

.btn-assess-q{
    white-space: normal;    /* Allow text wrapping in the .btn */
}

.activityFeedDiv{
    max-height: 400px;
    overflow: auto;
}
.colorGrayWarning{
    background-color:#d6d6d6 !important;
}

.darkGrayText{
    color:#646464 !important;
    font-weight: bold;
    top: 11px;
    position: relative;
}

#guiderSelectBox:focus{
     outline: 0;
}
#addGuiderSelectBox:focus{
    outline: 0;
}

.socialNotifItem:hover{
    cursor: pointer;
}

.noNotifWarning{
    text-align: center;
}

.questionModalText{
    font-weight: bolder;
}
.question-is-invalid{
    border-color:red;
}

.multiSelect.question-is-invalid{
    border-width: 1px;
    border-style: solid;
}

.btn-inactive{
    background-color:#d8d8d8;
    border-color:#d8d8d8;
    color:black;
}
.btn-inactive.active{
    background-color:var(--primaryColor) !important;
    border-color:var(--primaryColor) !important;
    color:#FFFFFF;
}
.datepickerAnswer{
    max-width:130px;
}

.fireJobIcon{
    float:right;
}

.CAP_Page_Link{
    color: var(--primaryColor) !important;
    text-decoration: none !important;
}

.CAP_Page_modalTab{
    color: var(--primaryColor) !important;
    text-decoration: none !important;
}

.CA_ReportViewBtn{
    text-decoration: none !important;
}

.emailToApplicantLink{
    text-decoration: none !important;
}

@media (max-width: 767px){
    #notificationsMenu{
        left:-58px !important;
    }
    .up_image_div{
        margin-top:50px !important;
    }
}

.u-side-nav--top-level-menu-link:focus{
    /*color: #286a6a !important;*/
    /*background-color: #25AD8D !important;*/
}
.u-side-nav--second-level-menu-link:focus{
    /*color: #286a6a !important;*/
    /*background-color: #25AD8D !important;*/
}

.u-side-nav--top-level-menu-link:focus i{
    /*color: #286a6a !important;*/
    /*background-color: #25AD8D !important;*/
}
.u-side-nav--second-level-menu-link:focus i{
    /*color: #286a6a !important;*/
    /*background-color: #25AD8D !important;*/
}

/* On mobile, hide sidenav so that it doesn't flicker accross the screen */
@media only screen and (max-width: 575px){
    #sideNav.pageLoading{
        display: none;
    }
}

#sideNav:not(.u-sidebar-navigation-v1--hidden) #sideNavMenu{
    position: fixed;
    top: 80px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: scroll;
    min-height: calc(100vh - 80px);
    -ms-overflow-style: none;   /*IE/Edge*/
}

/* Chrome, Safari, Opera */
#sideNavMenu::-webkit-scrollbar{
    display: none;
}

/*Overrride classes added on every page to give space to the (now hidden) mobile sidenav) 
* These classes should be removed from pages where seen, but this is a catch-all for those that don't have it removed.'
*/
.mainbody.g-ml-45.g-ml-0--lg{
    margin-left: 0px !important;
}

.btn-primary:focus{
    border: 2px outset var(--primaryColor);
}

.btn-secondary:focus{
    border: 2px outset var(--secondaryColor);
}

.btn-tertiary:focus{
    border: 2px outset var(--tertiaryColor);
}

.btn-quaternary:focus{
    border: 2px outset var(--quaternaryColor);
}

.ffj-color-primary:focus{
    color: var(--primaryColor) !important;
}

.btn-default:focus{
    border: 2px outset var(--tertiaryColor);
}

input:focus{
    border: 2px solid var(--primaryColor);
}
.hs-admin-align-left:focus{
    color:var(--primaryColor);
}

.hs-admin-angle-down{
     color:var(--primaryColor);
}

.navbar-brand {
    padding: 0 15px !important;
    height:45px !important;
}

/*.topJobMatch:focus{
    color:var(--tertiaryColor) !important;
    background-color:#e2bded; 
}*/

.jobAccordionDiv:focus-within{
    /*background-color:#d4c4ed;*/ 
}

/*.topJobMatch:focus .topJobMatchSelected{
    color:white !important;
}*/

.topLeftLogo:focus{
    border:1px solid var(--primaryColor);
}

.sideMenuToggler:focus i{
    color:var(--primaryColor) !important;
    opacity:5 !important;
}

.sideMenuTogglerAdmin {
    color:#fff !important;
    opacity:5 !important;
}

#profileMenuInvoker:focus{
    color:var(--tertiaryColor);
}

.topRightMenuItem:focus{
    color:var(--primaryColor) !important;
}

.checkListItem:focus{
    background-color:#d4c4ed;
}

.dashTopJobHeader:focus-within{
    background-color:#d4c4ed !important;
}

.u-check-icon-radio-v8:focus-within{
    background-color:#c9e6fc !important;
}

.interestAccordHead:focus-within{
    border:1px solid var(--tertiaryColor);
}

.interestRadio{
    /*display:inline !important;*/
/*    opacity: 0;*/
}

.interestBtnAnchors:focus-within{
    border: 1px solid var(--tertiaryColor);
}

.leaveAssocAnchor{
    color:black !important;
}
.leaveAssocBtn:focus-within{
    border:1px solid black;
}
.interestInfoAccordion:focus{
    border:1px solid var(--primaryColor) !important;
}

.traitTags:focus{
    transform: scale(1.2, 1.2);
}

.careerReportBtnAssess:focus{
    border: 2px outset var(--tertiaryColor) !important;
}

.skillsBtns{
    display:inline !important;
    opacity: 0;
}

.skillsBtns:focus + .skillRadioInner{
    background-color:#d1e8ff !important;
}

.btnViewApplicant:focus{
    color:var(--tertiaryColor) !important;
}

.CAP_Page_modalTab:focus{
  color:  var(--tertiaryColor) !important;
}

#notificationsInvoker:focus{
     transform: scale(1.2, 1.2);
}
/*
.dismissNotif:focus{
    color:#15d3b2 !important;
}*/

.socialNotifItem:focus-within{
    border: 1px solid #15d3b2 !important;
}

.CAP_Page_Link:hover{
    color: var(--tertiaryColor) !important;
}

.CAP_Page_Link:focus{
    color: var(--tertiaryColor) !important;
}

.loginLogo{
  height:100% !important;  
}

.nav-link-login{
    padding-left:5px !important;
    padding-right:5px !important;
}
.nav-link-login:focus{
    background-color:#d8e2ff !important;
    border-radius: 7px !important;
}

.sub-nav-link-login:focus{
    background-color:#d8e2ff !important;
    border-radius: 7px !important;
}

.ui-slider-range{
    opacity: 0 !important;
}

.ui-slider-handle{
    border-color:var(--primaryColor) !important;
}

#topJobsLoadingMessage,#favoriteLoadingMessage,#dismissedLoadingMessage{
    position: relative;
    bottom: 7px;
}

/*#topJobHeaderDismissedJobs{
    position: relative;
    bottom: 7px;
}

#favoritesHeaderProfileExplorer{
    position: relative;
    bottom: 7px;
}*/

.ui-slider-handle{
    width:20px !important;
    height:20px !important;
    background-color: var(--primaryColor) !important;
}
#profileMenu{
    width: 100% !important;
    min-width:150px !important;
}

#searchJobSpinnerMessage{
    bottom: 5px;
    position: relative;
    padding-left:3px;
}

.termsConditionsPage{
    margin-left:70px;
    margin-right:70px;
    background-color:red;
}

.logo-print-ffj{
    margin-top:5px;
    height:35px;
    width:130px;
}

.printAllJobs{
    margin-top:5px;
    text-decoration: none;
    color: var(--primaryColor) !important;
    font-size: 20px;
}
.printAllJobs:hover{
    text-decoration: none;
}
.printAllText{
    font-size:15px !important;
}

.printAllIcon{
    margin-top:5px;
    margin-left:5px;
}

#printAllTopJobsProgress{
   width:25%; 
   float:right;  
}

.cancelBtn{
    background-color: #999999 !important;
    border-color: #999999 !important;
}

#InviteMultiCandidateEmail{
    width:100%;
}

.accordion-contents{ 
    padding-left:0px;
    padding-right:0px;
    
    animation: fadein 2s;
    -moz-animation: fadein 2s;
    /* Firefox */
    -webkit-animation: fadein 2s;
    /* Safari and Chrome */
    -o-animation: fadein 2s;
    /* Opera */
}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein {
    /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein {
    /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein {
    /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}
.skillRowDiv{
    padding-bottom:5px;
    border-bottom: 1.5px solid #bad4ff;
}

.ce_occupational_search_div{
    max-height: 400px;
    overflow: auto;
}

.ui-slider-handle:focus{
    border: 2px solid var(--tertiaryColor) !important;
}

.salaryRangeLabel{
    font-weight:600;
}

#logo_nav_outer img{
    max-width:150px;
    vertical-align: middle;
}

#custom_logo_nav_outer img{
    max-width:220px;
    vertical-align: middle;
}

.error-text{
    color:red !important;
}

.incomplete_reasoning{
    border: 1px solid red !important;
    border-radius: 15px !important;
}

.jobSearchBorder{
    border: 1px solid gray;
}

.btn-applicant-email{
    font-weight: bold;
}

.btn-applicant-email:hover{
   text-decoration: none !important; 
}

.inviteTableRow{
   height: 62px !important;
}

#declineDiv{
    padding-top:20px;
    padding-bottom:20px;
    background-color:#FFFFFF !important;
}

.mainDCCCDImage{
    width:50% !important;
    max-width:100%;
    padding-left:15px;
    padding-right:15px;
}
.subDCCCDImage{
    width:50%;
    max-width: 280px !important;
    padding-left:15px;
    padding-right:15px;
}

#dcccdLogoDiv{
    background: url('../../dcccd/img/DCCCD-Signup-background-Image1.jpg') no-repeat 100%;
    padding-right:0px !important;
}

.halfJobBackground{
    background: url('../../dcccd/img/DCCCD-Signup-background-Image1.jpg') no-repeat 100% fixed;
    padding-right:0px !important;
}

#upLogoDiv{
    background: url('../../dcccd/img/DCCCD-Signup-background-Image1.jpg') no-repeat ;
    padding-right:0px !important;
}

.bold_text{
    font-weight:bold !important;
}

.h2replace{
    font-family: 'Libre Franklin', sans-serif;
    font-weight: 300;
    font-size: 24px;
}

.assessmentTraitInfoHeader{
    
}

.dateLabel{
    font-size: 12px !important;
    display:block !important;
}
@media (max-width: 768px){
    .up_image_div{
        margin-top:0px !important;
    }
}

.goalSetHeader{
    font-family: "Libre Franklin", sans-serif;
    font-weight: bold;
    font-size: 20px;
}
.headerTextClone{
    font-size:24px !important; 
    font-family: 'Libre Franklin', sans-serif; 
    font-weight: 300; 
}

.btn-navbar-settings{
    background-color:#fff !important;
}

.btn-navbar-settings.active{
    background-color:var(--primaryColor) !important;
    color: #fff !important;
}

.testertester123:hover{
    background-color:var(--primaryColor) !important;
}
.proSumAnchor{
    background-color:var(--primaryColor) !important;
   border:0px transparent !important;
}
.proSumAnchor:hover{
   background-color:var(--primaryColor) !important;
   border:0px transparent !important;
   cursor: pointer;
}

/*#actionsSubmenu{
    margin-left:0px !important;
    padding-left:0px !important
}*/
/*.u-side-nav--second-level-menu-item:hover{
    background-color:#25AD8D !important;
}*/


.sideMenuItem:hover{
     font-weight: bold !important;
}

.sideMenuItem:focus{
     font-weight: bold !important;
}

.outerBar{
    background-color:#fff !important;
}

.rangeBarGray{
    background-color:#e0e0e0 !important;
}

.trait-bar{
    
}

.traitNameSpan{
    position:relative;
    top:22px;
    font-size:12px;
    font-weight: bold;
}

.triangle-down {
	position:relative;
        width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 10px solid #f54254;
}

.traitDescDiv{
    font-size: small;
}

@media (max-width: 767px){
    .traitNameLow{
        float:left !important;
        position: relative;
        top:55px;
    }
    .traitNameHigh{
        float:right !important;
        top:-2px !important;  
    }
    .lowTraitDiv{
        height:0px;
    }
    .traitNameHighMulti{
        position: relative;
        top:5px;
    }
}

#infoBtn{
    color:#949391;
}

#infoBtn:hover, #infoBtn:focus{
    color:var(--tertiaryColor) !important;
}

.infoBtnSelected{
    color:var(--tertiaryColor) !important;
}

.idealJobRangeText{
    position: relative;
    font-size:10px;
}

.rangeText{
    margin-left:3px;
}
.appTraitScoreText{
    position:relative;
    font-size:11px;
    font-weight: bold;
}

.CE_tabLinkLabel{
    position: relative;
    top:2px;
}
@media (max-width: 469px){
    .genInfoDiv{
        
        width:100%;
    }
    #generateResumeBtn{
        margin-bottom:15px;
        width:100%;
    }
}


.profileDescriptionSm{
    display:none;
}
.actionBarSm{
    display:none;
}

.traitNameHigh{
    text-align: right;
}

@media (max-width: 991px){
    .profileDescriptionSm{
        display:block !important;
    }
    .profileDescriptionLg{
        display:none !important;
    }
    .actionBarSm{
        display:block;
    }
    .actionBarLg{
        display:none;
    }
}

@media (max-width: 416px){
    .rangeText{
        display:none;
    }
    .traitNameHigh{
        position: relative;
        top:-2px !important;  ; 
    }
    .traitNameLow{
        position: relative;
        top:55px;
    }
    .traitNameSpan{
        font-size:10px !important;
    }
}


@media (max-width: 495px){
    #AddEducation{
        width:100%;
        margin-left:0px !important;
        
    }
    #AddWorkExperience{
        width:100%;
        margin-left:0px !important;
        
    }
    
}
@media (max-width: 991px){
    .mainbody{
        /*margin-right:35px;*/
        padding-right: 35px !important;
    }  
}

@media (max-width: 576px){
    .mainbody{
        padding-right: 0px !important;
    }  
}
@media (max-width: 505px){
    .profile-nav-item{
        width:100%;
    }  
    .btn-navbar-settings{
        width:100%;
    }
}

.mainContent{
    background-color:#FFF;
}

.top-rh-menu-item:hover{
    color: #00ffb7 !important;
}

.showDetailsSpan{
    font-size: 12px !important;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    position: relative;
    top:10px;
}

@media (max-width: 768px){
    .showDetailsSpan{
        top:2px;
    }
}



@media (max-width: 706px){
   .assess-top-div-right{
       width:100% !important;
    
    }
}

.datePickIconDiv{
    cursor: pointer !important;
}

.lang-dropdown{
    background-color:#FFF;
    color:var(--primaryColor);
    border: 1px solid var(--primaryColor);
    padding-top:2px;
    padding-bottom:2px;
    padding-left:5px;
    padding-right:5px;
}

.lang-dropdown:hover{
    background-color:var(--primaryColor);
    color:#FFF;
    border: 1px solid var(--primaryColor);
}

.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle {
    background-color:var(--primaryColor);
    color:#FFF;
    border: 1px solid var(--primaryColor);
}

.dropdown-menu{
    top:-5px;
    color:var(--primaryColor) !important;
    left: 39px;
    border: 1px solid var(--primaryColor) !important;
    background-color: #FFF !important;
}
.drop-lang-item{
   color:var(--primaryColor) !important; 
}

@media (max-width: 991px){
   .dropdown-menu{  
        left: 0px;
    }
}

.dallasLogoDiv{
    margin-top:30%;
    display:none;
}

@media (max-width: 776px){
    .dallasLogoDiv{
        padding-top:20px;
        padding-bottom:30px;
        margin-top:5%;
        margin-bottom:5%;
        display:inline;
    }
    .dcccdNavTopIcon{
        display:none !important;
    }
    .dcccdJobLogoTop{
        position:relative;
        float:right;
    }
    #dcccdLogoDiv{
        background:none;
    }
}

.subDCCCDImage {
    margin-bottom:10px;
}



.dcccdNavTopIcon{
    width:50%;
    max-width: 200px !important;
    display:block;
}

.autoMotiveImage{
    margin-top:20%;
}
@media (max-width: 767px){
   .autoMotiveImage{
       margin-top:0%;
    }
}

.formSpinner > .fa-gear {
    font-size: 25px;
}

.formSpinner > .spinnerText {
    position: relative;
    bottom: 4px;
    margin-left: 2px;
}

div.alert > a{    /* Dark blue; Overrides Other CSS that makes links green */
    color: #0063cd;
}
input[type="checkbox"]:checked + .g-bg-primary--checked, input[type="radio"]:checked + .g-bg-primary--checked, input[type="checkbox"]:checked + * .g-bg-primary--checked, input[type="radio"]:checked + * .g-bg-primary--checked {
    background-color: var(--primaryColor) !important;
}

#talent-progress span.complete{
    /* Dark green */
    background-color: var(--primaryColor) !important;
}

#talent-progress span.g-bg-primary--before::before{
    background-color: var(--primaryColor) !important;
}

#talent-progress span.g-bg-primary--before.active::before{
    background-color: var(--job-purple) !important;
}

#talent-progress span.active{
    /* Light green */
    background-color: var(--job-purple) !important;
}

.trait-color-1{
    color:var(--quaternaryColor) !important;
}

.trait-color-2{
    color:var(--secondaryColor) !important;
}

.trait-color-3{
    color:var(--tertiaryColor) !important;
}

.trait-color-4{
    color:var(--primaryColor) !important;
}

.trait-color-5{
    color:#002b75 !important;
}

.interest-color-1{
    color: var(--tertiaryColor) !important;
}

.interest-color-2{
    color: #B59BCC !important;
}

.interest-bg-color-1{
    background-color: var(--tertiaryColor) !important;
}

.interest-bg-color-2{
    background-color: #B59BCC !important;
}

.summary-color-1{
    color:var(--primaryColor) !important;
}

.summary-color-2{
    color:var(--tertiaryColor) !important;
}

.summary-color-3{
    color:var(--secondaryColor) !important;
}

#totalQuestionsBar{
    background-color: var(--primaryColor); 
}

#totalQuestionsBarText{
    background-color: var(--primaryColor); 
}

.CE_TabLinks:focus{
    color:#FFF !important;
}
/* #65419d #2bc09d*/
.loadersvg {
 width: 3.25em;
 transform-origin: center;
 animation: rotate4 2s linear infinite;
}

.loadcirc {
 fill: none;
 stroke: hsl(166, 63%, 46%);
 stroke-width: 4;
 stroke-dasharray: 1, 200;
 stroke-dashoffset: 0;
 stroke-linecap: round;
 animation: dash4 2s ease-in-out infinite;
}

@keyframes rotate4 {
 100% {
  transform: rotate(360deg);
 }
}

@keyframes dash4 {
 0% {
  stroke-dasharray: 1, 200;
  stroke-dashoffset: 0;
 }

 50% {
  stroke-dasharray: 90, 200;
  stroke-dashoffset: -35px;
 }

 100% {
  stroke-dashoffset: -125px;
 }
}

.appLoaderText{
    font-size:16px;
    font-weight: bold;
    margin-bottom:10px;
}

.cinput-group {
    position: relative;
}

.cinput {
    border: solid 1.5px #9e9e9e;
    border-radius: 1rem;
    background: none;
    padding: 0.5rem;
    font-size: 1rem;
    color: #333;
    transition: border 150ms cubic-bezier(0.4,0,0.2,1);
}

.cuser-label {
    position: absolute;
    left: 15px;
    bottom:15px;
    color: #474747;
    pointer-events: none;
    transform: translateY(1rem);
    transition: 150ms cubic-bezier(0.4,0,0.2,1);
    font-weight: normal !important;
}

.cinput:focus, .cinput:valid, .cinput.r-only{
    outline: none;
    border: 1.5px solid var(--primaryColor);
    padding-left:20px;
}

.cinput:focus ~ label, .cinput:valid ~ label, .cinput.r-only ~ label, .cselect:valid ~ label{
    transform: translateY(-50%) scale(0.9);
    background-color: #FFF;
    padding: 0 .2em;
    color: var(--primaryColor);
    bottom:9px;
}

.cinput:focus ~ label, .cinput:active ~ label{
    font-weight:bold !important;
}

.jobButton {
  cursor: pointer;
  font-weight: 700;
  font-family: 'Libre Franklin', sans-serif;;
  transition: all .2s;
  padding: 5px 15px;
  border-radius: 100px;
  border: 1px solid #9e9e9e;
  background-color:var(--primaryColor);
  display: inline-flex;
  align-items: center;
  color:#FFF;
  font-size: 15px;
}

.jobButton:hover {
  background-color: #2bc09d;
  color:#FFF;
}

.jobButton > svg {
  width: 28px;
  margin-left: 10px;
  transition: transform .3s ease-in-out;
}

.jobButton:hover svg {
  transform: translateX(5px);
}

.jobButton:active {
  transform: scale(0.95);
}

.jobButton:hover .btncirc {
  color:#FFF !important;
}

.r-only{
    background-color:#e9ecef;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;       
}

.cselect{
    padding-right:20px;
}

#container {
	max-width: 300px;
	margin: 0 auto;
}

.highcharts-figure, .highcharts-data-table table {
	min-width: 380px;    
	max-width: 600px;
    margin: 0 auto;
}

.highcharts-data-table table {
    font-family: Verdana, sans-serif;
    border-collapse: collapse;
    border: 1px solid #EBEBEB;
    margin: 10px auto;
    text-align: center;
    width: 100%;
    max-width: 500px;
}
.highcharts-data-table caption {
    padding: 1em 0;
    font-size: 1.2em;
    color: #555;
}
.highcharts-data-table th {
	font-weight: 600;
    padding: 0.5em;
}
.highcharts-data-table td, .highcharts-data-table th, .highcharts-data-table caption {
    padding: 0.5em;
}
.highcharts-data-table thead tr, .highcharts-data-table tr:nth-child(even) {
    background: #f8f8f8;
}
.highcharts-data-table tr:hover {
    background: #f1f7ff;
}

.highcharts-figure, .highcharts-data-table table {
    min-width: 100% !important;
    min-height: 100% !important;
}

.highcharts-credits{
    display:none !important;;
}