body {
    background: #082533;
}

/* Side Bar */
.nav-header {
    text-align: center;
    padding: 15px;
    background: transparent;
}

.nav:not(.nav-tabs) li.active {
    border-left-color: #FFFFFF;
    background: #0F4966;
}

.nav .nav-third-level > li.active {
    border-left: none;
}

.navbar-default .nav > li > a:hover,
.navbar-default .nav > li > a:focus,
.nav > li > a:hover,
.nav > li > a:focus {
    background: transparent;
}

/* Top Bar */
.navbar-header {
    margin: 10px 0px;
}

.navbar-header .inline-section {
    display: inline-block;
    padding: 10px 0px;
}

.navbar-header #top-bar-logo-section {
    margin-right: 30px;
    border-right: 1px solid #999999;
    padding-right: 30px;
}

.navbar-header #top-bar-logo-section .top-bar-logo {
    max-width: 102px;
    max-height: 20px;
}

div.version-env .local {
    background-color: #ed5565;
}

div.version-env .dev-internal {
    background-color: #f8ac59;
}

div.version-env .alpha {
    background-color: #1c84c6;
}

div.version-env .beta {
    background-color: #23c6c8;
}

div.version-env .prod {
    background-color: #1ab394;
}

div.version-env span {
    font-size: 14px;
    padding: 5px 15px;
}

#page-wrapper {
    background: #E8E8EB;
}

form.inline-delete,
form.inline-terminate {
    display: inline;
}

.table-wrapper {
    display: table;
    width: 100%;
}

table.datatable td .btn {
    margin-bottom: 10px;
    margin-left: 10px;
    padding-right: 10px;
    padding-left: 10px;
}

.break-words {
    word-break: break-all;
    white-space: -moz-pre-wrap; /* Mozilla */
    white-space: -o-pre-wrap; /* Opera 7 */
    white-space: pre-wrap; /* CSS 2.1 */
    white-space: pre-line; /* CSS 3 */
    word-wrap: break-word; /* IE */
}

.no-wrap {
    word-break: normal !important;
    word-wrap: normal !important;
    white-space: nowrap !important;
}

.text-bold {
    font-weight: bold;
}

/* Reports */
.file .file-name {
    min-height: 125px;
}

/* Hos timer badges */
.rulesets .badge {
    font-size: 8px;
}

/* Driving Status Labels */
.driving_duty_badge {
    padding: 5px;
    font-size: 13px;
    width: 100px;
}

.driving_duty_badge.off_duty {
    color: #5A6265;
}

.driving_duty_badge.sleeper {
    color: #2B4252;
}

.driving_duty_badge.driving {
    color: #1FB1A6;
}

.driving_duty_badge.on_duty {
    color: #299776;
}

.driving_duty_badge i {
    margin-right: 5px;
    min-width: 13px;
}

/* HOS Timeline */
.vertical-container {
    width: 98%;
    max-width: none;
}

.hos-timeline.vertical-container {
    width: 100%;
}

.hos-timeline .vertical-timeline-block {
    margin: 0 10px 0 10px;
}

.hos-timeline .vertical-timeline-content {
    padding: 0;
    margin-bottom: 15px;
    margin-left: 40px;
}

.hos-timeline .hos-timeline-content-header {
    background: #f3f3f3;
}

.hos-timeline .hos-timeline-content-header .hos-event-details {
    padding: 0 5px 3px;
}

.vertical-timeline-content.hos-event-on_duty .hos-event-details {
    background: #299772;
}

.vertical-timeline-content.hos-event-off_duty .hos-event-details {
    background: #5a6265;
}

.vertical-timeline-content.hos-event-driving .hos-event-details {
    background: #1fb1a6;
}

.vertical-timeline-content.hos-event-sleeper .hos-event-details {
    background: #2b4252;
}

.vertical-timeline-icon {
    border-radius: 25%;
    font-size: 13px;
    left: -10px;
}

.vertical-timeline-icon .fa {
    font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: bolder;
}

.vertical-timeline-icon i {
    margin-top: -6px;
}

.hos-timeline .vertical-timeline-block .vertical-timeline-icon {
    background: red;
    color: #ffffff;
}

.hos-timeline .vertical-timeline-block .vertical-timeline-icon.off_duty {
    background: #5a6265;
}

.hos-timeline .vertical-timeline-block .vertical-timeline-icon.sleeper {
    background: #2b4252;
}

.hos-timeline .vertical-timeline-block .vertical-timeline-icon.driving {
    background: #1fb1a6;
}

.hos-timeline .vertical-timeline-block .vertical-timeline-icon.on_duty {
    background: #299772;
}

.data-block {
    float: left;
    padding: 5px;
    min-width: 90px;
    height: 50px;
}

.started-at {
    min-width: 180px !important;
}

.data-block span.name {
    text-transform: uppercase;
    font-size: 10px;
}

.data-block .value {
    font-weight: 500;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 16px;
}

span.hos-event-flag {
    background: white;
    color: black;
    margin: 0px 0px;
    border-radius: 3px;
    display: inline-block;
    padding: 2px 4px;
    font-size: 16px;
}

.hos-event-details .data-block {
    color: white;
}

.hos-event-details .data-block span.name {
    color: #E8E8E8;
}

.timeline-expander {
    font-size: 28px;
    text-align: right;
    margin: 5px 0px;
}

.edit-form {
    display: none;
    padding: 10px;
    clear: both;
    margin-left: 60px;
    background: #fcfcfc;
    border: 1px solid #f3f3f3;
    overflow: hidden;
}

.hos-event-details .event-data {
    width: 100%;
    font-size: 14px;
    min-height: 24px;
}

.activities .duration {
    width: 75px;
    height: 20px;
}

.activities .comment {
    width: 275px;
    height: 20px;
}

.hos-event-add-icon {
    font-size: 16px;
    left: -1px;
}

.hos-event-add-content {
    margin-bottom: 20px;
}

/**
 * Vertical Align Bootstrap Rows and Columns
*/
.vertical-align {
    display: flex;
    flex-direction: row;
}

.vertical-align > [class^="col-"],
.vertical-align > [class*=" col-"] {
    display: flex;
    align-items: center;
    justify-content: center;
}

/**
 *  "flex: 1" or "flex-grow: 1" is added to make the inner div
 *  - Which is also a flex-item - take up all the horizontal space
 *  available space inside the flex container (.col-* elements)
 */
.vertical-align > [class^="col-"] > div,
.vertical-align > [class*=" col-"] > div {
    flex-grow: 1;
}

.bottom-right {
    position: absolute;
    bottom: 5px;
    right: 0;
}

.hos-event-edit-form .form-group {
    height: 70px;
    margin: 0;
    padding: 0;
}

.wizard > .content > .body label {
    margin-bottom: 0px;
    padding-top: 7px;
}

.activities-edit-form .form-group {
    height: 26px;
    margin: 0;
    padding: 0;
}

.hos-event-add-content .form-group {
    height: 70px;
    margin: 0;
    padding: 0;
}

.cursor-pointer {
    cursor: pointer
}

.insert-event-alert,
.edit-event-alert,
.edit-activity-alert,
.violations-search-alert {
    margin-top: 20px;
}

.text-monospace {
    font-family: monospace;
}

select.form-control.input-sm {
    padding: 4px 12px;
}

.table.event-changes-table {
    margin-bottom: 0;
}

.table.event-changes-table span.database-value {
    font-family: monospace;
    font-weight: 200;
}

.chosen-container-single .chosen-single {
    cursor: pointer !important;
}

.table-condensed > tbody > tr > td > span.month,
.table-condensed > tbody > tr > td > span.year {
    padding: 5px;
}

/* timeline lazy load pagination classes */
.firstPage {
    padding: 0;
}

.pagingView {
    padding: 0;
    border-style: none;
    margin-top: -50px;
}

table.dot-70hr-property-recap-table {
    min-width: 140px;
    margin: 0 auto 5px;
    border: 1px solid black;
}

table.dot-70hr-property-recap-table > tbody > tr:not(:first-of-type) {
    border-top: 1px solid black;
}

table.dot-70hr-property-recap-table > tbody > tr > td:not(:first-of-type) {
    border-left: 1px solid black;
}

.dot-70hr-property-recap-table > tbody > tr > td {
    padding: 0px 15px;
    width: 50%;
}

.nav .nav-third-level > li.active {
    border-left: none;
}

.cancel-edit-button {
    visibility: hidden;
}

.table-condensed > tbody > tr > td.day.disabled,
.table-condensed > tbody > tr > td > span.month.disabled,
.table-condensed > tbody > tr > td > span.year.disabled {
    color: lightgrey;
}

.table-condensed > tbody > tr > td.day.active {
    background-color: #1ab394;
    color: #ffffff;
}

.training .page-block .panel-heading {
    text-overflow: ellipsis;
    overflow: hidden;
}

.training .page-block .content {
    overflow: hidden;
    height: 200px;
}

.datatable .export-only {
    display: none;
}

.filter-wrapper > .row {
    min-height: 48px;
}

.messages {
    height: 330px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.messages-list {
    flex-grow: 1; /* Grow to fill available space */
    height: 90%; /* no flex-box support */
    overflow-y: auto;
    margin-bottom: 1%;
}

.messages-send-form {
    height: 36px;
}

.messages-send-form form {
    display: table;
    width: 100%;
}

.messages-send-form form > div {
    display: table-cell;
    vertical-align: top;
}

.messages-send-form form .message-input {
    width: 100%;
}

.messages-send-form form .message-submit {
    padding-left: 10px;
    text-align: right;
}

.messages-no-history {
    text-align: center;
    color: #ccc;
    border-bottom: 1px solid #ccc;
    padding-bottom: 5px;
    width: 98%;
    margin: 0 auto;
}

.new-messages-delimiter {
    border-bottom: 1px solid #ff4040;
    line-height: 0;
    text-align: center;
    margin-top: 15px;
}

.new-messages-delimiter span {
    background-color: #fff;
    padding: 0 10px;
    color: #FF0000;
}

.chosen-container .chosen-results {
    max-height: 220px !important;
}

.text-smaller {
    font-size: smaller;
}

.app-footer {
    position: absolute;
    width: 100%;
    bottom: 0;
    text-align: center;
    padding-bottom: 10px;
    color: #979797;
}

.app-footer div {
    display: inline-block;
}

.form-control[type='file'] {
    border: 0;
}

.top-info {
    margin-bottom: 25px;
}

.info-card {
    background-color: #FFFFFF;
}

.info-card-title {
    height: 44px;
    padding: 4px 8px 5px;
    border-bottom: 1px solid #E8E8E8;
    vertical-align: middle;
}

.info-card-body {
    padding-left: 20px;
    padding-right: 17px;
}

.info-card-title h4 {
    line-height: 25px;
}

.info-card-detail {
    margin-top: 5px;
    padding-bottom: 4px;
}

.info-card-body .info-card-detail:not(:last-of-type) {
    border-bottom: 1px solid #E8E8EB;
}

.info-card-detail-label {
    font-weight: bold;
}

.info-label {
    border-radius: 2px;
    min-width: 120px;
    height: 35px;
    text-align: center;
    font-style: normal;
    font-size: 15px;
    line-height: 35px;
    vertical-align: middle;
}

.info-label-alert {
    background-color: #EC5565;
    color: #FFFFFF;
}

.info-label-driver-status-1 {
    background-color: #5A6265;
    color: #FFFFFF;
}

.info-label-driver-status-2 {
    background-color: #2B4252;
    color: #FFFFFF;
}

.info-label-driver-status-3 {
    background-color: #1FB1A6;
    color: #FFFFFF;
}

.info-label-driver-status-4 {
    background-color: #299772;
    color: #FFFFFF;
}

.info-card-body#hos-timers {
    padding: 0px;
}

.info-label > img {
    margin-top: -2px;
}

.info-card-body#hos-timers .hos-timer-row > .hos-timer {
    height: 87px;
    margin: 0px;
    border-bottom: 1px solid #E8E8E8;
}

.info-card-body#hos-timers .hos-timer-row > .hos-timer:not(:last-of-type) {
    border-right: 1px solid #E8E8E8;
}

.info-card-body#hos-timers .hos-timer.bg-danger,
.info-card-body#hos-timers .hos-timer.bg-danger {
    background-color: #EC5565;
    color: white;
}

.info-card-body#hos-timers .hos-timer .hos-timer-value {
    font-weight: bold;
    font-size: 28px;
}

.info-card-body#hos-timers .hos-timer .hos-timer-label {
    font-size: 12px;
}

.info-card-body#hos-timers .hos-timer .hos-timer-violation {
    font-size: 9px;
}

.info-card-body#hos-timers .last-34hr-reset {
    margin-top: 2px;
}

.ruleset-pills {
    margin-top: 2px;
    text-align: center;
    font-size: smaller;
}

.ruleset-pill {
    display: inline-block;
    padding: 0 5px;
    background-color: #A2ACBD;
    border-radius: 100px;
    color: white;
    white-space: nowrap;
    font-size: smaller;
}

.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.file .icon .compliance-icon {
    width: 70px;
    height: 70px;
}

.file .file-name.compliance-file-name {
    padding: 20px 10px;
}

.ibox-title {
    border: 0px;
}

.legendColorBox > div:first-of-type {
    border: 0px !important;
    padding: 0px !important;
}

div.dataTables_wrapper div.dataTables_length label {
    font-weight: normal;
    text-align: left;
    white-space: nowrap;
}

div.dataTables_wrapper div.dataTables_length select {
    width: 75px;
    height: 30px;
    background-color: #FFFFFF;
    border: 1px solid #E5E6E7;
    border-radius: 1px;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    font-size: 14px;
    line-height: 30px;
    vertical-align: middle;
}

div.dataTables_wrapper div.dataTables_length select:focus {
    border: 1px solid #1C84C6;
    outline: none;
}

div.dt-buttons {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

div.dt-buttons > a.dt-button {
    position: relative;
    float: left;
    margin-right: 0;
    margin-bottom: 5px;
    border: 1px solid #E7EAEC;
    border-radius: 3px;
    padding: 6px 8px;
    background: #FFFFFF;
    background-image: none;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    color: #676A6C;
    box-shadow: none;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-decoration: none;
}

div.dt-buttons > a.dt-button:hover,
div.dt-buttons > a.dt-button:focus:active {
    z-index: 2;
    border-color: #D2D2D2;
    background-color: #EEEEEE;
    background-image: none;
}

div.dt-buttons > a.dt-button:first-child:not(:last-child) {
    margin-left: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

div.dt-buttons > a.dt-button:last-child:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

div.dt-buttons > a.dt-button:not(:first-child):not(:last-child) {
    border-radius: 0;
}

div.dt-buttons > a.dt-button + a.dt-button {
    margin-left: -1px;
}

.dataTables_wrapper .dataTables_paginate {
    display: inline-block;
    margin: 2px 0;
    border-radius: 4px;
    padding-left: 0;
    white-space: nowrap;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    display: inline-block;
    position: relative;
    background-color: #FFFFFF;
    margin-left: -1px;
    border: 1px solid #DDDDDD;
    padding: 4px 10px;
    line-height: 1.42857;
    text-decoration: none;
}

.dataTables_wrapper .dataTables_paginate > .paginate_button:first-child {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    border-color: #DDDDDD;
    cursor: not-allowed;
    background-color: #FFFFFF;
    color: #777;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:focus,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:active {
    z-index: 2;
    border-color: #DDDDDD;
    background-color: #F4F4F4;
    background-image: none;
    color: inherit;
    cursor: default;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:focus,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    z-index: 2;
    border-color: #DDDDDD;
    background-color: #EEEEEE;
    background-image: none;
    color: #23527C !important;
}


.dataTables_wrapper .dataTables_paginate .fg-button {
    display: inline-block;
    position: relative;
    background-color: #FFFFFF;
    margin-left: -1px !important;
    border: 1px solid #DDDDDD !important;
    padding: 4px 10px !important;
    line-height: 1.42857;
    text-decoration: none;
}

.dataTables_info{
    text-transform: inherit;
}

div.dataTables_paginate a{
    font-weight: 400;
}

.dataTables_filter{
    float: left !important;
}
.installer-report-details .file-box .file-name {
    min-height: 100%;
}

.installer-report-details .file-box .image img {
    max-width: 200px;
}

.info-table {
    width: 100%;
}

.info-table th {
    padding-right: 30px;
}

.info-table th,
.info-table td {
    border-bottom: 1px solid #e7eaec;
    padding-top: 10px;
    padding-bottom: 5px;
}

#top_search_chosen {
    width: 450px !important;
}

.top-search .input-group-addon {
    background-color: transparent;
    border: none;
}

#top_search {
    height: 28px;
}

.top-search .input-group {
    padding: 17px 0;
}

.top-search .chosen-choices {
    background: none !important;
    border: 1px solid #E8E8EB !important;
    box-shadow: none !important;
}

.top-search .chosen-drop {
    border-top: none !important;
    border: none !important;
}

.top-search .chosen-choices {
    border: 1px solid #B6B6B8 !important;
    border-radius: 5px;
}

.top-search .chosen-container-active.results-displayed .chosen-choices {
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

.top-search .chosen-container-active.results-displayed .chosen-drop {
    border: 1px solid #B6B6B8 !important;
    border-top: none !important;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    overflow: hidden;
}

.top-search .results-displayed .chosen-results {
    color: #082533 !important;
    background-color: #E8E8EB !important;
}

.top-search .results-displayed .chosen-results .no-results {
    background-color: #E8E8EB !important;
}

.top-search .search-field {
    width: 100%;
}

.top-search .chosen-results li.highlighted {
    background: none !important;
    background-color: #BAC1C6 !important;
    color: #082533 !important;
    border: none !important;
}

.recent-telematics-history {
    max-height: 490px;
    overflow: auto;
}

span.help-pointer {
    cursor: help;
}

#driver-top-info .info-card {
    min-height: 340px;
}

.wrapper-content .button-before-content {
    margin-bottom: 20px;
}

.panel .panel-body .app-box {
    width: 200px;
}

.panel .panel-body .app-box .app {
    padding: 10px;
    height: 275px;
}

.panel .panel-body .app-box .app .app-icon {
    width: 160px;
    height: 160px;
    padding: 0;
    margin-bottom: 20px;
}

.panel .panel-body .app-box .app .app-icon img {
    width: 100%;
    height: 100%;
}

.panel .panel-body .app-box .app .app-name {
    height: 80px;
}

.panel .panel-body .app-box .app .app-name h4 {
    color: #676a6c;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: normal;
}

.panel .panel-body .app-box .app .app-name p {
    color: #8d8d8d;
    font-size: 12px;
    height: 50px;
    overflow: hidden;
}

.panel .panel-body .app-box .app .app-rating {
    width: 50%;
    display: inline-block;
}

.panel .panel-body .app-box .app .app-rating i {
    color: #676a6c;
}

.panel .panel-body .app-box .app .app-price {
    width: 45%;
    display: inline-block;
    text-align: right;
}

.panel .panel-body .app-box .app .app-price p {
    font-weight: bold;
    color: #88da16;
    font-size: 16px;
}

.dropdown-menu>.default>a {
    color: #fff;
    text-decoration: none;
    background-color: #337ab7;
    outline: 0;
}

.default-apps{
    pointer-events: none;
    opacity: 0.5;
}

.no-cursor{
    pointer-events: none;
    opacity: 0.5;
}

.margin-left-19{
    margin-left: 19px;
}

/**
 Compliance/Verification Status Report filters.
 */
.col-lg-3.col-lg-3-fixed {
    width: 16% !important;
}

/**
 Dynamic form data export button disabled styles
 */
.buttons-custom-export{
    pointer-events: none;
    color: #dddddd !important;
}