/*#014694*/
/*#0098d7*/

* { border: 0px; }
html { position: absolute; height: 100%; width: 100%; }
body { font-family: 'Noto Sans', sans-serif; position: absolute; height: 100%; width: 100%; display: block; }
.container-fluid { padding-right: 0; padding-left: 0; margin-right: 3%; margin-left: 3%; }
.footer { position: fixed; bottom: 0; width: 100%; background-color: #014694; color: whitesmoke; padding-top: 8px; text-align: center; z-index: 1; line-height: 8px; }
.footer .container-fluid p a, a.mbk-page { color: whitesmoke; }
.footer .container-fluid p a:active, 
.footer .container-fluid p a:focus, 
.footer .container-fluid p a:hover { color: whitesmoke; text-decoration: underline; }

a { color: #014694; }
a:hover, a:active, a:focus { color: #014694; }

.calculated-height { height: -moz-calc(100vh - 79px); height: -webkit-calc(100vh - 79px); height: calc(100vh - 79px); margin: 0px; }

@media(max-width:767px) { 
    .footer { padding-top: 5px; } 
    .calculated-height { height: -moz-calc(100vh - 79px); height: -webkit-calc(100vh - 79px); height: calc(100vh - 79px); } 
}

p.no-pad { padding: 0px; margin: 0px; }
p.c { text-align: center; }

.centered { text-align: center; vertical-align: middle; margin-top: 25vh; }

.figure { margin-top: 15%; display: table; }
.figure img { width: 100%; height: auto; vertical-align: top; margin-bottom: 3px; border:2px black solid; margin-top:10px; }
.figure .caption { display: table-caption; caption-side: bottom; background: #e3e3e3; box-sizing: border-box; padding: 10px; margin: 0; text-align: center; }

/* Navbar styling */
.navbar { background-color: #014694; color: whitesmoke; border-color: rgba(255, 255, 255, 0); border-width: 0px 0px 0px 0px; }
.navbar { padding: 0px; margin: 0px; border-radius: 0px; z-index: 10000; border-width: 0px 0px 3px 0px; border-style: solid; }
.navbar .container-fluid { padding-left: 0px; padding-right: 0px; margin-left: 30px; }
.navbar .container-fluid .navbar-header button.navbar-toggle { text-align: center; vertical-align: middle; float: left; margin-right: 0px; border: none; }
.navbar .container-fluid .navbar-header a.navbar-brand { font-size: 1.7em; text-shadow: 0px 0px 0px; }
.navbar .container-fluid .navbar-header a.navbar-brand img { display: inline; height: 18px; transform: translate(0px, -2px); margin-right: 5px; }

.navbar .container-fluid .navbar-header button.navbar-toggle { margin:5px 0 0 0; float: right; text-align: right; }
.navbar .container-fluid .navbar-header button span { font-size: 1.2em; }

.navbar a { font-size: 1.2em; text-shadow: 0px 0px 0px; text-decoration: none; color: whitesmoke; }

.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a.prime { color: #0098d7; }
.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a.prime.submenu { color: whitesmoke; }

.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a:active,
.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a:focus, 
.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a:hover, 
.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a.prime:active,
.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a.prime:focus, 
.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a.prime:hover { background-color: whitesmoke; color: #014694; }

.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav>li.open,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav>li.open:active,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav>li.open:focus,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav li ul li a.dropdown-toggle[aria-expanded=true],
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav li ul li a:active,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav li ul li a:focus,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav li ul li a:hover,
.navbar .container-fluid .navbar-header a.navbar-brand:hover { text-decoration: bold; text-shadow: 0px 0px 0px; background-color: whitesmoke; color: #0098d7;} 

.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav>li.open,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav>li.open:active,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav>li.open:focus,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav li a.dropdown-toggle[aria-expanded=true],
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav li a:active,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav li a:focus,
.navbar .container-fluid .navbar-collapse ul.nav.navbar-nav li a:hover,
.navbar .container-fluid .navbar-header button.navbar-toggle:active,
.navbar .container-fluid .navbar-header button.navbar-toggle:focus,
.navbar .container-fluid .navbar-header button.navbar-toggle:hover,
.navbar .container-fluid .navbar-header a.navbar-brand:hover { text-decoration: bold; text-shadow: 0px 0px 0px; background-color: #014694; color: #0098d7;} 

.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a.prime.submenu:active,
.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a.prime.submenu:focus,
.navbar .container-fluid .navbar-collapse ul.dropdown-menu>li>a.prime.submenu:hover {background-color: #014694; color: #0098d7;}

@media (max-width:767px) { .navbar .container-fluid ul.dropdown-menu>li>a.prime { margin-left: 30px; } }

.nav-icon {
    line-height: 18px;
    height: 18px;
    margin-right: 5px;
    width: 1.28571429em;
    text-align: center;
    vertical-align: top;
    display: inline-block;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    /*box-shadow: 0 1px 0 rgba(255,255,255,.25);*/
    box-sizing: border-box;
    translate: -10px;
}
/* END Navbar styling */

/* Font Awesome Icon Colors */
.fa.fa-bars { font-size: 1.6em; }
.fa-fw { margin-right: 5px; }
.fa-bell.on { color: red; }
.fa-exclamation { color: red; }
/* END Font Awesome Icon Colors */


/* Standard Button Styling for Site */
.btn-danger { background: #c12e2a; text-shadow: 0px 0px 0px 0px; box-shadow: none; margin-bottom: 10px; }
.btn-danger:hover, .btn-danger:active, .btn-danger:focus { color: white; background: #e74c3c; border-color: #e74c3c; font-weight: bold; }
.btn-left { float: left; width: 48%; }
.btn-right { float: right; width: 48%; }
.btn:active, .btn:hover, .btn:focus { background: #014694; border-color: #014694; color: #0098d7; font-weight: normal; }

/* END Standard Button Styling for Site */


/* menu thumbnails */
.thumbnail-menu-title,
.thumbnail-container {
  position: relative;
  max-width: 320px;
  font-size: 18px;
  font-style: oblique;
  margin: 5px;
  display: inline-block;
}

.thumbnail-container:active, .thumbnail-container:focus, .thumbnail-container:hover {
  
    box-shadow: 0px 0px 15px  #0098d7;

}

.thumbnail-container .content {
  position: absolute;
  bottom: 0;
  background: rgb(122, 122, 122); /* Fallback color */
  background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
  color: #f1f1f1;
  width: 100%;
  padding: 10px;
}

/* LOADER */
.loader {
border: 16px solid #0098d7;
border-top: 16px solid #014694;
border-radius: 50%;
width: 80px;
height: 80px;
animation: spin 2s linear infinite;
position: absolute;
top: 45vh;
left: 50%;
z-index: 1000000;
}

.tiny-loader {
border: 4px solid #0098d7;
border-top: 4px solid #014694;
border-radius: 50%;
animation: spin 2s linear infinite;
position: absolute;
z-index: 1000000;
top: 6px;
width: 18px;
height: 18px;
}

@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/* END LOADER */

/* FORMS */
.switch input { display: none; }
.slider { position: absolute; cursor: pointer; top: 0px; left: 0; right: 0; bottom: 0px; background-color: #014694; -webkit-transition: .4s; transition: .4s; }
.slider:before { position: absolute; content: ""; height: 8px; width: 8px; left: 3px; bottom: 3px; -webkit-transition: .4s; transition: .4s; }
input:checked + .slider:before { -webkit-transform: translateX(15px); -ms-transform: translateX(15px); transform: translateX(15px); }
.disabled { cursor: not-allowed; }
.slider.round { border-radius: 14px; display: inline-block; }
.slider.round:before { border-radius: 50%; }
.switch { position: relative; display: inline-block; width: 24px; height: 14px; display: inline-block; }
span.slider-label { margin: 12px; }

/* END FORMS */

/* fonts */
* { font-family: Roboto, Arial, sans-serif; }

/* background, layout, margins */
body {background-color: #EEE};
.content-holder { padding: 20px; overflow-y: scroll; height: -moz-calc(100%); height: -webkit-calc(100%); height: calc(100%); }
.dash-margins { margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px; }
.container-fluid.calculated-height { margin: 0px; }
.vcentered-form { margin-top: 25vh; }
.hcentered-form { text-align: center; }

/* forms */
.form-control.input-sm { border-radius: 4px; }

/* mobile */
@media(max-width:767px) { 

    /* background, layout, margins */
    .row.dash-margins .col-lg-9.col-md-12, .row.dash-margins .col-lg-12.col-md-12 { padding-left: 0px; }
    .title-block, .chart-content { margin: 10px; }
    .title-block span#chart-title { display: none; }

    /* navbar */
    .mbk-navbar .navbar.navbar-static-top .container-fluid .navbar-header .navbar-brand { line-height: 1.7em; padding: 5px 15px; }

}


select { border: solid 7px white; outline: white solid thick; outline-offset: -5px; }
button, select, textarea, input { border-radius: 4px; background-color: white; background: white; outline: white; color: #121212; border-color: rgba(255, 255, 255, 0); }
select, textarea, input { min-width: 280px; }
button, input[type=submit] { min-width: 160px; color: whitesmoke; }
input[type=text], input[type=submit] { border-width: 7px; border-style: solid; padding: 0px; }
input[type=text] { padding: 0 0 0 8px; }
input[type=submit]:hover, input[type=submit]:focus, input[type=submit]:active { color: #0098d7; }
button, .btn {min-width: 260px; outline: #014694; background: #014694; border-color: rgba(255, 255, 255, 0);  }

p label { color: #014694; min-width: 160px; text-align: right; }

.dropdown-menu { border-radius: 4px; }
.bootstrap-datetimepicker-widget table td.today:before{border-bottom-color: #0098d7; }
.bootstrap-datetimepicker-widget table td.active.today:before{border-bottom-color: #0098d7}
.bootstrap-datetimepicker-widget table td.day.active, .bootstrap-datetimepicker-widget table td.day.active:hover { color: white; background: #014694; }

input#id_password.textinput.textInput.form-control,    
input#id_login.textinput.textInput.form-control,
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    border-color: rgba(0, 0, 0, 0) !important;
    background: white !important;
    background-color: white !important;
    background-image: none !important;
    color: #121212 !important;
    -webkit-text-fill-color: #121212;
    -webkit-box-shadow: 0 0 0px 1000px white inset;
    transition: background-color 5000s ease-in-out 0s;
}

div#chart, .highcharts-container { overflow: visible !important; }
.highcharts-background { background: none !important; }
.highcharts-root { font-size: 14px !important; overflow: visible !important; }
.highcharts-plot-background { background: white !important; }

form.login { width: 100%; }
form.login div label { display: block; width: 100%; } 
form.login div input { display: block; width: 100%; border-radius: 4px; height: 34px; margin-bottom: 10px; padding-left: 12px; font-size: 14px; line-height: 1.42857143; border: 1px solid #ccc; }