@font-face {
    font-family: 'Kaushan Script';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/kaushan-script-latin-regular.eot');
    src: local('Kaushan Script'), local('KaushanScript-Regular'),
        url('../fonts/kaushan-script-latin-regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/kaushan-script-latin-regular.woff2') format('woff2'),
        url('../fonts/kaushan-script-latin-regular.woff') format('woff'),
        url('../fonts/kaushan-script-latin-regular.ttf') format('truetype'),
        url('../fonts/kaushan-script-latin-regular.svg#KaushanScript') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 100;
    src: url('../fonts/roboto-latin-100.eot');
    src: local('Roboto Thin'), local('Roboto-Thin'),
        url('../fonts/roboto-latin-100.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-100.woff2') format('woff2'),
        url('../fonts/roboto-latin-100.woff') format('woff'),
        url('../fonts/roboto-latin-100.ttf') format('truetype'),
        url('../fonts/roboto-latin-100.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 100;
    src: url('../fonts/roboto-latin-100italic.eot');
    src: local('Roboto Thin Italic'), local('Roboto-ThinItalic'),
        url('../fonts/roboto-latin-100italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-100italic.woff2') format('woff2'),
        url('../fonts/roboto-latin-100italic.woff') format('woff'),
        url('../fonts/roboto-latin-100italic.ttf') format('truetype'),
        url('../fonts/roboto-latin-100italic.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/roboto-latin-300.eot');
    src: local('Roboto Light'), local('Roboto-Light'),
        url('../fonts/roboto-latin-300.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-300.woff2') format('woff2'),
        url('../fonts/roboto-latin-300.woff') format('woff'),
        url('../fonts/roboto-latin-300.ttf') format('truetype'),
        url('../fonts/roboto-latin-300.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 300;
    src: url('../fonts/roboto-latin-300italic.eot');
    src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
        url('../fonts/roboto-latin-300italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-300italic.woff2') format('woff2'),
        url('../fonts/roboto-latin-300italic.woff') format('woff'),
        url('../fonts/roboto-latin-300italic.ttf') format('truetype'),
        url('../fonts/roboto-latin-300italic.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/roboto-latin-regular.eot');
    src: local('Roboto'), local('Roboto-Regular'),
        url('../fonts/roboto-latin-regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-regular.woff2') format('woff2'),
        url('../fonts/roboto-latin-regular.woff') format('woff'),
        url('../fonts/roboto-latin-regular.ttf') format('truetype'),
        url('../fonts/roboto-latin-regular.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: url('../fonts/roboto-latin-italic.eot');
    src: local('Roboto Italic'), local('Roboto-Italic'),
        url('../fonts/roboto-latin-italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-italic.woff2') format('woff2'),
        url('../fonts/roboto-latin-italic.woff') format('woff'),
        url('../fonts/roboto-latin-italic.ttf') format('truetype'),
        url('../fonts/roboto-latin-italic.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/roboto-latin-500.eot');
    src: local('Roboto Medium'), local('Roboto-Medium'),
        url('../fonts/roboto-latin-500.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-500.woff2') format('woff2'),
        url('../fonts/roboto-latin-500.woff') format('woff'),
        url('../fonts/roboto-latin-500.ttf') format('truetype'),
        url('../fonts/roboto-latin-500.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 500;
    src: url('../fonts/roboto-latin-500italic.eot');
    src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'),
        url('../fonts/roboto-latin-500italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-500italic.woff2') format('woff2'),
        url('../fonts/roboto-latin-500italic.woff') format('woff'),
        url('../fonts/roboto-latin-500italic.ttf') format('truetype'),
        url('../fonts/roboto-latin-500italic.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/roboto-latin-700.eot');
    src: local('Roboto Bold'), local('Roboto-Bold'),
        url('../fonts/roboto-latin-700.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-700.woff2') format('woff2'),
        url('../fonts/roboto-latin-700.woff') format('woff'),
        url('../fonts/roboto-latin-700.ttf') format('truetype'),
        url('../fonts/roboto-latin-700.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 700;
    src: url('../fonts/roboto-latin-700italic.eot');
    src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'),
        url('../fonts/roboto-latin-700italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-700italic.woff2') format('woff2'),
        url('../fonts/roboto-latin-700italic.woff') format('woff'),
        url('../fonts/roboto-latin-700italic.ttf') format('truetype'),
        url('../fonts/roboto-latin-700italic.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: url('../fonts/roboto-latin-900.eot');
    src: local('Roboto Black'), local('Roboto-Black'),
        url('../fonts/roboto-latin-900.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-900.woff2') format('woff2'),
        url('../fonts/roboto-latin-900.woff') format('woff'),
        url('../fonts/roboto-latin-900.ttf') format('truetype'),
        url('../fonts/roboto-latin-900.svg#Roboto') format('svg');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 900;
    src: url('../fonts/roboto-latin-900italic.eot');
    src: local('Roboto Black Italic'), local('Roboto-BlackItalic'),
        url('../fonts/roboto-latin-900italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-latin-900italic.woff2') format('woff2'),
        url('../fonts/roboto-latin-900italic.woff') format('woff'),
        url('../fonts/roboto-latin-900italic.ttf') format('truetype'),
        url('../fonts/roboto-latin-900italic.svg#Roboto') format('svg');
}

* {
    outline: none;
}

/*** HTML ***/
html {
    height: 100%;
}

/*** BODY ***/
body {
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #FFFFFF;
    font: 16px/150% 'Roboto',sans-serif;
    color: #3C88B5;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 500;
}
h1 {
    font-size: 30px;
}
h2 {
    font-size: 26px;
}
h3 {
    font-size: 24px;
}
h4 {
    font-size: 20px;
}
h5 {
    font-size: 18px;
}
h6 {
    font-size: 16px;
}
strong {
    font-weight: 500;
}
sup {
    position: relative;
    top: -3px;
    vertical-align: top;
    font-size: 12px;
}
img {
    max-width: 100%;
    height: auto;
}
.clear, 
#clear {
    height: .1px;
    font-size: .1px;
    line-height: .1px;
    clear: both;
}

.red {
    color: #FF0000;
}

/*** DEBUG ***/
#debug {
    width: 100%;
    height: auto;
    position: fixed;
    bottom: 0;
    background-color: rgba(23, 26, 31, 0.9);
    font-size: 12px;
    line-height: 120%;
    color: #E7EAEF;
    z-index: 1000;
}
#debug .inside {
    padding: 0 20px;
}

/*** WRAPPER ***/
#wrapper {
    min-height: 100%;
    position: relative;
}

/*** HEADER ***/
#header {
    width: 100%;
    height: 80px;
    position: relative;
    background-color: #FFFFFF;
    border-bottom: 2px solid #DFE6EE;
}
#header .inside {
    width: 94%;
    margin: 0 auto;
    position: relative;
}

/*** HAMBURGER ***/
#hamburger {
    width: 40px;
    height: 20px;
    position: absolute;
    top: 30px;
    left: 0;
}

/*** TITLE ***/
#title {
    width: 100%;
    position: relative;
    text-align: center;
    font-size: 18px;
    color: #FFFFFF;
}

/*** CONTAINER ***/
#container {
    width: 100%;
    margin: 0 0 50px;
    position: relative;
    float: left;
    font-size: 0;
}

/*** LEFT ***/
#left {
    width: 250px;
    height: calc(100vh - 82px - 50px);
    position: relative;
    top: 0;
    left: 0;
    display: inline-block;
    vertical-align: top;
    background-color: #E8EFF7;
    font-size: 16px;
    -webkit-transition: width 0.3s;
       -moz-transition: width 0.3s;
        -ms-transition: width 0.3s;
         -o-transition: width 0.3s;
            transition: width 0.3s;
}
/*** NAVIAGTION ***/
#navigation {
    width: 250px;
    position: relative;
    top: 0;
    left: 0;
}
#navigation.active {
    left: -3%;
}
#navigation ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
#navigation ul li {
    padding: 10px;
    text-align: center;
}
#navigation ul li a {
    color: #3C88B5;
    text-decoration: none;
    text-transform: uppercase;
}
#navigation ul li a .las {
    font-size: 30px;
}

/*** MAIN ***/
#main {
    width: 100%;
    margin: 0 auto;
    position: relative;
    font-size: 16px;
}
#main.loggedIn {
    width: calc(100% - 300px);
    padding: 0 0 0 25px;
    display: inline-block;
    vertical-align: top;
}
#main .las {
    font-size: 18px;
}
/*** LOGIN LOGO ***/
#main #ce_login_logo {
    width: 300px;
    margin: 50px auto;
    padding: 30px 0;
    background-color: #FFFFFF;
    border: 2px solid #3C88B5;
    text-align: center;
}
/*** LOGIN ***/
#main #ce_login {
    width: 500px;
    margin: 0 auto;
    padding: 20px 0;
    background-color: #3C88B5;
}
#main #ce_login h1 {
    padding: 20px 0;
    font: 20px/100% 'Roboto',sans-serif;
    font-weight: 400;
    color: #FFFFFF;
    text-transform: uppercase;
    text-align: center;
}
#main #ce_login .text_widget label {
    width: 250px;
    margin: 0 auto;
    display: block;
    font-weight: 300;
    color: #E8EFF7;
}
#main #ce_login .text_widget .text {
    margin: 0 auto 10px;
    display: block;
    border: 0;
}
#main #ce_login .submit_widget .submit {
    margin: 15px auto;
    display: block;
    border: 0;
}

/*** BACKLINK ***/
.backlink {
    margin: 15px 0;
}
.backlink a {
    color: inherit;
    text-decoration: none;
}

/*** GLOBAL OPERATIONS ***/
.global_operations {
    text-align: right;
}
.global_operations ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.global_operations ul li {
    padding: 0 0 0 15px;
    display: inline-block;
    vertical-align: top;
}
.global_operations ul li a {
    color: inherit;
    text-decoration: none;
}

/*** FORM WIDGETS ***/
.widget {
    margin: 0 0 5px;
    position: relative;
}
.widget.w50 {
    width: 280px;
    float: left;
}
.widget.clr {
    clear: both;
}
.widget label {
    display: block;
}
.text_widget .text {
    width: 250px;
    margin: 0 0 10px;
    padding: 5px 10px;
    background-color: #FFFFFF;
    border: 1px solid #B5D6EC;
    font: 16px/150% 'Roboto',sans-serif;
    box-sizing: border-box;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.textarea_widget .textarea {
    width: 250px;
    height: 150px;
    margin: 0 0 10px;
    padding: 5px 10px;
    background-color: #FFFFFF;
    border: 1px solid #B5D6EC;
    font: 16px/150% 'Roboto',sans-serif;
    box-sizing: border-box;
    resize: vertical;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.select_widget .select {
    width: 250px;
    margin: 0 0 10px;
    padding: 5px 10px;
    background-color: #FFFFFF;
    border: 1px solid #B5D6EC;
    border-radius: 0;
    font: 16px/150% 'Roboto',sans-serif;
    box-sizing: border-box;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}
.select_widget .select_div::after {
    position: absolute;
    top: 30px;
    left: 225px;
    font-family: 'Line Awesome Free';
    font-weight: 900;
    content: '\f107';
}
.submit_widget .submit {
    width: 250px;
    margin: 15px 0;
    padding: 5px 10px;
    background-color: #B5D6EC;
    border: 1px solid #B5D6EC;
    font: 16px/150% 'Roboto',sans-serif;
    color: #FFFFFF;
    cursor: pointer;
    box-sizing: border-box;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    -webkit-transition: all 0.3s;
       -moz-transition: all 0.3s;
        -ms-transition: all 0.3s;
         -o-transition: all 0.3s;
            transition: all 0.3s;
}
.submit_widget .submit:hover {
    background-color: #171A1F;
}

/*** MANAGER LIST HEADER ***/
.manager_list_header {
    padding: 3px;
    position: relative;
}

/*** MANAGER LIST ***/
.manager_list {
    position: relative;
    box-sizing: border-box;
}
.manager_list_item {
    margin: 0 0 25px;
    position: relative;
    border: 1px solid #B5D6EC;
    border-collapse: collapse;
}
.manager_list_item:nth-child(2n) {
    background-color: #F7FAFF;
}
.manager_list_item_topbar {
    padding: 15px 5px;
    position: relative;
    border-bottom: 1px solid #B5D6EC;
    border-collapse: collapse;
}
.manager_list_item_topbar_name {
    width: calc(100% - 130px);
    display: inline-block;
    vertical-align: top;
    text-transform: uppercase;
    font-weight: 500;
}
.manager_list_item_topbar_details {
    width: 120px;
    display: inline-block;
    vertical-align: top;
    text-align: right;
}
.manager_list_item_topbar_details a {
    padding: 5px 10px;
    border: 2px solid #3C88B5;
    border-radius: 20px;
    color: inherit;
    text-decoration: none;
    font-weight: 500;
}

.manager_list_item_location, 
.manager_list_item_dredger, 
.manager_list_item_user, 
.manager_list_item_group {
    width: 50%;
    padding: 15px 5px;
    position: relative;
    display: inline-block;
    vertical-align: top;
}

.manager_list_item_text {
    display: block;
    vertical-align: top;
}
.manager_list_item_map {
    width: 200px;
    height: 250px;
    padding: 5px;
    display: inline-block;
    vertical-align: top;
    border-right: 1px solid #B5D6EC;
}
.manager_list_item_info {
    width: 150px;
    height: 250px;
    padding: 5px;
    display: inline-block;
    vertical-align: top;
    border-right: 1px solid #B5D6EC;
}
.manager_list_item_info em {
    font-size: 12px;
}
.manager_list_item_info .light {
    width: 16px;
    height: 16px;
    position: relative;
    top: 4px;
    display: inline-block;
    vertical-align: top;
    background-color: #00FF00;
    border-radius: 50%;
}
.manager_list_item_status {
    width: calc(100% - 400px);
    height: 250px;
    padding: 5px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
}
.manager_list_item_status table {
    width: 100%;
}
.manager_list_item_status table tr {
    margin: 0 0 20px;
}
.manager_list_item_status span {
    margin: 50px 0 5px;
    display: block;
    font-size: 24px;
    font-weight: 500;
    line-height: 100%;
}

.manager_list_item_bottombar {
    padding: 15px 5px;
    position: relative;
    border-top: 1px solid #B5D6EC;
    border-collapse: collapse;
}

.manager_list_item_options {
    padding: 15px 5px;
    display: inline-block;
    vertical-align: top;
}
.manager_list_item_options ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.manager_list_item_options ul li {
    margin: 0 5px 0 0;
    display: inline-block;
}
.manager_list_item_options ul li a {
    color: inherit;
    text-decoration: none;
}

/*** MANAGER ADD ***/
.manager_add {
    position: relative;
}

/*** MANAGER EDIT ***/
.manager_edit {
    position: relative;
}

/*** MANAGER DETAIL ***/
.manager_detail {
    position: relative;
}
.manager_detail_text {
    width: 50%;
    margin: 0 0 30px;
    position: relative;
    display: inline-block;
    vertical-align: top;
}
.manager_detail #map {
    margin: 0 0 30px;
    position: relative;
    display: inline-block;
    vertical-align: top;
}
.manager_detail .interval {
    position: relative; 
}
.manager_detail .interval span {
    margin: 0 3px 0 0;
    padding: 5px 10px;
    display: inline-block;
    border: 1px solid #B5D6EC;
    border-collapse: collapse;
    box-sizing: border-box;
    cursor: pointer;
}
.manager_detail .interval span.active {
    background-color: #B5D6EC;
    color: #FFFFFF;
}
.manager_detail svg {
  width: 100%;
  height: 600px;
}

.bar {
  fill: #B5D6EC;
}

text {
  font-size: 12px;
  fill: #3C88B5;
}

path {
  stroke: gray;
}

line {
  stroke: gray;
}

line#limit {
  stroke: #3C88B5;
  stroke-width: 3;
  stroke-dasharray: 3 6;
}

.grid path {
  stroke-width: 0;
}

.grid .tick line {
  stroke: #9FAAAE;
  stroke-opacity: 0.3;
}

text.divergence {
  font-size: 14px;
  fill: #2F4A6D;
}

text.value {
  font-size: 14px;
}

text.title {
  font-size: 22px;
  font-weight: 600;
}

text.label {
  font-size: 14px;
  font-weight: 400;
}

text.source {
  font-size: 10px;
}

/*** TERMS & CONDITIONS ***/
.terms_conditions a {
    color: inherit;
    text-decoration: none;
}
.terms_conditions a:hover {
    color: inherit;
    text-decoration: underline;
}

/*** PRIVACY & POLICY ***/
.privacy_policy a {
    color: inherit;
    text-decoration: none;
}
.privacy_policy a:hover {
    color: inherit;
    text-decoration: underline;
}


/*** FOOTER ***/
#footer {
    width: 100%;
    height: 20px;
    margin: 0 auto;
    padding: 5px 0 20px;
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #3C88B5;
    font-size: 14px;
    color: #E8EFF7;
}
#footer .inside {
    padding: 0 20px;
}
#footer a {
    color: inherit;
    text-decoration: none;
}
#footer a:hover {
    text-decoration: underline;
}

/*** DESKTOPS ***/
@media screen and (max-width: 1280px) {
    
}

/*** TABLETS ***/
@media screen and (max-width: 1024px) {
    
}

/*** SMARTPHONES ***/
@media screen and (max-width: 768px) {
    
}