:root {
/* Go to main/colour_test to see a colour panel */
/* Colours: */

/* --skin-main-nav-colour: #e4051f; */
--skin-main-nav-colour: #01a0e1;
/* --skin-active-nav-colour: #EB5259; */
--skin-active-nav-colour: #49b9e6;
/* --skin-body-background: #3e3f3a; */
--skin-body-background: #3e3f3a;
/* --skin-active-pagination: #737470; */
--skin-active-pagination: #737470;
/* --skin-misc-text-colour: #EB5259; */
--skin-misc-text-colour: #34a0ca;
/* --skin-pack-selection-buttons-active: #e31b25; */
--skin-pack-selection-buttons-active: #006a94;

/* --skin-primary-btn: #E31B23; */
--skin-primary-btn: #0179a8;
/* --skin-primary-btn-low: #831015; */
--skin-primary-btn-low: #005d81;
/* --skin-primary-btn-high: #bd151e; */
--skin-primary-btn-high: #1e97c7;

/* --skin-success-btn: #00A88E; */
--skin-success-btn: #00A88E;
/* --skin-success-btn-low: #006F5E; */
--skin-success-btn-low: #006F5E;
/* --skin-success-btn-high: #00C1A5; */
--skin-success-btn-high: #00C1A5;

/* --skin-info-btn: #868B8E; */
--skin-info-btn: #868B8E;
/* --skin-info-btn-low: var(--skin-info-btn); */
--skin-info-btn-low: var(--skin-info-btn);
/* --skin-info-btn-high: #D3D5D6; */
--skin-info-btn-high: #D3D5D6;
 
/* --skin-danger-btn: #FCD700; */
--skin-danger-btn: #FCD700;
/* --skin-danger-btn-low: #F0CC00; */
--skin-danger-btn-low: #F0CC00;
/* --skin-danger-btn-high: #FFE02F; */
--skin-danger-btn-high: #FFE02F;
}

body {
  background-color: var(--skin-body-background);
}
a:focus {
  color: #666666;
}

/* Login Colours */

#the_form {
-webkit-box-shadow: 0px 7px 8px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 7px 8px 0px rgba(0,0,0,0.75);
box-shadow: 0px 7px 8px 0px rgba(0,0,0,0.75);
background-color: #FFFFFF;
}

#the_form h1 {
    background: var(--skin-main-nav-colour);
}

#the_form h1:before,
#the_form h1:after {
    border-color:transparent var(--skin-primary-btn-low);
}


/* Card Approval */

.card_approval_tabs {
  background-color: var(--skin-main-nav-colour) !important;
  color: white !important; 
  border-color: var(--skin-main-nav-colour) !important;
  font-weight: normal;
}

/* Any badges knocking around */

.nav_badge {
    background-color: var(--skin-main-nav-colour);
    bottom: 2px;
    color: white;
    display: none;
    font-size: 11px;
    left: 2px;
    padding-bottom: 2px;
    padding-top: 2px;
    position: relative;
}

.card_approval_badge {
    background-color: var(--skin-main-nav-colour);
    color: white;
}

/* Top of Archive */

.archive_heading {
  background-color: var(--skin-body-background) !important;
  cursor: pointer;
}

.archive_heading .panel-title{
  color: white;
}

.archive_heading_body {
  background-color: #f8f8f8 !important;
}

/* Dashboard Panels */
.hero-widget { background-color: #EFE8DC;}
.hero-widget label { color: #67665A;}
.hero-widget:hover {
  background-color: var(--skin-main-nav-colour);
  color: white;
}

/* Pagination */

.pagination > li > a, .pagination > li > span {
  background-color: var(--skin-body-background);
  color: white;
  text-transform: capitalize;
  border-color: #31322E;
}

.pagination > .active > a, 
.pagination > .active > span, 
.pagination > .active > a:hover, 
.pagination > .active > span:hover, 
.pagination > .active > a:focus, 
.pagination > .active > span:focus {
  background-color: var(--skin-active-pagination);
  border-color: var(--skin-active-pagination);
  color: white;
}

.pagination > li > a:hover, 
.pagination > li > span:hover, 
.pagination > li > a:focus, 
.pagination > li > span:focus {
    background-color: var(--skin-active-pagination);
    border-color: var(--skin-active-pagination);
    color: white;
}

/* Page headers on Relations */
.page_breaker {
  background-color: var(--skin-main-nav-colour);
  color: white;
}

.edit_member_option:hover {
  background-color: var(--skin-main-nav-colour);
  color: white;
}

.misc_colour_text {
	color: var(--skin-misc-text-colour);
}

.misc_color_item {
	background-color: var(--skin-misc-text-colour);
}

/* filter button colours on active */

.bizmoduleselect label.btn-default.active{ background-color:var(--skin-pack-selection-buttons-active); color:#FFF; }

/* navbar */

.navbar-default {
    background-color: var(--skin-main-nav-colour);
    border-color: var(--skin-main-nav-colour);
}

.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border-color: var(--skin-main-nav-colour);
}

.navbar-default .navbar-nav > li > a {
    color: white;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
  background-color: var(--skin-active-nav-colour);
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
  background-color: var(--skin-active-nav-colour);
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #ffffff;
}

/* footer */

#footer {
  background-color: var(--skin-main-nav-colour);
  color: white;
 }

#footer a {
  color: white;
}

/* buttons*/

.bg-primary { background-color: var(--skin-primary-btn); }
.btn-primary {  background-color: var(--skin-primary-btn); }
.btn-primary:hover { background-color: var(--skin-primary-btn-high); }
.btn-primary:focus { background-color: var(--skin-primary-btn-low); }

.btn-primary:active:hover, .btn-primary.active:hover, .open > .dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, 
.btn-primary.active:focus, .open > .dropdown-toggle.btn-primary:focus, .btn-primary.focus:active, .btn-primary.active.focus, 
.open > .dropdown-toggle.btn-primary.focus {
  background-color: var(--skin-primary-btn-low);
}

.btn-success { background-color: var(--skin-success-btn); }
.btn-success:hover { background-color: var(--skin-success-btn-high); }
.btn-success:focus { background-color: var(--skin-success-btn-low); }

.btn-success.disabled, 
.btn-success[disabled], 
fieldset[disabled] .btn-success, 
.btn-success.disabled:hover, 
.btn-success[disabled]:hover, 
fieldset[disabled] .btn-success:hover, 
.btn-success.disabled:focus, 
.btn-success[disabled]:focus, 
fieldset[disabled] .btn-success:focus, 
.btn-success.disabled.focus, 
.btn-success.focus[disabled], 
fieldset[disabled] .btn-success.focus, 
.btn-success.disabled:active, 
.btn-success[disabled]:active, 
fieldset[disabled] .btn-success:active, 
.btn-success.disabled.active, 
.btn-success.active[disabled], 
fieldset[disabled] .btn-success.active {
  background-color: var(--skin-success-btn-low); 
}

.btn-success:active:hover, .btn-success.active:hover, .open > .dropdown-toggle.btn-success:hover, .btn-success:active:focus, 
.btn-success.active:focus, .open > .dropdown-toggle.btn-success:focus, .btn-success.focus:active, .btn-success.active.focus, 
.open > .dropdown-toggle.btn-success.focus {
  background-color: var(--skin-success-btn-low); 
}

.btn-info { background-color: var(--skin-info-btn); }
.btn-info:hover { background-color: var(--skin-info-btn-high); }
.btn-info:focus { background-color: var(--skin-info-btn); }

.btn-info:active:hover, .btn-info.active:hover, .open > .dropdown-toggle.btn-info:hover, .btn-info:active:focus, 
.btn-info.active:focus, .open > .dropdown-toggle.btn-info:focus, .btn-info.focus:active, .btn-info.active.focus, 
.open > .dropdown-toggle.btn-info.focus {
  background-color: var(--skin-info-btn); 
}

.btn-danger { background-color: var(--skin-danger-btn); color: #333333;}
.btn-danger:hover { background-color: var(--skin-danger-btn-high); color: #333333; }
.btn-danger:focus { background-color: var(--skin-danger-btn-low); color: #333333; }

.btn-danger:active:hover, .btn-danger.active:hover, .open > .dropdown-toggle.btn-danger:hover, .btn-danger:active:focus, 
.btn-danger.active:focus, .open > .dropdown-toggle.btn-danger:focus, .btn-danger.focus:active, .btn-danger.active.focus, 
.open > .dropdown-toggle.btn-danger.focus {
  background-color: var(--skin-danger-btn-low); color: #333333;
}

/* panels */

.panel-primary { border-color: var(--skin-primary-btn); }
.panel-primary > .panel-heading {
    background-color: var(--skin-primary-btn);
    border-color: var(--skin-primary-btn);
    color: #ffffff;
}

.panel-success { border-color: var(--skin-success-btn); }
.panel-success > .panel-heading {
    background-color: var(--skin-success-btn);
    border-color: var(--skin-success-btn);
    color: #ffffff;
}


.panel-info { border-color: var(--skin-info-btn); }
.panel-info > .panel-heading {
    background-color: var(--skin-info-btn);
    border-color: var(--skin-info-btn);
    color: #ffffff;
}

.panel-danger { border-color: var(--skin-danger-btn); }
.panel-danger > .panel-heading {
    background-color: var(--skin-danger-btn);
    border-color: var(--skin-danger-btn);
    color: #333333;
}


/* alerts */
.alert-info {
  background-color: var(--skin-info-btn);
  padding-top: 6px;
  padding-bottom: 6px;
  font-weight: normal;
}

.alert .alert-link {
  font-weight: normal;
}

.alert-success {
  background-color: var(--skin-success-btn);
  padding-top: 6px;
  padding-bottom: 6px;
  font-weight: normal;
}

.alert-danger {
  background-color: var(--skin-danger-btn); 
  color: #333333;
  padding-top: 6px;
  padding-bottom: 6px;
  font-weight: normal;
}

.alert-warning {
  padding-top: 6px;
  padding-bottom: 6px;
  font-weight: normal;
}

.alert-danger a {
  color: #333333 !important;
}

/* Divs that give the JS their colours */

#default_nav_colour {
	background-color: var(--skin-primary-btn);
}

#highlighted_nav_colour {
	background-color: var(--skin-active-nav-colour);
}

#dashboard_boxes_colour {
	background-color: #67665A;
}

#dashboard_text_colour {
	background-color: #FFFFFF;
}

#html_background_colour {
	background-color: var(--skin-body-background);
}

/* misc */

.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {
  background-color: var(--skin-primary-btn) !important;
}

#map_background_colour {
	background-color: var(--skin-body-background);
}

#map_top_gradient_colour {
	background-color: var(--skin-active-nav-colour);
}

#map_bottom_gradient_colour {
	background-color: var(--skin-main-nav-colour);
}

.an_icon {
  color: var(--skin-main-nav-colour);
}

.template_selected {
  background-color: var(--skin-primary-btn);
}

.multiselect-container > li > a > label.radio, .multiselect-container > li > a > label.checkbox {
    color: #444444;
}

.nav-tabs > li > a {
    color: #444444;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: #444444;
}

.function_glyphs {
  color: var(--skin-main-nav-colour);
  font-size: 18px;
  margin-left: 3px;
}

.function_glyphs:hover {
  color: var(--skin-main-nav-colour);
  font-size: 18px;
  margin-left: 3px;
}

.function_labels_downloaded {
  color: var(--skin-success-btn);
}

.function_letters_downloaded {
    color: var(--skin-success-btn);
}

.move_box:hover {
	background-color: #cccccc;
  cursor: pointer;
}

.check_highlighted {
  background-color: #cccccc;
}

.pt_bar {
  background-color: var(--skin-body-background) !important; 
}

.pt_bar_red {
    background-color: #ff2c2c !important;
}

.pt_bar:hover {
  background-color: #54554F !important; 
}
