﻿textarea {
    width:100%;
}

table {
    border-spacing:10px;    
}

td {
    padding:10px;
}

.unpad {
    padding: 0 !important;
}

.unmargin {
    margin: 0 !important;
}

.dropdown-menu {
    margin-top:10px !important;
}

.navbar .navbar-collapse .navbar-nav > li.dropdown:after {
    top:80px !important;
}

.text_center {
    text-align: center !important;
    align-items:unset !important;
}

aside.app-sidebar {
    height:auto !important;
    height:-moz-fit-content !important;
}

#btnLogout {
    width: 30%;
    background-color: #095077;
    color: #FFF;
}

.frame_number {
    text-transform:uppercase;
}

.page_bottom_space {
    height: 80px;
}

.signin_box {
    top: 200px !important;
}

.hyperdrivers_login_background
{
    background:url(../images/login_bg_new.jpg) no-repeat;
    background-size:100% 100%;
}

.app-login .app-body .app-block {
    left:6%;
    top:310px;
    position:relative;
}

.disable {
    pointer-events:none;
}

.gridbox {
    border: solid 1px #000;
    border-radius: 30px;
    background-color:#FFF;
    padding:20px;
    margin-right:1px;
}

    .gridbox b {
        font-size:16px;
    }

.reject_card_box_icon {
    transform:none !important;
    top:unset !important;
    position:unset !important;
    padding:unset !important;
}

.hide {
    display:none !important;
}

.show {
    display:block !important;    
}

.customer_section input[type=text] {
    color:#000;
}

.service_history_row {
    padding:10px;
    width:95%;
    margin:15px 0px 10px 20px;
    border: solid 1px #D1D1D1;
    transition: linear 0.3s;
}

    .service_history_row_bigger {
        width:100% !important;
        margin: 15px 0px 10px 0px !important;
    }

    .service_history_row:hover {
        background-color: #EDEFF2;
        cursor: pointer !important;
        transition: linear 0.3s;
        border-left: solid 2px darkblue;
        border-right: solid 2px darkblue;
    }

    .service_history_row .row_details_button:hover {
        cursor:pointer;
    }

.service_history_row:hover .toggler {
    color:#FFF;
}

        .service_history_row:hover .details_panel, .service_history_row:hover span {
            color: #FFF !important;
        }

  .service_history_row .toggler:hover {
      cursor:pointer;
  }

.details_panel {
    margin:20px 0px 0px 80px;
    width:80%;
    border-top: solid 1px #31BCEA;
}

.details_panel .panel_title {
    font-size:2em;
    font-weight:bold;
    text-align:center;
    margin-top:30px;
}

.row_details {
    padding: 10px 0px;
}

.row_details td:first-child {
    color:rgba(0,0,0,1);
}

.row_details td:last-child {
    text-align:center;
}

.row_details span {
    display:block;    
}

.row_details span:nth-child(2) {
    margin-left:15px;
}

.row_details_button {
    cursor:pointer;
    margin-top:5px;
    color:#31BCEA;
}

.big_titles_service {
    font-size:24px;
}

.txtTime {
    display:inline;    
    width:15%;
}

.txtMalfunction {
    width:100%;
}

.menu_body {
    background:url(../images/menu_bg_new.jpg) no-repeat 0 0 !important;
    background-size:100% 100% !important;
    background-color:transparent !important;
}

.login_header_title {
    padding:20px 0px;
    font-size:1.5em;
    color: #006AAF;
}

.login_box_smaller img {
    padding-bottom:50px;
    display:block;
    margin:0 auto;
}

.login_box_smaller a {
    display: block;
    margin: 0 auto;
}

.type_loader {
    display: none;
}

    .type_loader img {
        width: 10%;
        display:inline-block;
    }

.gas_type_error {
    border: solid 1px red !important;
}

.gas_type_valid {
    border: solid 1px green !important;
}

.submit_button {
    background-color: transparent;
    font-size: 1.1em;
    font-family: 'Open Sans', sans-serif;
    color: #777;
    background-color:transparent;
    border:solid 1px green;
    padding:15px;
    border-radius:3px;
}

    .submit_button:hover {
        color: #000;
        transform: translate(0, -2px);
        transition: all .3s ease;
    }

.menu_box_flat {
    width:15% !important;
    min-height:60px !important;
    top:350px !important;    
    margin-right:2.1%;
    cursor:pointer;
    font-size:13px;
    padding-right:5px;
}

.menu_box_flat .app-form{
    padding:0 !important;
}

.menu_box_flat img {
    float:left;
}

.menu_box_flat a {
    font-weight:bold;
}

.menu_box_flat .col-xs-12 p {
    
    margin: 10px 0px 0px 60px;
    word-break:break-word;
}

.service_attributes_table, .guarantees_attributes_table {
    border-spacing: 10px;
    border-collapse: separate;
}

.service_attributes_table td {
    padding:0;
}

    .service_attributes_table td:last-child {
        width:30%;
    }

.service_attributes_table {
    width:100%;
    border-bottom:solid 1px #31BCEA;
}

.service_attributes_table th:last-child {
    text-align:center !important;
}

.guarantees_attributes_table {
    width:100%;
}

    .guarantees_attributes_table .row_details td:nth-child(2){
        text-align:center;
    }

.service_attributes_table .first_cell{
    width:90%;
}

service_attributes_table td, .guarantees_attributes_table td {
    padding:10px;
}

.guarantees_attributes_table td:first-child {
    width: 10%;
}

    .guarantees_attributes_table .cell2, .guarantees_attributes_table td:first-child {
        width:200px;
        text-align:center;
    }

    .guarantees_attributes_table .cell3 {
        width:350px;
        text-align:center;
    }

#modGuaranteeHistory .title, #modServiceHistory .title, #modNewService .title, #modNewGuarantee .title {
    font-weight:bold;
    text-align:center;
    color:rgba(0,106,175,1);
    font-size:32px;
    padding:10px 0px;
    border-top: solid 1px rgba(0,106,175,1);
    border-bottom: solid 1px rgba(0,106,175,1);
    margin-bottom:30px;
    background-color: rgba(0,106,175,1);
    color:#FFF;
}

#modGuaranteeHistory b, #modServiceHistory b {
    font-size:16px;
}

#modNewAccessory textarea {
    width:100%;
    height:150px;
}

.success {
    color: green !important;
}

.warning {
    color:orange !important;
}

.danger {
    color: red !important;
}

.separate_vertical_line {
    width:2px; 
    background-color:#C1C1C1; 
    height:20px; 
    margin: 0px 20px;
}

.li_margin {
    margin-right:5%;
}

.li_remove_height {
    height: 100% !important;
}

.navbar_no_padding {
    padding:0 20px 0px 0px !important;
}

.navbar_title_bgcolor {
    background-color: #39c3da;
    color:#FFF;
}

/*GROUPBOXES*/
.profile_info {
    border:solid 1px #006AAF; 
    padding-bottom:10px; 
    width:100%;
    margin:20px 0px;
}

.profile_info_small {
    width:50% !important;
}

.groupbox {
    position:relative; 
    top:-1.5em; 
    left:2em; 
    padding:5px; 
    width:235px; 
    background-color:#FFF;
}

.groupbox i {
    color:#006AAF;
    float:left;
}

.groupbox .groupbox_inner {
    color:#006AAF;
    font-size:1.3em; 
    float:left;
    margin:2px 0px 0px 10px;
}

/*DOCUMENTS*/
.doc {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    width: 90%;
    border: solid 1px #757575;
    padding: 20px;
    display: block;
    margin: 10px auto;
    position:relative;
}

.doc_buttons {
    margin:20px 47px;
    float:left;
}

    .doc .header {
        margin: 10px 10px 15px 0px;
    }

    
.doc img:not(.help_icon) {
    display: block;
    margin: 0 auto;
    width: 100%;
}

    .doc .header p {
        color: #757575;
        text-align: left;
    }

    .doc .footer {
        margin-top: 85px;
    }

.doc .body .title {
    text-transform: uppercase;
    color: #0090d2;
}

.doc .body .doc_logo {
    display:block;
    margin:0 auto;
    width:50%;
}

    .doc .body span {
        /*border-bottom: solid 1px #000;*/
        font-weight: bold;
        min-width:50px;
        margin-left:5px;
        display:inline-block;
    }

    .doc .body .installer {
        margin: 5px 0px 20px 0px;
    }

        .doc .body .installer b {
            color: #0090d2;
        }

        .doc .body .installer p {
            color: #606060;
        }

    .doc .body .vehicle_owner {
        margin: 35px 0px 0px 0px;
    }

        .doc .body .vehicle_owner b {
            color: #0090d2;
            padding-bottom: 5px;
            display: block;
            border-bottom: solid 1px #0090d2;
            margin-bottom:10px;
        }

        .doc .body .column {
            color: #606060;
            padding-bottom: 5px;
            display: block;
            border-bottom: solid 1px #0090d2;
            padding-left: 0 !important;
            padding-right: 0 !important;
        }


    .doc .body .lpg {
        margin: 28px 0px;
    }

        .doc .body .lpg b {
            color: #006AAF;
        }

    .doc .body .accessories {
        margin: 25px 0px 20px 0px;
    }

        .doc .body .accessories b {
            color: #0090d2;
            padding-bottom: 5px;
            display: block;
            border-bottom: solid 1px #0090d2;
            margin-bottom: 10px;
        }

        .doc .body .accessories .beck_column {
            display:inline-flex;
            float:left;
        }

        .doc .body .declaration {
            font-size: 12px;
            color: #757575;
        }

    .doc .body .declaration ol {
        padding:0;
    }
        .doc .body .declaration ol li b {
            color: #006AAF;
            font-size:14px;
            font-style:italic;            
        }

        .doc .body .declaration ol li {
            list-style-type: none;       
            margin-top:5px;     
        }

        .doc .website {
            margin-top:30px;
            text-align:center;
            font-size:22px;
            font-weight:bold;
            color:rgba(1, 104, 174, 1);
        }

        .doc .tootip_div {
            display:inline-block;
        }

        .doc .help_icon {
            cursor:pointer;
        }

        .doc .help_icon:hover + .tooltip_image {
            display:block;
        }

.doc .tooltip_image {
    position: absolute;
    display: none;
    width: 400px;
    margin-left: 20px;
    margin-top: -120px;
    z-index:100000;
}

.doc .footer .signature {
    border-top: solid 1px #757575;
    padding: 5px;
}

    .doc .body .essay {
        margin: 25px 0px 50px 0px;
        color: #757575;
    }

.doc .body .digital_signature {
    font-size:18px;
    background: url('../images/idotografima.png') no-repeat center;
    background-size: 60%;    
}

.doc .body .digital_signature .title {
    text-align:center;
    font-size:32px;
    text-transform:none;
    font-weight:bold;
    padding-bottom:50px;   
}

    .doc .body .digital_signature .text{
        text-align:justify;
    }

        .doc .body .digital_signature .text p {
            font-weight:bold;
            padding-bottom:25px;
        }

    .doc .body .digital_signature .text {
        text-align: center;
        padding: 0 8%;
        line-height: 1.5;
    }

        .doc .body .digital_signature .text .vehicle_details input[disabled] {
            border-color: lightgray;
            background-color: lightgray;
        }

        .doc .body .digital_signature .text .vehicle_details {
           padding-top:20px;
        }

            .doc .body .digital_signature .text .vehicle_details .vehicle_frame_number {
                display: block;
                margin: 0 auto;
                width: 600px;
                padding-bottom: 30px;
                position: relative;
            }

            .doc .body .digital_signature .text .vehicle_details .hexahydrate_number {
                width: 300px;
                display: block;
                margin: 0 auto;
                padding-bottom: 30px;
                position: relative;
            }

            .doc .body .digital_signature .text .vehicle_details .vehicle_ecu_number {
                display: block;
                margin: 0 auto;
                width: 480px;
                position: relative;
            }

            .doc .body .digital_signature .text .vehicle_details .vehicle_frame_number b {
                display:inline-block;
                margin: 0 auto;
            }

            .doc .body .digital_signature .text .vehicle_details .car_details {
               width:100%;
               padding-bottom:30px;
               position:relative;
            }

                .doc .body .digital_signature .text .vehicle_details .car_details .car_brand {
                    width: 50%;
                    float:left;
                    position:relative;
                }
                .doc .body .digital_signature .text .vehicle_details .car_details .car {
                    width: 50%;
                    float: left;
                    position: relative;
                }
                .doc .body .digital_signature .text .vehicle_details .car_details .car_spec, .doc .body .digital_signature .text .vehicle_details .car_details .car_plate {
                    width: 70%;
                    display: block;
                    margin: 0 auto;
                    position: relative;
                }
                .doc .body .digital_signature .text .vehicle_details .car_details .car_plate {
                    visibility:hidden;
                }
                
                .doc .body .digital_signature .text .vehicle_details .car_details .car_type {
                    width: 60%;
                    float: left;
                    position: relative;
                }
                
                .doc .body .digital_signature .text .vehicle_details .car_details .car_type input[type=text] {
                    float:left;
                    width:30%;
                }

                .doc .body .digital_signature .text .vehicle_details .car_details .car_environmental_instruction {
                    width: 40%;
                    float: left;
                    position: relative;
                }

                .doc .body .digital_signature .text .vehicle_details .car_details .car_input {
                    width: 90%;
                }

            .doc .body .digital_signature .text .vehicle_details .car_details select {
                width:98%;
            }

            .doc .body .digital_signature .text .cooperator {
                width: 100%;
                padding-bottom: 30px;
                position: relative;
            }

            .doc .body .digital_signature .text .vehicle_details .car_reservoir {
                width: 100%;
                padding-bottom: 30px;
                position: relative;
                border-bottom: solid 1px #000;
            }

            .doc .body .digital_signature .text .vehicle_details .car_reservoir input[type=text]{
                width: 100%;
                
            }   

            .doc .body .digital_signature .text input[type=text] {
            float: left;
            margin-right: 5px;
            border: solid 1px grey;
            width: 30px;
            height: 50px;
            padding: 5px;
            background-color: #FFF;
            color: #000;
            text-align: center;
        }

        .doc .body .digital_signature .text select {
            width:50%;
            display:block;
            margin:0 auto;
        }

    .doc .body .digital_signature b {
        color: #000000;
        display: inline;
    }

.doc .body .reservoir p {
    text-align: justify;
}

    .doc .body .reservoir h2 {
        text-align: center;
        font-weight:bold;
    }

.doc .body .reservoir h4 {
    font-weight: bold;
    color: rgb(35, 94, 159);
    border-bottom:solid 1px rgb(35, 94, 159);
    padding-bottom:7px;
}

.doc .body .reservoir .sfragida {
    width: 50%;
    text-align: left;
    margin-top: 20px;
    display: inline;
}

.doc .body .reservoir .sfragida_title {
    margin-top: 10px;
}

.doc .body .reservoir table {
    width:100%;
    border-collapse:collapse;
}

    .doc .body .reservoir table tr td {
        padding: 10px 0px;
    }

    .doc .body .reservoir table tr td:nth-child(2n + 1) {
        width: 45%;
        border-bottom: solid 1px rgb(35, 94, 159);
    }

    .doc .body .reservoir table tr td:nth-child(2) {
        width: 5%;
    }    

.doc .body .reservoir p span {
    color: rgb(35, 94, 159);
    margin:0;
}

.doc .footer .digital_signature {
    font-weight: bold;
    text-align: center;
    font-size: 20px;
    line-height: 5;
}

.doc .body .personal_info table tr td {
    font-size: 12px;
    padding: 5px;
    vertical-align:middle;
}

.doc .body .personal_info table tr td:first-child {
    width:15%;
}

.doc .body .personal_info table tr td input {
    margin: 0;
}

    .logo_underline {
        border-bottom: solid 2px rgba(1, 104, 174, 1);
    }

.logo_underline_pad {
    padding-bottom:10px;
}

.login_box_smaller {
    margin-right: 2%;
    min-height: 250px !important;
    width: 15%;
}

.app-login .logo {
    position: absolute;
    left: 250px;
    top: 240px;
    z-index: 1000000;
}

.menu_body .logo {
    left:6%;
}

.search_textbox {
    width:85%; 
    float:left; 
    margin-right:10px;
}

.search_button {
    width:10%; 
    float:left; 
    margin-right:10px;
}

.card_middle {
    margin-top:250px;
}

.container-fluid {
    padding-right:0 !important;
    padding-left:0 !important;
}

.hwcard {
    display:block !important;
    margin:150px auto !important;
    width:80% !important;
    padding: 20px 0px !important;      
}

.card_middle .card-body .col-md-9 input[type=text] {
    margin-left:0 !important;
}

.card-body .report_row {
    padding:10px 0px;
    border-bottom:solid 1px #e0d6d6;
    width:100%;
    margin:10px 0px 0px 0px !important;
    cursor:auto;
}

.card-body .report_row b {
    word-break:break-all;
    font-size:1.15em;
}
.card-body .report_row a {
    word-break:break-all;
}   
 
.card-body .report_title {
    padding:5px;
    color:coral;
    text-align:center;
}

.hw_responsive_link {
    width:100%;
    white-space: normal;
    padding-left:5px;
    padding-right:5px;
}

.terms img {
    float:right;
}

.terms .hwCheck {
    float: right;
    margin: 10px 0px 0px 20px;
}

.terms .text {
    margin-top:3%;
}

.terms .terms_container {
    margin-top: 1%;
}

aside.app-sidebar, .navbar .navbar-collapse {
    box-shadow: #006AAF 0px 0px 20px 2px;
}

    aside.app-sidebar .sidebar-header {
        border-bottom: solid 3px lightblue;
    }

.menu_navbar {
    background-color: rgba(255, 255, 255, 0.5) !important;
    padding: unset;
    margin-bottom: unset;
    position:absolute;
    width:100%;
}

.menu_navbar_no_shadow {
    box-shadow: none !important;
    background-color: rgba(255, 255, 255, 0.5) !important;
}

/*SIDE MENU*/
.admin_kits {
    color: #39c3da !important;
}

.admin_accessories {
    color: #FFBC11 !important;
}

.admin_customers {
    color: #29c75f !important;
}

.admin_cooperators {
    color: #FF5E63 !important;
}

.admin_users {
    color: #999999 !important;
}

.admin_kteo {
    color: #FF8B56 !important;
}

.admin_reports {
    color: #001DC4 !important;
}

.coop_menu {
    color: #006AAF !important;
}

/*
aside.app-sidebar .sidebar-menu ul.sidebar-nav > li > a .icon, aside.app-sidebar .sidebar-menu ul.sidebar-nav > li.active > a .icon {
    background-color:#FFF;
}

aside.app-sidebar .sidebar-menu ul.sidebar-nav > li > a .title, .navbar .navbar-collapse .navbar-nav > li.navbar-title {
    color:#FFF;
}

.btn-success {
    color: #FFF !important;
    background-color: #5cb85c !important;
    border-color: #5cb85c !important;
}

.btn-danger {
    color: #FFF !important;
    background-color: #d9534f !important;
    border-color: #d43f3a !important;
}

.btn-warning {
    color: #FFF !important;
    background-color: #f0ad4e !important;
    border-color: #eea236 !important;
}

.btn-primary {
    color: #FFF !important;
    background-color: #337ab7 !important;
    border-color: #2e6da4 !important;
}
*/

/*MENU ITEM NOTIFICATIONS*/
.notification_dropdown {
    position:relative;
    top:-50px;
    left:50px;
}

.notification_bell {
    font-size: 1.6em;
    width: 45px;
    height: 45px;
    transition: all 0.2s ease;
    border-radius: 50%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: rgba(231, 76, 60, 1);
    color: rgba(255,255,255,1);
    float: right;
}

.notification_count {
    position: absolute;
    top: 0;
    left: auto;
    bottom: auto;
    right: -5px;
    width: 100%;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 0.70em;
    font-weight: 400;
    color: #FFF;
    padding: 3px;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    line-height: 1em;
    background-color: rgba(252, 130, 41, 1);
    box-shadow: 0 1px 2px rgba(252, 130, 41, 0.1);
}

.notification_dropdown_menu {
    display: block;
    visibility: hidden;
    position: absolute;
    right: 0;
    left: 97%;
    z-index:10000000;
    top: 0%;
    opacity: 0;
    min-width: 300px;
    transition: all 0.3s ease;
    transform: translate(0, 0);
    padding-top: 0;
    padding-bottom: 0;
    border: 1px solid #dfe6e8;
    background-color: #FFF;
}

.notification_dropdown:hover .notification_dropdown_menu {
    display: block;
    visibility: visible;
    opacity: 1;
    transform: translate(0, -20px);
}

.notification_dropdown:hover:after {
    display: block;
    visibility: visible;
    opacity: 1;
    transform: translate(-50%, -20px);
}

.notification_dropdown_menu .dropdown-header {
    background: transparent;
    padding: 1.2rem;
    color: #222;
    font-weight: 400;
    background-color: rgba(141, 146, 147, 0.1);
    border-bottom: none;
}

.notification_dropdown_menu .dropdown-footer {
    background-color: transparent;
    border-top: 0;
    font-weight: 300;
    font-size: 0.9em;
    text-align: right;
}

    .notification_dropdown_menu .dropdown-footer a {
        color: #8d9293;
        padding: 1.2rem;
    }

.notification_dropdown_menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.notification_dropdown_menu ul li {
    border: 0;
    border-radius: 0;
    padding: 0;
    border-bottom: 1px solid rgba(141, 146, 147, 0.1);
    margin-bottom: 0;
    font-weight: 300;
    font-size: 0.9em;
}

    .notification_dropdown_menu ul li.empty {
        color: #8d9293;
        font-weight: 200;
    }

    .notification_dropdown_menu ul li:hover {
        background-color: rgba(141, 146, 147, 0.1);
        color: #222;
        cursor: pointer;
    }

    .notification_dropdown_menu ul li a {
        display: block;
        text-decoration: none;
        color: #444 !important;
        padding: 1.2rem;
        font-weight: 400;
    }

        .notification_dropdown_menu ul li a .message {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-direction: row;
            flex-direction: row;
            -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-pack: start;
            justify-content: flex-start;
            padding-right: 40px;
        }

            .notification_dropdown_menu ul li a .message .content {
                -ms-flex: 1;
                flex: 1;
            }

                .notification_dropdown_menu ul li a .message .content .title {
                    font-weight: 400;
                    font-size: 1.2em;
                }

                .notification_dropdown_menu ul li a .message .content .description {
                    font-weight: 400;
                    font-size: 0.85em;
                    opacity: 0.4;
                }

    .notification_dropdown_menu ul li span .badge {
        border-radius: 3px;
        font-weight: 400;
        font-size: 1.4em;
    }

.navbar .navbar-collapse .navbar-nav > li.dropdown.notification a.dropdown-toggle .icon {
    width: 60px !important;
    height: 60px !important;
}

.hyperware {
    width: 20%;
    background-color: #FFF;
    position: absolute;
    bottom: 0;
    right:0;
    text-align: center;
}

.hyperware img {
    width:32px;
}

.app-footer {
    display:block;
    margin:0 auto;    
}

.hw {
    font-size:10px;
    text-align:center;
}

.copyright {
    font-size: 14px !important;    
}

.hw img {
    width:16px;
}

.search_panel {
    margin:20px 0px;
}

.search_panel i {
    color:#0c2ba3;
}

.precheck_service_menu_item {
    position:fixed;
    right:1%;
    top:20%;
    background-color:#FFF;
    text-align:center;
    cursor:pointer;
}

#timer {
    border: solid 1px #006AAF;
    border-radius: 5px;
    padding: 10px;
    font-weight: 700;
    font-size: 20px;
    font-family: Rockwell;
    margin-top:10px;    
}

/*COMMERCIAL*/
.commercial {
    height: 700px;
    background-size: 100% 100%;
    border: solid 15px !important;
    padding: 0px !important;    
}

    .commercial .close_button {
        color: rgb(251, 176, 59);
        float: right;
        border: 0;
        font-size: 10px;
        margin: 0px 10px 0px 0px
    }

        .commercial .close_button:hover {
            background: none !important;
            color: rgb(179, 142, 81) !important;
        }

    .commercial .panel {
        width: 250px;
        height: 60px;
        background-image: linear-gradient(to bottom, rgb(251, 176, 59), rgb(44, 30, 6));
        border-radius: 10px;
        position: absolute;
        bottom: 30px;
        right: 100px;
    }

        .commercial .panel .num {
            font-size: 22px;
            color: #FFF;
            font-weight: bold;
            background-image: linear-gradient(to right, #845819, #9A7B49);
            border-radius: 5px;
            width: 55px;
            height: 40px;
            padding: 3px 0px 0px 10px;
            margin: 8px 0px 0px 5px;
            float: left;
        }

    .commercial .buttons {
        width: 80px;
    }

        .commercial .buttons .plus {
            font-size: 14px;
            background-color: #845819;
            width: 20px;
            height: 19px;
            text-align: center;
            position: absolute;
            top: 8px;
            left: 40px;
            border-top-right-radius: 5px;
        }

        .commercial .buttons .minus {
            font-size: 14px;
            background-color: #845819;
            width: 20px;
            height: 19px;
            text-align: center;
            position: absolute;
            top: 29px;
            left: 40px;
            border-bottom-right-radius: 5px;
        }

        .commercial .buttons .plus, .commercial .buttons .minus {
            cursor: pointer;
        }

        .commercial .buttons .fa {
            color: #FFF;
            font-weight: normal;
        }

    .commercial .panel .send {
        position: absolute;
        color: #FFF;
        right: 10px;
        bottom: 10px;
        width: 150px;
        height: 35px;
        border-radius: 10px;
        padding-top: 3px;
        text-align: center;
        background-image: linear-gradient(to bottom, rgb(251, 176, 59), rgb(44, 30, 6));
        font-size: 20px;
        font-weight: bold;
        border: 0;
    }
    
    .kit_menu_box_details {
        margin-top:20px;
    }

        .kit_menu_box_details span {
            color: #39c3da;   
            font-weight:600;
        }

        .kit_menu_box_details span {
            margin-right:15px;
        }

.card.card-blue-light:hover .card-body .content .kit_menu_box_details span {
    color:#FFF;
}

/*HWWIZARD*/
#wizard {
    border-radius: 3px;
    box-shadow: 0 1px 2px #c8d1d3;
}

    #wizard #steps_summary .link_step:hover {
        cursor: pointer;
        background-color: rgba(28, 106, 152, 0.5);        
    }

        #wizard #steps_summary .link_step:hover p {
            color: lightgreen;
            font-weight: bold;            
        }

    #wizard h1 {
        text-align: left;
        border: 0;
        color: #1C6A98;
        font-weight: bold;
        background-color: #FFF;
        display: inline-block;
        padding: 20px 14px;
        margin: 0 !important;
    }

    #wizard .separate_line {
        height: 1px;
        background-color: #FFF;
        width: 100%;
        margin-top: 20px;
    }

    #wizard .profile_info .groupbox_inner b {
        font-size:23px;
    }

    #wizard select {
        margin-bottom: 15px;        
    }

    #wizard input[type=text], #wizard select, #wizard input[type=number] {
        border: solid 2px #8FB5CC;
    }

    #wizard .hw_wizard_step {
        display: none;
    }

    #wizard .hw_wizard_step h3 {
        background-color: #FFF;
        color: #1C6A98;
        font-weight: bold;
        padding-bottom: 5px;
        border-bottom: solid 1px #1C6A98;
    }

        #wizard .hw_wizard_step input[type=text] {
            text-transform: uppercase;
        }

        #wizard .hw_wizard_step .email {
            text-transform:none !important;
        }

#wizard .hw_wizard_current_step {
    display: block !important;
}

    #wizard .hw_wizard_current_step .title {
        color: #1F6996;
    }

#wizard #right_arrow:hover, #wizard #left_arrow:hover {
    cursor: pointer
}

#wizard #steps_summary {
    background-color: #F2F2F0;
    min-height:800px;
}

    #wizard #steps_summary .empty_space {
        height: 60px;
        display: block;
    }

#wizard #steps_summary .step {
    color:#FFF;
    font-weight:bold;
    font-size:16px;
    margin:20px auto;    
    text-align:center;
}

    #wizard #steps_summary .step p {
        color: #1C6A98;
        padding: 12px 5px 3px 5px;
    }
    #wizard #steps_summary .step_line {
        height:30px;
        width:5px;
        background-color:#FFF;
        margin:0 auto;
    }

    #wizard #steps_summary .step span {
        border: solid 3px #FFF;
        border-radius: 100%;
        padding: 10px;
        font-size:16px;
        display:inline-block;
        margin-right:10px;
    }

        #wizard #steps_summary .active {            
            background-color: #1C6A98;
        }

        #wizard #steps_summary .active span {
            border: solid 3px #FFF;
        }

            #wizard #steps_summary .active p {
                color: #FFF;
                font-weight: bold;                
            }

            #wizard #steps_summary .selected p{
                color: lightgreen;
            }

#wizard #steps_panel {
    min-height: 800px;
}

        #wizard #steps_panel .hw_wizard_step:last-child img {
            margin:20px 0px;
        }

        #wizard #step_buttons {
            background-color: #FFF;
            position: relative;
            bottom: 0;
        }

    #wizard #step_buttons a {
        color: #FFF;
    }

#wizard .profile_info {
    margin: 20px 0px 0px 0px !important;
}

#wizard #wizard_error {
    opacity:0;
    padding:20px;
    text-align:center;
    background-color:red;
    color:white;
    font-size:16px;
    border-radius:15px;
    position:absolute;
    margin: 0 auto;
    left:25%;
    width:50%;
    z-index: 10000000;
}

#wizard #wizard_error i:hover {
    cursor:pointer;
}

#wizard .gas_type_error {
    background-color: lightcoral;
    color: white
}

#wizard .gas_type_valid {
    background-color: #FFF;
    color: #004775;
    border: solid 1px green;
}

/*COOPERATOR EXPIRED_GUARANTEES*/
#coop_expired_guarantees {
    background-color: #e7edee;
}

    #coop_expired_guarantees .service_statistics_panel, #coop_expired_guarantees .search_panel, #coop_expired_guarantees .results {
        background-color: #FFF;
        border-radius: 13px;
        box-shadow: 0 1px 2px #c8d1d3;
        margin: 10px;
        min-height: 185px;
        font-size: 16px;
        font-weight:600;
        padding: 20px 15px 0px 0px;
    }

    #coop_expired_guarantees .stat_panel {
        background-color: #FFF;
        border-radius: 3px;
        box-shadow: 0 1px 2px #c8d1d3;
        margin: 20px 0px 20px 20px;
        font-size: 16px;
    }

    #coop_expired_guarantees .service_statistics_panel div:nth-child(3n+3) {
        margin-bottom: 5px;
    }

        #coop_expired_guarantees .service_statistics_panel .fa-info {
            color:Highlight;
            font-style:italic;
            margin-bottom:20px;
        }

        #coop_expired_guarantees .service_statistics_panel .charts .chart_label {
            font-size: 12px;
            text-align: center;
        }

        #coop_expired_guarantees div[hw_pager_item] {
            min-height: 50px;
            font-size: 16px;
            color: #fc8229;
            margin-bottom: 10px;
            padding-top: 5px;
            border: solid 1px;
        }

    #coop_expired_guarantees div[hw_pager_item]:nth-child(2n) {
        background-color: rgba(252, 130, 41, 0.2);
    }

        #coop_expired_guarantees div[hw_pager_item] div:not(.status) {
            padding-top: 10px;
        }
    
    #coop_expired_guarantees div[hw_pager_item] div:first-child {
            font-weight: bold;
        }

    #coop_expired_guarantees .stat_panel {
        padding: 0px 10px;
    }

        #coop_expired_guarantees .stat_panel .stat_row {
            padding: 10px 0px 10px 10px !important;
            transition: linear 0.5s;
            border-bottom: solid 1px #e7edee;
        }

        #coop_expired_guarantees .stat_panel .stat_row a {
            text-align:left;            
            white-space:normal;
        }

            #coop_expired_guarantees .stat_panel .stat_row i {
               display:inline-block;
               margin:10px 0%;
            }

            #coop_expired_guarantees .stat_panel .stat_row:hover {
                background-color: rgba(252, 130, 41, 0.1);
                cursor:pointer;
                transition:linear 1s;
            }

#results {
    text-align:center;
}

.results .result_headers {
    font-weight:bold;
    text-align:center;    
}

.results .result_headers_horizontal {
    font-weight: 600;
    text-align: left;
    font-size: 20px;
}

.small_font {
    font-size: 13px;
}

.results .month_box {
    border: solid 1px #D3D3D3;
    font-weight: 600;
    text-align: center;
}

    .results .month_box p, .results .month_box a {
        font-size: 18px;
    }

.results .breadcrumb {
    color:royalblue;
}

.info {
    font-size:18px;
    color:cornflowerblue;
    float:left;
    margin: 0px 10px 40px 0px;
}

.info_text {
    font-size:12px;
    font-style:italic;
}

.stat_row_selected {
    background-color: rgba(252, 130, 41, 0.3);
}

.stat_row_selected:hover {
    cursor:pointer;
}

.report .report_row {
    padding:10px 0px;
}

.report .report_row a {
    color:yellow;
}

    .report .report_row a:hover {
        color:goldenrod;
    }


    .report .report_row .btn-primary, .report .report_header .btn-primary {
        background-color:darkblue;
    }

.report .report_header {
    margin: 25px 0px;
    padding:0;
    border-bottom: solid 1px lightgray;
    text-align: center;
}

.lovato_hellas_profile {
    width:100%;
    height:1024px;
    border:0;
}

.card_body_white {
    background-color:#FFF !important;
}

.default_card_padding {
    padding:20px !important;
}

.total_width {
    width: 100%;
    height: 100%;
}

.frame_height {
    height: 960px;
}

.modal_height_with_frame {
    height: 1300px;
}

#excel_rows {
    border-bottom:solid 1px #000;
}

#excel_rows [hw_pager_item] {
    padding: 10px 0px;
}

    #excel_rows [hw_pager_item]:last-child {
        padding: 10px 0px;
    }

    .card_banner_report_min_height {
        min-height: 280px;
    }

.selected_stat_link {
    background-color: #8ec8d1 !important;
    padding: 10px 0px;
}

#det_results a[id^=lnk_] i {
    font-size: 1.5em;
}

/*RESPONSIVE*/
@media (max-width: 1680px) {
    .login_box_smaller:nth-child(5) .app-form img {
        padding-top: 40px;
        padding-bottom: 35px;
    }

    .login_box_smaller:nth-child(1) img {
        padding-top: 40px;
    }
}
@media (max-width: 1580px) {
    .login_box_smaller:nth-child(5) .app-form img {
        padding-top: 50px;
        padding-bottom: 40px;
    }

    .login_box_smaller:nth-child(1) img {
        padding-top: 40px;
    }
}
@media (max-width: 1440px) {
    .search_textbox {
        width: 82%;
    }

    .login_box_smaller:nth-child(5) .app-form img {
        padding-top: 40px;
        padding-bottom:50px;
    }

    .login_box_smaller:nth-child(1) img {
        padding-top: 40px;
    }
}

    @media (max-width: 1350px) {
        .login_box_smaller {
            width: 20%;
        }

        .menu_box_flat {
            width: 20% !important;
        }

        .terms .hwCheck {
            margin: 20px 0px 0px 20px;
        }

        .login_box_smaller:nth-child(5) .app-form img {
            padding-top: 50px;
            padding-bottom: 40px;
        }

        #wizard #steps_summary .step p {
            font-size:14px;    
        }
    }

    @media (max-width: 1200px) {
        .search_textbox {
            width: 80%;
        }

        #wizard #steps_summary .step p {
            font-size: 12px;
        }
    }

    @media (max-width: 1100px) {
        .search_textbox {
            width: 77%;
        }
    }

@media (max-width: 991px) {
    .login_box_smaller {
        margin: 10px auto;
        width: 60%;
        display: block;
        margin: 10px auto;
    }

    
    .menu_box_flat {
        top: 165px !important;
        width: 60% !important;
        left: 20% !important;
        margin-bottom: 20px;
        text-align:center;
    }

    .menu_box_flat img {
        float:none;
        display:inline;
    }

    .menu_box_flat .col-xs-12 p {
        margin:0;
        width:100%;
    }
    
    .app-login .app-body {
        display: initial;
    }

        .app-login .app-body .app-block {
            left: 0;
            top: 150px;
        }

    .app-login .logo {
        top: 50px;
    }

    .menu_body .logo {
        top: 50px;
        left: 19%;
    }

    .menu_body, .hyperdrivers_login_background {
        background-size: 100% 50% !important;
        background-color: #f1f1f1;
    }

    body {
        background-size: 100% 50% !important;
        background-color: #f1f1f1;
    }

        .hyperdrivers_login_background .app-body .app-block {
            top: 270px;
            width: 60%;
            display: block;
            margin: 0 auto;
        }

    .search_textbox {
        width: 100%;
        float: none;
    }

    .search_button {
        float: none;
    }

    .doc .body .digital_signature .text .vehicle_details .vehicle_frame_number {
        width: 315px;
    }

    .doc .body .digital_signature .text select {
        width: 100%;
    }

    .terms .terms_container {
        display: block;
        margin: 0 auto;
    }

    .hyperware {
        width: 15%;
    }

        .hyperware a, .hyperware h5 {
            font-size: 12px;
        }

        .hyperware img {
            display: none;
        }

    .card-body .report_row {
        text-align: center;
    }

    #wizard #steps_summary .step p {
        font-size: 16px;
    }

    #wizard #steps_summary .empty_space {
        height:0px;
    }

    #wizard #steps_summary {
        padding:20px 0px;
    }
}
    @media (max-width: 824px) {
        .hyperware {
            width: 20%;
        }

            .hyperware a, .hyperware h5 {
                font-size: 10px;
            }

        .commercial {
            height: 500px;
            width: 500px !important;
            left: 10% !important;
        }

            .commercial .panel {
                width: 170px;
                height: 50px;
                bottom: 8px;
                right: 60px;
            }

                .commercial .panel .num {
                    font-size: 18px;
                    color: #FFF;
                    font-weight: bold;
                    background-image: linear-gradient(to right, #845819, #9A7B49);
                    border-radius: 5px;
                    width: 55px;
                    height: 34px;
                    padding: 3px 0px 0px 10px;
                    margin: 8px 0px 0px 5px;
                    float: left;
                }

            .commercial .buttons .plus {
                font-size: 12px;
                height: 17px;
                top: 8px;
                left: 40px;
            }

            .commercial .buttons .minus {
                font-size: 12px;
                height: 17px;
                top: 25px;
                left: 40px;
            }

            .commercial .buttons {
                width: 80px;
            }

            .commercial .panel .send {
                right: 10px;
                bottom: 10px;
                width: 90px;
                height: 35px;
                text-align: center;
                font-size: 14px;
            } 
    }

    @media (max-width: 767px) {
        .navbar_no_padding {
            padding: 0 30px !important;
        }

        .navbar .navbar-collapse .navbar-nav.navbar-mobile > li.logo{
            display:none;
        }

        aside.app-sidebar .sidebar-header .sidebar-brand, aside.app-sidebar .sidebar-header {
            height: 100px;
        }

        .navbar .navbar-collapse .navbar-nav.navbar-mobile > li:last-child {
            left: 100% !important;
        }
    }

    @media (max-width: 667px) {
        .app-brand .login_header_title {
            font-size: 14px;
        }
    }

    @media (max-width: 470px) {
        .app-brand .login_header_title {
            text-align: center
        }

        .hyperware {
            width: 100%;
        }

        .menu_box_flat {
            width: 60% !important;
            top: 160px !important;
        }

            .menu_box_flat img {
                display: block;
                margin: 0 auto;
                float: none;
            }

            .menu_box_flat .col-xs-12 div {
                text-align: center;
            }
    }

    @media (max-width:450px) {
        .doc .body .digital_signature .text .vehicle_details .vehicle_frame_number {
            width: 180px;
        }
    }

    @media (max-width:420px) {
        .app-brand img {
            width: 100%;
        }

        .app-brand .login_header_title {
            font-size: 14px;
            text-align: center;
        }

        .app-block {
            width: 75% !important;
        }

        .menu_box_flat {
            left: 12% !important;
        }
    }

    @media (max-width:370px) {
        .doc .body .digital_signature .text .vehicle_details .hexahydrate_number {
            width: 180px;
        }
    }

    @media (max-width:330px) {
        .app-block {
            width: 90% !important;
        }

        .menu_box_flat {
            left: 5% !important;
        }
    }

@media (max-width:220px) {
    .app-brand .login_header_title {
        font-size:12px;
    }

    .app-block a {
        font-size: 12px;
    }
}

@media (max-height:720px) {
    .app-login .app-body .app-block {
        top: 250px;
    }

    .menu_body .logo {
        top: 160px;
    }

    .menu_box_flat {
        top: 280px !important;
    }
}

@media (max-height:670px) {
    .hw {
        display:none;
    }
    .copyright {
        display:none;
    }
}

@media (max-height:620px) {
    .app-login .app-body .app-block {
        top: 180px;
    }

    .menu_body .logo {
        top: 90px;
    }

    .menu_box_flat {
        top: 210px !important;
    }
}

@media (max-height:600px) {
    .hwcard {
        margin: 100px auto !important;
    }

    footer.app-footer .footer-copyright {
        margin-bottom: 0;
    }
}

@media (max-height:540px) {
    .app-login .app-body .app-block {
        top: 120px;
    }

    .menu_body .logo {
        display:none;
    }

    .menu_box_flat {
        top: 150px !important;
    }
}

@media (max-height:480px) {
    .app-login .app-body .app-block {
        top: 70px;
    }

    .menu_box_flat {
        top: 100px !important;
    }

    .menu_body .logo {
        top: 0;
    }

    .hwcard {
        margin: 0px auto !important;
    }

    aside.app-sidebar {
        height: initial !important;
    }

    .hw, .copyright {
        display: none;
    }
}

@media (max-height:410px) {
    .app-login .app-body .app-block {
        top: 20px;
    }

    .menu_box_flat {
        top: 40px !important;
    }

    .menu_body .logo {
        display: none;
    }

    footer.app-footer .footer-copyright {
        display: none;
    }
}

@media (max-height:370px) {
    .app-login .app-body .app-block {
        top: 0px;
    }

    .menu_box_flat {
        top: 15px !important;
    }
}