/*�û�-��ҳ*/
body,html{
height: 100%;
}
.mui-bar-nav~.mui-content {
height: 100%;
}
.nav-user{
display: block;
float:left;
width: 20px;
height: 20px;
margin-left: 5px;
margin-top: 15px;
background:url(../images/icon_my-max@2x.png) no-repeat center;
background-size: contain;
}
.nav-phone{
display: block;
float:right;
width: 20px;
height: 20px;
margin-right: 5px;
margin-top: 15px;
background:url(../images/icon_phone-kefu@2x.png) no-repeat center;
background-size: contain;
}
/*Ԥ����ͼ����ʼ*/
.map-display{
width: 100%;
height: 100%;
background:url(../upload/Map2@2x.png) no-repeat center;
background-size: cover;
position: relative;/*λ�ã�����ʱ��д�ģ���������������*/
}
/*�Ʒѱ�ע��ʼ*/
.calculate-tips{
width: 280px;
height: 82px;
padding: 20px 15px;
background:url(../images/icon_hint02@2x.png) no-repeat center;
background-size: cover;
position: absolute;/*λ�ã�����ʱ��д�ģ���������������*/
top:50px;
left: 50%;
margin-left: -140px;
}
.calculate-tips:after{
display: block;
content: " ";
clear: both;
}
.calculate-tips li{
list-style: none;
float: left;
}
.calculate-tips li:first-child{
border-right: 1px solid #E6E6E6;
}
.calculate-price{
width: 70%;
height: 40px;
}
.calculate-price-show{
width: 30%;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 20px;
color: #F67123;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.calculate-price-detail{
font-size: 10px;
color: #7A7A7A;
}
.calculate-price-detail:after{
display: block;
content: " ";
clear: both;
}
.calculate-price-detail span{
display: block;
float: left;
width:30%;
padding-left: 10px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.calculate-price-detail em{
font-style: normal;
display: block;
float: left;
width:70%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.calculate-price-detail em i{
color: #F67123;
font-style: normal;
}
/*�Ʒѱ�ע����*/
/*�ȴ��ӵ���ʼ*/
.wait-get{
width: 250px;
height: 70px;
padding: 12px 15px;
background:url(../images/icon_hint02@2x.png) no-repeat center;
background-size: cover;
position: absolute;/*λ�ã�����ʱ��д�ģ���������������*/
top:50px;
left: 50%;
margin-left: -125px;
/*outline: 1px solid red;*/
}
.wait-get li{
list-style: none;
font-size: 12px;
color: #7A7A7A;
padding-left: 45px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.wait-get li span{
font-size: 18px;
color: #F67123;
}
/*�ȴ��ӵ�����*/
/*��ͨ��һ����ʾ��ʼ*/
.tall-say{
width: 170px;
height: 50px;
padding: 14px 15px;
background:url(../images/icon_hint02@2x.png) no-repeat center;
background-size: cover;
position: absolute;/*λ�ã�����ʱ��д�ģ���������������*/
top:50px;
left: 50%;
margin-left: -85px;
}
.tall-say li{
list-style: none;
font-size: 12px;
color: #7A7A7A;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
}
.tall-say li span{
font-size: 18px;
color: #F67123;
}
/*��ͨ��һ����ʾ����*/
/*ȷ�Ϻ��п�ʼ*/
.call-sure{
width: 170px;
height: 50px;
padding: 10px 15px;
background:url(../images/icon_hint02@2x.png) no-repeat center;
background-size: cover;
position: absolute;/*λ�ã�����ʱ��д�ģ���������������*/
top:50px;
left: 50%;
margin-left: -85px;
}
.call-sure:after{
display: block;
content: " ";
clear: both;
}
.call-sure li{
float: left;
list-style: none;
}
.call-sure li:first-child{
border-right: 1px solid #E6E6E6;
}
.call-sure-time{
width: 40%;
height: 30px;
font-size: 14px;
color: #F67123;
line-height: 14px;
}
.call-sure-time em{
display: block;
text-align: center;
font-style: normal;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.call-sure-time span{
display: block;
text-align: center;
}
.call-sure-tips{
width: 60%;
height: 30px;
font-size: 12px;
color: #555;
line-height: 30px;
text-align: center;
}
/*ȷ�Ϻ��н���*/
/*Ԥ����ͼ�������*/
/*��˵�*/
.mui-off-canvas-left, .mui-off-canvas-right {
background: #fff;
min-width: 220px;
}
.menu-title{
display: block;
text-decoration: none;
width: 100%;
margin-top:60px;
}
.menu-title img{
display: block;
width: 70px;
height: 70px;
background: #D8D8D8;
border-radius: 100%;
margin: 0 auto;
}
.menu-title p{
margin-top: 15px;
padding-left: 10px;
padding-right: 10px;
font-size: 14px;
color: #555555;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
}
.menu-content{
margin-top: 30px;
}
.menu-content-choose{
display: block;
height: 60px;
width: 100%;
min-width: 220px;
}
.menu-content-choose:after{
display: block;
content: " ";
clear: both;
}
.menu-content-choose i{
display: block;
float: left;
width: 20px;
height: 20px;
margin-left: 30px;
margin-top: 20px;
}
.menu-content-choose .money{
background:url(../images/icon_wallet@2x.png) no-repeat center;
background-size: contain;
}
.menu-content-choose .journey{
background:url(../images/icon_work@2x.png) no-repeat center;
background-size: contain;
}
.menu-content-choose .set{
background:url(../images/icon_set@2x.png) no-repeat center;
background-size: contain;
}
.menu-content-choose .client{
background:url(../imgs/client.png) no-repeat center;
background-size: contain;
}
.menu-content-choose span{
display: block;
float: left;
width: 65%;
line-height: 60px;
margin-left: 10px;
font-size: 16px;
color: #555;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/*�������*/
.extra-bottom{
position: fixed;
bottom: 10px;
left: 0;
width: 100%;
min-width: 320px;
z-index: 10;
}
.extra-bottom-map{
display: block;
width: 30px;
height: 30px;
margin-left: 15px;
background:url(../images/icon_current-position@2x.png) no-repeat center;
background-size: contain;
}
.extra-bottom-choose{
margin-left: 15px;
width: 120px;
height: 50px;
margin-top: 10px;
margin-bottom: 10px;
background: url(../images/icon_cut01@2x.png) no-repeat center;
background-size: 120px 50px;
position: relative;
}
.extra-bottom-choose:after{
display: block;
content: " ";
clear: both;
}
.extra-bottom-choose span{
display: block;
position: absolute;
right: 0;
top:0;
width: 50%;
height: 50px;
line-height: 50px;
text-align: center;
font-size: 12px;
color: #B1B1B1;
z-index: 20;
}
.extra-bottom-choose span:first-child{
position: absolute;
left: 0;
top:0;
}
.extra-bottom-choose i{
display: block;
position: absolute;
top: 7px;
left: 8px;
/*left: 68px;*/
width: 45px;
height: 37px;
border: 1px solid #DEDEDE;
border-radius: 18px;
z-index: 15;
}
.extra-bottom-choose .active{
color: #555;
}
.extra-bottom-content{
background: #fff;
margin: 0 15px;
box-shadow: 0 0 4px 0 rgba(186,186,186,0.50);
border-radius: 2px;
}
.extra-bottom-time{
height: 50px;
text-align: center;
display: none;
}
.extra-bottom-time i{
display: inline-block;
width: 15px;
height: 15px;
background:url(../images/icon_time@2x.png) no-repeat center;
background-size: contain;
vertical-align: middle;
margin-top: -2px;
}
.extra-bottom-time span{
font-size: 12px;
color: #555;
line-height: 50px;
}
.extra-bottom-sot{
display: block;
text-decoration: none;
border-top: 1px solid #F1F1F1;
height: 50px;
position: relative;
}
.extra-bottom-sot:after{
display: block;
content: " ";
clear: both;
}
.extra-bottom-sot i{
display: block;
float: left;
width: 5px;
height: 5px;
border-radius: 100%;
margin-left: 15px;
margin-top: 22px;
}
.extra-bottom-sot span{
display: block;
float: left;
margin-left: 15px;
width: 80%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 50px;
line-height: 50px;
font-size: 14px;
}
.extra-bottom-sot.here i{
background: #36BB9D;
}
.extra-bottom-sot.here span{
color: #333;
}
.extra-bottom-sot.there i{
background: #F67123;
}
.extra-bottom-sot.there span{
color: #B1B1B1;
}
.extra-bottom-mask{
position: absolute;
top:0;
left: 0;
width: 100%;
height: 50px;
z-index: 30;
}
.extra-bottom-history{
position: absolute;
top:7px;
left:110px;
width:50%;
height: 35px;
background:url(../images/icon_lead@2x.png) no-repeat center;
background-size:100% 35px;
z-index: 35;
}
.extra-bottom-history:after{
display: block;
content: " ";
clear: both;
}
.extra-bottom-history a{
display: block;
text-decoration: none;
float: left;
line-height: 35px;
width: 80%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 12px;
color: #FFF;
padding-left: 15px;
}
.extra-bottom-history em{
display: block;
width: 20%;
height: 35px;
line-height: 35px;
text-align: center;
float: right;
background:url(../images/icon_lead-close@2x.png) no-repeat center center;
background-size: 10px 10px;
}
/*��ַѡ����ʽ��ʼ*/
.mui-btn-blue, .mui-btn-primary, input[type=submit] {
color: #333;
background: none;
border: none;
}
.mui-btn.mui-poppicker-btn-ok{
color: #59A6FF;
}
.mui-btn, button, input[type=button], input[type=reset], input[type=submit] {
color: #888;
background: none;
border: none;
}
.mui-poppicker-header {
background: #fff;
}
.mui-picker{
background: #fff;
}
/*��ַѡ����ʽ����*/
/*ȷ�Ϻ���ҳ��*/
.sure-call{
display: block;
text-decoration: none;
border-top: 1px solid #F1F1F1;
height: 50px;
line-height: 50px;
text-align: center;
font-size: 12px;
color: #333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.sure-call:after{
display: block;
content: " ";
clear: both;
}
.sure-call em{
font-style: normal;
font-size: 18px;
margin-left: 5px;
margin-right: 5px;
}
.sure-call i{
display: inline-block;
width: 15px;
height: 15px;
background:url(../images/icon_my-little@2x.png) no-repeat center;
background-size: contain;
vertical-align: middle;
margin-top: -2px;
}
.sure-call span{
color: #B1B1B1;
margin-left: 5px;
}
.sure-call-go{
display: block;
text-decoration: none;
margin-left: 15px;
margin-right: 15px;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 14px;
color: #FFF;
margin-top: 10px;
background: #59A6FF;
border-radius: 2px;
}
/*�ȴ��Ӽ�*/
.driver-info{
margin: 10px 15px;
background: #FFFFFF;
box-shadow: 0 0 4px 0 rgba(186,186,186,0.50);
border-radius: 2px;
padding-top: 20px;
padding-bottom: 20px;
}
.driver-info .mui-col-xs-3{
height: 70px;
}
.driver-info .mui-col-xs-7{
height: 70px;
border-right: 1px solid #E6E6E6;
}
.driver-info .mui-col-xs-2{
display: block;
text-decoration: none;
height:70px;
}
.driver-info .mui-col-xs-3 img{
display: block;
width: 60px;
height: 60px;
border-radius: 100%;
margin: 0 auto;
margin-top: 5px;
}
.driver-info .mui-col-xs-2 i{
display:block;
width: 30px;
height: 30px;
margin: 0 auto;
margin-top: 20px;
background:url(../images/icon_phone-user@2x.png) no-repeat center;
background-size: contain;
}
.driver-info-user{
margin-bottom: 3px;
font-size: 14px;
color: #555;
}
.driver-info-user:after{
display: block;
content: " ";
clear: both;
}
.driver-info-user span{
display: block;
float: left;
max-width: 40%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.driver-info-user em{
display: block;
float: left;
max-width: 51%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-style: normal;
margin-left: 10px;
}
.driver-info-car{
margin-bottom: 3px;
font-size: 12px;
color: #7A7A7A;
}
.driver-info-car:after{
display: block;
content: " ";
clear: both;
}
.driver-info-car span{
display: block;
float: left;
max-width: 45%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.driver-info-car em{
display: block;
float: left;
font-style: normal;
max-width: 48%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-left: 10px;
}
.driver-info-num{
font-size: 12px;
color: #7A7A7A;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/*ȡ���г�-�ѽ���*/
.cancel-end-time{
height: 50px;
padding-right: 10px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.cancel-end-time i{
display: inline-block;
width: 15px;
height: 15px;
background:url(../images/icon_time@2x.png) no-repeat center;
background-size: contain;
vertical-align: middle;
margin-top: -2px;
margin-left: 11px;
}
.cancel-end-time span{
font-size: 14px;
color: #333;
line-height: 50px;
margin-left: 3px;
}
.cancel-end-sot{
border-top: 1px solid #F1F1F1;
height: 50px;
}
.cancel-end-sot:after{
display: block;
content: " ";
clear: both;
}
.cancel-end-sot i{
display: block;
float: left;
width: 5px;
height: 5px;
border-radius: 100%;
margin-left: 15px;
margin-top: 22px;
}
.cancel-end-sot span{
display: block;
float: left;
margin-left: 15px;
width: 80%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 50px;
line-height: 50px;
font-size: 14px;
color: #333;
}
.cancel-end-sot.here i{
background: #36BB9D;
}
.cancel-end-sot.there i{
background: #F67123;
}
.cancel-end-show{
border-top: 1px solid #E6E6E6;
padding-top: 20px;
padding-bottom: 15px;
}
.cancel-end-show i{
display: block;
width: 50px;
height: 50px;
margin: 0 auto;
background:url(../images/icon_alarm@2x.png) no-repeat center;
background-size: contain;
}
.cancel-end-show span{
display: block;
font-size: 14px;
color: #333;
text-align: center;
margin-top: 10px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.cancel-end-show p{
padding-left: 10px;
padding-right: 10px;
text-align: center;
font-size: 14px;
color: #B1B1B1;
margin-top: 10px;
}
/*����-�г�-��ϸ��Ϣ*/
.driver-info.set{
margin-bottom: 0;
}
.set-journey{
border-top: 1px solid #E3E3E3;
padding-top: 15px;
padding-bottom: 15px;
background: #fff;
margin: 0 15px;
box-shadow: 0 0 4px 0 rgba(186,186,186,0.50);
border-radius: 2px;
}
.set-journey .price{
font-size: 14px;
color: #7A7A7A;
text-align: center;
padding: 5px 10px 0 10px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.set-journey .price span{
font-size: 32px;
color: #151515;
margin-left: 5px;
margin-right: 5px;
}
.set-journey .tips{
font-size: 12px;
color: #B1B1B1;
text-align: center;
margin-top: 5px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/*����*/
@media screen and (min-width:320px) and (max-width:374px){
.cancel-end-show{
padding-top: 15px;
}
.cancel-end-show p{
margin-top: 5px;
}
}
/*�г̽�����ʼ*/
.new-journey-finish{
border-top: 1px solid #E3E3E3;
box-shadow: 0 0 4px 0 rgba(186,186,186,0.50);
padding: 10px 0;
margin-left: 15px;
margin-right: 15px;
background: #fff;
}
.new-journey-finish .title{
font-size: 14px;
color: #555;
margin-left: 15px;
}
.new-journey-finish .content{
margin-bottom: 5px;
font-size: 12px;
color: #555;
line-height: 16px;
}
.new-journey-finish .content:after{
display: block;
content: " ";
clear: both;
}
.new-journey-finish .content span{
display: block;
float: left;
width: 40%;
padding-left: 15px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.new-journey-finish .content em{
font-style: normal;
display: block;
float: left;
width: 60%;
text-align: right;
padding-right: 15px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.set-journey .new-journey-rule-go{
display: block;
width: 100%;
text-decoration: none;
text-align: center;
padding: 5px 0;
font-size: 12px;
color: #B1B1B1;
}
.set-journey.new-journey{
border-top: none;
}
.set-journey.new-journey .thread{
margin-top: -25px;
margin-bottom:5px;
}
.set-journey.new-journey .thread:after{
display: block;
content: " ";
clear: both;
}
.set-journey.new-journey .thread em{
display: block;
float: left;
width: 40%;
height: 10px;
border-bottom: 1px solid #ddd;
}
.set-journey.new-journey .thread span{
display: block;
float: left;
width: 20%;
font-size: 14px;
color: #B4B4B4;
background: #fff;
text-align: center;
}
.new-journey-tips{
width: 100%;
height: 45px;
line-height: 45px;
text-align: center;
font-size: 14px;
color: #FFF;
background: #59A6FF;
}
/*�г̽�������*/
/*确认呼叫页面修改样式开始*/
.sure-call-bid i{
width:15px;
height:20px;
margin-top: -4px;
background:url(../images/hanjia_icon@2x.png) no-repeat center;
background-size: contain;
}
.sure-call-bid span{
font-size: 14px;
color: #F57123;
}
.sure-call-normal i{
background:url(../images/licheng_icon@2x.png) no-repeat center;
background-size: contain;
}
.sure-call-normal span{
font-size: 12px;
color: #59A6FF;
}
.sure-call-after{
position: relative;
}
.sure-call-after div{
padding-left: 60px;
padding-right: 60px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.sure-call-after .alter-bid{
position: absolute;
right: 0;
top:0;
width: 80px;
height: 50px;
line-height: 50px;
text-align: center;
font-size: 12px;
color: rgba(153,153,153,0.80);
z-index: 10;
}
/*确认呼叫页面修改样式结束*/
/*进行中喊价金额改动开始*/
#bid-price{
width: 200px;
height: 55px;
padding: 7px 15px;
background: url(../images/icon_hint02@2x.png) no-repeat center;
background-size: cover;
position: absolute;
top: 50px;
left: 50%;
margin-left: -100px;
}
#bid-price .calculate-price{
width: 60%;
text-align: center;
}
#bid-price .calculate-price-detail{
line-height: 15px;
}
#bid-price .calculate-price-detail:first-child{
margin-top: 6px;
}
#bid-price .calculate-price-show {
width: 40%;
}
/*进行中喊价金额改动结束*/