body { font-family: 'Roboto', sans-serif; color: #3c3b4e; overflow-x: hidden; }

.container.disable { max-width: none !important; }

.body-content { padding-left: 15px; padding-right: 15px; }

.dataTables_length { margin-left: 15px; margin-bottom: 10px; }

    .dataTables_length .form-control { display: inline-block; width: auto; }

.fa-circle.green { color: #02D951; }

.fa-circle.red { color: #ff0022; }

.fa-circle.yellow { color: yellow; }

.fa-circle.orange { color: orange; }

.fa-circle.blue { color: dodgerblue; }
.fa-circle.violet { color: blueviolet; }

button .fa-space { margin-right: 5px; }


footer { background-color: #3D3C4E; color: white; text-align: left; padding: 15px 20px; font-size: 12px; }

    footer p { margin: 0px; }

    footer a { color: white; font-weight: bold; }

.header-content { height: 60px; background: url('https://www.bertin-medical-waste.fr/wp-content/themes/bertininstruments/dist/assets/images/logo-bertin-medical.png') left no-repeat; border-bottom: 1px solid #D6D6D6; padding-left: 130px; }

    .header-content .user-container ul { flex-direction: row; }

        .header-content .user-container ul li.li-button-notification { margin-right: 15px; margin-top: -5px; }

            .header-content .user-container ul li.li-button-notification .button-notification { border: none; background: none; color: #bbb; font-size: 22px; margin-top: 5px; }

                .header-content .user-container ul li.li-button-notification .button-notification:hover,
                .header-content .user-container ul li.li-button-notification .button-notification:focus,
                .header-content .user-container ul li.li-button-notification .button-notification:active { color: #555; }

            .header-content .user-container ul li.li-button-notification .notif-count { display: none; color: white; background: red; border-radius: 50%; margin-top: -15px; margin-left: 20px; padding: 2px 5px; font-size: 8px; }

                .header-content .user-container ul li.li-button-notification .notif-count.active { display: block; position: absolute; }


#notifications { display: none; padding: 10px; padding-bottom: 0px; background: white; position: absolute; border: 1px solid #555; border-radius: 5px; margin-top: 20px; margin-left: -350px; font-size: 12px; z-index: 1000; }

    #notifications .notifications-triangle { display: inline-block; border-right: 10px solid transparent; border-bottom: 20px solid white; border-left: 10px solid transparent; position: absolute; margin-top: -30px; margin-left: 345px; z-index: 3; }

    #notifications .notifications-triangle-2 { display: inline-block; border-right: 10px solid transparent; border-bottom: 21px solid #555; border-left: 10px solid transparent; position: absolute; margin-top: -32px; margin-left: 345px; }

    #notifications.active { display: block; }


    #notifications .notifications-container { min-width: 400px; }

        #notifications .notifications-container h3 { text-align: center; display: block; margin-bottom: 10px; }

    #notifications .notification { padding: 10px 0px; border-top: 1px solid #e2e2e2; display: block; }

        #notifications .notification:first-of-type { padding-top: 0px; border-top: none; }

        #notifications .notification .btn-exclude { margin-left: 15px; }

.header-content .user-container { float: right; padding-top: 15px; }

    .header-content .user-container .user { display: inline-block; padding-top: 18px; }

        .header-content .user-container .user .user-image { width: 30px; height: 30px; border: 1px solid #555; border-radius: 50%; padding: 2px; margin-top: -2px; display: inline-block; }

        .header-content .user-container .user .user-name { color: #7d7c94; font-size: 15px; line-height: 17px; font-family: 'Roboto', sans-serif; font-weight: 400; vertical-align: super; }

            .header-content .user-container .user .user-name.no-photo { margin-top: 7px; display: inline-block; }

            .header-content .user-container .user .user-name:hover { color: #3c3b4e; }

        .header-content .user-container .user a { text-decoration: none; color: #7d7c94; }

        .header-content .user-container .user .dropdown .fa { vertical-align: super; margin-left: 5px; }

.save-container { position: fixed; top: 0px; right: 0px; margin-right: 15px; margin-top: 15px; }

    .save-container i { margin-right: 10px; }

    .save-container .save { display: none; }

        .save-container .save.success { color: forestgreen; }

        .save-container .save.in-progress { }

        .save-container .save.error { color: red; }

h1 { font-size: 30px; font-weight: 300; letter-spacing: 1px; color: #3c3b4e; text-transform: uppercase; font-family: 'Roboto', sans-serif; margin: 25px 0px; }

    h1 .fa { margin-right: 10px; }

h2 { font-weight: 500; font-size: 22px; color: #3c3b4e; font-family: 'Roboto', sans-serif; }

h3 { font-size: 18px; line-height: 24px; letter-spacing: 1px; color: #3c3b4e; font-family: 'Roboto', sans-serif; font-weight: 500; }

h4 { font-size: 16px; line-height: 20px; letter-spacing: 1px; color: #3c3b4e; font-family: 'Roboto', sans-serif; font-weight: 500; }

.status { display: block; text-align: center; }

.field-validation-error { color: red; margin-top: 5px; }

.input-validation-error { color: #a94442; background-color: #f2dede; border-color: #ebccd1; }

.btn.btn-download { background-color: #ddb11c; color: white; border-color: #ddb11c; }

    .btn.btn-download:hover, .btn.btn-download:active, .btn.btn-download:focus { background-color: #F7EA58; color: white; background-color: #F7EA58; }


/* Date Picker */
.ui-widget-content { background: white; color: #333; z-index: 2 !important; }

.ui-widget-header, .ui-datepicker-title { background: #62BAB8; border-color: #1FAEAA; color: white; }

    .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background: #62BAB8; border-color: #1FAEAA; }

    .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { color: white; background: #62BAB8; border-color: #1FAEAA; }

/* FIn Date Picker */

/* Menu */

.container-fluid { }

#ulMenu { padding: 0px; margin-bottom: 0px; padding-top: 10px; padding-bottom: 0px; }

.navbar { border-radius: 0px; border: none; text-align: center; background-color: transparent; display: inline-block; padding: 15px; padding-top: 17px; }

.navbar-nav > li { margin: 0px 2.5px; }

    .navbar-nav > li > a { color: #3c3b4e; text-transform: uppercase; font-size: 14px; line-height: 17px; font-family: 'Roboto', sans-serif; font-weight: 400; }

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus { color: #e05656; text-transform: uppercase; font-size: 14px; line-height: 17px; font-family: 'Roboto', sans-serif; font-weight: 400; background-color: transparent; }

.navbar-nav > li.active { font-weight: bold; color: #e05656; }

.menu.nav { float: left; text-align: left; }

.navbar-brand { padding-top: 27.5px; }

/* Fin Menu */

/* Datatable */

.dataTables_filter { display: none; }

.buttons-print { display: none; }

table.dataTable { font-size: 13px; }

/* Fin Datatable */
/* Device Index */

.device-index .device-filters label { margin-bottom: 0px; display: block }

/* Fin Device Index */

/* Device Detail */

.device-detail { }

    .device-detail label { font-weight: bold; }

    .device-detail h2 { font-weight: bold; }

    .device-detail .log-field-container { margin-left: 20px; }

        .device-detail .log-field-container label { margin: 0; }

        .device-detail .log-field-container .circle { border-radius: 50%; width: 14px; display: inline-block; height: 14px; }

.device-detail-tabs { }

    .device-detail-tabs .device-detail-tab { border: 1px solid #e2e2e2; display: inline-block; padding: 10px 15px; border-bottom: none; cursor: pointer; margin-left: -5px; }

        .device-detail-tabs .device-detail-tab label { font-weight: normal; margin-bottom: 0; }

        .device-detail-tabs .device-detail-tab.selected { background-color: #e2e2e2; }

        .device-detail-tabs .device-detail-tab:nth-child(1) { margin-left: 0px; }

.device-detail-panels { border: 1px solid #e2e2e2; padding: 10px }

    .device-detail-panels .panel { display: none; }

        .device-detail-panels .panel.selected { display: block; }

.device-detail-infos-generales, .device-detail-postal { border: 1px solid #e2e2e2; padding: 10px; }

.device-detail-infos-generales { margin-bottom: 20px; }

.device-detail-postal button { display: block; margin: auto; }

.device-detail #btn-save { margin-top: 10px; margin-bottom: 10px; }

.list-logs { }

    .list-logs label { display: block; }

    .list-logs .form-control-inline { display: inline-block; width: calc(50% - 5px); }

        .list-logs .form-control-inline:nth-child(3) { margin-left: 10px; }

.bal-liste-message:first-of-type { margin-top: 10px; border-top: 1px solid #e2e2e2; }
.bal-liste-message { padding: 10px; border-bottom: 1px solid #e2e2e2; font-size: 12px; }
    .bal-liste-message .fa.fa-circle { font-size: 14px; }
    .bal-liste-message span, .bal-liste-message i { }
    .bal-liste-message.selected { background-color: rgba(255, 140, 0, 0.5); }

.bal-detail-message h3 { display: block; padding-bottom: 5px; border-bottom: 1px solid #e2e2e2; margin-top: 10px; }

.bal-detail-message h4 { padding-bottom: 10px; border-bottom: 1px solid #e2e2e2; margin-top: 10px; }

.log-sections { }

.logs-content { overflow-y: auto; max-height: 1000px; }

.log-sections .log-section { border: 1px solid #e2e2e2; padding: 10px; margin-bottom: 20px; }

    .log-sections .log-section h3 { margin: 0; }

    .log-sections .log-section .total { margin: 0; }

    .log-sections .log-section small { margin-bottom: 10px; display: block; text-align: right; }
    .log-sections .log-section span { font-size: 0.7rem; font-weight: bold; vertical-align: text-top; }

#user-detail-form { margin-top: 20px; }

    #user-detail-form .tools { margin-bottom: 20px; }

.user-list-container #filters { margin-top: 20px; }

    .user-list-container #filters label { display: block; }

.device-detail-logs-container { }

    .device-detail-logs-container:first-of-type { margin-top: 20px; }

    .device-detail-logs-container h3 { margin-top: 15px; }

.device-detail-logs-container-left { border-right: 1px solid #e2e2e2; padding-top: 20px; }

    .device-detail-logs-container-left:first-of-type { padding-top: 0px; }

#device-detail-logs-alarm, #device-detail-logs-ticket { margin: auto; }

#alarm-log-total, #ticket-log-total { margin: 10px 5px; }

#device-detail-logs .content { margin-top: 20px; }

#device-detail-list-logs #btn-add-list-logs-request,
#device-detail-list-logs #btn-upload-document { }

.data-cycle-progress { display: none; }

    .data-cycle-progress.in-progress { display: inline-block; color: orange; margin-left: 5px; }

    .data-cycle-progress.success { display: inline-block; color: green; margin-left: 5px; }

#device-detail-configuration .lbl-key { font-size: 13px; }

#device-detail-configuration .lbl-value { font-weight: normal; display: block; text-align: center; font-size: 15px; }

#device-detail-configuration .configuration-container { border: 1px solid #e2e2e2; padding: 10px; }

    #device-detail-configuration .configuration-container .config-item { border: 1px solid #bbb; background-color: #e2e2e2; width: calc(33% - 10px); margin: 5px; display: inline-block; padding: 5px; }

tr.error td { background-color: red; color: white; word-break: break-all; }

tr.info td { background-color: deepskyblue; color: white; word-break: break-all; }

tr.success td { background-color: green; color: white; word-break: break-all; }

tr.warning td { background-color: orange; word-break: break-all; }

tr.fatalerror td { background-color: darkred; color: white; word-break: break-all; }

.home-console { }

    .home-console .created { width: 15%; }

    .home-console .message { width: 30%; }

    .home-console .stack { width: 45%; }

    .home-console .user { width: 10%; }

.bars { margin-left: 3px; }

    .bars .bar { width: 10px; height: 5px; position: absolute; margin-top: -5px; }

        .bars .bar.alarm { background-color: red; margin-left: 10px; }

        .bars .bar.ticket { background-color: green; margin-left: 20px; }

        .bars .bar.dataCycle { background-color: dodgerblue; }

.nav-item .fa { margin-right: 5px; }

.log-bar { margin: 10px 0px; }

    .log-bar .legend { position: absolute; width: 100%; z-index: -1; }

        .log-bar .legend p { font-size: 10px; }

    .log-bar .legend-right { margin-top: -138px; }

    .log-bar .legend .left.min { margin-top: 45px; }

    .log-bar .legend .right.max { float: right; margin-right: 30px; }

    .log-bar .legend .right.min { float: right; margin-top: 60px; margin-right: -22px; }

    .log-bar table td { padding: 0.75rem 5px; }

.count-log .bar-section { padding-bottom: 60px; }

.count-log .bar { width: 20px; position: absolute; bottom: 65px; cursor: pointer; }

#data-cycle-log-bar .count-log .bar { background-color: dodgerblue; }

#alarm-log-bar .count-log .bar { background-color: red; }

#ticket-log-bar .count-log .bar { background-color: green; }

#toolbox { position: absolute; right: 15px; z-index: 10; }

.device-index #map { height: 300px; margin: 15px 0px; border-radius: 5px; }

.abs-notifications { position: fixed; bottom: 20px; right: 20px; width: 20%; display: none; z-index: 10000; }

    .abs-notifications.active { display: block; }

    .abs-notifications .abs-notification { width: calc(100% - 20px); margin: 5px 10px; padding: 5px 10px; padding-right: 25px; border: 1px solid black; border-radius: 5px; background-color: white; }

        .abs-notifications .abs-notification .icon { display: inline-block; width: 24px; text-align: center; vertical-align: top; }

        .abs-notifications .abs-notification .message { display: inline-block; line-height: normal; width: calc(100% - 28px); }

        .abs-notifications .abs-notification .close { float: right; margin-right: -15px; margin-top: -2px; }

        .abs-notifications .abs-notification.alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }

        .abs-notifications .abs-notification.alert-error { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }

        .abs-notifications .abs-notification.alert-info { color: #004085; background-color: #cce5ff; border-color: #b8daff; }

        .abs-notifications .abs-notification.alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba; }


.device-detail-postal.b-overlay { }

.abs-postals-address { display: none; position: absolute; border: 1px solid #333; background-color: white; margin-top: -80px; margin-left: 150px; padding: 10px; width: 500px; border-radius: 5px; }

    .abs-postals-address.active { display: block; }

    .abs-postals-address .fa-map-marker-alt { margin-right: 10px; color: #1FAEAA; }

.postal-address { border-bottom: 1px solid #e2e2e2; padding-top: 5px; }

    .postal-address p span { font-size: 12px; }

    .postal-address .button { border: 1px solid #333; background-color: #1FAEAA; color: white; border-radius: 5px; transition: 0.5s; }

        .postal-address .button:hover,
        .postal-address .button:active,
        .postal-address .button:focus { color: #1FAEAA; background-color: white; }

.alert.alert-info p { margin: 0; }

.leaflet-popup-content p { margin-bottom: 10px !important; }

.leaflet-popup-content a { display: block; text-align: right; }

.device-distributors { margin-top: 30px; }

#sw-list .sw-item { margin-top: 5px; }

#sw-list, #client-list, #distributor-list { font-size: 13px; }

    #distributor-list .distributor-item { margin-top: 5px; }

.distributor-item.selected,
.client-item.selected { background-color: orange; }

.client-item, .distributor-item { border-radius: 5px; margin-top: 5px; padding: 5px; }

.switch { position: relative; display: inline-block; width: 60px; height: 34px; zoom: 0.6; margin: 0; top: -10px; }

    .switch input { opacity: 0; width: 0; height: 0; }

.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; }

    .slider:before { position: absolute; content: ""; height: 26px; width: 26px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; }

input:checked + .slider { background-color: #2196F3; }

input:focus + .slider { box-shadow: 0 0 1px #2196F3; }

input:checked + .slider:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); }

/* Rounded sliders */
.slider.round { border-radius: 34px; }

    .slider.round:before { border-radius: 50%; }

.rtm.off { margin-right: 10px; margin-left: 10px; }

.rtm.on { margin-left: 10px; color: #2196F3; }

#simulation-console { height: 300px; border: 1px solid #e2e2e2; margin-bottom: 20px; overflow-y: auto; }

    #simulation-console p { padding: 5px; margin: 0; border-bottom: 1px solid #e2e2e2; font-size: 12px; }

.device-detail-status .status { border: 1px solid #e2e2e2; margin-bottom: 10px; min-height: 150px; text-align: left; padding: 10px; }

    .device-detail-status .status p { margin: 5px; border-bottom: 1px solid #e2e2e2; font-size: 11px; }

    .device-detail-status .status .ongoing { }

.mid { width: 33%; display: inline-block; text-align: center; }
    .mid span { width: 50px; display:inline-block; }

.rules { list-style: none; padding-left: 10px; }
    .rules .rule { font-size: 16px; margin-bottom: 0px; }
        .rules .rule.valid { color: forestgreen; }
        .rules .rule.error { color: #a94442; }
        .rules .rule .fa { margin-right: 10px; }

.manage-account { }
    .manage-account .alert-index { margin: 15px 0px; }

.device-status-code label { font-weight: bold; }
.device-status-code.not-connected label { color: red; }
.device-status-code.connected label { color: green; }
.device-status-code.never-connected label { color: black; }

.parameter-d-none, .category-d-none { display: none !important; }

.file-list-table { font-size: 0.85rem !important; }
    .file-list-table td { padding: 5px 10px; }
    .file-list-table th { text-align: center; }
    .file-list-table td:nth-child(1) { width: 20%; }
    .file-list-table td:nth-child(2) { text-align: center; width: 20%; }
    .file-list-table td:nth-child(3) { text-align: center; width: 20%; }
    .file-list-table td:nth-child(4) { text-align: center; width: 20%; }
    .file-list-table td:nth-child(5) { text-align: center; width: 20%; }

    .file-list-table .folder td { background-color: rgb(245, 245, 245); }
    .file-list-table .folder .fa-minus-circle,
    .file-list-table .folder .fa-plus-circle { color: dodgerblue; }
    .file-list-table .downloaded td { background-color: lightgreen; }
    .file-list-table .requested td { background-color: lightyellow; }
    .file-list-table button, .file-list-table a { color: #555; border: none; background-color: transparent; }


#fiche-equipement-button { position: absolute; right: -25px; top: 15%; border: 1px solid #E2E2E2; border-right: none; font-size: 2rem; background-color: white; color: #555; border-radius: 25%; padding: 15px 20px; padding-right: 45px; }
    #fiche-equipement-button.active { animation: slide-left .75s forwards; }

#fiche-equipement-contenu { right: 0; position: absolute; width: 600px; top: 15%; min-height: 100px; background-color: white; border: 1px solid #E2E2E2; border-start-start-radius: 0; border-right: none; border-end-start-radius: 5px; margin-right: -600px; padding: 10px; max-height: 500px; overflow: auto; }
    #fiche-equipement-contenu.active { animation: slide-left 0.5s forwards; }
    #fiche-equipement-contenu p { margin: 0; }

    #fiche-equipement-contenu #pending-server-requests,
    #fiche-equipement-contenu .device-reports { max-height: 200px; overflow: auto; }
        #fiche-equipement-contenu #pending-server-requests .message,
        #fiche-equipement-contenu .device-reports .device-report { font-size: 0.75rem; padding: 2.5px 5px; border-bottom: 1px solid #E2E2E2; }

            #fiche-equipement-contenu #pending-server-requests .message.read { background-color: #02D951; }
            #fiche-equipement-contenu #pending-server-requests .message.unread { background-color: dodgerblue; color: white; }
            #fiche-equipement-contenu #pending-server-requests .message.error { background-color: #ff0022; color: white; }
            #fiche-equipement-contenu #pending-server-requests .message.warning { background-color: orange; }
            #fiche-equipement-contenu #pending-server-requests .message.inprogress { background-color: yellow; }

        #fiche-equipement-contenu #pending-server-requests .no-border { font-size: 0.75rem; margin: 0; padding: 0; }

.status-tag { font-size: 0.8rem; border: 1px solid; border-radius: 5px; padding: 5px 10px; }
    .status-tag.connected { color: darkgreen; border-color: darkgreen; color: darkgreen; }
    .status-tag.not-connected { color: darkred; border-color: darkred; color: darkred; }
    .status-tag.never-connected { color: darkblue; border-color: darkblue; color: darkblue; }

@keyframes slide-left {
    from { transform: translateX(0); }
    to { transform: translateX(-600px); }
}