html{
overflow-x: hidden;	
}
a.logo img{
max-height:31px;
min-height:31px;
margin-right: 20px;
margin-left: 70px;
}
.border{
border:0px solid red;
}
.text-right{
text-align: right;
}
.center{
text-align:center;
}
.text-left{
text-align:left;
}
a:hover{
text-decoration:none;	
}
.block{
display:block;
}
#leftsidebar .square-box a{
font-size: 18px !important;
text-decoration:none;
color: #fff !important;
}
#leftsidebar .square-box{
padding-left: 30px !important;
}
#leftsidebar .square-box{
border: 1px solid #fff;
border-radius: 5px;
padding: 8px;
width: 94%;
float: left;
margin: 10px 3% 20px;
text-align:left;
line-height: 180%;
}
#leftsidebar .square-box a{
font-size:12px !important;	
font-weight:bold;
display: initial !important;
padding:0px !important;
}

.hide,
.popup_menu,
.table-action,
.assign-agent-wrap,
.team_opion,
.delivery-info,
.reason_wrap,
#order-id-wrap,
.search-team-wrap,
.custom_selection,
#frm_forgotpass,
.show-on-map
{
display:none;
}

.back-dashboard{
display:block;
}

.back-dashboard  a{
display: table;
}

body.dashboard .back-dashboard{
display:none;
}
body.dashboard .search-team-wrap{
display:block;
}

.table tr:hover .table-action
{
display:block;
}

#table_list .concat-text, .log_frm .concat-text{
width:200px;
}
.blue-fields{
border:1px solid #38323a;
padding: 5px 8px;
}
.lightblue-fields{
border:1px solid #fff;
border: 1px solid #494949;
padding: 5px 8px;
color:#000;
width: 100%;
margin-bottom:5px;
}
.lightblue-fields.medium{
padding: 3px 5px;
margin-bottom:0px;
}
.dashboard-calendar{
background: #aeaeae;
border: 0px;
color: white;
text-align: left;
border: 1px solid #fff;
width: 100%;
}
.orange-button{
background:#ffa809;
border:1px solid #ffa809;
color:#fff;
padding: 5px 15px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
.orange-button:hover{
background:#fff;
color:#ffa809 !important;
}
.orange-button-o{		
background:#fff;		
border:1px solid #ffa809;		
color:#ffa809;		
padding: 8px 25px;		
-webkit-border-radius: 30px;		
-moz-border-radius: 30px;		
border-radius: 30px;		
}		
.orange-button-o:hover{		
background:#ffa809 !important;		
color:#fff;			
}
.red-button{
background:#ca2323;
border:1px solid #ca2323;
color:#fff;
padding: 5px 15px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
.red-button:hover{
color:#ca2323 !important;
background:#fff;	
}
.blue-button{
background:#2b84ca;
border:1px solid #2b84ca;
color:#fff;
padding: 5px 15px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
.blue-button:hover, .blue-button:active{
color:#2b84ca !important;
background:#fff !important;	
}
.black-button{
background:#101316;
border:1px solid #101316;
color:#fff;
padding: 5px 15px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
a.orange-button:hover,
button.orange-button:hover,
input.orange-button:hover,
input.orange-button:focus,
a.orange-button:focus,
#menu .logout-menu a:hover
{
text-decoration: none;
color: #ffa809;
background: #fff;
border: 1px solid #ffa809;
}
.black-button:hover{
background:#262b31;
}
.orange-button.medium,
.green-button.medium,
.green-button-o.medium,
.black-button.medium,
.red-button.medium
{
padding: 8px 25px;
}
.green-button.small{
padding:2px 7px;
}
.green-button.inline{
display:inline;
}
.green-button.large {
display: block;
text-align: center;
width: 100%;
padding: 10px 8px;
}
.green-button{
background:#89d541;
border:1px solid #89d541;
color:#fff;
padding: 5px 15px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
.green-button:hover{
color:#89d541 !important;
background:#fff !important;
border:1px solid #89d541 !important;	
}
.green-button-o{
background:#fff;
border:1px solid #89d541;
color:#89d541;
padding: 5px 15px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
font-weight:bold;
overflow:hidden;
}
.green-button-o:hover{
color:#fff !important;
background:#89d541 !important;
border:1px solid #89d541 !important;	
}
.green-button:hover > i{
color:#89d541 !important;
}
.yellow-button{
background:#fcd206;
border:1px solid #fcd206;
color:#fff;
padding: 5px 15px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
.yellow-button:hover{
background:#f2ce21;
border:1px solid #f2ce21;
}
a.yellow-button:hover,
a.yellow-button:active,
a.yellow-button:focus
{
text-decoration:none;
color:#fff;
}
.yellow-button.large{
display: block;
text-align: center;
width: 100%;
padding: 10px 8px;
}
.relative{
position:relative;
}
.yellow-button i{
font-size: 30px;
position: absolute;
right: 20px;
top: 6px;
}
.tag_online{
color:#89d541;
}
.green-button.inline,
.orange-button.inline,
.inline-block,
.black-button.inline
{
display:inline-block;
}
a.green-button:hover,
button.green-button:hover,
input.green-button:hover,
input.green-button:focus,
a.green-button:focus,
#menu .green-button a:hover
{
text-decoration:none;
color:#fff;
background:#23c562;
border:1px solid #23c562;
}
.rounded{
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px; 
-khtml-border-radius: 2px;
}
.rounded3{
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px; 
-khtml-border-radius: 3px;
}
.rounded5{
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px; 
-khtml-border-radius: 5px;
}
.rounded30{
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
border-radius: 30px; 
-khtml-border-radius: 30px;
}
#leftsidebar.white{
background:#fff;
background: #2f2f2f;
}
.green_panel{
background:#89c540;
padding:10px;
color:#fff;
}
.green_panel i{
color:#fff;
}
.green_panel a{
color:#38323a;
font-size:20px;
display:inline-block;
margin-left:10px;
}
#header-warning{
width:100%;
padding:15px 25px;
text-align:center;
background:#F33;
color:#fff;
position:fixed;
z-index:10;
font-size:16px;
display:none;
z-index:1000;
top:0px;
}
#header-error-wo-close{
    width:100%;
    padding:15px 25px;
    text-align:center;
    background:#F33;
    color:#fff;
    position:fixed;
    z-index:10;
    font-size:16px;
    display:none;
    z-index:100;
    top:0px;
}
#header-warning-wo-close{
    width:100%;
    padding:15px 25px;
    text-align:center;
    background: #ffca94;
    color:#fff;
    position:fixed;
    z-index:10;
    font-size:16px;
    display:none;
    z-index:100;
    top:0px;
}
#header-warning a{
color:#fff !important;
}
#header-warning-close, #header-exp-warning-close{
color:#fff;
font-size:26px;
position:absolute;
top:10px;
right:25px;
cursor:pointer;
}
#header-warning-close:hover{
color:#333;	
}
/*-------------- Tabs -----------------*/
ul#tabs {
list-style-type: none;
padding: 0;
text-align: center;
margin:0;
background:#fff;
}
.round-avatar{
width: 100%;
height: auto;
border-radius: 100px;
border: 3px solid #f1f1f1;
}
.ticket-details-modal .modal-body ul#tabs li{
width:32.5% !important;	
padding:12px;
}
.ticket-details-modal .modal-body ul#tab i:before{
width: 30px;
text-align: center;
}
.form-group label{
min-width: 20px !important;
}
/*------------ Dashboard Left Column ------------*/
#leftsidebar .map-tab{
width:50%;
float:left;
padding:8px;
border-bottom:3px solid #ccc;	
text-align:center;
cursor:pointer;
}
#leftsidebar .map-tab:hover, #leftsidebar .map-tab.active{
border-bottom:3px solid #494949;	
}
#leftsidebar ul#tabs li {
display: inline-block;    
padding: 5px;
cursor: pointer;
color:#515253;
width: 30%;
border-bottom:0px !important;
}
#leftsidebar ul#tabs.ticket-tabs li {
width: 23.5%;
text-transform: uppercase;	
font-size: .6em;
box-sizing:border-box;
font-weight:bold;
}
#leftsidebar ul#tabs li.active, #leftsidebar ul#tabs li:hover {
color:#89c540 !important;
border-bottom:3px solid #89c540 !important;
}
#leftsidebar ul#tab {
list-style-type: none;
margin: 0;
padding: 0;
}
#leftsidebar ul#tab li {
display: none;
}
#leftsidebar ul#tab li.active {
display: block;
}

ul#tabs li {
display: inline-block;    
padding: 5px;
cursor: pointer;
color:#515253;
width: 32.5%;
border-bottom: 4px solid #ccc;
}
ul#tabs.ticket-tabs li {
width: 23.5%;
font-size: 11px;
box-sizing:border-box;
}
ul#tabs li.active, ul#tabs li:hover  {
color:#89d541;
border-bottom:4px solid #89d541 !important;
}
ul#tab {
list-style-type: none;
margin: 0;
padding: 0;
}
ul#tab li {
display: none;
}
ul#tab li.active {
display: block;
}
/*------------ End Tabs ---------------*/
.top5{
margin-top:5px;
}
.top8{
margin-top:8px;
}
.top10{
margin-top:10px;
}
.top20{
margin-top:20px;
}
.top30{
margin-top:30px;
}
.bottom10{
margin-bottom:10px;
}
.bottom20{
margin-bottom:20px;
}
.bottom30{
margin-bottom:30px;
}
#leftsidebar #tabs li span
{
display:block;
text-align:center;
font-size:30px;
line-height: 130%;
}
.drivers-view #tabs li span{
margin: 0px 10px;	
}
.list_row .row.box{
color:#515253;
background:#fff;
border-bottom:1px solid #d8d8d8;
-webkit-box-shadow: 0px 1px 4px 0px rgba(216,216,216,1);
-moz-box-shadow: 0px 1px 4px 0px rgba(216,216,216,1);
box-shadow: 0px 1px 4px 0px rgba(216,216,216,1);
padding-top:10px;
padding-bottom:10px;
padding-left:2px;
padding-right:2px;
margin-left:0;
margin-right:0;
cursor:pointer;
}
.list_row .row.box.active{
background:#fff !important;	
}
.list_row .inline{
display:inline-block;
}
.list_row .row p{
margin:0;
}
.tag{
background:#7ec13e;
color:#fff;
}
span.tag{
display: inline-block;
padding: 3px 8px;
text-align: center;
min-width: 90px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}
span.tag.failed,
span.tag.canceled,
span.tag.cancelled,
.ticket-item.cancelled,
span.tag.declined,
.tag.cancelled,
tag.failed,
.failed,
.declined,
span.tag.suspended,
span.tag.blocked
{
background:#e53935;
}
.tag.unassigned, .ticket-item.unassigned {
background: #f5704c;
}
.tag.assigned, .ticket-item.assigned {
background:#F44336 ;
}
.tag.acknowledged, .ticket-item.acknowledged, .ticket-item.accepted {
background:#4d95d2 ;
}
.tag.successful, .ticket-item.successful {
background:#2c9f2c  ;
}
.tag.started, .ticket-item.started {
background:#ba68c8 ;
}
.tag.inprogress, .ticket-item.inprogress, .tag.arrived, .ticket-item.arrived {
background:#ff9b00 ;
}
.tag.sign, .ticket-item.sign, .ticket-item.notes, .ticket-item.photo {
background:#f6bf00 ;
}
.orange-button-small{
background:#f75d34;
color:#fff;
padding:2px 7px;
}
.orange-button-small:hover,
.orange-button-small:focus
{
background:#ff4e41;
color:#fff;
text-decoration:none;
}
.orange-button-small.inline{
display: inline;
}
.nav_option{
padding: 10px 20px;
margin-top: 20px;
margin-bottom: 10px;
font-size: 24px;
background: #f7f7f7;
}
.nav_option a:hover, .nav_option a:focus{
text-decoration:none !important;
}
.nav_option .right-icons{
float: right;
}
.nav_option_in{
line-height: 40px;
}
.nav_option .right-icons i, .block-header .help-icon{
color:#38323a;	
}
.nav_option a{
margin-right:10px;
}
.frm input[type="text"],
.frm input[type="password"],
.frm select,
.frm textarea,
.chosen-container-multi .chosen-choices
{
border:1px solid #d8d8d8;
padding:8px 10px;
font-size:14px;
width:100%;
border-radius: 7px;
background-image:none !important;
}
.chosen-container-active .chosen-choices{
box-shadow: none !important;
border:1px solid #d8d8d8;	
}
.chosen-container-multi .chosen-choices li.search-choice{
padding: 7px 20px 7px 5px !important;	
}
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close{
top:8px !important;	
}
.frm p{
margin-bottom:3px;
}
.form-text{
position:relative;
}
.frm .price_input{
padding-left: 30px !important;
min-width:180px;
}
.input-icon{
position:absolute;
left:10px;
font-weight:bold;
color:#444;
top:9px;
}
.bp-menu-item{
padding:10px; 
border-bottom:5px solid #ccc;
font-size: 16px;
margin-bottom: 25px;
text-align: center;
cursor:pointer;
}
.bp-menu-item.active, .bp-menu-item:hover{
border-bottom:5px solid #89d541;  
}
.total-wrap{
font-size: 26px;
text-align: right;
}
.total-due{
margin-left:5px; 
}
.frm input[type="text"].mobile_inputs{
padding-left:50px;
min-width:245px;
}
#frm_new_ticket.frm input[type="text"].mobile_inputs{
min-width:inherit;
}
.frm input[type="text"].price_inputs{
padding-left:25px;
min-width:245px;
position: relative; 	
}
.price_input_wrap:before{
font-family: 'FontAwesome';
position: absolute;
padding-left: 8px;
font-size: 16px;
padding-top: 8px;
content: "\f155";
z-index: 100;	
}
body.login-body{
background:#1e1e1e  ;
}
.login-wrap{
margin:auto;
margin-top:7%;
width:350px;
}
.login-wrap p.white{
color:#ffffff;
}
.login-wrap hr{
border-top:1px solid #605b61;
height:1px;
}
.login-wrap img{
display:block;
margin:auto;
max-width:200px;
margin-bottom:30px;
}
.login-wrap .frm{
border:1px solid #d8d8d8;
background:#f7f8fa;
}
.login-wrap .lightblue-fields{
padding:8px 10px;
margin:auto;
width:100%;
}
#team_member_chosen input[type="text"]{
height:auto;
width:100% !important;
}
.modal-map-wrap{
border:1px solid #d8d8d8;
min-height:360px;
width:100%;
background:#494646;
position:relative;
}
.map_zone_mdl{
border:1px solid #d8d8d8;
min-height:360px;
width:100%;
background:#494646;
position:relative;
}
.map_ticket,
.map_account,
.map_location,
.modal_map,
.modal-map,
.map_zone,
.map_manually_add_marker
{
position:absolute;
height:100%;
width:100% !important;
left:0;
top:0;
}
.modal_map{
background: #efefef;
display:inline-block;
margin: 51px 0px 0px 280px;
height: -webkit-calc(100% - 51px);
height: -moz-calc(100% - 51px);
height:calc(100% - 51px);
width: -webkit-calc(100% - 280px);
width: -moz-calc(100% - 280px);
width:calc(100% - 280px);		
}
.modal_map.dashboard-narrow-view{
display:inline-block;
margin: 51px 280px 0px 280px !important;
height: -webkit-calc(100% - 51px);
height: -moz-calc(100% - 51px);
height:calc(100% - 51px);
width: -webkit-calc(100% - 560px) !important;
width: -moz-calc(100% - 560px !important);
width:calc(100% - 560px) !important;		
}
.modal_map.dashboard-narrow-view .custom-route-btns-wrap{
width:auto !important;	
right:280px !important;
}
.pac-container{
z-index:99999 !important;
}
.inline.customer_name{
vertical-align: top;
width: 97px;
}
.assign-agent{
font-size:12px;
}
#leftsidebar .row.box:hover .ticket-details,
.map-info-window .ticket-details
{
display:block;
}
.text-orange{
color:#f75d34;
}
.text-green{
color:#89d541;
}
.assign-agent.text-orange,
.assign-agent.text-green,
.ticket-map .text-green
{
text-transform:capitalize;
font-weight:600;
font-size:12px;
}
.concat-text
{
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display:block;
}
.modal-padding{
padding: 8px 10px;
}
.modal-padding .v{
color:#515253;
}
.ticket-action-button a{
display:block;
text-align:center;
}
.map-info-window h4{
font-size:17px;
}
#order-id-wrap h4{
margin:0;
}
#leftsidebar #team{
background: #89c540;
color: #ffffff;
margin-right: 30px;
z-index: 1000;
border: 1px solid #fff;
}
#leftsidebar #team option{
color:#fff;	
}
#search_map{
min-width: 250px;
background: transparent;
color: #fff;
border: 0px;
padding: 5px 8px 5px 30px;
box-sizing:border-box;
font-size: 15px;
}
.agent_name{
font-weight:600;
font-size:13px;
margin-bottom:5px !important;
}
.connection_status{
font-size:12px;
}
.form-horizontal.frm .control-label{
text-align:left;
}
.item-order-list,
.summary-wrap
{
width:350px;
margin:auto;
}
.item-order-list {
border-bottom:1px solid #d8d8d8;
padding-top:8px;
}
.summary-wrap{
padding-top:8px;
}
.item-order-list .a,
.item-order-list .b
{
float:left;
}
.item-order-list .a{
padding-right:8px;
}
.item-order-list .b.uk-text-success{
font-weight:bold;
}
.item-order-list .manage{
float:right;
}
.clear{
clear:both;
}
.dashboard-work-area .tag.rounded.pickup{
background:#2196f3 ;
}
.up-down-wrap{
bottom: 40px;
position: fixed;
right: 3%;
z-index: 9999;
}
.up-down-wrap a{
font-size:30px;
margin-right:5px;
}
.notification-pop textarea{
min-height:150px;
overflow:scroll;
overflow-x: hidden;
}
.tag{
text-align:center;
}
.customer-signature{
max-width:110px;
background:#fff;
}
.map-location-wrap{
border:1px solid #d8d8d8;
height:450px;
width:100%;
position:relative;
}
.map-location{
position:absolute;
height:100%;
width:100% ;
left:0;
top:0;
}
.settings-page ul#tabs li{
width: 20%;
}
.map_ticket_loader{
position:relative;
top:0;
z-index:999999;
background:rgba(50, 50, 50, 0.85) none repeat scroll 0 0;
width:100%;
height:100%;
display:none;
}
.map_ticket_loader .inner{
margin: 0;
padding: 0;
position: absolute;
top: 20%;
width: 100%;
}
.small-font{
font-size:11px;
}
#chart-wrap, #heatmap_div{
width:100%;
height:430px;
}
.table_charts{
width:100%;
margin:auto;
margin-top:30px;
}
.login-wrap .frm .inner{
padding:20px;
}
.login-wrap .sub-section{
border-top:1px solid #e1e1e1;
padding:10px 20px;
color:#939598;
}
.login-wrap .sub-section a{
color:#939598;
text-decoration:underline;
}
.language-wrapper{
display:none;
background: #eeeeee none repeat scroll 0 0;
position: absolute;
top: 50px;
width: 100px;
}
.border-top{
border-top:1px solid #ccc;
}
.color-bronze{
color:#bb725b;
}
.color-silver{
color:#aaaaaa;	
}
.color-gold{
color:#ff8e00;
}
.border-radius{		
-webkit-border-radius: 6px;		
-moz-border-radius: 6px;		
border-radius: 6px;			
}		
.border-gray{		
border:1px solid #ccc;		
}
/* ------------------ Margins --------------------*/
.row.no-padding {
margin-left: 0;
margin-right: 0;
}
.row.no-padding [class^="col-"] {
padding: 0;
}
.m0 {
margin: 0 !important;
}
.m5 {
margin: 5px !important;
}
.m10 {
margin: 10px !important;
}
.m15 {
margin: 15px !important;
}
.m20 {
margin: 20px !important;
}
.m25 {
margin: 25px !important;
}
.m30 {
margin: 30px !important;
}
.mt0 {
margin-top: 0 !important;
}
.mt5 {
margin-top: 5px !important;
}
.mt10 {
margin-top: 10px !important;
}
.mt15 {
margin-top: 15px !important;
}
.mt20 {
margin-top: 20px !important;
}
.mt25 {
margin-top: 25px !important;
}
.mt30 {
margin-top: 30px !important;
}
.mt40 {
margin-top: 40px !important;
}
.mt50 {
margin-top: 50px !important;
}
.mr0 {
margin-right: 0 !important;
}
.mr5 {
margin-right: 5px !important;
}
.mr10 {
margin-right: 10px !important;
}
.mr15 {
margin-right: 15px !important;
}
.mr20 {
margin-right: 20px !important;
}
.mr25 {
margin-right: 25px !important;
}
.mr30 {
margin-right: 30px !important;
}
.mb0 {
margin-bottom: 0 !important;
}
.mb5 {
margin-bottom: 5px !important;
}
.mb10 {
margin-bottom: 10px !important;
}
.mb15 {
margin-bottom: 15px !important;
}
.mb20 {
margin-bottom: 20px !important;
}
.mb25 {
margin-bottom: 25px !important;
}
.mb30 {
margin-bottom: 30px !important;
}
.mb40 {
margin-bottom: 40px !important;
}
.mb50 {
margin-bottom: 50px !important;
}
.ml0 {
margin-left: 0 !important;
}
.ml5 {
margin-left: 5px !important;
}
.ml10 {
margin-left: 10px !important;
}
.ml15 {
margin-left: 15px !important;
}
.ml20 {
margin-left: 20px !important;
}
.ml25 {
margin-left: 25px !important;
}
.ml30 {
margin-left: 30px !important;
}
.ml50 {
margin-left: 50px !important;
}
/*------------------- Subtract margins -----------------*/
.mlm5 {
margin-top: -5px !important;
}
.mlm10 {
margin-top: -10px !important;
}
.mlm15 {
margin-top: -15px !important;
}
.mlm20 {
margin-top: -20px !important;
}
.mlm25 {
margin-top: -25px !important;
}
.mtm5 {
margin-top: -5px !important;
}
.mtm10 {
margin-top: -10px !important;
}
.mtm15 {
margin-top: -15px !important;
}
.mtm20 {
margin-top: -20px !important;
}
.mtm25 {
margin-top: -25px !important;
}
.mrm5 {
margin-top: -5px !important;
}
.mrm10 {
margin-top: -10px !important;
}
.mrm15 {
margin-top: -15px !important;
}
.mrm20 {
margin-top: -20px !important;
}
.mrm25 {
margin-top: -25px !important;
}
.mbm5 {
margin-top: -5px !important;
}
.mbm10 {
margin-top: -10px !important;
}
.mbm15 {
margin-top: -15px !important;
}
.mbm20 {
margin-top: -20px !important;
}
.mbm25 {
margin-top: -25px !important;
}
/* ------------------ Paddings --------------------*/
.p0 {
padding: 0 !important;
}
.p5 {
padding: 5px !important;
}
.p10 {
padding: 10px !important;
}
.p15 {
padding: 15px !important;
}
.p20 {
padding: 20px !important;
}
.p25 {
padding: 25px !important;
}
.pt0 {
padding-top: 0 !important;
}
.pt5 {
padding-top: 5px !important;
}
.pt10 {
padding-top: 10px !important;
}
.pt15 {
padding-top: 15px !important;
}
.pt20 {
padding-top: 20px !important;
}
.pt25 {
padding-top: 25px !important;
}
.pr0 {
padding-right: 0 !important;
}
.pr5 {
padding-right: 5px !important;
}
.pr10 {
padding-right: 10px !important;
}
.pr15 {
padding-right: 15px !important;
}
.pr20 {
padding-right: 20px !important;
}
.pr25 {
padding-right: 25px !important;
}
.pr30 {
padding-right: 20px !important;
}
.pr35 {
padding-right: 35px !important;
}
.pb0 {
padding-bottom: 0 !important;
}
.pb5 {
padding-bottom: 5px !important;
}
.pb10 {
padding-bottom: 10px !important;
}
.pb15 {
padding-bottom: 15px !important;
}
.pb20 {
padding-bottom: 20px !important;
}
.pb25 {
padding-bottom: 25px !important;
}
.pl0 {
padding-left: 0 !important;
}
.pl5 {
padding-left: 5px !important;
}
.pl10 {
padding-left: 10px !important;
}
.pl15 {
padding-left: 15px !important;
}
.pl20 {
padding-left: 20px !important;
}
.pl25 {
padding-left: 25px !important;
}
/* ------------------ Percent widths --------------------*/
.per5 {
width: 5% !important;
}
.per10 {
width: 10% !important;
}
.per15 {
width: 15% !important;
}
.per20 {
width: 20% !important;
}
.per25 {
width: 25% !important;
}
.per30 {
width: 30% !important;
}
.per35 {
width: 35% !important;
}
.per40 {
width: 40% !important;
}
.per45 {
width: 45% !important;
}
.per50 {
width: 50% !important;
}
.per55 {
width: 55% !important;
}
.per60 {
width: 60% !important;
}
.per65 {
width: 65% !important;
}
.per70 {
width: 70% !important;
}
.per75 {
width: 75% !important;
}
.per80 {
width: 80% !important;
}
.per85 {
width: 85% !important;
}
.per90 {
width: 90% !important;
}
.per95 {
width: 95% !important;
}
.per100 {
width: 100% !important;
}
/* ------------------ Sizes --------------------*/
.s8 {
font-size: 8px !important;
}
.s10 {
font-size: 10px !important;
}
.s11 {
font-size: 11px !important;
}
.s12 {
font-size: 12px !important;
}
.s14 {
font-size: 14px !important;
}
.s16 {
font-size: 16px !important;
}
.s20 {
font-size: 20px !important;
}
.s22 {
font-size: 22px !important;
}
.s24 {
font-size: 24px !important;
}
.s32 {
font-size: 32px !important;
}
.s34 {
font-size: 32px !important;
}
.s64 {
font-size: 64px !important;
}
/* ------------------ Colors --------------------*/
.color-red {
color: #ed7a53 !important;
}
.color-dark-red {
color: #ff0000 !important;
}
.light-red{
color: #ed5353 !important;
}
.color-red-light {
color: #ec8765 !important;
}
.color-red-dark {
color: #ec693c !important;
}
.color-blue {
color: #1389b9 !important;
}
.color-blue-light {
color: #4faede !important;
}
.color-blue-dark {
color: #1e86ba !important;
}
.color-green {
color: #89d541 !important;
}
.color-orange {
color: #ff921f !important;
}
.color-green-light {
color: #adcf7e !important;
}
.color-green-dark {
color: #8db652 !important;
}
.color-yellow {
color: #f4ad49 !important;
}
.color-yellow-light {
color: #f5b75f !important;
}
.color-yellow-dark {
color: #d69840 !important;
}
.color-white {
color: #ffffff !important;
}
.color-black {
color: #000000 !important;
}
.color-dark {
color: #1f3140 !important;
}
.color-dark-light {
color: #273e51 !important;
}
.color-dark-dark {
color: #17242f !important;
}
.color-gray {
color: #a2aaac !important;
}
.color-gray-light {
color: #777777 !important;
}
.color-gray-dark {
color: #333333 !important;
}
.bg-white {
background: #ffffff !important;
}
.hover-green:hover {
color: #89d541 !important;
}
/* ----------- Bootstrap typeahead ------------- */
.w10{
width:10%;
float:left;	
}
.w20{
width:20%;
float:left;		
}
.w30{
width:30%;
float:left;		
}
.w40{
width:40%;
float:left;		
}
.w50{
width:50%;
float:left;		
}
.w60{
width:60%;
float:left;		
}
.w70{
width:70%;
float:left;		
}
.w80{
width:80%;
float:left;		
}
.w90{
width:90%;	
float:left;	
}
.w100{
width:100%;
float:left;		
}
.wp100{
width:100%;	
}
.w290{
width:290px !important;	
}
.col{
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
box-sizing: border-box;
}
.ticket-details-modal .trophy{
position: absolute;
bottom: -25px;
left: -30px;
font-size: 40px;
}
.order-details-wrap label{
float:left;
margin-right:10px;
}
.twitter-typeahead{
width:100% !important;
}
.twitter-typeahead .tt-dropdown-menu{
top:40px !important;
left:0px !important;
}
.twitter-typeahead input {
width:100% !important;	
}
.twitter-typeahead .tt-input{
background-color:#fff !important;
}
.tt-dropdown-menu {
cursor:pointer;
width: 400px;
margin-top: 5px;
padding: 5px 0;
background-color: #ffffff;
border: 1px solid #c4c4c4;
border-radius: 2px;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
top:30px !important;
left:10px !important;
}
.tt-dropdown-menu p{
max-height:24px;
overflow:hidden
}
.tt-suggestion {
padding: 3px 10px;
font-size: 14px;
line-height: 24px;
}
.tt-suggestion.tt-cursor {
color: #1a1a1a;
background-color: #f3f3f3;
}
.tt-suggestion p {
margin: 0;
}
.auto-complete-checkmark {
color: green;
position: absolute;
font-size: 18px;
top: 9px;
right: 10px;
}
.typeahead-spinner{
position: absolute;
font-size: 18px;
top: 8px;
right: 10px;
}
.bp-read-only{
border:1px solid #fff;	
}
.dataTables_wrapper .dataTables_processing{
top: 100px !important;
height: 65px !important;
background: #38323a;
width: 200px;
margin: 0px auto;
border-radius: 10px;
color: #fff;
margin-left: -100px;
padding: 22px 35px;
z-index: 100;
}
.fa-pulse{
margin-right:8px;
font-size:18px;
}
.dashboard-avatar{
padding-left:8px !important;
padding-right:0px !important;
position:relative;
}
.driver-color{
width:13px;
height:13px;
border-radius:13px;
position:absolute;
bottom:-1px;
right:-1px;
border:1px solid #fff;
}
.driver-color-ticket{
width:13px;
height:13px;
border-radius:13px;
margin:8px auto 0px;
}
.dashboard-avatar .img-frame{
border-radius:40px;
overflow:hidden;
width:40px;
height:40px;
background-size: 34px 34px !important;
background-repeat: no-repeat !important;
background-position: center; 
}
.border_offline{
border:3px solid #ccc;	
}
.border_online{
border:3px solid #8BC34A;;	
}
.driver-details-photo{
width:100%;
height:auto;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;	
}
.profile-photo{
background: #fff;
border: 2px solid #77b33f;
float: right;
border-radius: 50px;
height: 85px;
position: absolute;
right: 20px;
width: 85px;
height:85px;
overflow: hidden;
}
.profile-photo div{
margin: 27px 0px 0px 27px;
font-size: 30px;
}
.profile-photo div i{
color:#77b33f;	
}
.company-logo{
border: 1px solid #d8d8d8;
width: 200px;
padding: 3px 10px;
text-align: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.company-logo img{
width:180px !important;
height: auto !important;
}
.profile-photo img, .company-logo img{
width:100%;
height:100%;
}
.profile-photo p, .company-logo p{
position: absolute;
text-align: center;
top: 35%;
width: 100%;
}
.ratings_wrap{
display:none;
}
.ticket-remaining-wrap .ticket-number{
float:left;
width:45%;
position:relative;
color:#fcd206;
}
.ticket-remaining-wrap .ticket-text{
float:right;
width:55%;
color:#000;
font-size: 10px;
text-align: center;
background:#fcd206;
min-height:29px;
}
.ticket-number p{
font-size: 15px;
font-weight: bold;
position: absolute;
text-align: center;
top: 5px;
width: 100%;
}
.dashboard-tab{
position:absolute;
width:100%;
top:0px;
left:0;
z-index:10;
background:#FFFFFF;
display:none;
}
.dashboard-tab a{
display:block;
text-align: center;
font-weight:bold;
padding:8px;
color:#000000;
}
.dashboard-tab a:hover,
.dashboard-tab a.active
{
text-decoration:none;
background:#ECECEC;
}
.dashboard-tab .col-xs-4{
padding:0;
margin:0;
}
.dashboard-tab a.active{
color:#004D75;
}
.float-right{
float:right;
}
.float-left{
float:left;
}
.clear{
clear:both;
}
.ticket-remaining-wrap{
margin-right: 30px;
font-size: 13px;
color: #333;
text-transform: uppercase;
}
.raty-stars{
zoom:80%;
width:100px;
}
.new-ticket-mdl .module-wrap{
padding: 6px;
background: #fbfbfb;
border: 1px solid #e8e8e8;
margin-bottom:15px;
}
#total-wrap{
padding: 7px;
border-radius: 7px;
}
#frm_new_ticket #total{
border: 1px solid #ccc;
border-radius: 7px;
line-height: 15px;
padding: 7px;
margin-left: 7px;
font-size: 18px;
}
#feature-video { 
position: relative; 
padding-bottom: 56.25%; 
height: 0; 
overflow: hidden; 
max-width: 100%; 
} 
#feature-video iframe, #feature-video object, #feature-video embed { 
position: absolute; 
top: 0; 
left: 0; 
width: 100%; 
height: 100%; 
}
.delete{
font-size:24px;
color:#ed7a53;
cursor:pointer;	
}
.delete:hover{
color:#F00;	
}
.new-product .price_input{
min-width: 70px !important;	
}
.order-item-buttons .delete-order-item:hover{
color:#C00;
cursor:pointer;
}
.order-item-buttons .add-order-item:hover{
color:#0065CA;
cursor:pointer;
}
.order-item-row{
margin-bottom: 10px;
border-bottom: 3px solid #c6c6c6;
}
.ticket-abbr{
width: 20px;
border-radius: 20px;
margin-left: -2px;	
}
.zones-button{
border: 1px solid #191919;
float: left;
width: 47%;
border-radius: 0px;
background: rgba(0,0,0,.7);
color: #ffffff;
z-index: 10001;
padding: 5px 10px 7px 10px;
}
.zones-button:hover{
background:#38323a;	
color:#fff;
}
.zones-button-dark{
border: 2px solid #38323a;
float: left;
width: 47%;
border-radius: 4px;
background: #38323a;
color: #fff;
z-index: 10001;
}
.zones-button-dark:hover{
background:#fff;	
color:#38323a;
}
.zone-driver-img{
width: 40px;
border-radius: 40px;
float: left;
margin-right: 10px;
}
.zone-info-wrap{
min-width: 220px;
}
.zone-info-wrap div{
margin-left: 50px;	
}
.track-map-parent,
.track-details-wrap,
.heatmap-parent
{
height: 75%;
margin-top: 20px;
position: absolute;
width: 70%;
}
.track-map{
position:absolute;
width:100%;
height:100%;
}
.tr_d{
display:none;
}
.track_replay{
margin-top:25px;
display:none;
padding: 2px 12px;
font-size: 28px;
width:50px;
}
.track-details-wrap{
right:0;
width:27%;
border:1px solid #ccc;
font-size:13px;
overflow:scroll;
background:#efefef;
}
.cancel-tour-continue-wrap{
line-height:71px;
position:absolute;
top:49%;
left:50%;
margin-left:-247px;	
z-index:101;
font-size:22px;
color:#333;
}
.wn-or{
float:left;
padding:0px 10px;
color: #fff;
}
.cancel-tour{
background: none !important;
color: #fff;
}
.cancel-tour, .continue-tour{	
float:left;
padding: 0px 40px;
border-radius:20px;
background:#fff;
cursor:pointer;
border:2px solid #fff;
}
.continue-tour:hover{
color:#000;
background:#efefef;	
}
.cancel-tour:hover{
background: #fff;
color:#000;	
}
.take-tour-but:hover > i{
color:#2b84ca !important;
}
.wn-text{
font-size: 18px;
padding: 10px;
border-radius: 10px;
background: rgba(24, 24, 24, .5);	
}
.wn-step-1-txt{
width:200px;
margin-left:-50px;	
}
#whats-new-wrap{
background: rgba(0,0,0,0.6);
width: 100%;
height: 100%;
position: fixed;
top: 0px;
left: 0px;
z-index: 10;
}
#whats-new-wrap .whats-new-item{
position:absolute;
color:#fff;
width: 320px;
}
.wn-arrow{
background:url('https://zippykind.com/assets/images/arrow-t.png');
width:64px;
height:190px;	
}
.arrow-45{
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);	
}
.arrow-90{
-ms-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);	
}
.arrow-135{
-ms-transform: rotate(135deg);
-webkit-transform: rotate(135deg);
transform: rotate(135deg);	
}
.arrow-180{
-ms-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);	
}
.arrow-225{
-ms-transform: rotate(225deg);
-webkit-transform: rotate(225deg);
transform: rotate(225deg);	
}
.arrow-270{
-ms-transform: rotate(270deg);
-webkit-transform: rotate(270deg);
transform: rotate(270deg);	
}
.arrow-315{
-ms-transform: rotate(315deg);
-webkit-transform: rotate(315deg);
transform: rotate(315deg);	
}
.arrow-355{
-ms-transform: rotate(355deg);
-webkit-transform: rotate(355deg);
transform: rotate(355deg);	
}
table.dataTable{
width:100% !important;	
}
.dataTables_wrapper .dataTables_filter input{
border: 1px solid #ccc !important;
border-radius: 5px !important;	
}
table.dataTable.no-footer{
border-bottom: 5px solid #f1f1f1;	
}
table.dataTable thead th, table.dataTable thead td{
border-bottom: 5px solid #f1f1f1;	
}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{
border-top: 1px solid #f1f1f1;	
}
.existing-customer-wrap{
display:none;	
}
.dash-ticket-wrap-in{
line-height:30px;
overflow: hidden;	
}
.dash-ticket-wrap-in .dt-1 i{
font-size:20px;
line-height:30px;
}
.cap{
text-transform:capitalize;	
}
.uppercase{
text-transform: uppercase;
}
.ticket-dash-wrap{
padding-top:0px !important;
border-bottom:0px !important;	
}
.mile-tag{
border-radius:25px;
background:#fff;
color:#0cc012;
float:right;
padding:3px 9px;
font-size:11px;
line-height:13px;	
margin: 5px 0px;
font-weight: bold;
}
/* --------- Pagination and pagers ------------ */
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
z-index: 3 !important;
color: #8BC34A !important;
background: #f3f3f3 !important;
border-color: #c8c8c8 !important;
}
.dataTables_wrapper .dataTables_paginate {
height: auto !important;
margin: 0 0 18px 0 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
color: #8BC34A !important;
border-bottom: 1px solid #8BC34A !important;
background: none !important;
background-image:none !important;
padding: 8px 0px !important;
border-top: 0px;
border-left: 0px;
border-right: 0px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button{
border-bottom: 1px solid #8BC34A !important;
}
.dataTables_wrapper .dataTables_paginate > li:last-child a,
.dataTables_wrapper .dataTables_paginate > li:last-child span {
margin-right: 0 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active, .dataTables_wrapper .dataTables_paginate paginate_button.next, .dataTables_wrapper .dataTables_paginate .paginate_button:hover{
color:#8BC34A !important;
border-radius:35px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button{
background:none !important;
background-image:none !important;	
border:0px !important;
}
.dataTables_wrapper .dataTables_paginate > li a, .dataTables_wrapper .dataTables_paginate .paginate_button {
cursor: pointer !important;
transition: background !important;
margin-right: 3px !important;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff3f3f3', GradientType=0) !important;
padding: 6px 15px !important;
margin-bottom: 5px !important;
box-shadow: 0 1px 0 #eaeaea ,0 1px 0 #fff inset !important !important;
font-weight: bold !important;
transition: all !important;
transition-duration: 0.4s !important;
font-size: 20px;
color:#ccc;
}
.dataTables_wrapper .dataTables_info{
float: right;
font-weight: bold;	
}
.required-fields-warning{
background:#F33;
color:#fff;
border-radius:8px;
line-height:180%;	
}
.white-tag{
padding:2px 6px;
border-radius:8px;
color:#F33;
background:#fff;
font-weight:bold;
}
.green-round-button-o-small{
border: 2px solid #89d541;
background: 0,0;
color: #89d541;
border-radius: 25px;
padding: 2px 25px;
font-size: 16px;
font-weight: 500;
}
.green-round-button-o-small:hover{
background:#89d541;
color:#fff;
text-decoration:none;	
}
.green-round-button-o{
border:2px solid #89d541;
background:#fff;
color:#89d541;
border-radius:25px;
padding:8px 35px;
font-size:16px;
font-weight: 500;
}
.green-round-button-o:hover{
background:#89d541;
color:#fff;
text-decoration:none;	
}
.green-round-button{
border:2px solid #89d541;
background:#89d541;
color:#fff;
border-radius:25px;
padding:8px 35px;
font-size: 1em;
font-weight: 500;
}
.green-round-button-o:hover{
background:#89d541;
color:#fff;
text-decoration:none;	
}
.orange-round-button{
border:2px solid #ffa200;
background:#ffa200;
color:#fff;
border-radius:25px;
padding:8px 35px;
font-size:16px;
font-weight: 500;
}
.orange-round-button:hover{
background:#fff;
color:#ffa200;
text-decoration:none;	
}
.orange-round-button-o{
border:2px solid #ffa200;
background:#fff;
color:#ffa200;
border-radius:25px;
padding:8px 35px;
font-size:16px;
font-weight: 500;
}
.orange-round-button-o:hover{
background:#ffa200;
color:#fff;
text-decoration:none;	
}
.sm-btn{
padding:2px 20px !important;	
}
*:focus {
outline: none;
}
.dataTables_wrapper .dataTables_filter{
float:left !important;	
margin:0px !important;
}
.dataTables_wrapper .top{
margin: 20px 0;	
}
.dataTables_filter .ion-search{
font-size: 28px;
margin-left: 20px;
}
.dataTables_filter label{
line-height: 53px;	
}
.dataTables_filter input[type="search"]{
width: 450px;
border: 0px !important;
position: relative;
padding: 8px;
font-size: 32px;
margin: 0 0 0 20px !important;
color: #666;	
font-weight: 100;
line-height: 100%;
}
.dataTables_wrapper .dataTables_paginate{
margin: 0px !important;	
}
.dataTables_filter ::-webkit-input-placeholder { 
color: #CDCDCD;
}
.dataTables_filter ::-moz-placeholder { 
color: #CDCDCD;
}
.dataTables_filter :-ms-input-placeholder { 
color: #CDCDCD;
}
.dataTables_filter :-moz-placeholder { 
color: #CDCDCD;
}
.dataTables_wrapper thead{
background: #f3f3f3;
}
/* ---------- Custom Checkboxes and radios ---------- */
input[type='checkbox'], input[type='radio']{
height: 20px;
width: 20px;
position: relative;
}
input[type='checkbox']:after, input[type='radio']:after{
content: '\00D7';
display: block;
background: white;
background-image: url('https://zippykind.com/assets/images/custom-check.png');
pointer-events: none;
font-size: 15px;
position: absolute;
top: 0;
left: 0;
height: 20px;
width: 20px;
color: transparent;
transition: .25s all ease-in-out;
border-radius: 3px;
line-height: 15px;
background-position: 0 15px;
background-repeat: no-repeat;
background-size: 15px 15px;
border-width: 2px;
border-style: solid;
border-color: #ccc;
}
input[type='radio']:after{ border-radius: 50%; }
input[type='checkbox']:checked:after, input[type='radio']:checked:after {
background-color: #89d541;
background-position: 0 0;
border-color: #89d541;
}
input[type='checkbox']:hover:after, input[type='radio']:hover:after{
border-color: #89d541;
}
.modal-content .gravatar{
width: 120px;
margin: 25px auto;	
}
.modal-content .small-gravatar{
width: 80px;
margin: 0px 20px 10px;
}
#ticket-history .ticket-item{
padding:2px;	
}
#ticket-history .item-header{
font-size: 18px;
color: #fff;
padding: 3px 7px;
}
#ticket-history .status-item-desc{
background:#fff;
padding: 5px;
}
#csv-format-table div{
font-size:10px;
font-weight:normal;	
}
#csv-format-table{
border:1px solid #efefef;   
}
#csv-format-table td{
padding:4px 9px;
border:1px solid #efefef; 
font-weight:bold;  
}
#csv-format-table .format-options .optional{
background:#66dc66;  
color:#fff; 
}
#csv-format-table .format-options .required{
background:#f44; 
color:#fff;  
}
.csv-table div{
font-size:10px;
font-weight:normal;	
}
.csv-table{
border:1px solid #efefef;   
}
.csv-table td{
padding:4px 9px;
border:1px solid #efefef; 
font-weight:bold;  
}
.csv-table .format-options .optional{
background:#66dc66;  
color:#fff; 
}
.csv-table .format-options .required{
background:#f44; 
color:#fff;  
}
.popup_menu #notification_list li{
color:#fff;	
}
ul,li{
list-style: none !important;
}
ul.check {
list-style: none;
padding: 0px 0px 0px 10px;
margin-bottom:25px;
}
ul.check li {
padding-left: 1.3em;
padding-bottom:10px;
}
ul.check li:before {
content: "\f00c"; 
font-family: FontAwesome;
display: inline-block;
margin-left: -1.8em; 
width: 1.8em; 
}
.ticket-details-modal .info-wrap{
border:1px solid #efefef;  
margin-bottom: 20px;
}
.ticket-details-modal .info-title{
background:#E2EBF1; 
font-size:16px;
padding:9px 7px;
font-weight:bold; 
color: #153144;
}
.ticket-details-modal .info-body{
 padding: 15px 7px 7px 7px;
}
.small-table{
width:100%;  
}
.small-table thead td{
padding:7px;
background:#efefef;
font-weight:bold;
}
.small-table tbody td{
padding:7px;  
}
.small-table tbody tr{
border-bottom:1px solid #efefef;  
}
.amcharts-chart-div a {
display:none !important;
}
.xdsoft_date:hover{
background:#89d541 !important;
cursor: pointer;
}
.track-details-wrap .track-in{
width:100%;
border-bottom: 1px solid #e0e0e0;
}
.track-details-wrap .track-in{
width:100%;
border-bottom: 1px solid #e0e0e0;
position:relative;
font-size:12px;
}
.track-details-wrap .track-time{
position:absolute;
top:4px;
right:4px;
padding:1px 6px;
background:#333;
color:#fff;    
border-radius:20px;
font-size:9px;
}
.track-details-wrap .track-time i{
color:#fff;	
}
.track-details-wrap .track-coords{
float:left;
padding:5px 10px;
background:#efefef;
width:85%;
overflow:none;
}
.pointer{
cursor:pointer;	
}
a:hover{
text-decoration:none;	
}
.support-item .vid{
border:2px solid #000;	
}
.support-item .vid:hover{
border:2px solid #89d541;
}
.support-item .title{
font-size:18px;
font-weight:bold;
margin-bottom:25px;	
}
.support-item .desc{
font-size:12px;
font-weight:100;	
}
.talk-bubble {
margin: 7px 10px;
display: inline-block;
position: relative;
height: auto;
background-color: lightyellow;
border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border: 3px solid #ccc;
}
.tri-right.right-top:before {
content: ' ';
position: absolute;
width: 0;
height: 0;
left: auto;
left: -18px;
top: -3px;
bottom: auto;
border: 16px solid;
border-color: #ccc transparent transparent transparent;
}
.tri-right.right-top:after{
content: ' ';
position: absolute;
width: 0;
height: 0;
left: auto;
left: -11px;
top: 0px;
bottom: auto;
border: 15px solid;
border-color: lightyellow transparent transparent transparent;
}
.talktext{
padding: 1em;
text-align: left;
line-height: 1em;
}
.talktext p{
-webkit-margin-before: 0em;
-webkit-margin-after: 0em;
}
.gps-driver{
width:100%;
height:300px;
margin-top:7px;
}
.custom-route-btns-wrap{
position:fixed;
bottom:0px;
left:280px;
background:#2f2f2f;
padding:15px;
text-align:left;
z-index:10;
width: -webkit-calc(100% - 280px);
width: -moz-calc(100% - 280px);
width:calc(100% - 280px);	
}
.ticket-dash-wrap .route-number{
font-size: 12px;
font-weight: bold;
color: #969696;
padding: 4px 3px;
width: 25px;
height: 25px;
text-align: center;
position: absolute;
top: 55px;
right: 15px;	
}
.custom-route-btns-wrap .total-trip-wrap{
border:2px solid #fff;
font-size:1.2em;
padding:5px 15px;
border-radius:20px;
color:#fff;	
margin:5px 0px;
}
.custom-route-btns-wrap .stops-counter{
background:#fff;
color:#333;
border-radius:15px;
padding: 4px 7px;
width:100px;
text-align:center;
font-size: 11px;
font-weight: bold;
}
#frm_map_style_settings .map-styles-map{
width:100%;
height:auto;
border:2px solid #ccc;	
cursor:pointer;
}
#frm_map_style_settings .map-styles-map:hover, #frm_map_style_settings .map-styles-map.active{
border:2px solid #89d541;		
}
#frm_map_style_settings input[type=radio]{
display:none;	
}
.browse-support-videos .video-title, #frm_map_style_settings .map-title{
text-align:center;
font-size:18px;
margin:30px 0px 10px;	
}
.browse-support-videos img, .pages-demo-video img{
border:2px solid #ccc;	
cursor:pointer;
width:100%;
margin-bottom:10px;
}
.browse-support-videos img{
max-width:450px;
}
.browse-support-videos img:hover, .pages-demo-video img:hover{
border:2px solid #7ec13e;	
}
.list-group .list-group-item{
display:inherit !important;	
}
#frm_changes_status .status-option-wrap{
width:95px;	
float:left;
margin-right:12px;
}
#frm_changes_status .status-option-wrap-last{
width:100px;
margin-right:0px !important;
float:left;
}
#frm_changes_status .status-option{
width:98px;
height:98px;
border:2px solid #000;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
overflow:hidden;
cursor:pointer;
padding:8px;
}
#frm_changes_status .status-option:hover{
border:2px solid #89d541;	
}
#frm_changes_status .option-title{
color:#89d541;
font-size:14px;
text-transform:uppercase;
text-align:center;
margin:15px 0 10px 0;	
}
#amount-due{
border-right: 1px solid #ccc;
padding: 10px;
font-size: 30px;
text-align: right;	
}
.green-box{
padding: 8px;
box-sizing: border-box;
border: 1px solid #ffffff;	
cursor:pointer;	
}
.green-box:hover, .green-box.active{
border: 1px solid #89d541;
-webkit-border-radius: 9px;
-moz-border-radius: 9px;
border-radius: 9px;
}
.bootstrap-switch input[type=radio], .bootstrap-switch input[type=checkbox]{
height: initial !important;
width: initial !important;
}
.ticket_unassigned .awaiting-assignment{
background:#2f2f2f;
padding:8px 0px;	
}
.ticket_unassigned .small-font{
color:#fff;
text-transform:capitalize;	
}
.hours-tbl td{
padding:5px 10px;	
}
#schedule-wrap .fc-event .fc-driver-img{
width: 30px;
height: 30px;
margin: -5px 0px -5px -5px;
border-radius: 25px;
}
#schedule-view thead a{
color: #89d541 !important;	
}
#schedule-wrap #loading{
z-index:100;	
}
.truncate-text{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;	
}
.fc-content.truncate-text{
min-width:20px;
}
.dash-circ{
width: 17px;
height: 17px;
border-radius: 20px;
margin-top: 12px;
background:#fff;	
}
.dash-circs-wrap{
z-index:2;	
}
.dash-circ-d-p{
border: 1px solid #000;
font-size: 10.5px;
font-weight: 800;	
}
.dash-circ-stop-1{
border: 1px solid #89c540;
} 
.dash-circ-stop-3{
border: 1px solid #f08300;
} 
.dash-circ-stop-failed{
border: 1px solid #d20a0a;	
}
.product-pickup-wrap .dash-circ{
margin:10px auto !important;	
}
.product-pickup-wrap .dash-line-stop-1{
left: 50% !important;
margin-top: 35px;	
}
.tickets-view .list_row .row.box{
padding-left:0px !important;
padding-right:0px !important;
position: relative;	
}
.tickets-view .dash-time{
font-size:16px;	
font-weight:bold;
}
.tickets-view .dash-ticket-number{
padding: 5px 15px 5px 10px;
line-height: 100%;
color: #737373;
background: #e8e8e8;
margin-right: -15px;
font-size: 12px;
}
#online-drivers-wrap .driver-name-dash{
padding:2px 3px;
box-sizing:border-box; 
line-height:100%;
border-radius:4px; 
border: 1px solid #2f2f2f;
font-size:9px;
color:#fff;
background:#2f2f2f;	
margin-top:4px;
text-align:center;
letter-spacing:.05em;
width:40px;
max-width:40px;
}
#online-drivers-wrap .driver-color{
bottom:17px !important;	
}
.dash-line-stop-1{
position: absolute;
left: -24px;
height: 54px;
width: 1px;
background-color: #89c540;
z-index: 1;
margin-top: 12px;
}
.tickets-view .more-info{
position:absolute;
top:50px;
right:50px;	
}
.dash-wrap-unassigned{
border-bottom: 2px solid rgba(245, 112, 76, 1);
background: rgba(245, 112, 76, .8);
}
.dash-wrap-assigned{
border-bottom: 2px solid rgba(244, 67, 54, 1);
background: rgba(244, 67, 54, .8);
}
.dash-wrap-acknowledged, .dash-wrap-accepted{
border-bottom: 2px solid rgba(77, 149, 210, 1);
background: rgba(77, 149, 210, .8);
}
.dash-wrap-successful{
border-bottom: 2px solid rgba(44, 159, 44, 1);
background: rgba(44, 159, 44, .8);
}
.dash-wrap-started{
border-bottom: 2px solid rgba(187, 105, 201, 1);
background: rgba(187, 105, 201, .8);
}
.dash-wrap-inprogress, .dash-wrap-arrived{
border-bottom: 2px solid rgba(255, 155, 0, 1);
background: rgba(255, 155, 0, .8);
}
.dash-wrap-cancelled, .dash-wrap-failed, .dash-wrap-declined{
border-bottom: 2px solid rgba(250, 5, 0, 1);
background: rgba(250, 5, 0, .8);
}
.tickets-view .dash-ticket-wrap-in .dt-2{
color: #fff !important;	
}
.tickets-view .ticket-dash-wrap{
box-shadow: none !important;	
}
.tickets-view .dashboard-calendar{
background: #89c540;	
}
.tickets-view #tab .box:hover > .dash-item-options-wrap{
-webkit-animation: fadein 2s;
-moz-animation: fadein 2s;
-ms-animation: fadein 2s; 
-o-animation: fadein 2s; 
animation: fadein 2s;		
}
.waiting-driver{
text-transform: uppercase;
font-size: 11px;
margin-top: 3px;	
}
.dash-item-options-wrap{
display:none;
}
.tickets-view #tab li .box:hover .dash-item-options-wrap{
-webkit-animation: fadeIn .2s;
-moz-animation: fadeIn .2s;
-ms-animation: fadeIn .2s; 
-o-animation: fadeIn .2s; 
animation: fadeIn .2s;	
display: block;
}
.dash-item-options-wrap{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background:rgba(0,0,0,.85);
color:#fff;	
z-index:10;
}
.dash-item-options-wrap .dash-option{
width:50%;	
float:left;	
text-align: center;
}
.dash-item-options-wrap .dash-option-full-width{
width:100% !important;	
}
.dash-item-options-2 .dash-option{
padding-top: 35px;
height: 100%;
}
.dash-item-options-3 .dash-option, .dash-item-options-4 .dash-option{
padding-top: 15px;
height: 50%;	
}
.dash-option-info{
display: none;
background: #fff;
padding: 0px 6px;
border-radius: 6px;
color: #333;
font-size: 9px;
width: 80%;
margin: 10px auto 0px;	
}
.dash-item-options-2 .dash-option:hover > .dash-option-info{
display:block;	
}
.dash-item-options-4 .dash-option:hover > i, .dash-item-options-3 .dash-option:hover > i{
display:none;	
}
.dash-item-options-4 .dash-option:hover > .dash-option-info, .dash-item-options-3 .dash-option:hover > .dash-option-info{
display:block;	
}
.dash-item-options-wrap i{
font-size:34px;
text-align:center;
padding:15px;
cursor:pointer;
color:#fff;
}
.dash-item-options-wrap div:hover i{
color:#89c540;
}
.pie-wrap { 
width:16px;
height:16px;
position:relative;
background:#fff; 
border: 1px solid #89c540;
border-radius:18px;
margin-top:12px;
}
.pie {
width: 50%;
height: 100%;
transform-origin: 100% 50%;
position: absolute;
background: #89c540;
}
.pie-spinner {
border-radius: 100% 0 0 100% / 50% 0 0 50%;
z-index: 200;
border-right:none;
animation: rota 5s linear infinite;
}
.pie-filler {
border-radius: 0 100% 100% 0 / 0 50% 50% 0; 
left: 50%;
opacity: 0;
z-index: 100;
animation: fill 5s steps(1,end) infinite;
border-left: none;
}
.pie-wrap .mask {
width: 50%;
height: 100%;
position: absolute;
background: inherit;
opacity: 1;
z-index: 300;
animation: mask 5s steps(1,end) infinite;
border-top-left-radius:17px;
border-bottom-left-radius:17px;
}
.drivers-view ul#tabs li{
text-transform: uppercase;
font-size: .7em;
font-weight: bold;
}
.bootstrap-duallistbox-container input, .bootstrap-duallistbox-container select, .bootstrap-duallistbox-container button{
border-radius: 0px !important;	
box-shadow: none !important;
}
.bootstrap-duallistbox-container .move, .bootstrap-duallistbox-container .remove{
width: 60%;	
}
.bootstrap-duallistbox-container .moveall, .bootstrap-duallistbox-container .removeall{
width: 40%;	
}
.bootstrap-duallistbox-container .btn-group{
width: 100%;
margin-bottom: 7px;
}
.bootstrap-duallistbox-container input{
margin-bottom: 7px;	
}
.bootstrap-duallistbox-container .btn.btn-default{
background-image: linear-gradient(to bottom, #ffffff 0%, #e0e0e0 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
text-shadow: 0 1px 0 #fff;
border-color: #dbdbdb;
border-color: #ccc;
}
.bootstrap-duallistbox-container .btn-group .btn i {
color: #acb1b8;
line-height:inherit !important;
}
.bootstrap-duallistbox-container .move, .bootstrap-duallistbox-container .remove{
padding-bottom:8px; 	
}
.bg-trans{
background:0,0 !important;	
}
.sm-det-btn{
border:1px solid #333;
background:#333;
padding:2px 4px;
color:#fff;
font-size:9px;	
text-transform:uppercase;
border-radius:3px;
}
.sm-create-route-btn{
border:1px solid #89c540;
background:#89c540;
padding:2px 4px;
color:#fff;
font-size:9px;	
text-transform:uppercase;
border-radius:3px;	
}
.sm-create-route-btn.red-btn{
border:1px solid #fb2c2c;
background:#fb2c2c;	
color:#fff;
}
.sm-create-route-btn.red-btn:hover, .sm-create-route-btn.red-btn:focus, .sm-create-route-btn.red-btn:active{
background:#fff;
color:#fb2c2c;
text-decoration:none !important;
}
.sm-create-route-btn:hover, .sm-create-route-btn:focus, .sm-create-route-btn:active{
background:#fff;
color:#89c540;
text-decoration:none !important;
}
.sm-det-btn:hover, .sm-det-btn:focus, .sm-det-btn:active{
background:#fff;
color:#333;
text-decoration:none !important;
}
#toast-container > .toast-info {
border-right: 1px solid #fff;
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
border-radius: 0px !important;
background-image:none !important;
background:rgba(37,48,52,1) !important;
}
.toast-info:before {
content: " ";
position: absolute;
z-index: 1;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
border-left:10px solid #89d541;
}
.toastr-pic{
border-radius: 40px;
overflow: hidden;
width: 30px;
height: 30px;
border: 1px solid #89d541;
}
#toast-container>div{
opacity:1 !important;
padding: 15px 15px 15px 20px;
}
.send-driver-push-pic{
width: 50%;
margin-left: 25%;
height: auto;
border: 6px solid #efefef;
border-radius: 200px;	
}
/* Route Optimization */
ul#sortable, ul#sortable-label{
list-style: none;
margin:0px;
padding:0px;
width:100%;
}
ul#sortable .sort-label{
line-height:28px;	
}
ul#sortable-label li{
color: #fff;
padding: 20px;
margin: 0px auto 10px;
padding: 10.2px 5px;
color:#222;
display:inline-block;
width:100%;
}
ul#sortable li{
color: #fff;
padding: 20px;
width: 100%;
margin: 0px auto 10px;
cursor: move;
background-color: #f7f7f7;
padding: 5px;
border-radius: 6px;
border: 1px solid #d0cfcf;
color:#222;
display:inline-block;
}
#sortable .ui-sortable-placeholder{
border: 1px dotted;
border: 1px solid #89d541;
padding: 10px 5px;
background:#89d541;
}
#uploader-templates-list li{
display:block !important;	
}
ul#sortable li.required{
border-right:4px solid #F00;	
}
.directions-panel-count{
background:#fff;
border-radius:18px;
width:15px;
height:15px;
padding:1px;
text-align:center;
color:#333;
font-size:10px;
font-weight:bold;
}
.directions-panel-row{
border-bottom: 1px solid #444;
margin-bottom: 10px;	
font-size: 11px;
}
.directions-panel-row .col-a{
width:15px;	
text-align: center;
}
#directions_panel, #route_item_info_container {
color: #fff;
padding: 20px;
position: fixed;
top: 51px;
right: 0;
overflow: auto;
z-index: 9;
border-bottom: 1px solid #ccc;
box-sizing:border-box;
}
#directions_panel{
width: 280px;
background: #191919;
height: calc(100vh - 210px);
}
#route_item_info_container {
width: 0px;
background: #272727;
display:none;
}
.custom-route-btns-wrap button{
padding: .5em 1.1em !important;	
margin:5px 0px;
}
#map-progress-bar{
display: table-cell;
}
#progress-bar{
position:absolute;
left:0px;
top:0px;
right:0px;
bottom:0px;
background:rgba(0,0,0,.5);
color:white;
padding:40px;
text-align:center;
display:none;
}
#map-progress #preparing-route-progress{
text-align:center;
width:100%;
font-size:26px;
color:#fff;
margin-top:25px;
}
.map-progress{
position:fixed;
top:0px;
bottom:0px;
left:0px;
right:0px;
background:rgba(0,0,0,.5);
padding:100px;
z-index:1000;
}
.accounting-tbl .ion-minus-round:before, .accounting-tbl .ion-plus-round:before{
width:20px;	
}
#directions_panel .ui-state-default{
border: none; 
background: none; 
font-weight: normal;
color: #fff;
position:relative;
}
#directions_panel .ui-sortable li{
border-left: 4px solid #89c540;	
cursor:move;
}
#directions_panel .ui-sortable .route-info{
position:absolute;
left:0px;
bottom:0px;
background:#333;
color:#fff;
padding: 2px 6px;	
cursor:pointer;
}
#directions_panel .ui-sortable .route-info:hover{
background:#89c540;
}
#directions_panel .ui-sortable .route-info i{
color:#fff;	
}
#directions_panel .ui-sortable, #directions_panel .unsortable{
padding-left:0px;	
}
.border-box{
border-box:box-sizing;
}
.route-item-close{
padding:4px;
cursor:pointer;
text-align:right;	
}
.route-item-close i{
font-size:14px;
color:#f00;
}
.route-item-close:hover > i{
color:#ff6565;
}
.ui-state-highlight{
background:#89c540;
border-radius:5px;
height:45px;	
list-style-type: none;
}
.route-item-label{
font-weight:bold;
color: #fff;
}
/*------------ end route optimization -------------*/
#table_list_sort_2 .btn-primary, .table .btn-primary{
color: #313131 !important;	
background-color: rgba(255, 255, 255, 0.0) !important;
border-color: #313131 !important;	
padding: 4px 10px !important;	
border: 1px solid !important;	
box-shadow: none !important;
}
#table_list_sort_2 .btn-primary:hover, .btn-primary:focus{
color: #fff !important;	
background-color: #333 !important;
background: #333 !important;	
border:1px solid #333;
}
#directions_panel .ui-sortable-handle{
-ms-touch-action:none;touch-action:none
}
.resize_dashboard_map{
width: -webkit-calc(100% - 560px) !important;
width: -moz-calc(100% - 560px) !important;
width: calc(100% - 560px) !important;
height: -webkit-calc(100% - 210px) !important;
height: -moz-calc(100% - 210px) !important;
height: calc(100% - 210px) !important;
}
/* --------------- Support Videos --------------- */
.vid-preloader{
position:absolute;
top:0;
left:0;
z-index:999999;
width:100%;
height:100%;
display:none;
}
.vid-preloader .vid-vid-inner{
margin: 0;
padding: 0;
position: absolute;
top: 10%;
width: 100%;
}
.vid-pre-in {
margin: 150px auto;
font-size: 10px;
position: relative;
text-indent: -9999em;
border-top: 1.1em solid rgba(118, 195, 44, 0.2);
border-right: 1.1em solid rgba(118, 195, 44, 0.2);
border-bottom: 1.1em solid #9cf14c;
border-left: 1.1em solid #89d541;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
-webkit-animation: load8 1.1s infinite linear;
animation: load8 1.1s infinite linear;
}
.vid-pre-in,
.vid-pre-in:after {
border-radius: 50%;
width: 10em;
height: 10em;
}
/* --------------- Pseudo Elements --------------- */
::-webkit-scrollbar-track{
background-color: #F5F5F5;
}
::-webkit-scrollbar{
width: 8px;
background-color: #F5F5F5;
}
::-webkit-scrollbar-thumb{
-webkit-box-shadow: inset 0 0 3px #5d5c5c;
background-color: #5d5c5c;
}
/* --------------- Setup Account --------------- */
.setup-account .setup-steps{
margin:10px 0; 
text-align:center; 
}
.setup-account .setup-steps .setup-step {
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
padding:15px 21px;
border:1px solid #89d541;
background:#fff;
color:#89d541;
float:left;
margin:0px 20px;
cursor:pointer;
position:relative;
}
.setup-account .setup-steps .setup-step span{
position: absolute;
right: -25px;
top: 18px;
color: #333;
}
.setup-account .setup-steps .active-step, .setup-steps .setup-step:hover{
background:#89d541;
color:#fff;  
}
.setup-account .setup-steps .setup-steps-in{
width: 470px;
margin:0px auto 30px;
}
.setup-account .label-small{
font-size:11px;
color:#999;
text-transform:uppercase;
}
.setup-account .step-title{
text-align:center;
font-weight:bold;
margin-bottom:15px;
font-size:16px;  
}
.setup-account .setup-account-option-btn{
padding:10px;
border-bottom:2px solid #ccc; 
margin:15px 0px;
cursor:pointer;
}
.setup-account .download-app, .add-products{
font-size:46px;
color:#bdbdbd;
cursor:pointer;  
}
.setup-account-icons:hover,.setup-account-icons.active{
color:#333 !important; 
}
.setup-account .download-app div{
margin-top:8px;
color:#ccc;
font-size:12px;
}
.setup-account .skip-step{
color:#89d541; 
line-height:38px; 
}
.setup-account .skip-step:hover{
text-decoration:none;
color:#57921f;  
}
.setup-account .setup-account .price_input{
min-width:70px !important;  
}
.payment-wrap .card-wrapper {
padding: 6px 0px;
width: 100%;
}
.payment-wrap .title{
font-weight:bold;
font-size:18px;
color:#89d541;	
}
.payment-wrap .card-wrapper .jp-card-container{
z-index:0 !important;	
}
.payment-wrap #payment-options{
text-transform:capitalize;
font-size:16px;
font-weight:bold;
margin:50px 0px;
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
}

.payment-wrap .pym-option{
width:50%;
display:inline-block;
padding:7px;
float:left;
text-align: center;
}
.payment-wrap .pym-option:hover, .payment-wrap .pym-option.active{
background: #f3f3f3;
cursor:pointer;
}
.payment-wrap .pick-membership{
border-bottom: 1px solid #ccc;
padding: 20px 0 7px;
font-size: 24px;
margin-bottom: 30px;	
}
.no-hover{
pointer-events: none;	
}
.ticket-map .ticket_critical{
background:#FF0000;
-webkit-animation: argh-my-eyes 2s infinite;
-moz-animation:    argh-my-eyes 2s infinite;
animation:         argh-my-eyes 2s infinite;
}
.tickets-view .dash-status-wrap{
padding-top:2px;	
}
/* styles for '...' truncating text in tickets manager tbl */ 
.truncate-text-tbl {
overflow: hidden;
position: relative; 
line-height: 1em;
max-height: 1em; 
word-break: break-all;  
margin-right: -1em;
padding-right: 1em;
}
.truncate-text-tbl:before {
content: '...';
position: absolute;
right: 4px;
bottom: 0;
z-index:0;
}
.truncate-text-tbl:after {
content: '';
position: absolute;
right: 4px;
width: 1em;
height: 1em;
margin-top: 0.2em;
background: white;
z-index:1;
}
@-webkit-keyframes argh-my-eyes {
0%   { background-color: #FF0000;color:#fff; }
49% { background-color: #FF0000;color:#fff; }
50% { background-color: #fff;color:#333; }
99% { background-color: #fff;color:#333; }
100% { background-color: #FF0000;color:#fff; }
}
@keyframes rota {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes mask {
  0% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

@keyframes fill {
  0% { opacity: 0; }
  50%, 100% { opacity: 1; }
} 
@-webkit-keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}  
@keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}