.cityPicker { position: relative; float: left; width: 320px; }
    .cityPicker .txt { width: 306px; }
.cityPicker-input { opacity: 0 !important; top: -9999px; left: -9999px; position: absolute; }
.cityPicker .title { color: #ccc; padding-right: 18px; float: left; height: 32px; overflow: hidden; }

.cityPicker_reset { padding: 0 4px; margin-left: 4px; margin-right: 4px; background-color: #f0ad4e; border-color: #eea236; }
.cityPicker_disable { padding: 0 4px; background-color: #d9534f; border-color: #d43f3a; }

.cityPicker_span { position: relative; display: block; outline: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); background-color: #fff; height: 34px; line-height: 32px; border: solid 1px #ccc; padding: 0 6px; color: #ccc; cursor: pointer;}

    .cityPicker_span > .placeholder { color: #999; }

    .cityPicker_span > .arrow { position: absolute; top: 50%; right: 8px; width: 10px; margin-top: -3px; height: 5px; background: url(imgs/drop-arrow.png) -10px -25px no-repeat; }

    .cityPicker_span:hover { border-color: #8BADE4; }

    .cityPicker_span.open > .arrow { background-position: -10px -10px; }

    .cityPicker_span > .title > span { color: #666; padding: 2px; border-radius: 3px; }

        .cityPicker_span > .title > span:hover { background-color: #f1f8ff; }

.cityPicker_dropdown { position: absolute; width: 330px; left: -9999px; top: -9999px; outline: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); z-index: 999999; display: none; min-width: 330px; margin-bottom: 20px; }

.city_select_wrap { border: solid 1px #ccc; -webkit-box-shadow: 2px 1px 2px rgba(9,3,5,0.1); box-shadow: 2px 1px 2px rgba(9,3,5,0.1); }

.city_select_tab { border-bottom: 1px solid #ccc; background: #f0f0f0; font-size: 13px; }

    .city_select_tab > a { display: inline-block; padding: 0px 22px; border-left: 1px solid #ccc; border-bottom: 1px solid transparent; color: #4D4D4D; text-align: center; outline: 0; text-decoration: none; cursor: pointer; font-size: 14px; margin-bottom: -1px; height: 32px; line-height: 32px; }

        .city_select_tab > a.active { background: #fff; border-bottom: 1px solid #fff; color: #3493ef; }

        .city_select_tab > a:first-child { border-left: none; }

        .city_select_tab > a:last-child.active { border-right: 1px solid #ccc; }

.city_select_content { min-height: 10px; background-color: #fff; padding: 10px 15px; }

.city_select { font-size: 13px; }

    .city_select dl { line-height: 2; clear: both; padding: 3px 0; margin: 0; }

    .city_select dt { position: absolute; width: 2.5em; font-weight: 500; text-align: right; line-height: 2; color: #f12727; }

    .city_select dd { margin-left: 0; line-height: 2; }

    .city_select.province dd { margin-left: 3em; }

    .city_select a { display: inline-block; padding: 0 10px; outline: 0; text-decoration: none; white-space: nowrap; margin-right: 2px; text-decoration: none; cursor: pointer; }

        .city_select a:hover,
        .city_select a:focus { background-color: #f1f8ff; border-radius: 2px; color: #3493ef; }

        .city_select a.active { background-color: #46A4FF; color: #fff; border-radius: 2px; }