:root {

    --primary-lighter:    #57ADC2;
    --primary-light:      #05BCE7;
    --primary:            #00718E;;  /* Main Primary color */
    --primary-dark:       #00404F;
    --primary-darker:     #00080A;
    
    --primary-text:       #f5ffff;
    --primary-darker-text: #f5ffff;
    
    --secondary-text:     #FAFFFF;
    --secondary-lighter:  #688F8B;
    --secondary-light:    #2F726B;
    --secondary:          #005950;  /* Main Secondary color (1) */
    --secondary-dark:     #00332E;
    --secondary-darker:   #000404;
    
    --third-lighter:      #FFD36F;
    --third-light:        #FFB100;
    --third:              #E59F00;  /* Main Secondary color (2) */
    --third-dark:         #805900;
    --third-darker:       #100B00;
    
    --third-text:           #fffdfd;
    --third-dark-text:      #fffdfd;
    
    --complement-lighter: #FFB66F;
    --complement-light:   #FF7F00;
    --complement:         #E57200;  /* Main Complement color */
    --complement-dark:    #804000;
    --complement-darker:  #100800;
    
    --background:         #f1f1f1;
    --complement-text:      #000000;   
    
    --gray-light:           #C0C0C2;
    --gray:                 #A0A0A2;
    --gray-dark:            #707373;
    --gray-darker:          #505052;

}

body {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important;
}

.btn-odr {
  background-color: var(--primary);
}

.btn-default {
    background-color: var(--primary-light) !important;    
    color: var(--primary-text) !important;    
}

.btn-warning {
  background-color: var(--secondary);
  border-color: var(--secondary-dark);
}
.btn-warning:hover {
  background-color: var(--secondary-dark);
  border-color: var(--secondary-darker);
}


table.dataTable thead .sorting_asc {
  background: var(--secondary-dark);
}
.dataTable_wrapper thead {
  background-color: var(-gray);
}

.heading::after {
  background-color: var(--primary);
}

.logo img {
    height: 4.5em !important;
}

.primary-box {
  color: var(--primary-text);
  background-color: var(--primary);
}
.primary-box .has-error .help-block,
.primary-box .has-error .control-label,
.primary-box .has-error .radio,
.primary-box .has-error .checkbox,
.primary-box .has-error .radio-inline,
.primary-box .has-error .checkbox-inline,
.primary-box .has-error.radio label,
.primary-box .has-error.checkbox label,
.primary-box .has-error.radio-inline label,
.primary-box .has-error.checkbox-inline label {
  color: var(--secondary-dark);
}

.secondary-box {
  color: var(--secondary-text);
  background-color: var(--secondary);
}
.secondary-box .icon-container .fa {
  color: white;
}
.secondary-box h1,
.secondary-box h2,
.secondary-box h3,
.secondary-box h4,
.secondary-box h5 {
  color: white;
}
.secondary-box .icon-container {
  border: 1px solid white;
}
h1 h3 .secondary-box .icon-container .fa {
  color: white;
}

span.icon-container {
  border: 1px solid var(--primary);
  color: var(--primary);
}

.blue-section {
  background-color: var(--primary);
}

.navbar {
  background-color: var(--primary);
}
.navbar-inverse {
    border-color: var(--primary-darker) !important;
}
.navbar-default {
  background-color: var(--gray);
}
.navbar .side-nav li a:hover,
.navbar .side-nav li a:focus,
.navbar .side-nav li a:active,
.navbar .side-nav li a.active {
  background-color: var(--secondary) !important;
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
  background-color: var(--gray);
}

.form-steps > ul > li.active > .status-number {
  background-color: var(--primary);
}
.form-steps > ul > li > .status-number {
  border: 4px solid var(--primary);
  color: var(--primary);
}
.form-steps > ul > li > .status-number > span {
  color: var(--primary);
}
.form-steps > ul > li.separator {
  border-bottom: 4px solid var(--primary);
}

.case-validation-errors a.active {
  color: var(--secondary);
}

.notifications a.active {
  color: var(--third);
}

.light-blue {
  background: var(--secondary-lighter) !important;
}


