/*
 *
 * col-xs   0-480
 * col-sm   @media (min-width: 480px)
 * col-md   @media (min-width: 720px)
 * col-lg   @media (min-width: 1024px)
 * col-hg   @media (min-width: 1200px)
 *
*/
html {
  font-size: 10px;
  font-size: 62.5%;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 130%;
  line-height: 1.42857143;
  color: #333;
}
pre {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1.42857143;
    color: #333;
}
#wrapper {
    font-size: 1.3rem;
}
body, div, dl, dt, dd, ul, li, form {
    margin: 0;
    padding: 0;
}
ol,ul {
    list-style: none
}
input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
input[type=text] {
    border: 1px solid #7f9db9;
}
input:focus[type=text] {
    border: 1px solid #009AD3;
}
input:invalid[type=text] {
    border: 1px solid #009AD3;
}

input[type=text],
input[type=password],
textarea,
select {
    background: #ffffff;
    border: 1px solid #7f9db9;
    outline: none;
    line-height: 1.4;
}
input[type="checkbox"],
input[type="radio"] {
    vertical-align: middle;
    margin-left: 2px;
}
::-webkit-input-placeholder {
    color:#777;
    font-size: .9em;
}
input::-moz-placeholder {
    color:#777;
    font-size: .9em;
}
input::placeholder {
    color:#777;
    font-size: .9em;
}
input.error {
    border: 1px #FF0000 solid;
}
a {
    color: #333;
    text-decoration: none;
}
a:hover,
a:focus {
    color: #2a6496;
    text-decoration: underline;
}
a:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}
figure {
    margin: 0;
}
img {
    max-width: 100%;
    vertical-align: middle;
}

.white, a.white:link, a.white:visited {
    color: #fff;
}
.default, a.default:link, a.default:visited {
    color: #4ca3bf;
}
.red, a.red:link, a.red:visited {
    color: #ff0000;
}
.gray, a.gray:link, a.gray:visited {
    color: #999;
}
.b, a.b:link, a.b:visited {
    font-weight: bold;
}
.u, a.u:link, a.u:visited {
    text-decoration: underline;
}
.nou, a.nou:link, a.nou:visited {
    text-decoration: none;
}
/* Button */
button,.button {
    position: relative;
    overflow: visible;
    display: inline-block;
    padding: 4px 13px;
    color: #666;
    text-decoration: none;
    font:12px/normal inherit;
    color: #666;
    white-space: nowrap;
    cursor: pointer;
    outline: none;
    border: 0;
    -webkit-border-radius: 0.2em;
    -moz-border-radius: 0.2em;
    border-radius: 0.2em;
    /* IE hacks */
    zoom: 1;
    *display: inline;
    background-color: #ddd;
}

button:hover,.button:hover,
button:focus,.button:focus,
button:active,.button:active {
    text-decoration: none;
    color: #111;
}
button:active,.button:active,
button.active,.button.active {
    text-decoration: none;
    color: #111;
}
select.disabled,
button.disabled,
select[disabled],
button[disabled]{
    border-color: #E9E9E9;
    text-decoration: none;
    color: #B8B8B8;
    background-color: #F1F1F1;
    box-shadow: none;
    cursor: default;
}
.button.unable,
button.unable {
    cursor: progress;
    background-color: #EEEEEE;
}
.button.unable:hover,
button.unable:hover,
.button.unable:focus,
button.unable:focus,
.button.unable:active,
button.unable:active {
    cursor: progress;
    color: #fff;
    background-color: #EEEEEE;
}
/* beg global color */
.odd-bg {
    padding: 15px 0;
    margin: 15px 0;
    background-color: #EDEDED;
}
/* end global color */
/* fix button */
.fix {
    position: fixed;
    right: 15px;
    bottom: 5px;
}

/* overrides extra padding on button elements in Firefox */
.button::-moz-focus-inner {
    padding: 0;
    border: 0;
}
/* ...... Button Danger */

.button.primary {
    text-decoration: none;
    color: #fff;
    background-color: #079dd4;
}
.button.primary:hover,
.button.primary:focus,
.button.primary:active,
.button.primary:active,
.button.primary.active {
    color: #fff;
    background-color: #22ACDF;
}
.button.primary.disabled {
    color: #B8B8B8;
    background-color: #F1F1F1;
    cursor: default;
}
.button.redbtn {
    text-decoration: none;
    color: #fff;
    background-color: #F44336;
}
.button.redbtn:hover,
.button.redbtn:focus,
.button.redbtn:active,
.button.redbtn:active,
.button.redbtn.active {
    color: #fff;
    background-color: #F44336;
}

.button.danger {
    color: #900;
    text-shadow: none;
}
.button.danger:hover,
.button.danger:focus,
.button.danger:active {
    border-color: #b53f3a;
    border-bottom-color: #a0302a;
    color: #fff;
    background-color: #dc5f59;
}

.button.danger:active,
.button.danger.active {
    border-color: #a0302a;
    border-bottom-color: #bf4843;
    background-color: #b33630;
}
/* ...... Button icons */
.button.icon:before {
    content: "";
    position: relative;
    top: 1px;
    float: left;
    width: 12px;
    height: 12px;
    margin: 0 0.75em 0 -0.25em;
    background: url(images/icons/gh-icons.png) 0 99px no-repeat;
}

.button.remove.icon:before { background-position: 0 -60px; }
.button.remove.icon:hover:before,
.button.remove.icon:focus:before,
.button.remove.icon:active:before { background-position: -12px -60px; }

/* Button size */
.button.btn-lg {
    padding: 10px 20px;
}
.button.btn-default {
    padding: 6px 15px;
}
.button.btn-sm {
    padding: 5px 15px;
}
.button.btn-xs {
    padding: 1px 5px;
}

/* Clear */
.clearfix:after {
    clear: both;
    content: "";
    display: block;
    height: 0;
}
.clearfix:after {
    clear:both;
}
.clearfix {
    zoom:1;
}

.inline-block {
    display: inline-block;
    vertical-align: top;
    zoom: 1; /* Fix for IE7 */
    *display: inline; /* Fix for IE7 */
}

.none {
    display: none;
}
.pointer {
    cursor: pointer;
}
.middle {
    vertical-align: middle;
}
.warning {
    color: #f89406;
}
.danger {
    color: #dd5a43;
}
.success, span.online {
    color: #69aa46;
}

.icon-yes {
    color: #69aa46;
    font-size: 14px;
}
.icon-no {
    color: #dd5a43;
    font-size: 14px;
}

.alert {
    margin-top: 5px;
    padding: 5px 10px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    word-wrap:break-word
}
.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}
.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}
.alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}
.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.icon {
    display: inline-block;
    width: 0px;
    padding-left: 16px;
    height: 16px;
    color: #666;
    font-size: 0px;
    text-align: center;
    line-height: 0px;
    background-repeat: no-repeat;
    background-position: 0 0;
    text-decoration: none;
    background-color: #fff;
    vertical-align: middle;
    overflow: hidden;
}
.icon.icon-refund {
    margin-top: -1px;
    background-image: url('images/icons/icon-refund.png');
}
.icon.icon-invoice {
    background-image: url('images/icons/icon-invoice.png');
}

.align-right {
    text-align: right;
}

.point {
    position: absolute;
    background: #f00;
    width: 4px;
    height: 4px;
    cursor: move;
    z-index: 100;
}


/** popup style **/
#overlay {
    z-index: 100;
}
.popup-wrapper {
    z-index: 1000;
}
.popup-container {
    position: relative;
    min-height: 200px;
    min-width: 400px;
    background-color: #fff;
    -moz-background-clip: padding;
    -webkit-background-clip: padding;
    background-clip: padding-box;
    border: 3px solid rgba(0,0,0,.3);
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
.popup-header {
    min-height: 32px;
    line-height: 32px;
}
.popup-header h3 {
    margin: 0;
    text-indent: 15px;
    font-size: 14px;
    background-color: #D5EAF9;
}
.popup-message {
    padding: 0 40px;
}
.popup-main {
    padding: 10px;
    min-height: 80px;
}
.popup-footer {
    text-align: center;
}
.popup-footer button {
    margin: 0 25px;
}
.popup-close {
    display: block;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 16px;
    height: 16px;
    text-indent: -9999em;
    cursor: pointer;
    background: url(images/icons/popup-detele.png) no-repeat 0 0;
}
.tip-container {
    max-width: 500px;
    position: relative;
    padding: 20px 40px 20px 30px;
    border-width: 0 1px 1px 1px;
    border-style:solid;
    border-color: #ddd;
    border-radius: 0 0 8px 8px;
    box-shadow: 0px 4px 4px rgba(0,0,0,.3);
    background: #fff;
}
.tip-message {
    line-height: 26px;
    text-align: center;
}
.tip-close {
    display: block;
    width: 16px;
    height: 16px;
    position: absolute;
    right: 20px;
    top: 25px;
    text-indent: -999em;
    background: url(images/icons/popup-detele.png) no-repeat 0 0;
}
#popup-warning .tip-container {
    padding: 10px 40px 10px 20px;
    border-width: 0 0 1px 1px;
    background-color: #FFCECF;
    background-image: none;
    border-color: #E08E90;
}
#popup-images-main {
    text-align: center;
}
.popup-main .popup-images-title {
    margin: 0 -10px;
    padding-left: 10px;
    text-align: left;
    border-bottom: 1px solid #C5D0DC;
}
.popup-main .popup-images-title span {
    display: inline-block;
    padding: 5px 15px;
    margin-right: 5px;
    background-color: #eee;
    cursor: pointer;
}
.popup-main .popup-images-title span.current {
    color: #fff;
    background-color: #7db4d8;
    cursor: default;
}
.popup-main .image-nav {
    padding: 5px 0;
}
.popup-main .image-nav li {
    display: inline-block;
    vertical-align: top;
    *display: inline;
    zoom: 1;
    margin-right: 5px;
    border: 1px solid #ddd;
    padding: 1px;
    cursor: pointer;
}
.popup-main .image-nav img {
    max-width: 100px;
}
.popup-main .image-nav li.current {
    border-color: #d9534f;
    cursor: default;
}


.loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('images/icons/loading.gif') center center no-repeat #000;
    background-image: url('images/icons/loading.svg'), none;
    background-size: 64px 64px;
    opacity: .6;
    z-index: 100;
}

/* bof order-list-address*/
.popup-address-form {
    margin-top: -5px;
    overflow-y: auto;
}
.popup-address-form h3 {
    margin: 5px auto 10px;
    padding: 0 9px 6px;
}
.popup-address-form input[type="text"],
.popup-address-form select {
    width: 270px;
}

.popup-address-form .control-label {
    text-align: left;
}

.popup-address-form .shipping-method li {
    padding: 3px 10px;
}
@media (min-width: 1024px) {
    .popup-address-form .control-label {
        text-align: right;
    }
}


table.lens-stock{
    background: #ccc;
}
table.lens-stock td,table.lens-stock th{ background: #fff; padding: 2px; text-align: center}

table.rx-table{
    font-size: 14px;
}
table.rx-table select, table.rx-table input{ border: solid 1px #ccc; width: 90%; margin: 0 auto; font-size: 12px;}

table.rx-table td{ text-align: center}
table.rx-table td small{ font-size: 12px; color:#999;}

table.rx-info{
    font-size: 14px;
}
table.rx-info td{ text-align: center; border: solid 1px #ccc;  padding: 3px; line-height: 22px;}

.job-detail i{ font-size: 10px;}

.main-order{
    background-color: #fff;
    border: 1px solid #ddd;
    border-color: #ebebeb #ebebeb #d8d8d8;
    box-shadow: 0 1px 4px rgba(0,0,0,.1);
    width: 900px; min-height: 500px;
}
.new-order-title{ line-height: 37px; font-size: 12px;}
#customer-select{ line-height: 32px; margin-top: 5px; }
.order-user-select{ width: 80px; float: left;}
.order-user-select li { display: block; line-height: 25px; background: #eee; padding-left: 15px;}
.order-user-select li.active{ background: #ccc;}

.sub-total{ line-height: 22px; font-size: 14px; margin-top: 25px; width: 280px; float: right;}
.sub-total li{ display: block; margin: 3px }
.sub-total li .title{ width: 120px; text-align: right; display: inline-block}
.total-pay{ border-top: solid 1px #333;}

.paymethod{ width: 40px; height: 39px; display: inline-block; margin-right: 10px;}
.pay-alipay{ background: url(img/alipay.jpg) no-repeat;}
.pay-wechat{ background: url(img/wechat.jpg) no-repeat;}
.pay-yinlian{ background: url(img/yinlian.jpg) no-repeat;}
.pay-cash{ background: url(img/cash.jpg) no-repeat;}

.autocomplete-suggestions { border: 1px solid #999; background: #FFF; overflow: auto; }
.autocomplete-suggestion { padding: 5px 5px; white-space: nowrap; overflow: hidden; }
.autocomplete-selected { background: #F0F0F0; }
.autocomplete-suggestions strong { font-weight: normal; color: #3399FF; }
.autocomplete-group { padding: 2px 5px; }
.autocomplete-group strong { display: block; border-bottom: 1px solid #000; }

.search-field{ float: left; display: inline-block; margin-right: 15px;}
.search-field label, .search-field .search-span{ float: left; line-height: 35px; color: #444; font-weight: normal;}

.order-detail ul {
    text-align: left;
    padding-bottom: 8px;
}
.order-detail ul li { margin: 10px; }
.order-title {
    display: block;
    width: 13.5%;
    padding-left: 10px;
    font-weight: 700;
    float: left;
    line-height: 1.8;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}