@charset "utf-8";
/* CSS Document */
/*主题模式*/
.theme { background: #6abb03 url(images/theme_pageBg_1.gif) top center no-repeat; }
a { color: #6abb03; }
.theme .m-content { position: absolute; left: 0; right: 0; top: 67px; bottom: 0; z-index: 70; overflow: hidden; }
.theme .back-btn-base { background-position: 0 -35px; }
.theme .m-head .m-title { color: #6abb03; }
.page-title { text-indent: -999em; width: 160px; height: 60px; margin: 10px 0 0 70px; background: url(images/theme_title.png) no-repeat; }
.themes-class { position: absolute; top: 68px; bottom: 0; width: 100%; }
.themes-class .themes-c-l, .themes-class .themes-c-r { width: 80px; height: 100%; position: absolute; top: 6px; background: #6abb03 url(images/theme_class_top_bg.png) 0 0 repeat-x; z-index: 20; }
.themes-class .themes-c-l { left: 0; }
.themes-class .themes-c-r { right: 0; }
.themes-class .prev-btn, .themes-class .next-btn { display: block; width: 80px; height: 64px; background: url(images/theme_scroll_btn.png) }
.themes-class .next-btn { background-position: -80px 0; }
.themes-class .themes-c-m { width: 100%; height: 100%; padding: 6px 80px 0; position: relative; overflow: hidden; background: url(images/theme_class_top_bg.png) 0 6px repeat-x; z-index: 10; }
.themes-c-m .themes-i-list { position: absolute; top: 0; left: 0; width: 1518px; height: 100%; }
.themes-class .themes-i { float: left; width: 254px; margin-left: -1px; height: 100%; background: url(images/theme_class_bg.png) no-repeat; position: relative; z-index: 10; }
.themes-class .themes-i:hover { z-index: 12; }
.themes-i .themes-i-t { height: 64px; width: 254px; z-index: 12; }
.themes-i .themes-i-b { position: absolute; top: 65px; bottom: 0; width: 100%; z-index: 12; }
.themes-i .themes-i-bg { display: none; background: url(images/theme_class_bg.png) -254px 0 no-repeat; position: absolute; top: 0; left: 0; height: 100%; width: 100%; box-shadow: 0 3px 8px #68b303; z-index: 10; }
.theme-item-list { padding: 0 12px; }
.theme-item-list li { width: 50%; padding: 12px; float: left; text-align: center; }
.theme-item-list li .theme-item { display: block; width: 91px; height: 128px; position: relative; padding: 8px; margin-bottom: 5px; background: #fff; border: 1px solid #999; border-radius: 5px; box-shadow: 0 2px 5px #68b303; }
.theme-item-list li .theme-item:hover { border-color: #3d6a04; box-shadow: 0 2px 5px #529101; }
.theme-item-list li .theme-item img { width: 73px; height: 110px; }
.theme-item-list li.vip-level1 .theme-item{border-color:#ff7109;}
.theme-item-list li.vip-level2 .theme-item{border-color:#ee3a2c;}
.theme-item-list li.vip .theme-item::after{position:absolute;top:4px;left:-4px;content:"VIP";display: block;  color: #fff;height:18px; line-height: 18px;width: 24px; text-align: center;}
.theme-item-list li.vip-level1 .theme-item::after{ background: #ff7109;}
.theme-item-list li.vip-level2 .theme-item::after{ background: #ee3a2c;}
.theme-preview .modal-dialog { width: 760px; }
.theme-preview .modal-body { padding: 0; }
.theme-preview .m-simulator { top: 0; left: 0; margin: 0; border: 1px solid #6abb03; box-shadow: 0 2px 12px #fff; }
.theme-preview .m-simulator .display-area .app-content{top:0;}
.theme-preview .m-simulator .backdrop { background-color: #ccc; }
.theme-preview .c-left { width: 360px; float: left; padding: 10px; }
.theme-preview .c-right { width: 350px; padding: 60px 0 10px 20px; float: left; }
.theme-preview .c-right h3 { font-size: 18px; }
.theme-preview .gallery-img-list { height: 320px; padding-left: 10px; margin: 10px 0; border-color: #ececec; border-radius: 4px; }
.theme-preview .gallery-img-list .img-list .thumbnail { width: 84px; height: 126px; }
.theme-preview .theme-qrcode{margin-top:10px;padding-top:10px; text-align: center;border-top:1px solid #ececec;}
.theme-preview .theme-qrcode img{padding:20px;background: #f9f9f9;margin:10px;}
/*分栏*/
.theme .m-content { position: absolute; width: 100%; top: 67px; bottom: 0; overflow: hidden; }
.theme .m-left { width: 280px; height: 100%; padding: 10px; position: absolute; left: 0; top: 0; -webkit-animation: loadLeft 1s; -moz-animation: loadLeft 1s; }
.theme .m-left > .panel-full > .panel-body { position: absolute; top: 38px; bottom: 0; width: 100%; }
.theme .m-right > .panel-full > .panel-body { top: 52px; padding: 0; }
.theme .m-left .m-left-t { height: 40px; text-align: center; }
.theme .m-left .m-left-b { position: absolute; top: 48px; bottom: 10px; left: 10px; right: 10px; overflow: hidden; border: 1px solid #ccc; border-radius: 3px; overflow: hidden; }
.theme .m-right { width: 340px; height: 100%; padding: 10px; position: absolute; right: 0; top: 0; -webkit-animation: loadRight 1s; -moz-animation: loadRight 1s; }
.theme .m-left > .panel, .theme .m-right > .panel { box-shadow: 0 2px 15px rgba(0,0,0,.4); }



@media (max-width: 1200px) {
    .themes-type,.themes-content .themes-list{
        width: 980px;
        margin:0 auto;
    }
    .themes-list li {padding:10px 12px;}
}

@media (min-width: 1200px) {
    .themes-type,.themes-content .themes-list{
        width: 1200px;
        margin:0 auto;
    }
    .themes-list li {padding:10px;}
}



html,body{min-width: 1000px;}
.fss{ font-family: "宋体", arial, sans-serif;}
.m-head .m-title{margin-left:-90px;}
.page-title{ margin: 10px auto 0;}
.themes-type{position:relative;border-bottom:1px solid #b5dd81;height: 56px; font-size: 0;}
.themes-type .themes-tab li{float: left; width: 14.286%;position: relative;}
.themes-type .themes-tab li a{ display: block;width: 100%; color: #fff; font-size: 18px; text-align: center; font-weight: lighter;opacity:.6;   transition: 0.2s;  -moz-transition: 0.2s;  -webkit-transition: 0.2s;  -o-transition: 0.2s;}
.themes-type .themes-tab li .txt{display:inline-block;position: relative;padding:8px 0 8px 32px; line-height:40px; text-shadow: 0 6px 1px rgba(46,81,0,.2);}
.themes-type .themes-tab li .txt:after{content:"";display: block;position: absolute;top:0;left:0;width: 32px;height: 56px; background:url("images/bg_themes.png") no-repeat ;}
.themes-type .themes-tab li.all .txt:after{background-position: 0 0;}
.themes-type .themes-tab li.theme-1 .txt:after{background-position: -32px 0;}
.themes-type .themes-tab li.theme-2 .txt:after{background-position: -64px 0;}
.themes-type .themes-tab li.theme-3 .txt:after{background-position: -96px 0;}
.themes-type .themes-tab li.theme-4 .txt:after{background-position: -128px 0;}
.themes-type .themes-tab li.other .txt:after{background-position: -160px 0;}
.themes-type .themes-tab li.my .txt:after{background-position: -192px 0;}
.themes-type .themes-tab li a:hover{text-decoration: none;opacity: 1;}
.themes-type .themes-tab li.active a{opacity: 1;}
.themes-type .themes-tab li.has-new .new{display: block;position: absolute;right:-3px;top:12px;width:12px;height: 12px;border:2px solid #fff; border-radius: 50%; background: #ee3a2c;}
.themes-type .curr-arror{position: absolute;bottom:0;left:0;width: 20px;height: 10px;background:url("images/bg_themes.png") 0 -56px no-repeat }
.themes-content{position: absolute;top:126px;bottom:0;left:0;right: 0;}
.themes-content .themes-panel{position:absolute;left:0;top:60px;width:100%;height: 100%;opacity: 0; z-index: 10;   transition: 0.2s;  -moz-transition: 0.2s;  -webkit-transition: 0.2s;  -o-transition: 0.2s;}
.themes-content .themes-panel.active{opacity: 1;top:0; z-index: 15; }
.themes-list{padding:30px 0;margin-right:-17px;}
.themes-list .theme-item{float: left;position: relative;}
.themes-list .theme-item .theme-title{text-align: center;padding:5px 0 10px; color: #fff; height: 40px; line-height: 25px; font-size: 16px; font-weight: normal;}
.themes-list .theme-item .theme-title .label{ display: inline-block; width:42px; line-height: 20px; font-size: 13px;margin-right:3px;margin-top:-2px;text-align:center;background: #ee3a2c; color: #fff; vertical-align: middle;}
.themes-list .theme-item .theme-title .label.new{background: #ffa022;}
.themes-list .loading{ display: inline-block;width: 120px; line-height: 24px; font-size: 13px; padding:8px 0;border-radius: 8px; background: rgba(0,0,0,.3); color: #fff;}
.themes-list .loading i{font-size: 16px;}
.themes-list .empty-box{  display: inline-block;width:240px; }
.themes-list .empty-box p{font-size: 16px;color: #fff;}
.themes-list .empty-box i{ font-size: 60px;color: #fff;}
.theme-item .theme-card{position: relative;width: 220px;height: 386px;border:3px solid #fff;background: #fff; overflow: hidden;}
.theme-item .theme-card .image{position:relative;width: 214px;  height: 380px;text-align:center;overflow: hidden; z-index: 20;}
.theme-item .theme-card .image img{max-width: 100%;}
.theme-item .theme-card p{color: #fff;}
.theme-item .theme-card .details{opacity: 0;transform:scale(.8);position: absolute;top:0;left:0;width: 100%; height:100%;text-align: center;  z-index: 30;transition: 0.2s;  -moz-transition: 0.2s;  -webkit-transition: 0.2s;  -o-transition: 0.2s;}
.theme-item .theme-card.on .details{opacity: 1;transform:scale(1); }
.theme-item .theme-card .details .backdrop{position: absolute;top:-500px;right:-500px;bottom:-500px;left:-500px; background: #000;opacity:.6;z-index: 30;}
.theme-card .next-btn, .theme-card .other-btn, .theme-card .preview-qrcode{position: relative;z-index: 40;}
.theme-card .next-btn{margin-top:60px;}
.theme-card .other-btn{margin-top:30px}
.theme-card .preview-qrcode{margin-top:30px;}
.theme-card .preview-qrcode .qrcode-image{margin-top:10px;}
.theme-module-dl dt{font-size: 16px; line-height:16px;padding-left:10px;margin:0 0 10px;border-left:3px solid #70be45;}
.theme-module-dl dt.level-1{border-color:#ffa022;}
.theme-module-dl dt.level-2{border-color:#ff6e03;}
.theme-module-dl dd{margin-bottom:20px;}
.theme-module-dl .module-list{margin-right:-10px;}
.theme-module-dl .module-list li{ float: left;}
.theme-module-dl .module-list li .txt{position:relative;display: block;width: 107px;margin:0 5px 5px 0;padding:8px 8px; font-size:13px; line-height:16px;background: #f1f1f1;color:#aaa;}
.theme-module-dl .module-list li .txt:after{content:"\e851";font-family: "fontello";position: absolute;display:block;width:20px;height:20px;text-align:center; font-size:12px;line-height:16px;right:5px;top:8px;color:#ccc;}
.theme-module-dl .module-list li.checked .txt{color: #fff; background: #70be45;}
.theme-module-dl .module-list li.checked .txt:after{color: #fff;}
.theme-module-dl .module-list.level-1 li.checked .txt{background: #ffa022;}
.theme-module-dl .module-list.level-2 li.checked .txt{background: #ff6e03;}

.drag-element{position:absolute;z-index:200;opacity:.7;filter:alpha(opacity=70);background:#666}