/*--reset-css--*/
@font-face {
    font-family: 'interstateregular';
    src: url('/fonts/INTR____.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'interstatebold';
    src: url('/fonts/INTBD___.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;

}
*{margin: 0; padding: 0; box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;}
body,html { height: 100%;}
body { margin: 0; padding: 0; font-family: 'interstateregular'; font-size: 16px; background: rgba(0, 0, 0, 0) url("/images/main-bg.jpg") repeat scroll 0 0; background-repeat: repeat;}
img { border: none; outline: none;}
a { text-decoration: none;}

.wrapper { height: auto;width: 100%;margin: 0 auto -90px; min-height: 100%;}
.wrapper:after { content: ''; display: block; height: 100px;}


header {background-color: #E3E3E3;border-radius: 30px 0 0;float: left;padding: 25px 30px;width: 100%; text-align: center; position: relative;}
div.logo {float: left;width: auto; position: absolute; left: 40px; top: 25px;}
div.sitelogo {float: right;width: 200px; height:70px; position: absolute; right: 35px; top: 18px; padding:1px; text-align:right; justify-content:flex-end; background-color:white;}
div.sitelogo img { width: 100%; height: 100%;}
div.sitename {position: absolute; top: 120px; width:97%; color:#007dc1; font-weight:bold; text-align:center; font-size: 30px;}
h1.pagetitle {display: inline-block;margin: 7px 0 0;width: auto; color: #2B2A29; font-size: 40px;}

section.main {float: left;width: 100%;}
.container {margin: 0 auto;width: 798px;}
.login-bar {display: table;margin: 60px auto 0;width: 448px;}
.login-title {background-color: #E3E3E3;border-radius: 30px 0 0;color: #2B2A29;float: left;padding: 20px 45px;width: 100%; margin-bottom: 5px;}
    .login-title h3 {color: #2B2A29;font-size: 20px;font-weight: normal;}
.login-middle {background-color: #E3E3E3;border-radius: 0px 0 0;color: #2B2A29;float: left;padding: 20px 45px;width: 100%; margin-bottom: 5px;}
.login-body {background-color: #E3E3E3;border-radius: 0 0 30px;float: left;padding: 45px;width: 100%;}
.row {float: left; width: 100%; position: relative;}
.input-form { width: 100%; float: left; margin-bottom: 15px;}
.input-form label { width:80px; margin-right: 10px; color: #2B2A29; float: left;}
.input-form input[type="text"],.input-form input[type="password"] { width:179px; height: 19px; background-color: #fff; color: #000; border-radius: 5px 0 ;border: none; padding: 0 5px;}
.input-form textarea { background-color: #fff; color: #000; border-radius: 5px 0 ;border: none; padding: 0 5px;}
input[type="submit"] {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+54,dde9f6+54 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #eff0f0 54%, #eff0f0 54%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #eff0f0 54%,#eff0f0 54%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #eff0f0 54%,#eff0f0 54%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eff0f0', endColorstr='#eff0f0',GradientType=0 ); /* IE6-9 */
width: 68px; border-radius: 5px 0; color: #2B2A29; font-size: 18px; font-weight:bold; padding:3px 0; border: none; display: table; margin: 0 auto; cursor: pointer;
height:28px!important;
}
input[type="submit"]:hover {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#dde9f6+46,ffffff+46 */
background: #dde9f6; /* Old browsers */
background: -moz-linear-gradient(top,  #dde9f6 46%, #D6DCDD 46%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #dde9f6 46%,#D6DCDD 46%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #dde9f6 46%,#D6DCDD 46%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dde9f6', endColorstr='#D6DCDD',GradientType=0 ); /* IE6-9 */
}
input[type="text"],select{
}
textarea{border: 1px solid #D6DCDD;border-radius: 5px 0;color: #2B2A29;padding: 0 5px;}


footer {background-color: #E3E3E3;border-radius: 0 0 30px;bottom: 0px;color: #2B2A29;padding: 15px 35px;position: relative;width: 100%; float: left; height: 70px;}
p.copy-right {float: left;width: auto; margin-top: 10px;}
.brand-logo {float: right;width: auto;}
.brand-logo ul { float: left; width: auto; list-style: none;}
.brand-logo ul li { width:auto; display: inline-block; vertical-align: middle; margin-left: 19px;}

.login-detail {float: left;margin: 23px 0 20px;width: 100%;}
.logout-status {float: right;width: auto;}
.logout-status a {float: left;margin-left: 15px;width: auto;}
.logout-status a.avatar-name{ /*opacity: 0.5;*/}
.logout-status a.avatar-name:hover { /*opacity: 0.5;*/}
.logout-status a:hover { /*opacity: 0.8;*/}
span.text {background-color: #E3E3E3;border-radius: 6px 0 0 6px;color: #2B2A29;display: inline-block;min-width: 100px;padding: 5px 15px 5px 8px;width: auto;}
.l-icon {background-color: #E3E3E3;border-radius: 40px;display: inline-block;height: 40px;line-height: 47px;margin-left: -11px;margin-top: -5px;text-align: center;vertical-align: middle;width: 40px;padding-top:2px;}

.service-list {float: left;width: 100%;}
.service-list > ul {float: left;list-style: outside none none;width: 100%;}
.service-list li {float: left;height: 210px;margin-bottom: 15px;margin-right: 14px;width: 390px;}
.service-list li:nth-child(3n) {margin-right: 14px;}
.service-list a {background-color: #E3E3E3;border-radius: 25px 0;color: #2B2A29;display: table;float: left;font-size: 25px;height: 100%;position: relative;text-align: center;text-decoration: none;width: 100%;}
.service-list a:hover {background-color: #B2B3B3;}
.service-list img {position: absolute;right: 20px;top: 15px;}
.service-list span {color: #2B2A29;display: table-cell;vertical-align: middle;}

.back-btn {background-color: #E2E3E3; float: left; padding: 2px 18px; color: #2B2A29; width: auto; border-radius: 6px 0; margin-top: 5px;}
.back-btn:hover {background-color: #B2B3B3;}

.navgation {z-index:999; background-color: rgba(178, 179, 179, 0.5);border-radius: 0 25px 25px 0;bottom: 0;height: 682px;left: 0;margin: auto 0;position: fixed;top: 0;width: 38px; cursor:pointer;}
.navgation > ul {float: left;height: 100%;width: 100%; list-style: none;}
.navgation li {float: left;margin-top: 32px;text-align: center; width: 100%;}
.navgation a {float: left;width: 100%; opacity: 1;}
.navgation a:hover { opacity:0.5;}
.navgation img {width: 30px;}

.navigation-inner {background-color: #B2B3B3;border: 2px solid #D6DCDD;border-radius: 0 20px 20px 0;bottom: 0;margin: auto 0;overflow: auto;position: fixed;top: 0;width: 250px;z-index: 1; left:-100%;transition: all 0.8s ease-in-out;-moz-transition: all 0.8s ease-in-out;-ms-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out;-webkit-transition: all 0.8s ease-in-out;}
/*.navigation-inner {background-color: #a2d2ed;border: 2px solid #007ac0;border-radius: 0 20px 20px 0;bottom: 0;height: 482px;margin: auto 0;overflow: auto;position: fixed;top: 0;width: 180px;z-index: 1; left:-100%;transition: all 0.8s ease-in-out;-moz-transition: all 0.8s ease-in-out;-ms-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out;-webkit-transition: all 0.8s ease-in-out;}*/
.navigation-inner.active { left: 0;}
.nav-name {color: #fff;float: left;font-weight: normal;margin-bottom: 15px;margin-top: 34px;padding-left: 5px;text-align: left;vertical-align: middle;width: 100%;}
.nav-name > img {display: inline-block;margin-right: 10px;vertical-align: middle;}
.navigation-inner > ul {float: left;list-style: outside none none;margin: 0;width: 100%;}
.navigation-inner li {margin: 0;}
.navigation-inner a {color: #2B2A29;font-size: 11px;font-weight: normal;opacity: 1;padding: 5px 0 5px 45px;text-align: left;text-transform: uppercase;}
.navigation-inner a:hover {background-color: #eff0f0; color:#2B2A29}


.page-inner {background-color: #E3E3E3;border-radius: 30px 0;float: left;padding: 10px;width: 100%; margin-bottom: 25px;}
.site-information {float: left;width: 100%;}
.site-name {float: left;margin-bottom: 15px; width: 100%;}
.input-select {float: left;width: 340px; margin-left:10px}
.input-select select {border-style: none;
    border-color: inherit;
    border-width: medium;
    -moz-appearance: none;-webkit-appearance: none;-ms-appearance: none;-o-appearance: none;background: #fff url("/images/select-arrow.png") no-repeat scroll right center;border-radius: 5px 0;color: #2B2A29;padding: 0 30px 0 5px;text-transform: uppercase;
}
.page-inner label {color: #2B2A29;margin-right: 15px;}
.date-fromto {float: left;margin-left: 40px;width: auto;}
.input-group {float: left;margin-right: 0px;width: auto;}
.input-group+.input-group { margin-right: 0;}
.input-group input {border-style: none;
    border-color: inherit;
    border-width: medium;
    font-family: 'interstateregular'; border-radius: 5px 0;color: #2B2A29;padding: 0 5px;
}
.aditional-filter {float: left;margin-bottom: 15px;width: 100%;}
.aditional-filter > label {line-height: 20px;}
.aditional-filter > a {background: rgba(0, 0, 0, 0) url("/images/input-bg.jpg") repeat-x scroll 0 0;border-radius: 5px 0;color: #007dc1;display: inline-block;height: 18px;line-height: 18px;margin-left: 6px;padding: 0 9px;}
.aditional-categoery {float: left;width: 100%;}
.checkbox-btns {background: #fff url("/images/input-bg.jpg") repeat-x scroll left bottom;border-radius: 10px;float: left;margin-right: 15px;padding: 2px 10px;width: 225px;}
.checkbox-btns > input {display: inline-block;margin-right: 5px;margin-top: -4px;vertical-align: middle;}
.checkbox-btns > span {color: #2B2A29;}
.plus-btn {background-color: #fff;border-radius: 30px;color: #057bc0;float: left;font-size: 18px;height: 18px;line-height: 17px;margin-top: 2px;text-align: center;width: 18px;}

.chart-bar { width: 100%; float: left; padding: 10px 20px; background: #fff; border-radius: 30px 0; margin-top:40px; margin-bottom: 20px;}
.chart-main {float: left;position: relative;width: 260px;}
.chart-over {bottom: 0;color: #007ac0;font-size: 26px;height: 190px;left: 0;margin: auto;padding-top: 40px;position: absolute;right: 0;text-align: center;top: 0;width: 190px;}
.chart-options {float: left;width: 1160px;}
.chart-options > ul {float: left;list-style: outside none none;padding-left: 25px;width: 100%;}
.chart-options li {float: left;margin-bottom: 10px;margin-right: 4px;width: 120px;}
/*.chart-options li:nth-child(3n) {margin-right: 0;}*/
.chart-options ul li a {background-color: #000;border-radius: 20px 0;float: left;height: 115px;width: 100%;padding-left:2px; padding-right:2px;}
.chart-options ul li a.red-option {background-color: #d22527;}
.chart-options ul li a.black-option {background-color: #272750;}
.chart-options ul li a.green-option {background-color: #35aa44;}
.chart-options ul li a.yellow-option {background-color: #ffed00;}
.chart-options ul li a.purple-option {background-color: #8d1779;}
.chart-options ul li a.blue-option {background-color: #007bc0;}
.chart-options ul li a.pcnload {background-color: #24a3e5;}
.chart-options ul li a.cancelled_paid_on_site{background-color: #006E4A;}
.chart-options ul li a.anpr {background-color: #e0d500;}
.chart-options ul li a.cases_at_debt{background-color: #0082C5;}
.chart-options ul li a.closed{background-color: #882084;}
.chart-options ul li a.new_customer_notes{background-color: #F68634;}
.chart-options ul li a.paid{background-color: #EC6592;}
.chart-options ul li a.pending_day_60{background-color: #A2ADAE;}
.chart-options ul li a.active{background-color: #D71E24;}
.chart-options ul li a.appeal_accepted{background-color: #030E4F;}
.chart-options ul li a.appeal_pending{background-color: #34B555;}
.chart-options ul li a.appeal_rejected{background-color: #000000;}
.chart-options ul li a.cancelled_by_client_charge{background-color: #06AEB3;}
.chart-options ul li a.cancelled_by_client_no_charge{background-color: #FFF100;}
.chart-options ul li a.with_popla{background-color: #724C0A;}
.chart-options ul li a.warning1{background-color: #f06140;}
.chart-options ul li a.warning2{background-color: #ff4444;}

.chart-options li a span {color: #fff;float: left;font-size: 14px;margin-top: 15px;text-align: center;width: 100%;}

.offers-bar {float: left;width: 100%;}
.offers-main {background-color: #fff;border-radius: 15px 0;float: left;padding: 12px;text-align: center;width: 150px;}
.offers-main h3 {color: #057bc0;}
.offers-main > ul {float: left;list-style: inside none disc;margin-top: 5px;text-align: left;width: 100%;}
.offers-main li {float: left;margin-bottom: 5px;width: 100%;list-style: inside;}
.offers-main a {color: #057bc0;}
.offers-main a:hover { opacity: 0.8;}

.page-inner.data-table { padding: 0;}
.search-filter {float: left;padding: 10px;width: 100%;}
.search-filter h3 {color: #2B2A29;font-size: 20px;font-weight: normal;margin-bottom: 15px;}
.search-filter .row {margin-bottom: 15px;}
.search-filter .site-name {margin-bottom: 0;}
.search-filter legend {color: #2B2A29;font-size: 20px;font-weight: normal;margin-bottom: 15px; margin-left:10px; margin-right:10px; padding:5px}
.search-filter fieldset {border-style:solid; border-color:#D6DCDD}

.inner-container { width: 90%; margin: 0 auto;position: relative;}
.inner-container .login-bar {margin-top:0;}
.datatable-main {float: left;width: 100%; margin-bottom: 20px; padding-left:5px; padding-right:5px;}
.showing-result {color: #2B2A29;left: 20px;position: absolute;}
.btns {float: left;margin-bottom: 20px;text-align: center;width: 100%;}
.btns > a {background: rgba(0, 0, 0, 0) url("/images/input-bg.jpg") repeat-x scroll 0 0;border-radius: 5px 0;color: #007dc1;display: inline-block;margin: 0 5px;padding: 0 5px;}
.btns > a:hover {opacity: 0.8;}
.data-table table {border: 1px solid #007dc1;border-collapse: collapse;text-align: left;width: 100%;}
.data-table table th {background-color: #fefefe;border-right: 1px solid #007dc1;font-weight: normal;padding: 7px;color: #007dc1;}
.data-table tbody td {background-color: #d9edf6;border-right: 1px solid #007dc1;border-bottom: 1px solid #007dc1;color: #007dc1;font-weight: normal;padding: 7px;}

/*--whitelist-blacklist--*/

.tabs-links {float: left;width: 100%; position: relative; margin-bottom: 0;}
.tabs-menu {float: left;list-style: outside none none;width: 100%;}
.tabs-menu li {float: left;margin-right: 35px;width: auto;}
.tabs-menu li a {background-color: #D6DCDD;border: 2px solid #D6DCDD;border-radius: 25px 0 0; color: #fff;float: left;padding: 5px 20px;text-align: center;width: 270px;}
.tabs-menu li.current a {background-color: #fff;color: #2B2A29; border-bottom-color:transparent; }
.tabs-menu li.blacklist-link a {background-color: #000; color: #fff;border-color: #000;}
.tabs-menu li.current {position: relative;top: 2px;}
.tabs-menu li.blacklist-link.current {top: 0;}
.tab-show {display: none;float: left;width: 100%;}
#tab-1 {display: block;}

.tabiing-inner {float: left;width: 100%;}
.tabs {float: left;width: 100%;}
.tabs-head.authorized-vehicle {background-color: #fff;border: 2px solid #D6DCDD;float: left;width: 100%;}
.tabs-head .search-filter {padding:15px 20px}
.tabs-head .search-filter h3 {color: #2B2A29;}
.tabs-head .search-filter .input-select select {border:1px solid #D6DCDD;}
.tabs-head .search-filter .input-group input {border:1px solid #D6DCDD;}
.description-input input {width:250px }

.vrm-bar {float: left;width: 500px;}
.date-timebar {float: left;width: 450px;}
.date-timebar .date-fromto {margin-left: 0; width: 50%;}
.date-fromto .input-select {width: 100%;}
.date-fromto .input-select select {width: 140px;}

.tabs-head .btns {margin-bottom: 0; margin-top: 5px;}
.tabs-head .btns a {border:1px solid #D6DCDD;}

.tabel-list {float: left;width: 100%; padding: 20px 0;border:2px solid #D6DCDD;background-color: #fff; margin-top: 10px; margin-bottom: 50px;border-radius: 0 0 30px}
.tabel-list .datatable-main {float: left;margin-bottom: 0;width: 100%;}
.tabel-list.data-table table {border: none;}
.tabel-list.data-table table th {background-color: #D6DCDD;border-bottom: 1px solid #fff;border-right: 1px solid #fff;color: #fff;font-weight: normal;padding: 3px;}
.tabel-list.data-table tbody td {background-color: #D6DCDD;border-bottom: 1px solid #fff;border-right: 1px solid #fff;color: #fff;font-weight: normal;padding: 3px;}

.blacklist-bar .tabs-head {background-color: #000;border-color: #000;}
.blacklist-bar .tabs-head .search-filter h3 {color: #fff;}
.blacklist-bar .tabs-head .search-filter .input-select select {border:1px solid #000;color: #000;}
.blacklist-bar .tabs-head .search-filter .input-group input {border:1px solid #000;color: #000;}
.blacklist-bar .tabs-head .search-filter label {color: #fff;}
.blacklist-bar .tabs-head .btns a {color: #000;border-color: #000;}

.blacklist-bar .tabel-list {background-color: #000;border-color: #000;}
.blacklist-bar .tabel-list.data-table table th {background-color: #fff;border-right: 1px solid #000;color: #000;border-bottom: 1px solid #000;}
.blacklist-bar .tabel-list.data-table table td {background-color: #fff;border-right: 1px solid #000;color: #000;border-bottom: 1px solid #000;}

.fileUpload {border: 1px solid #D6DCDD;border-radius: 5px 0;color: #2B2A29;float: left;overflow: hidden;padding: 2px 10px;position: relative;}
.fileUpload input.upload {position: absolute;top: 0;right: 0; margin: 0; padding: 0; font-size: 18px;cursor: pointer; opacity: 0; filter: alpha(opacity=0);width: 100%;height: 100%;}
.file-upload > input {background-color: transparent;border: medium none;display: inline-block;height: 24px;margin-left: 10px;width: 225px;}
.file-upload {border: 2px dashed #B2B3B3;float: left;padding: 5px 10px;width: 350px;}

.linkButton {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+54,dde9f6+54 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #eff0f0 54%, #eff0f0 54%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #eff0f0 54%,#eff0f0 54%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #eff0f0 54%,#eff0f0 54%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eff0f0', endColorstr='#eff0f0',GradientType=0 ); /* IE6-9 */
width: 68px; border-radius: 5px 0; color: #2B2A29; font-size: 18px; font-weight:bold; padding:3px 0; border: none; display: table; margin: 0 auto; cursor: pointer;
height:28px!important;
text-align:center;
}
.linkButton:hover {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#dde9f6+46,ffffff+46 */
background: #dde9f6; /* Old browsers */
background: -moz-linear-gradient(top,  #dde9f6 46%, #D6DCDD 46%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #dde9f6 46%,#D6DCDD 46%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #dde9f6 46%,#D6DCDD 46%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dde9f6', endColorstr='#D6DCDD',GradientType=0 ); /* IE6-9 */
}

.image-list {float: left;}
.image-list > ul {float: left;list-style: outside none none;width: 100%;}
.image-list li {float: left;height: 210px;margin-bottom: 40px;margin-right: 14px;width: 320px; margin-right:40px}

.image-list img {border-radius: 25px 0}
.image-list span {background-color: white;border-radius: 25px 0;color: #fff;display: table;float: left;font-size: 25px;height: 100%;position: relative;text-align: center;text-decoration: none;width: 100%; padding:5px}
.image-list span:hover {background-color: #a2d2ed;}

/*Red button*/
.buttonred {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff3019+0,cf0404+100;Red+3D */
background: #ff3019!important; /* Old browsers */
background: -moz-linear-gradient(top, #ff3019 0%, #cf0404 54%)!important; /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ff3019 0%,#cf0404 54%)!important; /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ff3019 0%,#cf0404 54%)!important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 )!important; /* IE6-9 */
width: 68px; border-radius: 5px 0; color: white!important; font-size: 18px; padding:3px 0; border: none; display: table; margin: 0 auto; cursor: pointer;
height:28px!important;
}
.buttonred:hover {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#dde9f6+46,ffffff+46 */
background: #dde9f6; /* Old browsers */
background: -moz-linear-gradient(top,  #dde9f6 46%, #ffffff 46%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #dde9f6 46%,#ffffff 46%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #dde9f6 46%,#ffffff 46%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dde9f6', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

select::-ms-expand {
    display: none;
}

td {
    padding: 3px;
}
.errormsg {color:red}