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, font, 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 { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent }
body { line-height: 1 }
ol, ul { list-style: none }
blockquote, q { quotes: none }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none }
:focus { outline: 0 }
ins { text-decoration: none }
del { text-decoration: line-through }
table { border-collapse: collapse; border-spacing: 0 }
a { text-decoration: none; color: #878787 }
a:hover{ color: #f1b30e;text-decoration: none; }
body { font-family: "Kreon"; font-weight: 300; color: #333; background: #f5f5f5; }
#switcher { height: 0px;  position: fixed; z-index: 999; width: 100%; top: 0; background: #262626; }
.center { width: 100%; padding-top: 0 }
.center ul li { display: inline; float: left; position: relative }
.logoTop{ margin-left: 30px;margin-right: 30px; margin-top: 20px; color: #fff; font-weight: bold; font-family: "微软雅黑" }

.logo{ position: absolute; left: 50%; top:13px; margin-left: -29px;}
@media screen and (max-width:1082px) {
#sj { display: none; }
#sj2 { display: none; }
}
.top2 {
    position: relative;
    margin-top: 0px;
    font-size: 12px;
    font-weight: normal;
    background-image: url(img/2vmd.png);
    background-repeat: no-repeat;
    background-position: 3px center;
    padding-top: 40px;
    padding-bottom: 16px;
    padding-left: 45px;
    line-height: 20px;
    padding-right: 15px;
}
.vm { position: absolute; z-index: 999; top: 0px; left: 0px; background-color: #fff; height: 170px; width: 150px; display: none; padding: 30px; }
.top2:hover .vm { display: block }
.logoTop a:hover { text-decoration: underline }
.center ul li ul { font-family: 'Droid Serif', serif; display: none; margin-left: 17px; position: absolute; width: 313px; background: #10100f; border: 1px solid #323024; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; padding-bottom: 3px; line-height: 18px; }
.center ul li ul li { margin: 0 0 1px 4px; padding: 5px; width: 271px }
.center ul li ul li a { display: block; width: 210px; font-size: 13px; color: #c4beab; float: left; line-height: 22px; white-space: nowrap; overflow: hidden }
.center ul li ul li .tag { display: block; width: 50px; height: 22px; font-size: 10px; color: #c4beab; margin: 0 8px 0 0; line-height: 22px; white-space: nowrap; background: url(sel-sp-act.png) no-repeat; text-align: center; float: left }
.center ul li ul li a span.link { display: block; width: 209px; height: 22px; overflow: hidden; float: left }
.center ul li ul li:hover { background: url(sel-act.png) no-repeat }
.center ul li ul li:hover a { color: #f8bc06 }
.center ul li ul li:hover .tag { color: #f8bc06 }
.center ul li ul li:first-child { margin-top: 3px }
li.device-resolution { text-transform: uppercase; font-size: 12px; color: #ada58b; font-family: 'Cambria'; line-height: 0px }
li.purchase { float: right!important; margin-top: 11px }
li.purchase a { padding: 0; background: url(trolley2.png) no-repeat 0 0; width: 133px; height: 36px; display: block; transition: all .3s ease-out 0s }
li.purchase a:hover { background-position: 0 -36px }
li.remove_frame { margin-left: 17px; float: right!important; margin-right: 30px }
li.remove_frame a { background: url(img/cross2.png) no-repeat 0 0; width: 20px; height: 21px; display: block; margin-top: 18px; transition: all .3s ease-out 0s }
li.remove_frame a:hover { background-position: 0 -21px }
li.service { margin-left: 17px; float: right!important; margin-right: 30px }
li.service a { width: 92px; height: 31px; text-align: center; line-height: 31px; color: #FFF; background-color: #ee7c1c; border-radius: 5px; display: block; margin-top: 11px; transition: all .3s ease-out 0s; font-size: 15px; }
li.service a:hover { opacity: 0.8;}

#iframe { margin-top: 0 }
.icon-monitor, .icon-tablet, .icon-mobile-1, .icon-mobile-2, .icon-mobile-3 { margin-right: 7px; margin-top: 20px; width: 17px; height: 16px }
.icon-monitor { margin-left: 10px; background-image: url(img/mon-spr.png); background-position: 0 0; background-repeat: no-repeat }
.icon-tablet { background: url(img/mon-spr.png) no-repeat -24px 0 }
.icon-mobile-1 { background: url(img/mon-spr.png) no-repeat -49px 0 }
.icon-monitor:hover, .icon-monitor.active { background-position: 0 -16px }
.icon-tablet:hover, .icon-tablet.active { background-position: -24px -16px }
.icon-mobile-1:hover, .icon-mobile-1.active { background-position: -49px -16px }
.icon-mobile-2 { background: url(img/mon-spr.png) no-repeat -71px 0 }
.icon-mobile-3 { background: url(img/mon-spr.png) no-repeat -94px 0 }
.icon-mobile-2:hover, .icon-mobile-2.active { background-position: -71px -16px }
.icon-mobile-3:hover, .icon-mobile-3.active { background-position: -94px -16px }
#iframe-wrap { height: 100%; overflow: visible; position: relative; top: 0; z-index: 50 }
.tablet-width { height: 960px!important; margin: 0 auto; padding: 96px 100px 115px 49px; width: 785px; margin-top: 40px; background: url(img/bgipad.png) no-repeat 0 0;transition: all 0.5s ease 0s;}
.tablet-width iframe { height: 960px!important }
.mobile-width { height: 703px!important; margin: 0 auto; padding: 41px 115px 100px 75px; width: 1041px; margin-top: 40px; background: url(img/bgipadw.png) no-repeat;transition: all 0.5s ease 0s; }
.mobile-width iframe { height: 704px!important }
.mobile-width-2 { height: 735px!important; margin: 0 auto; padding: 102px 25px 159px 23px; width: 414px; margin-top: 40px; background: url(img/bgiphone2.png) no-repeat;transition: all 0.5s ease 0s;}
.mobile-width-2 iframe { height: 735px!important }
.mobile-width-3 { height: 273px!important; margin: 0 auto; padding: 43px 115px 69px 82px; width: 605px; margin-top: 40px; background: url(img/bgiphonew.png) no-repeat;transition: all 0.5s ease 0s; }
.mobile-width-3 iframe { height: 317px!important }
.by { overflow-y: hidden }
.fdad { width: 336px; background-color: #FFF; position: fixed; top: 84px; right: 25px; opacity: .9; z-index: 888;  }
.fdl { float: left; font-family: Arial; font-size: 12px; padding-left: 5px; color: #ccc; line-height: 20px }
.fdr { float: right; font-family: Arial; font-size: 16px; padding-left: 5px; padding-right: 5px; background-color: #ccc; cursor: pointer }
.fdadnr {}