﻿body {
    background-color: #f0f0f7;
}

.main-container {
    box-sizing: border-box;
    width: 1182px;
    position: relative;
    margin-left: auto;
    margin-right: auto; }

.sub-container {
    width: 768px;
    margin-left: auto;
    margin-right: auto; }

.nav {
    background-color: #f5f5f5;
    padding: 5px;
    border-bottom: 1px solid #e8e8e8;
}
.nav a {
    font-size: 12px;
}
.nav .nav-item {
    display: inline-block;
    font-size: 12px;
    color: #333;
    margin-right: 30px;
}

.nav .nav-dropdown-menu {
    margin-top: -5px;
    margin-bottom: -5px;
    padding-left: 5px;
    padding-right: 5px;
    line-height: 32px;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    -webkit-transition: background-color 0.1s ease-in-out 0.5s;
    transition: background-color 0.1s ease-in-out 0.5s;
}
.nav .nav-dropdown-menu:hover {
    background-color: #fff;
    border-left-color: #e8e8e8;
    border-right-color: #e8e8e8;
    -webkit-transition: background-color 0.1s ease-in-out;
    transition: background-color 0.1s ease-in-out;
}
.nav .nav-dropdown {
    border: 1px solid #e8e8e8;
    border-top: none;
    background-color: #fff;
    top: 32px;
    left: -1px;
    line-height: 1.5;
    z-index: 1001;
    width: 100px;
}
.nav .nav-dropdown li {
    padding: 5px 10px;
}
.nav .text-r .nav-item {
    margin-right: 0;
    margin-left: 30px;
}
.nav .nav-item-green {
    color: #2ea661;
}
.nav .nav-item-green-block {
    background-color: #2ea661;
    color: #fff;
    padding: 1px 10px;
}
.nav .nav-item-green-block:hover {
    background-color: #299455;
}
.nav .nav-item-green-block a {
    color: #fff;
}
.nav .nav-item-green-block a:hover {
    color: #fff !important;
}
.nav .nav-line {
    width: 1px;
    height: 20px;
    vertical-align: middle;
    background-color: #999;
}
.nav .icon-angle-down {
    font-size: 16px;
    vertical-align: middle;
}

.nav #topShopCartCount{
	color: red;
}
.nav .nav-item-login {
    background: url("../images/icon_topnav.png") no-repeat 0 -24px;
    padding-left: 22px;
    box-sizing: border-box;
    max-width: 130px;
    vertical-align: middle;
}
.nav .nav-item-login:hover {
    background-position: 0 0;
    color: #2ea661;
}
.nav .nav-logininfo {
    display: inline-block;
    min-width: 400px;
}
.nav .nav-item-integral {
    background: url("../images/integral.png") no-repeat -8px -8px;
    padding-left: 22px;
    float: right;
    line-height: 22px;
}
.nav .nav-item-register {
    background: url("../images/icon_topnav.png") no-repeat 0 -72px;
    padding-left: 22px;
}
.nav .nav-item-register:hover {
    background-position: 0 -48px;
}
.nav .location {
    background: url("../images/icon_topnav.png") no-repeat 5px -160px;
    padding-left: 28px;
}
.nav .location:hover {
    background-position: 5px -136px;
    background-color: #fff;
}
.nav .location-text {
    color: #2ea661;
}
.nav .location-changer {
    color: #93978e;
    cursor: pointer;
}
.nav .location-selection {
    padding: 10px;
    width: 270px;
    top: 32px;
    left: -1px;
    line-height: 1.5;
    z-index: 1001;
    display: none;
}
.nav .location-selection li {
    cursor: pointer;
    font-size: 14px;
    color: #000;
    margin: 3px 3px;
    padding: 0 10px;
}
.nav .location-selection li:hover,
.nav .location-selection li.active {
    background-color: #2ea661;
    color: #fff;
    border-radius: 2px;
}


.layout-table {
    width: 100%;
    border: none;
    table-layout: fixed; }
.layout-table tr, .layout-table td {
    border: none; }
.layout-table tr:hover {
    background: none; }

.banner-bar {
    background-color: #fff;
}
.banner {
    height: 100px; }
.banner .logo {
    background-image: url("../images/logo.png");
    background-repeat: no-repeat;
    background-position: left center;
    width: 228px;
    height: 100px;
    /**margin-left: 30px;*/
    margin-right: 30px;
    display: inline-block;
    float: left;}
.banner .head {
    width: 40px;
    height: 40px; }

.banner .func {
    width: 150px;
    padding: 10px; }
.banner .func a:hover {
    text-decoration: none; }
.banner .shopping-cart {
    background-image: url("../images/shopping-cart.png");
    background-color: #f9f9f9;
    background-repeat: no-repeat;
    background-position: 20px center;
    text-align: center;
    border: 1px solid #dfdfdf;
    padding: 8px 0 6px 30px;
    display: block;
    position: relative; }
.banner .shopping-cart .cart-badge {
    display: block;
    position: absolute;
    top: -5px;
    right: 0px;
    background-color: #DE5102;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    line-height: 20px;
    border-radius: 50%;
    border-bottom-left-radius: 0;
    font-size: 12px;
    color: #fff; }

/*.banner-terminal-info {*/
    /*margin-bottom: -30px;*/
/*}*/
.banner-terminal-info .banner {
    height: 80px;
    margin-left: 60px;
}
.banner .terminal-info {
    color: #fff;
    float: left;
    display: inline-block; }
.banner .terminal-info-logo {
    background-image: url("../images/logo-terminal-info.jpg");
    background-repeat: no-repeat;
    background-position: left center;
    width: 141px;
    height: 80px;
    margin-right: 30px;}
.banner-terminal-info .terminal-info-logo {
    background-image: url("../images/logo_outlet.png");
    width: 210px;
}
.banner .terminal-info-user {
    margin-top: 14px;
}
.banner .terminal-info-name {
    font-size: 1.25em;
}
.banner .user-level-name {
    padding-top: 2px;
    padding-bottom: 2px;
}
.banner .user-level-progress {
    width: 200px;
    height: 8px;
}
.banner .user-level-progress .progress-bar {
    background-color: #a0d667;
}
.banner .user-level-progress .sr-only {
    background-color: #f0f0f0;
}
.banner .user-level-icons {
    margin-top: 2px;
}
.banner .user-level-icon {
    display: inline-block;
    width: 15px;
    height: 15px;
    background-image: url("../images/user_level.png");
    background-repeat: no-repeat;
}
.banner .user-level-icon.user-level-0 {
    background-position: 0 0;
}
.banner .user-level-icon.user-level-1 {
    background-position: -20px 0;
}
.banner .user-level-icon.user-level-2 {
    background-position: -40px 0;
}
.banner .user-level-icon.user-level-3 {
    background-position: -60px 0;
}
.banner .user-level-icon.user-level-4 {
    background-position: -80px 0;
}
.banner .user-level-icon.user-level-5 {
    background-position: -100px 0;
}
.banner .user-level-icon.user-level-6 {
    background-position: -120px 0;
}
.banner .data-query {
    line-height: 100px;
  	margin-left: 100px;
    display: inline-block;
}
.banner .data-query-box {
    display: inline-block;
    line-height: 1;
    border: 2px solid #2ea661;
}
.banner .data-query-box .btn {
    padding: 4px 30px;
    height: 31px;
}
.banner .data-query .floating {
	width: auto;
    display: inline-block;
}
.banner .data-query .floating label {
	top: 9px;
    left: 4px;
}
.banner .data-query .input-text {
	width: 300px;
    border: none;
    box-shadow: none;
    padding: 8px 4px;
}
.banner .data-query .query-type {
    display: inline-block;
    box-sizing: border-box;
    width: 80px;
    height: 31px;
    padding: 6px 4px;
    font-size: 14px;
    line-height: 1.42857;
}
.banner .query-types {
    background-color: #fff;
    border: 1px solid #dcdcdc;
    width: 100px;
    z-index: 10;
    font-size: 14px;
    line-height: 1.6;
}
.banner .query-types a {
    padding: 3px 10px;
    display: block;
}

.menu-bar {
    width: 100%;
    padding: 0;
    background-color: #fff;
    border-bottom: 2px solid #2ea661; }
.menu-bar table {
    border-spacing: 0;
    width: 100%; }
.menu-bar table table {
    table-layout: fixed;
    margin-left: 5px; }
.menu-bar .menu {
    text-align: center;
    color: #515153;
    height: 31px;
    line-height: 31px;
    padding: 10px 0 8px;
    cursor: pointer;
    font-size: 18px; }
.menu-bar .menu-main-cell {
    width: 210px;
    position: relative; }
.menu-bar .menu-main {
    background-color: #279c58;
    color: #fff;
    width: 100%;
    position: absolute;
    top: 0; }
.menu-bar .menu-other {
    background-color: #fff !important;
    /*width: 1%;*/
    /*display: table-cell;*/
    width: auto;
    display: block;
    -webkit-transition: color 0.28s ease-in-out;
    transition: color 0.28s ease-in-out; }
.menu-bar .menu-other span {
    display: inline-block;}
.menu-bar .menu-other:hover, .menu-bar .menu-other.active {
    border-bottom: 4px solid #2ea661;
    padding-bottom: 4px;
    color: #2ea661;}
.menu-bar .menu-empty {
    background-color: #404146 !important;
    width: 150px; }
.menu-bar .menu-hot {
    background: url("../images/01_icon_hot.png") no-repeat;
}
.menu-bar .menu-hot-label {
    position: absolute;
    top: -15px;
    left: 50%;
    margin-left: 20px;
}
.menu-bar .menu-hot-label:after {
    content: "";
    border-top: 8px solid #f85a5a;
    border-right: 6px solid transparent;
    position: absolute;
    top: 24px;
    left: 8px;
    transform: rotate(20deg);
}
.menu-bar .menu-hot-label .label-danger {
    background: #f85a5a;
    font-weight: normal;
}
.menu-bar :hover .menu-hot-label:after {
    border-top-color: #f74040;
}
.menu-bar :hover .menu-hot-label .label-danger {
    background: #f74040;
}

.showme-cell{
    width: 318px;
}

.categories {
    margin-bottom: 20px;
    box-sizing: border-box;
    width: 210px;
    padding: 0;
    display: none;
    background-image: linear-gradient(to right, #2ea661, #279c58);
    background-color: #2ea661;
    }
.categories.index, .categories.active {
    display: block;
    position: absolute;
    z-index: 1000; }
.categories ul > li {
    margin-top: -1px; }
.categories ul > .empty-item {
    border-top-color: transparent;
    border-bottom-color: transparent;}
.categories ul > .empty-item:last-child {
    border-bottom-color: #dcdcdc;}
.categories ul > li > a {
    font-size: 14px;
    display: block;
    height: 62px;
    padding: 0 15px; }
.categories ul > li > a .tag-wrapper {
    padding: 9px 0;}
.categories ul > li > a .tag-wrapper.border-bottom {
    border-bottom: 1px dashed #31b468;}
.categories ul > li > a .tag-name {
    color: #fff;
    font-weight: bold;
    display: block;}
.categories ul > li > a .tag-desc {
    color: #5ef39d;
    display: block;
    width: 168px;}
.categories ul > li > a .icon-angle-right {
    float: right;
    margin-top: -30px;
    margin-right: 5px;
    color: #5ef39d;}
.categories ul > li:hover > a {
    background-color: #f7f7f7;
    border-right-color: #f7f7f7;
    text-decoration: none;
    border-left: 4px solid #2ea661;
    padding-left: 16px;}
.categories ul > li:hover > a .tag-wrapper.border-bottom {
    border-bottom: none;}
.categories ul > li:hover > a .tag-name {
    color: #2ea661;}
.categories ul > li:hover > a .tag-desc,
.categories ul > li:hover > a .icon-angle-right {
    color: #8c8c8c;}
.categories ul .popup-menu, .categories .popup-menu-mask {
    box-sizing: border-box;
    width: auto;
    height: 100%;
    top: 0;
    left: 100%;
    padding: 5px 10px;
    background-color: #f7f7f7;
    border: 1px solid #f7f7f7;
    z-index: 10;
    display: none; }
.categories ul > li:hover .popup-menu {
    display: block; }
.categories ul ul > li {
    width:180px;
    margin: 14px 10px;
}
.categories ul ul > li > a {
    font-weight: normal;
    font-size: 14px;
    border: none;
    color: #6c6c6c;
    height: 50px;
    padding: 0;
    overflow: hidden;}
.categories ul ul > li > a > img {
    display: inline-block;}
.categories ul ul > li > a > span {
    display: inline-block;
    width: 100px; }
.categories ul ul > li:hover > a {
    background: none;
    border: none;
    padding-left: 0;
    box-shadow: none; }
.categories ul ul > li > a:hover {
    text-decoration: underline;
    color: #2ea661; }
.categories .popup-menu-mask {
    background-color: #d2eab8;
    opacity: 0.95;
}
.categories:hover > ul > li {
    border-right: none;
}
.categories:hover .popup-menu-mask {
    display: block;
}
.no-image-masker {
    width: 68px;
    height: 48px;
    display: inline-block;
    border: 1px solid #dcdcdc;
}

.sidebar {
    position: fixed;
    _position: absolute;
    top: 0;bottom: 0;right: 0;
    z-index: 10010;
    border-right: 5px solid #817672;
}
.sidebar .sidebar-top {
    position: absolute;
    margin-top: -130px;
    top: 50%;right: -5px;
    width: 35px;
}
.sidebar .sidebar-bottom {
    position: absolute;
    width: 35px;
    bottom: 0;right: -5px;
}
.sidebar ul {
    background-color: #a28f88;
}
.sidebar .sidebar-item {
    background-color: #817672;
    margin-bottom: 1px;
    text-align: center;
}
.sidebar .sidebar-item:hover {
    background-color: #2ea661;
}
.sidebar .sidebar-item-icon {
    background-repeat: no-repeat;
    background-image: url("../images/icon_home_right.png");
    height: 36px;
}
.sidebar .sidebar-item-phone {
    background-position: 0 0;
    cursor: pointer;
}
.sidebar .sidebar-item-phone:hover div {
    background-color: #2ea661;
}
.sidebar .sidebar-item-phone div,
.sidebar .sidebar-item-chat .chat-container {
    position: absolute;
    background-color: #817672;
    z-index: -1;
    display: none;
    right: -79px;
    color: #fff;
    padding: 7px 10px;
}
.sidebar .sidebar-item-phone div{
    box-sizing: border-box;
    width: 115px;
    height: 36px;
}
.sidebar .sidebar-item-chat .chat-container {
    box-sizing: border-box;
    width: 418px;
    padding: 20px 30px 10px;
    background-color: #fff;
    right: -418px;
    top: -96px;
    border: 1px solid #d5d5d5;
    cursor: auto;
}
.sidebar .sidebar-item-chat .chat-item {
    display: inline-block;
    float: left;
}
.sidebar .sidebar-item-chat .chat-item.chat-item-qq {
    cursor: pointer;
}
.sidebar .sidebar-item-chat .chat-item-desc {
    color: #666;
    margin-top: 8px;
}
.sidebar .sidebar-item-chat .chat-item-desc span {
    color: #2ea661;
}
.sidebar .sidebar-item-chat .chat-split {
    display: inline-block;
    float: left;
    margin: 0 30px 0 28px;
    border-right: 1px dashed #e7e7e7;
    height: 148px;
    width: 1px;
    vertical-align: top;
}
.sidebar .sidebar-item-chat {
    background-position: 0 -35px;
    cursor: pointer;
}
.sidebar .sidebar-item-feedback {
    background-position: 0 -70px;
    cursor: pointer;
}
.sidebar .sidebar-item-feedback:hover div{
    background-color: #2ea661;
}
.sidebar .sidebar-item-feedback div{
    position: absolute;
    display: none;
    z-index: -1;
    color: #fff;
    box-sizing: border-box;
    width: 90px;
    height: 36px;
    right: -58px;
    padding: 7px 15px;
    background-color: #817672;
}
.sidebar .sidebar-item-feedback div:hover{
    display: block;
}
.sidebar .sidebar-item-qrcode {
    background-position: 0 -105px;
    cursor: pointer;
}
.sidebar .sidebar-item-qrcode div {
    position: absolute;
    display: none;
    right: -184px;
    bottom: 37px;
    z-index: -1;
    background-color: #fff;
    padding: 20px;
    box-shadow: 1px 5px 60px rgba(0,0,0,.4);
}
.sidebar .sidebar-item-top:hover div{
    background-color: #2ea661;
}
.sidebar .sidebar-item-top div{
    position: absolute;
    display: none;
    z-index: -1;
    color: #fff;
    box-sizing: border-box;
    width: 100px;
    height: 36px;
    right: -58px;
    background-color: #817672;
    padding: 7px 15px;
}
.sidebar .sidebar-item-top {
    background-position: 0 -140px;
    cursor: pointer;
}
.sidebar .sidebar-item-word {
    word-wrap: break-word;
    word-break: break-all;
    color: #fff;
    line-height: 1.4;
    padding: 10px 8px;
    cursor: pointer;
}
.sidebar .sidebar-item-word .aboutXiangin{
    box-shadow: 1px 5px 60px rgba(0,0,0,.4);
    background-color: #fff;
    padding: 16px 14px;
    position: absolute;
    display: none;
    right: -230px;
    width: 230px;
    bottom: 0;
    z-index: -1;
}
.sidebar-item .video-intro-link {
    background-image: url("../images/video_intro.png");
    width: 150px;
    height: 100px;
    margin: 0 auto;
    cursor: pointer;
}
.sidebar-item .video-intro-link:hover {
    background-image: url("../images/video_intro_hover.png");
}
.modal.video-intro-modal {
    background: transparent;
    border: none !important;
    box-shadow: none;
}
.modal.video-intro-modal .modal-body{
    margin-top: 40px;
}
.modal.video-intro-modal .close {
    background-image: url("../images/x_big_white.png");
    width: 30px;
    height: 30px;
    right: 0;
    top: -10px;
}
.modal.video-intro-modal .close:hover {
    animation: none;
}
.modal.video-intro-modal .modal-body {
    padding: 0;
}

.textColor{
    font-style:normal;color: #44C4E1;
}

.block-nav-title-current {
    color: #2ea661;
}
.nav-holder {
    display: inline-block;
}

.main-link {

}
.main-link:hover {
    color: #2ea661 !important;
    text-decoration:none;
}

.qq-icon {
    background: url("../images/connect_logo_1.png") no-repeat 0 center;
    padding-left: 20px;
}
.qq-hover:hover{
	text-decoration:none;
	color:#2ea661;
}
.card {
    box-shadow: 1px 1px 1px #ccc;
}
.ie8 .card {
    border-bottom: 1px solid #ccc;
}
.card.card-hover {
    transition: all 0.3s ease-in-out;
}
.card.card-hover:hover {
    border-color: #51c080;
    box-shadow:
        2px 4px 6px rgba(36, 199, 105, 0.1),
        -6px -4px 2px rgba(36, 199, 105, 0.1), /* left */
        -4px 6px 2px rgba(36, 199, 105, 0.1), /* bottom */
        4px -2px 6px rgba(36, 199, 105, 0.1); /* top */
}

.crumbs {
    padding: 15px 20px;
}

.btn-ok {
    border-color: #2ea661;
    background-color: #2ea661;
    color: #fff;
}
.btn-ok-bordered {
    border-color: #177a41;
    background-color: #2ea661;
    color: #fff;
}
.btn-ok:hover,
.btn-ok-bordered:hover {
    border-color: #51c080;
    background-color: #51c080;
    color: #fff;
}
.btn-ok:active,
.btn-ok.active,
.btn-ok-bordered:active,
.btn-ok-bordered.active {
    border-color: #42b873;
    background-color: #42b873;
    color: #fff;
}


.btn-ok-reverse {
    border-color: #3eaf6e;
    background-color: #fff;
    color: #2ea661;
}

.btn-ok-reverse:hover {
    background-color: #2ea661;
    color: #fff;
}
.btn-ok-reverse:active,
.btn-ok-reverse.active {
    border-color: #299455;
    background-color: #299455;
    color: #fff;
}

.btn-cancel {
    border-color: #aaaaac;
    background-color: #f7f7f7;
    color: #777;
}
.btn-cancel:hover,
.btn-cancel:focus {
    background-color: #fff;
    color: #444;
}
.btn-cancel:active,
.btn-cancel.active {
    background-color: #eee;
    color: #444;
}

.btn-reset {
    border-color: #dcdcdc;
    background-color: #f9f9f9;
    color: #777;
}
.btn-reset:hover,
.btn-reset:focus {
    background-color: #999;
    color: #fff;
}
.btn-reset:active,
.btn-reset.active {
    background-color: #999;
    color: #fff;
}

.pt-0{
    padding-top: 0px;
}