/*html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline}html{line-height:1}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}caption,th,td{text-align:left;font-weight:normal;vertical-align:middle}q,blockquote{quotes:none}q:before,q:after,blockquote:before,blockquote:after{content:"";content:none}a img{border:none}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}a{text-decoration:none}*/
.clearfix, .city-picker-selector { *zoom:1; width:100%;}
.clearfix:after, .city-picker-selector:after { content: " "; display: table; height: 0; clear: both }/*body{padding:5% 10%}*/
h2 { font-size: 26px; margin-top: 50px; margin-bottom: 20px }
.city-picker-selector .selector-item { width: 31.333%; height: 40px; line-height: 40px; float: left; margin-left: 3%; position: relative; background: #fff; }
.city-picker-selector .selector-item:first-child { margin-left: 0 }
.city-picker-selector .selector-item:after { content: ''; border-right: 6px solid transparent; border-left: 6px solid transparent; border-top: 6px solid #ccc; display: block; width: 0; height: 0; position: absolute; top: 20px; right: 10px; }
.city-picker-selector .selector-name { border: 1px solid #d3d3d3; color: #333; font-size: 14px; display: block; text-indent: 5%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; border-radius: 10px; }
.city-picker-selector .selector-name:hover { background-color: #fdfdfd }
.city-picker-selector .selector-name.df-color { font-size: 14px; color: #999; border: 1px solid #d3d3d3; border-radius: 10px; }
.city-picker-selector .selector-name.forbid { cursor: not-allowed }
.city-picker-selector .selector-list { border: 1px solid #ccc; background: #fff; width: 100%; position: absolute; top: 36px; left: -1px; z-index: 1 }
.city-picker-selector ul { width: 100%; max-height: 160px; overflow-x: hidden; overflow-y: auto }
.city-picker-selector li { font-size: 14px; border-top: 1px solid #ccc; color: #333; cursor: pointer; width: 90%; padding: 0 5%; height: 30px; line-height: 30px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap }
.city-picker-selector li:first-child { border-top: none }
.city-picker-selector li.caller:hover { background: #f5f5f5 }
.city-picker-selector li.caller.active, .city-picker-selector li.caller.active:hover { background: #b9b9b9; color: #fff }
.city-picker-selector li.forbid { color: #999; font-size: 14px; cursor: not-allowed }
.city-picker-selector .selector-search { display: none; border: 1px solid #ccc; border-top: none; background: #f8f8f8; font-size: 0; padding: 10px; height: 28px; margin-left: -1px; margin-right: -1px }
.city-picker-selector .input-search { border: 1px solid #ccc; border-radius: 5px; color: #333; font-size: 14px; width: 100%; height: 26px; line-height: 26px\9; padding: 0; text-indent: 5px }
.city-picker-selector .input-search:focus { outline: none }
.city-picker-selector .hide { display: none }
select { border: 1px solid #ccc; background: #fff; border-radius: 5px; color: #333; font-size: 16px; outline: none; width: 160px; height: 36px; margin-right: 10px; box-shadow: 0 0 5px #eee; }
.add_detail { clear: both; float: left; margin-top: 20px; width: 100%; }

@media (max-width:550px) {
.city-picker-selector .selector-item{ width:100%; margin-left:0; margin-bottom:15px;}
.add_detail{ margin-top:0;}
}