@charset "UTF-8";

@import url(https://www.asus.com.cn/css/2015/fontapi.css );

@import url(https://www.asus.com.cn/css/2015/fontapi.css );

@import url(https://www.asus.com.cn/css/2015/fontapi.css );

/*!
 * Z97 Main CSS Framework  
 * @author oldface
 * @version 20140331

 * New version for X99-E
 * @author disorder24
 * @version 20140828

 */
 /*!
 * ======================
 * Commons
 * ======================
 * basic colors: blue : #02b1e4
 */

.m-wrap div,.m-wrap span,.m-wrap applet,.m-wrap object,.m-wrap iframe,
.m-wrap h1,.m-wrap h2,.m-wrap h3,.m-wrap h4,.m-wrap h5,.m-wrap h6,.m-wrap p,
.m-wrap blockquote,.m-wrap pre,.m-wrap a,.m-wrap abbr,.m-wrap acronym,.m-wrap address,
.m-wrap big,.m-wrap cite,.m-wrap code,.m-wrap del,.m-wrap dfn,.m-wrap em,.m-wrap img,.m-wrap ins,
.m-wrap kbd,.m-wrap q,.m-wrap s,.m-wrap samp,.m-wrap small,.m-wrap strike,.m-wrap strong,.m-wrap sub,
.m-wrap sup,.m-wrap tt,.m-wrap var,.m-wrap b,.m-wrap u,.m-wrap i,.m-wrap center,.m-wrap dl,.m-wrap dt,
.m-wrap dd,.m-wrap ol,.m-wrap ul,.m-wrap li,.m-wrap fieldset,.m-wrap form,.m-wrap label,.m-wrap legend,
.m-wrap table,.m-wrap caption,.m-wrap tbody,.m-wrap tfoot,.m-wrap thead,.m-wrap tr,.m-wrap th,.m-wrap td,
.m-wrap article,.m-wrap aside,.m-wrap canvas,.m-wrap details,.m-wrap embed,.m-wrap figure,.m-wrap figcaption,
.m-wrap footer,.m-wrap header,.m-wrap hgroup,.m-wrap menu,.m-wrap nav,.m-wrap output,.m-wrap ruby,.m-wrap section,
.m-wrap summary,.m-wrap time,.m-wrap mark,.m-wrap audio,.m-wrap video{
    margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline
}

.m-wrap table{
    border-collapse:collapse;border-spacing:0
}
.m-wrap caption,.m-wrap th,.m-wrap td{
    text-align:left;font-weight:normal;vertical-align:middle
}
.m-wrap q,.m-wrap blockquote{quotes:none}
.m-wrap q:before,.m-wrap q:after,.m-wrap blockquote:before,.m-wrap blockquote:after{
    content:"";content:none
}
.m-wrap a img{border:none}
.m-wrap img{
    image-rendering:optimizeQuality;
    image-rendering:auto;
    -ms-interpolation-mode:bicubic
}
.m-wrap a{
    color:#010101;
    text-decoration:none;
    -webkit-tap-highlight-color:rgba(255,255,255,0.1);
    -webkit-transition:color 0.2s ease-out;-moz-transition:color 0.2s ease-out;
    -o-transition:color 0.2s ease-out;transition:color 0.2s ease-out
}
.m-wrap p{margin:0 0 1em;padding:0}
.m-wrap p:last-child{margin-bottom:0}
.m-wrap b{font-weight:normal}
.m-wrap small{font-size:inherit}
.m-wrap h1 img,.m-wrap h2 img,.m-wrap h3 img,.m-wrap h4 img,.m-wrap h5 img,.m-wrap h6 img{margin:0;vertical-align:bottom}
.m-wrap blockquote{margin:0;padding:0;border:none}
.m-wrap ul,.m-wrap ol{list-style:none;display:block}


/*!
 * ----------------------
 * Commons/ Text & color
 * ----------------------
 */
 .m-wrap {
    line-height: 1.41176;
    font-family: "Roboto","STHeiti Light",STXihei,STHeiti,"Apple LiGothic Medium",\5FAE\8EDF\6B63\9ED1\9AD4,"微軟正黑體","Microsoft JhengHei",Helvetica,Arial,sans-serif;
    font-size: 16px;
    color: #010101;
}

.m-wrap a:hover {
    color: inherit;
    text-decoration: none;
}

.m-wrap small.ps {
    display: block;
    margin-top: 1em;
    font-size: 12px;
}
/*!
 * ----------------------
 * Commons/ Button, Bullet & Icon
 * ----------------------
 */


.m-wrap .icn-hyperlink {
    width: 54px;
    height: 54px;
    overflow: hidden;
    background: url("../../img/ui/icn-hyperlink.png");
}

.m-wrap .icn-play {
    width: 54px;
    height: 54px;
    overflow: hidden;
    background: url("../../img/ui/icn-play.png");
}

.m-wrap .icn-arrow-prev,.m-wrap .icn-arrow-next,.m-wrap .icn-arrow-prev2,.m-wrap .icn-arrow-next2,.m-wrap .icn-arrow-tiny,.m-wrap .icn-arrow-up {
    background-image: url("../../img/ui/icn-arrow.png");
}

.m-wrap .icn-arrow-prev,.m-wrap .icn-arrow-next,.m-wrap .icn-arrow-prev2,.m-wrap .icn-arrow-next2,.m-wrap .icn-arrow-up {
    width: 22px;
    height: 22px;
    text-indent: -119988px;
    overflow: hidden;
    text-align: left;
    background-repeat: no-repeat;
    display: block;
}

.m-wrap .icn-arrow-prev>br,.m-wrap .icn-arrow-prev br,.m-wrap .icn-arrow-next>br,.m-wrap .icn-arrow-next br,.m-wrap .icn-arrow-prev2>br,.m-wrap .icn-arrow-prev2 br,.m-wrap .icn-arrow-next2>br,.m-wrap .icn-arrow-next2 br,.m-wrap .icn-arrow-up>br,.m-wrap .icn-arrow-up br {
    display: none;
}

.m-wrap .icn-arrow-prev {
    background-position: 0 0;
}

.m-wrap .icn-arrow-next {
    background-position: 0 -22px;
}

.m-wrap .icn-arrow-prev2 {
    background-position: 0 -44px;
}

.m-wrap .icn-arrow-next2 {
    background-position: 0 -66px;
}

.m-wrap .icn-arrow-tiny {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: baseline;
    vertical-align: middle;
    width: 21px;
    height: 21px;
    background-position: 0 -88px;
}

.m-wrap .icn-arrow-up {
    background-position: 0 -109px;
}

.m-wrap .icn-play2 {
    display: block;
    width: 45px;
    height: 45px;
    text-indent: -119988px;
    overflow: hidden;
    text-align: left;
    background-image: url("../../img/ui/icn-play2.png");
    background-repeat: no-repeat;
}

.m-wrap .icn-play2>br,.m-wrap .icn-play2 br {
    display: none;
}

.m-wrap .icn-loading {
    width: 16px;
    height: 11px;
    position: absolute;
    left: 50%;
    bottom: 10px;
    float: left;
    z-index: 99;
    margin-left: -8px;
    overflow: hidden;
    background: url("../../img/ui/icn-loading.gif") no-repeat 50% 50%;
}

.m-wrap .icn-loading2 {
    width: 36px;
    height: 36px;
    position: absolute;
    left: 50%;
    top: 50%;
    float: left;
    z-index: 99;
    margin-left: -18px;
    margin-top: -18px;
    overflow: hidden;
    border: 2px solid #7e6838;
    background: #000 url("../../img/ui/icn-loading.gif") no-repeat 50% 50%;
    background: rgba(0,0,0,0.8) url("../../img/ui/icn-loading.gif") no-repeat 50% 50%;
    -webkit-animation: displayLoadingIcon 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -moz-animation: displayLoadingIcon 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -ms-animation: displayLoadingIcon 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -o-animation: displayLoadingIcon 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    animation: displayLoadingIcon 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.m-wrap .bn-arrow-prev,.m-wrap .bn-arrow-next,.m-wrap .bn-arrow-up {
    display: block;
    float: left;
    padding: 13px;
    border: 2px solid #02b1e4;
    background: rgba(0,0,0,0.8);
    -webkit-transition: all 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-transition: all 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    -o-transition: all 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: all 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    cursor: pointer;
}

.no-rgba .m-wrap .bn-arrow-prev,.no-rgba .m-wrap .bn-arrow-next,.no-rgba .m-wrap .bn-arrow-up {
    background: #111;
}

.m-wrap .bn-arrow-prev:hover,.m-wrap .bn-arrow-prev.pressed,.m-wrap .bn-arrow-next:hover,.m-wrap .bn-arrow-next.pressed,.m-wrap .bn-arrow-up:hover,.m-wrap .bn-arrow-up.pressed {
    background: black;
    border-color: #02b1e4;
    box-shadow: 0 0 10px #02b1e4;
}

.m-wrap .bn-arrow-prev:hover,.m-wrap .bn-arrow-prev.pressed {
    padding-left: 9px;
    padding-right: 17px;
}

.m-wrap .bn-arrow-next:hover,.m-wrap .bn-arrow-next.pressed {
    padding-right: 9px;
    padding-left: 17px;
}

.m-wrap .bn-arrow-up:hover,.m-wrap .bn-arrow-up.pressed {
    padding-top: 9px;
    padding-bottom: 17px;
}

.m-wrap .bn-close {
    width: 48px;
    height: 48px;
    text-indent: -119988px;
    overflow: hidden;
    text-align: left;
    background-image: url("../../img/ui/bn-close.png");
    background-repeat: no-repeat;
    cursor: pointer;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -moz-transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -o-transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.m-wrap .bn-close>br,.m-wrap .bn-close br {
    display: none;
}

.m-wrap .bn-close:hover,.m-wrap .bn-close.pressed {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.m-wrap .open-detail,.m-wrap .close-detail {
    position: relative;
    z-index: 2;
    display: block;
    width: 189px;
    height: 46px;
    text-indent: -119988px;
    overflow: hidden;
    text-align: left;
    background-image: url("../../img/ui/toggle-detail-button.png");
    background-repeat: no-repeat;
    margin-left: auto;
    margin-right: auto;
    -webkit-transition: background 0.2s cubic-bezier(0.77, 0, 0.175, 1);
    -moz-transition: background 0.2s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: background 0.2s cubic-bezier(0.77, 0, 0.175, 1);
    transition: background 0.2s cubic-bezier(0.77, 0, 0.175, 1);
    cursor: pointer;
}

.m-wrap .open-detail>br,.m-wrap .open-detail br,.m-wrap .close-detail>br,.m-wrap .close-detail br {
    display: none;
}

.m-wrap .open-detail {
    -webkit-animation: flowing 2s ease 1s infinite;
    -moz-animation: flowing 2s ease 1s infinite;
    -ms-animation: flowing 2s ease 1s infinite;
    -o-animation: flowing 2s ease 1s infinite;
    animation: flowing 2s ease 1s infinite;
}

.m-wrap .open-detail:hover,.m-wrap .open-detail.pressed {
    opacity: 1;
    -webkit-animation: none;
    -moz-animation: none;
    -ms-animation: none;
    -o-animation: none;
    animation: none;
}

.m-wrap .close-detail:hover,.m-wrap .close-detail.pressed {
    background-position: 0 -46px;
}

.m-wrap .open-detail {
    background-position: 0 -92px;
}

.m-wrap .open-detail:hover,.m-wrap .open-detail.pressed {
    background-position: 0 -138px;
}

.m-wrap .toggle-detail-bar {
    position: absolute;
    left: 0;
    bottom: 0;
    float: left;
    z-index: 10;
    display: block;
    width: 100%;
    height: 46px;
    overflow: hidden;
    background: #009fbc;
    color: #fff;
    text-align: center;
    -webkit-transition: background 0.2s cubic-bezier(0.77, 0, 0.175, 1);
    -moz-transition: background 0.2s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: background 0.2s cubic-bezier(0.77, 0, 0.175, 1);
    transition: background 0.2s cubic-bezier(0.77, 0, 0.175, 1);
    cursor: pointer;
}

.m-wrap .toggle-detail-bar i {
    display: block;
    width: 189px;
    height: 46px;
    text-indent: -119988px;
    overflow: hidden;
    text-align: left;
    background-image: url("../../img/ui/toggle-detail-bar.png");
    background-repeat: no-repeat;
    margin-left: auto;
    margin-right: auto;
}

.m-wrap .toggle-detail-bar i>br,.m-wrap .toggle-detail-bar i br {
    display: none;
}

.m-wrap .toggle-detail-bar.closed i {
    background-position: 0 -46px;
}

.m-wrap .toggle-detail-bar:hover {
    background: #007489;
}

/*!
 * ----------------------
 * Commons/ Layout
 * ----------------------
 */
 br.mclear {
    display: block;
    width: 1px;
    margin-left: -1px;
    clear: both;
}

br.mclear:after {
    content: " ";
    visibility: hidden;
    display: block;
    font-size: 0;
    clear: both;
    height: 0;
}

* html br.mclear {
    zoom: 1;
}

*:first-child+html br.mclear {
    zoom: 1;
}

.m-wrap .divider {
    clear: both;
    text-align: center;
}

.m-wrap .divider .section-title-x {
    padding: 0.47619em 0;
    line-height: 1;
    font-weight: 400;
    font-size: 42px;
    font-family: "Cuprum","Oswald","Arial Narrow",Impact,"Roboto";
}

.m-wrap .picnav {
    font-size: 0;
    white-space: nowrap;
}

.m-wrap .picnav .picnav-item {
    font-size: 16px;
}

.m-wrap .picnav .picnav-item {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: top;
    white-space: normal;
}

.m-wrap .picnav-item {
    position: relative;
    overflow: hidden;
}

.m-wrap .picnav-item a {
    display: block;
}

.m-wrap .picnav-item .pic {
    width: 100%;
    -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-transition: -moz-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
    -o-transition: -o-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.m-wrap .picnav-item .pic img {
    display: block;
    width: 100%;
    height: auto;
}

.m-wrap .picnav-item .title {
    position: absolute;
    left: 0;
    bottom: 0;
    float: left;
    display: table;
    z-index: 2;
    width: 100%;
    height: 76px;
    background: black;
    background: rgba(0,0,0,0.8);
    line-height: .9;
    font-size: 2.5em;
    font-weight: 400;
    font-family: "Oswald","Cuprum","Arial Narrow",Impact,"Roboto";
    color: #fff;
    text-align: center;
    -webkit-transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    -o-transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.m-wrap .picnav-item .title span {
    height: 76px;
    display: table-cell;
    vertical-align: middle;
}

.m-wrap .picnav-item .title span>* {
    vertical-align: middle;
}

.m-wrap .picnav-item .title span>* {
    *display: inline;
    *zoom: 1;
}

.m-wrap .picnav-item .title span>.helper,.m-wrap .picnav-item .title span>.mh {
    *height: 100%;
}

.m-wrap .picnav-item a:hover {
    text-decoration: none;
}

.m-wrap .picnav-item a:hover .title {
    color: #fff;
}

.m-wrap .picnav-item a:hover .pic {
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    -o-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

.m-wrap .line[class^=p] {
    position: absolute;
    z-index: 2;
    float: left;
}

.m-wrap .line[class^=p] .text {
    position: absolute;
    left: auto;
    right: auto;
    bottom: auto;
    top: auto;
    z-index: 2;
    float: left;
    font-size: 0.9375em;
    line-height: 1.2;
    padding: 0.1875em;
}

.m-wrap .line[class^=p] .text:before,.m-wrap .line[class^=p] .text:after {
    content: "";
    display: table;
}

.m-wrap .line[class^=p] .text:after {
    clear: both;
}

.m-wrap .line[class^=p] .text {
    zoom: 1;
}

.m-wrap .line[class^=p] .text .id {
    display: none;
    float: left;
    width: 25px;
    height: 25px;
    margin-right: .5em;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    -o-border-radius: 100%;
    border-radius: 100%;
    background: #fff;
    background: rgba(255,255,255,0.8);
    color: black;
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    line-height: 25px;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
}

.m-wrap .line[class^=p] .text strong {
    display: block;
    font-weight: 700;
}

.m-wrap .line[class^=p] .text span {
    display: block;
}

.m-wrap .line[class^=p] .text ul {
    list-style: disc;
    font-size: 85%;
    margin-top: .5em;
    margin-bottom: .5em;
}

.m-wrap .line[class^=p] .text.b {
    bottom: auto;
    top: 100%;
}

.m-wrap .line[class^=p] .text.l {
    left: auto;
    right: 100%;
}

.m-wrap .line[class^=p] .text.t {
    top: auto;
    bottom: 100%;
}

.m-wrap .line[class^=p] .text.r {
    left: 100%;
    right: auto;
}

.m-wrap .line[class^=p] .text.tl {
    left: 0;
    right: auto;
    top: auto;
    bottom: 100%;
}

.m-wrap .line[class^=p] .text.tr {
    right: 0;
    left: auto;
    top: auto;
    bottom: 100%;
}

.m-wrap .line[class^=p] .text.bl {
    left: 0;
    right: auto;
    bottom: auto;
    top: 100%;
}

.m-wrap .line[class^=p] .text.br {
    right: 0;
    left: auto;
    bottom: auto;
    top: 100%;
}

.m-wrap .line[class^=p] .text.rt {
    left: 100%;
    right: auto;
    top: 0;
    bottom: auto;
}

.m-wrap .line[class^=p] .text.rb {
    left: 100%;
    right: auto;
    bottom: 0;
    top: auto;
}

.m-wrap .line[class^=p] .text.lt {
    left: auto;
    right: 100%;
    top: 0;
    bottom: auto;
}

.m-wrap .line[class^=p] .text.lb {
    left: auto;
    right: 100%;
    bottom: 0;
    top: auto;
}

.m-wrap .line[class^=p] .text.nowrap {
    white-space: nowrap;
}

.m-wrap .line[class^=p] .text.move-t-x0d5 {
    margin-top: -.5em;
}

.m-wrap .line[class^=p] .text.move-t-x1 {
    margin-top: -1em;
}
.m-wrap .line[class^=p] .text.move-t-x1a {
    margin-top: -3em;
    left: -15em;
}

.m-wrap .line[class^=p] .text.move-t-x2 {
    margin-top: -2em;
}

.m-wrap .line[class^=p] .text.move-t-x3 {
    margin-top: -3em;
}

.m-wrap .line[class^=p] .text.move-t-x4 {
    margin-top: -4em;
}

.m-wrap .line[class^=p] .text.move-b-x0d5 {
    margin-top: .5em;
}

.m-wrap .line[class^=p] .text.move-b-x1 {
    margin-top: 1em;
}

.m-wrap .line[class^=p] .text.move-b-x2 {
    margin-top: 2em;
}

.m-wrap .line[class^=p] .text.move-b-x3 {
    margin-top: 3em;
}

.m-wrap .line[class^=p] .text.move-b-x4 {
    margin-top: 4em;
}

.m-wrap .line[class^=p] .text.move-r-x1 {
    margin-left: 1em;
}

.m-wrap .line[class^=p] .text.move-r-x2 {
    margin-left: 2em;
}

.m-wrap .line[class^=p] .text.move-r-x3 {
    margin-left: 3em;
}

.m-wrap .line[class^=p] .text.move-r-x4 {
    margin-left: 4em;
}

.m-wrap .line[class^=p] .text.move-l-x1 {
    margin-right: 1em;
}

.m-wrap .line[class^=p] .text.move-l-x2 {
    margin-right: 2em;
}

.m-wrap .line[class^=p] .text.move-l-x3 {
    margin-right: 3em;
}

.m-wrap .line[class^=p] .text.move-l-x4 {
    margin-right: 4em;
}

.m-wrap .line[class^=p] .point {
    position: relative;
    z-index: 1;
    float: left;
}

.m-wrap .line[class^=p] .point img {
    display: block;
}

.m-wrap .on-dark .line .text {
    color: #fff;
}

.m-wrap .video {
    position: relative;
    width: 62.5em;
    margin-left: auto;
    margin-right: auto;
}

.m-wrap .video .play {
    position: absolute;
    left: 50%;
    top: 50%;
    float: left;
    z-index: 5;
    margin-left: -22.5px;
    margin-top: -22.5px;
}

.m-wrap .video .previvew {
    position: relative;
    z-index: 1;
}

.m-wrap .video .previvew img {
    display: block;
}

.m-wrap a:hover .play {
    opacity: .7;
}

.m-wrap .tabing .tabing-menu.in-tab {
    height: 60px;
    overflow: hidden;
}

.m-wrap .tabing .tabing-menu.in-tab ul {
    height: 60px;
    font-size: 0;
}

.m-wrap .tabing .tabing-menu.in-tab ul>li {
    font-size: 16px;
}

.m-wrap .tabing .tabing-menu.in-tab ul>li {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: top;
    white-space: normal;
}

.m-wrap .tabing .tabing-menu.in-tab li {
    width: 165px;
    height: 60px;
    margin-right: 1px;
}

.m-wrap .tabing .tabing-menu.in-tab li a {
    display: block;
    width: 100%;
    height: 60px;
    line-height: 60px;
    background: url("../../img/ui/tab-menu-bg.png") 100% 0;
    text-decoration: none;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    font-weight: 400;
    font-size: 1.25em;
    color: #5c5c5c;
    text-align: center;
}

.m-wrap .tabing .tabing-menu.in-tab li.on a,.m-wrap .tabing .tabing-menu.in-tab li a:hover {
    background-position: 100% -60px;
    color: #fff;
}

.m-wrap .tabing .tabing-cont {
    position: relative;
}

.m-wrap .tabing .tabing-page {
    display: none;
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding: 25px;
}

.m-wrap .tabing .tabing-page .tabing-page-cont {
    width: 60%;
    float: left;
}

.m-wrap .tabing .tabing-page .tabing-page-descr {
    width: 37%;
    float: right;
}

.m-wrap .tabing .tabing-page .subpage {
    overflow: hidden;
}

.m-wrap .tabing .tabing-page .subpage.on {
    display: block;
    -webkit-animation: fadein 0.1s;
    -moz-animation: fadein 0.1s;
    -ms-animation: fadein 0.1s;
    -o-animation: fadein 0.1s;
    animation: fadein 0.1s;
}

.m-wrap .tabing .tabing-page.on {
    display: block;
    position: relative;
    z-index: 2;
    -webkit-animation: fadein 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-animation: fadein 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -ms-animation: fadein 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -o-animation: fadein 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    animation: fadein 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
}
.m-wrap .tabing .tabing-page .subpage .next {
    font-family:oswald;font-size:1.5em; 
    color:#02b1e4; 
    cursor:pointer;
    margin-top:-15px
}

.m-wrap .list1 li {
    background: url("../../img/ui/icn-bullet-1.png") no-repeat 0.3em 0.5em;
    padding-left: 1em;
    margin-bottom: .2em;
}



#videoplayer {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 199999;
    width: 100%;
    height: 100%;
    background: black;
    background: rgba(0,0,0,0.6);
}

#videoplayer iframe.player {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
    padding: 0;
    vertical-align: bottom;
    background: black;
}

#videoplayer .close {
    position: absolute;
    right: 15px;
    top: 15px;
    float: left;
    z-index: 2;
    width: 44px;
    height: 44px;
    overflow: hidden;
    background: url("../../img/ui/videoplayer-close.png") no-repeat;
    cursor: pointer;
    opacity: .6;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}

#videoplayer .close:hover {
    opacity: 1;
}

/*!
 * ======================
 * Template
 * ======================
 */
html #main-zone {
    overflow: visible !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

html #asus-api-header {
    position: relative !important;
}

html #overview #special-sectionOverview,html #overview #sectionOverview {
    width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    float: none !important;
}

/* fix
html #overview #special-sectionOverview img,html #overview #sectionOverview img {
    max-width: none !important;
}

@media (max-width: 959px) {
    .m-wrap img {
        max-width: none !important;
    };
}
*/

#product_content_area p {
    margin: 0;
}

#sectionOverview p,#special-sectionOverview p {
    margin-bottom: 1em;
}

#overview #sectionOverview {
    line-height: inherit;
}

.m-nav {
    position: relative;
    z-index: 10101010101;
    top: auto;
    width: 100%;
    height: 55px;
    background: #484848;
    background: rgba(72,72,72,0.85);
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    font-size: 0;
    white-space: nowrap;
    text-align: center;
}

.m-nav .m-logo {
    position: relative;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: baseline;
    vertical-align: top;
    width: 250px;
}

.m-nav .m-logo img {
    display: block;
    margin-top: 13px;
}

.m-nav ul {
    position: relative;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: baseline;
    vertical-align: top;
    font-size: 0;
    overflow: hidden;
    *zoom: 1;
    border-left: 1px solid #ddd;
}

.m-nav ul li {
    font-size: 16px;
}

.m-nav ul li {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: top;
    white-space: normal;
}

.m-nav li {
    border-right: 1px solid #ddd;
    color: #fff;
    text-align: center;
}

.m-nav li a {
    display: block;
    padding: 0 40px;
    background-color: transparent;
    font: 18px/55px "Oswald","Arial Narrow",Impact,"Roboto";
    color: #fff;
    text-decoration: none;
    -webkit-transition: background-color 0.2s;
    -moz-transition: background-color 0.2s;
    -o-transition: background-color 0.2s;
    transition: background-color 0.2s;
}

.m-nav li.on a,.m-nav li a:active,.m-nav li a:hover {
    background-color: #02b1e4;
}

.m-nav.fixed {
    position: fixed;
    top: 0;
    min-width: 1000px;
    height: 36px;
}

.m-nav.fixed a {
    line-height: 36px;
}

.m-nav.fixed li.on i {
    height: 2px;
}

@media (max-width: 1000px) {
    .m-nav li a {
        padding-left: 20px;
        padding-right: 20px;
    };
}

@media (max-width: 60em) {
    .m-nav .m-logo {
        display: none;
    }

    .m-nav ul {
        text-align: left;
    };
}

@media (max-width: 53.125em) {
    .m-nav li a {
        padding-left: 14px;
        padding-right: 14px;
    };
}

.m-wrap .section {
    position: relative;
}

.m-wrap .section-inner {
    position: relative;
    max-width: 1000px;
    margin: 0 auto;
    padding: 4.375em 0;
}

.m-wrap .section-display {
    z-index: 2;
}

.m-wrap .section-display img {
    display: block;
}

.m-wrap .section-display .base {
    z-index: 1;
}

.m-wrap .section-imgbg {
    position: absolute;
    left: 50%;
    top: 0;
    float: left;
    z-index: 1;
    width: 100%;
    margin-left: -50%;
}

.m-wrap .section-imgbg img {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
}

.m-wrap .learndetail {
    position: relative;
}

.m-wrap .open-detail {
    position: absolute;
    left: 50%;
    bottom: 0;
    float: left;
    z-index: 5;
    margin-left: -95px;
}

.m-wrap .close-detail {
    position: absolute;
    left: 50%;
    bottom: 0;
    float: left;
    z-index: 5;
    margin-left: -95px;
}

.m-wrap .close-detail.attop {
    top: 0;
    bottom: auto;
}

#backtop {
    display: none;
    position: fixed;
    z-index: 99999;
    right: 10px;
    bottom: 50px;
    cursor: pointer;
    -webkit-animation: fadein 0.5s;
    -moz-animation: fadein 0.5s;
    -ms-animation: fadein 0.5s;
    -o-animation: fadein 0.5s;
    animation: fadein 0.5s;
}

#mininav {
    position: relative;
    z-index: 999;
    width: 100%;
    height: 64px;
}

#mininav .bar {
    position: relative;
    z-index: 2;
    height: 100%;
    background: #666;
    box-shadow: 0 1px 5px rgba(0,0,0,0.5);
}

#mininav .toggle {
    position: absolute;
    right: 0;
    top: 0;
    float: left;
    width: 64px;
    height: 100%;
    overflow: hidden;
    background: #555 url("../../img/ui/mininav-toggle.png") no-repeat 50% 50%;
    cursor: pointer;
}

#mininav .toggle:hover,#mininav .toggle:active {
    background-color: #444;
}

#mininav .menu {
    display: none;
    position: absolute;
    z-index: 1;
    top: 100%;
    left: 0;
    width: 100%;
}

#mininav .menu ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

#mininav .menu li {
    padding: 0;
    margin: 0;
    text-align: center;
    border-bottom: 1px solid #333;
}

#mininav .menu li a {
    display: block;
    height: 100%;
    padding: 0.66667em;
    background: #777;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzc3Nzc3NyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #777777), color-stop(100%, #666666));
    background-image: -webkit-linear-gradient(top, #777777,#666666);
    background-image: -moz-linear-gradient(top, #777777,#666666);
    background-image: -o-linear-gradient(top, #777777,#666666);
    background-image: linear-gradient(top, #777777,#666666);
    color: #fff;
    text-shadow: 0 1px 0 #333;
    font-size: 30px;
    font-weight: 400;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    line-height: 1.1;
}

#mininav .menu li a:hover,#mininav .menu li a:active {
    background: #555;
}

#mininav.open .menu {
    -webkit-animation: mininavShowMenu 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-animation: mininavShowMenu 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -ms-animation: mininavShowMenu 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -o-animation: mininavShowMenu 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
    animation: mininavShowMenu 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

#mininav.fixed {
    position: fixed;
    top: 0;
    right: 0;
}

#mininav.fixed .bar {
    position: absolute;
    right: 0;
    top: 0;
    float: left;
    width: 64px;
    opacity: .7;
}

#mininav.fixed.open .bar {
    position: relative;
    width: 100%;
    opacity: 1;
}


/*!
 * ======================
 * Product Commons
 * ======================
 */
 /*!
 * ----------------------
 * Commons/ Text & color
 * ----------------------
 */

.m-wrap {
    font-weight: 300;
}

.m-wrap .section-title-x {
    display: block;
    line-height: 1.05;
    font-size: 2.75em;
    font-weight: 400;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    color: #02b1e4;
}

.m-wrap .section-title-x.on-dark {
    color: #02b1e4;
}

.m-wrap .section-title-b {
    display: block;
    line-height: 1.1;
    font-size: 1.875em;
    font-weight: 400;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    color: #02b1e4;
}

.m-wrap .section-title-b.on-dark {
    color: #02b1e4;
}

.m-wrap .section-title-x+.section-title-b {
    margin-top: 0.33333em;
}

.m-wrap .section-title-s {
    display: block;
    line-height: 1.1;
    font-size: 1.375em;
    font-weight: 400;
    font-family: "Roboto";
    color: #adadad;
}

.m-wrap .section-title-x+.section-title-s {
    margin-top: 0.90909em;
}
.m-wrap .text-center{
    text-align: center;
}
.m-wrap .section-descr {
    font-size: 1.0625em;
    font-weight: 300;
}

.m-wrap .section-descr.on-dark {
    color: #fff;
}

.m-wrap .section-title-x+.section-descr,.m-wrap .section-title-b+.section-descr,.m-wrap .section-title-s+.section-descr {
    margin-top: 1.47059em;
}

.m-wrap p.on-dark,.m-wrap span.on-dark {
    color: #fff;
}

.m-wrap li strong {
    display: block;
    font-weight: 700;
}

.m-wrap li span {
    display: block;
}

@media (max-width: 60em) {
    .m-wrap {
        font-size: 20px;
    }

    .m-wrap .section-title-x {
        font-size: 1.8em;
    }

    .m-wrap .section-title-b {
        font-size: 1.2em;
    };
}
/*!
 * ----------------------
 * Commons/ Button, Bullet & Icon
 * ----------------------
 */
 /*!
 * ----------------------
 * Commons/ Layout
 * ----------------------
 */

.m-wrap .m-nav .m-logo {
    display: none;
}

.m-wrap .divider.cyan {
    background: #02b1e4;
}
.m-wrap .divider.light {
    background: #17375e;
}

.m-wrap .divider.cyan .section-title-x {
    color: #fff;
}

.m-wrap .divider.wood {
    background: #cbb68f url("../../img/ui/divider-bg-wood.png") repeat-x 50% 0;
}

.m-wrap .divider.wood .section-title-x {
    color: black;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    text-shadow: 0 1px #3c5861;
}

@media (max-width: 48em) {
    .m-wrap .divider .section-title-x {
        padding-top: 15px;
        padding-top: 15px;
        font-size: 30px;
    };
}

.m-wrap .picnav-item .title {
    color: #fff;
}

.m-wrap .picnav-item a:hover .title {
    color: #02b1e4;
}

@media (max-width: 48em) {
    html #main-zone .m-wrap .section-text {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    html #main-zone .m-wrap .section-display {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        position: relative;
        width: 96%;
        left: auto;
        top: auto;
        bottom: auto;
        right: auto;
    }

    html #main-zone .m-wrap .section-display .base {
        margin-bottom: 1em;
    }

    html #main-zone .m-wrap .section-display .base img,html #main-zone .m-wrap .section-display .screenshot img {
        width: 100%;
        height: auto;
    }

    .m-wrap .section-inner {
        padding-top: 2.5em;
        padding-bottom: 2.5em;
    };
}

@media (max-width: 48em) {
    html #main-zone .m-wrap .line[class^=p] {
        position: relative;
        float: none;
        left: auto !important;
        top: auto !important;
        bottom: auto !important;
        right: auto !important;
        text-align: left;
        padding: 0 !important;
        margin: 0 0 1em 0 !important;
        width: auto !important;
    }

    html #main-zone .m-wrap .line[class^=p] .text {
        position: relative;
        float: none;
        left: auto !important;
        top: auto !important;
        bottom: auto !important;
        right: auto !important;
        text-align: left !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 0 0 32px !important;
        font-size: 1.0625em;
    }

    html #main-zone .m-wrap .line[class^=p] .text span,html #main-zone .m-wrap .line[class^=p] .text strong {
        width: auto !important;
    }

    html #main-zone .m-wrap .line[class^=p] .text .id {
        position: absolute;
        left: 0;
        top: 2px;
        float: left;
        display: block;
    }

    html #main-zone .m-wrap .line[class^=p] .point {
        display: none;
    };
}

.m-wrap .tabing-menu.in-pic {
    background: #313131;
    position: relative;
    width: 400%;
    left: -150%;
}

.m-wrap .tabing-menu.in-pic ul {
    width: 984px;
    margin: 0 auto;
    padding-top: 14px;
    padding-bottom: 14px;
    height: 186px;
    font-size: 0;
    text-align: center;
}

.m-wrap .tabing-menu.in-pic ul>li {
    font-size: 16px;
}

.m-wrap .tabing-menu.in-pic ul>li {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: top;
    white-space: normal;
}

.m-wrap .tabing-menu.in-pic li {
    position: relative;
    width: 20%;
    height: 186px;
}

.m-wrap .tabing-menu.in-pic li a {
    position: relative;
    display: block;
    width: 179px;
    height: 186px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    text-decoration: none;
    text-align: center;
}

.m-wrap .tabing-menu.in-pic li .title {
    position: absolute;
    left: 0;
    top: 0;
    float: left;
    z-index: 2;
    width: 167px;
    height: 112px;
    padding: 74px 6px 0;
    background: url("../../img/ui/00000080.png");
    background: rgba(0,0,0,0.7);
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    font-weight: 400;
    font-size: 1.375em;
    line-height: 1.2;
    color: #02b1e4;
    -webkit-transition: opacity 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-transition: opacity 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    -o-transition: opacity 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: opacity 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.m-wrap .tabing-menu.in-pic li:nth-child(3) .title { /* this one has 3 lines! */
    padding-top: 64px;
    height: 122px;

}

.m-wrap .tabing-menu.in-pic li .pic {
    position: relative;
    z-index: 1;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-transition: -moz-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    -o-transition: -o-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.m-wrap .tabing-menu.in-pic li .pic img {
    display: block;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
}

.m-wrap .tabing-menu.in-pic li.on a .title,.m-wrap .tabing-menu.in-pic li a:hover .title {
    opacity: 0;
}

.no-opacity .m-wrap .tabing-menu.in-pic li.on a .title,.no-opacity .m-wrap .tabing-menu.in-pic li a:hover .title {
    display: none;
}

.m-wrap .tabing-menu.in-pic li a:hover .pic {
    -webkit-transform: scale(1.2, 1.2);
    -moz-transform: scale(1.2, 1.2);
    -ms-transform: scale(1.2, 1.2);
    -o-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2);
}

.m-wrap .tabing-menu.in-pic li.on:after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -14.5px;
    float: left;
    width: 21px;
    height: 13px;
    margin-left: -10px;
    background: url("../../img/ui/tabing2-active-arrow.png");
    overflow: hidden;
}

@media (max-width: 62.5em) {
    .m-wrap .tabing-menu.in-pic {
        width: 100%;
        left: 0;
    }

    .m-wrap .tabing-menu.in-pic ul {
        width: 100%;
        height: auto;
        overflow: hidden;
    }

    .m-wrap .tabing-menu.in-pic li {
        float: left;
        display: block;
    }

    .m-wrap .tabing-menu.in-pic li a {
        width: 100%;
        height: auto;
    }

    .m-wrap .tabing-menu.in-pic li .title {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .m-wrap .tabing-menu.in-pic li:nth-child(3) .title { /* this one has 3 lines! */
    height: 40px;
    padding: 10px 0 0 0;
    }
}

@media (max-width: 48em) {
    .m-wrap .tabing-menu.in-pic li {
        width: 100%;
        height: auto;
        display: block;
        float: none;
        margin-bottom: .2em;
    }

    .m-wrap .tabing-menu.in-pic li a {
        display: inline;
        height: auto;
    }

    .m-wrap .tabing-menu.in-pic li .title {
        display: inline;
        position: static;
        width: 100%;
        height: auto;
        padding: .5em 0;
    }

    .m-wrap .tabing-menu.in-pic li .pic {
        display: none;
    }

    .m-wrap .tabing-menu.in-pic li.on a .title,.m-wrap .tabing-menu.in-pic li a:hover .title {
        background: #02b1e4;
        opacity: 1;
        color: black;
    };
}

@media (max-width: 48em) {
    .m-wrap .tabing .tabing-page .tabing-page-cont {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    .m-wrap .tabing .tabing-page .tabing-page-descr {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    };
}

















/*! 
 * ======================    
 * Product Template
 * ======================  
 */
 #protection .detail .section-text .icon,#pcdiy-step4 .steps .n1,#pcdiy-step4 .steps .n2,#validation-hours .section-display .heading,#validation-hours .section-display .list,#pcdiy-step1 .heading,#turbo-lan .supports li,#wifi-go .controls .section-display,#proven-quality-top .columns .col,#compatible-devices .detail .section-text,#compatible-others .section-text,#pcdiy-step4 .steps .n3,#memory .section-text,#speed .col3 .section-display,#pcdiy .steps li .pic,#asus-5-way .section-descr,#uefi-bios .mode,#speed .col1,#speed .col2,#crystal-sound2 .section-text,#crystal-sound2 .section-display,#doublewin .section-text,#turbo-lan .network .chart,#turbo-lan .network .row,#nfc .section-text,#nfc .section-display,#protection .detail .section-text .descr,#compatible-devices .qvl .section-text,#compatible-devices .qvl .section-display,#pcdiy .steps li .descr,#speed .col3 .section-text,#homecloud .section-text,#homecloud .section-display,#wifi-go .controls .section-text,#compatible-others .section-display,#media-streamer .section-display,#validation-hours .section-display .pics,#pcdiy-step1 .detail {
    display: inline;
    float: left;
    position: relative;
    margin-left: 1%;
    margin-right: 1%;
}












#pcdiy-step4 .steps .n1 {
    margin-left: 0;
}

#asus-5-way .section-descr,#pcdiy-step4 .steps .n3 {
    margin-right: 0;
}

#protection .detail .section-text .icon,#pcdiy-step4 .steps .n1,#pcdiy-step4 .steps .n2 {
    width: 14.667%;
}

#validation-hours .section-display .heading,#validation-hours .section-display .list,#pcdiy-step1 .heading {
    width: 23.0%;
}

#turbo-lan .supports li,#wifi-go .controls .section-display,#proven-quality-top .columns .col,#compatible-devices .detail .section-text,#compatible-others .section-text,#pcdiy-step4 .steps .n3 {
    width: 31.333%;
}

#memory .section-text,#speed .col3 .section-display,#pcdiy .steps li .pic {
    width: 39.667%;
}

#asus-5-way .section-descr,#uefi-bios .mode,#speed .col1,#speed .col2,#crystal-sound2 .section-text,#crystal-sound2 .section-display,#doublewin .section-text,#turbo-lan .network .chart,#turbo-lan .network .row,#nfc .section-text,#nfc .section-display,#protection .detail .section-text .descr,#compatible-devices .qvl .section-text,#compatible-devices .qvl .section-display,#pcdiy .steps li .descr {
    width: 48.0%;
}

#speed .col3 .section-text,#homecloud .section-text,#homecloud .section-display {
    width: 56.333%;
}

#wifi-go .controls .section-text,#compatible-others .section-display {
    width: 64.667%;
}

#media-streamer .section-display,#validation-hours .section-display .pics,#pcdiy-step1 .detail {
    width: 73.0%;
}

#media-streamer .section-display {
    padding-left: 8.333%;
}

#asus-5-way .section-descr {
    z-index: 2;
}

#pcdiy-step4 .steps .n1,#pcdiy-step4 .steps .n2 {
    padding-right: 8.333%;
}

#homecloud .section-text,#homecloud .section-display {
    padding-right: 41.667%;
}

html,body {
    overflow-x: hidden;
}

#z97-wrap {
    position: relative !important;
    margin: 0 auto;
    background: #fff;
}

#z97-content {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-left: auto !important;
    margin-right: auto !important;
    -webkit-animation: fadein 0.4s ease;
    -moz-animation: fadein 0.4s ease;
    -ms-animation: fadein 0.4s ease;
    -o-animation: fadein 0.4s ease;
    animation: fadein 0.4s ease;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
}

#z97-content:after {
    content: " ";
    visibility: hidden;
    display: block;
    font-size: 0;
    clear: both;
    height: 0;
}

* html #z97-content {
    zoom: 1;
}

*:first-child+html #z97-content {
    zoom: 1;
}
















/*! 
 * ======================
 * Section
 * ======================
 */


 #z97-top {
    background: black;
}

#z97-top .picnav-item {
    width: 25%;
}

@media (max-width: 48em) {
    #z97-top .picnav-item .title {
        font-size: 1.875em;
    };
}


/* z97-overview */

#z97-overview {
    background: url("../../img/hp/overview/overview-bg.png") 50% 0;
}

#z97-overview .section-inner {
    background: url("../../img/hp/overview/overview-grid.png") 50% 0 no-repeat;
}
#z97-overview .section-display {
}

#z97-overview .mb {
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

#z97-overview .mb .base {
    margin: 0 auto;
}
#z97-overview .mb .base-mobile {
    margin: 0 auto;
    display: none;
    text-align: center;
    width: 100%;
}
#z97-overview .mb .base-mobile img{
    width: 100%;
}
/*
#z97-overview .mb .p1 {
    left: -58px;
    top: 45px;
}

#z97-overview .mb .p2 {
    left: -57px;
    top: 87px;
}

#z97-overview .mb .p3 {
    left: -42px;
    top: 163px;
}

#z97-overview .mb .p4 {
    left: -39px;
    top: 358px;
}

#z97-overview .mb .p5 {
    left: -25px;
    top: 402px;
}

#z97-overview .mb .p6 {
    left: -33px;
    top: 586px;
}

#z97-overview .mb .p7 {
    left: -13px;
    top: 478px;
}

#z97-overview .mb .p8 {
    left: -30px;
    top: 648px;
}

#z97-overview .mb .p9 {
    left: 207px;
    top: 30px;
}

#z97-overview .mb .p10 {
    left: 360px;
    top: 81px;
}

#z97-overview .mb .p11 {
    left: 285px;
    top: 259px;
}

#z97-overview .mb .p12 {
    left: 418px;
    top: 327px;
}

#z97-overview .mb .p13 {
    left: 467px;
    top: 382px;
}

#z97-overview .mb .p14 {
    left: 484px;
    top: 596px;
}

#z97-overview .mb .p15 {
    left: 436px;
    top: 630px;
}

#z97-overview .mb .p16 {
    left: 210px;
    top: 744px;
}
*/
#z97-overview .mb .line .text {
    width: 160px;
    color: #02b1e4;
}

#z97-overview .mb .p1 .text,#z97-overview .mb .p2 .text,#z97-overview .mb .p3 .text,#z97-overview .mb .p4 .text,#z97-overview .mb .p5 .text,#z97-overview .mb .p6 .text,#z97-overview .mb .p7 .text {
    text-align: right;
}



@media (max-width: 48em) {
    #z97-overview .section-descr {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    #z97-overview .section-display .closeup {
        position: static;
        margin-left: -20%;
    }

    #z97-overview .mb {
        width: 97%;
    }

    #z97-overview .mb .line {
        width: 49.2%;
        display: inline-block !important;
    }
    #z97-overview .mb .base-mobile {
        display: block;
    }
    #z97-overview .mb .base {
        display: none;
    }
}




#workstation-exclusive{
    background: #000;
    padding-bottom: 100px;
}
#workstation-exclusive .workstation-full{
    background: url("../../img/hp/workstation/workstation-board.jpg") 40% top no-repeat;
    position: relative;
}
@media (max-width: 1100px) {
    #workstation-exclusive .workstation-full{ background-position: 70% top;}
}

#workstation-exclusive .workstation-full:after{
    display: block;
    clear: both;
    content: '';
}
#workstation-exclusive .workstation-full .section-text{
    width: 520px;
    float: right;
    min-height: 600px;
}
#workstation-exclusive .workstation-full .section-title-s{
    color: #02b1e4;
}


#workstation-exclusive .workstation-full .chart-title{
    color: #02b1e4;
    width: 400px;
    font-size: 1.8em;
    text-decoration: underline;
    font-family: "Cuprum","Oswald","Arial Narrow",Impact,"Roboto";
    margin-bottom: 0;
}
#workstation-exclusive .workstation-full .chart-icon{
    margin-top: 20px;
}
#workstation-exclusive .workstation-full .chart-name{
    color: #fff;
    width: 400px;
    text-align: center;
    font-size: 1.2em;
    font-family: "Cuprum","Oswald","Arial Narrow",Impact,"Roboto";
}
#workstation-exclusive .workstation-full .chart-name span{
    text-decoration: underline;
}
#workstation-exclusive .workstation-full .chart-info{
    color: #777;
    font-size: 0.8em;
}

#workstation-exclusive .workstation-full img{
    vertical-align: top;
}

#system-aspects-1 {
    background: #000;
}

#tab-a3 .tabing-page-descr, #tab-a4 .tabing-page-descr {
    width: 80%;
    float: none;
    margin-top: 50px;
    margin-left: 10%;
}


#workstation-exclusive .section-rows{
    width: 47%;
    float: left;
}
#workstation-exclusive .section-rows:first-child{
    margin-right: 6%;
}
#workstation-exclusive .section-rows .section-title-s{
    color: #14cbff;
}
#workstation-exclusive .section-rows img{
    max-width: 100%;
}

#workstation-exclusive .section-single .section-title-s{
    color: #14cbff;
}
#workstation-exclusive .section-single .section-descr{
    margin-right: 2%;
}
#workstation-exclusive .section-single img{
    max-width: 50% !important;
    float: left;
}


@media (max-width: 60em) {
    #workstation-exclusive .workstation-full{
        background-position: 75% top;
    }
    #workstation-exclusive .workstation-full .section-text{
        padding-right: 10px;
    }
}
@media (max-width: 48em) {
    #workstation-exclusive .workstation-full{
        background: none;
    }
    #workstation-exclusive .section-rows{
        width: 90%;
        float: none;
        margin: 0 auto;
    }
    #workstation-exclusive .section-single img{
        max-width: 96% !important;
        float: none;
    }
}











#high-performance{
    background: #000;
}
#high-performance .divider{
    margin-bottom: 40px;
}


#high-performance .section-image-set-1a{
    padding-bottom: 50px;
    text-align: center;
}
#high-performance .section-image-set-1a img:first-child{
    width: 80%;
}
#high-performance .section-image-set-1a img:nth-child(3){
    margin-bottom: 40px;
}
#high-performance .section-image-set-1a img:nth-child(5){
    margin-bottom: 40px;
}
#high-performance .section-image-set-1a p{
    color: #fff;
    text-align: center;
}
#high-performance .section-image-set-1a p:last-child{
    color: #999;
    text-align: left;
    width: 70%;
    margin: 0 auto;
    font-size: 0.8em;
}
#high-performance .section-image-set-1a .ps{
    text-align: left;
    color: #fff;
    margin-right: 20%;
    margin-left: 10%;
}

/*
#high-performance .section-image-set-1a .go-video-1{
    width: 33%;
    margin-right: 2%;
    display: block;
    float: right;
    margin-top: 5%;
    background: #aaa;
    text-align: center;
    border: 1px solid #333;
    background: #333 url("../../img/hp/overview/go-video-1.jpg") center center no-repeat;
    background-size: cover;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}
#high-performance .section-image-set-1a .go-video-1:hover{
    border-color: #02b1e4;
}
#high-performance .section-image-set-1a .go-video-1 img{
    width: 54px;
    height: 54px;
    padding: 20% 0;
}
*/



#high-performance .section-image-set-3{
    text-align: center;
}
#high-performance .section-image-set-3 img:first-child{
    width: 100%;
    margin-bottom: -150px;
}
#high-performance .section-image-set-3 p{
    color: #fff;
}




#high-performance .section-image-set-2{
    background: url("../../img/hp/overview/overview-4.JPG") right 0 no-repeat;
    background-size: 75%;
    padding-top: 100px;
}
#high-performance .section-image-set-2 img{
    width: 40%;
    border: 3px solid #02b1e4;
    padding: 5px 20px;
}



#high-performance .section-image-set-add{
    margin-bottom: 40px;
}
#high-performance .section-image-set-add:after{
    clear: both;
    content: '';
    display: block;
}
#high-performance .section-image-set-add-1{
    width: 40%;
    margin-right: 10%;
    float: left;
}
#high-performance .section-image-set-add-2{
    width: 40%;
    float: left;
}
#high-performance .section-image-set-add p{
    color: #fff;
    margin-left: 20px;
    font-size: 14px;
    padding-left: 25px;
    background: url("../../img/ui/tri.png") no-repeat;
}









@media (max-width: 48em) {
    #high-performance .section-image-set-1a img:first-child{
        width: 100%;
    }
    #high-performance .section-image-set-1a .go-video-1{
        width: 95%;
        margin-bottom: 30px;
    }
    #high-performance .section-image-set-1a .go-video-1 img{
        width: 54px;
        height: 54px;
    }
    #high-performance .section-image-set-1b img:first-child{
        width: 100%;
    }
    #high-performance .section-image-set-1b img:last-child{
        width: 95%;
    }
    #high-performance .section-image-set-2{
        background: none;
        padding-top: 0px;
    }
    #high-performance .section-image-set-2 img{
        width: 90%;
    }

    #high-performance .section-image-set-1a p:last-child{
        width: 95%;
    }

    #high-performance .section-image-set-3 img:first-child{
        margin-bottom: -50px;
    }
}



/*------ video ------*/
.pop-video{
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: rgba(0,0,0,0.9);
    position: fixed;
    left: 0;
    top: 0;
    display: none;
}
.pop-video iframe{
    width: 70%;
    height: 70%;
    margin: 7% 15%;
}
.pop-video .close-video{
    width: 50px;
    height: 50px;
    display: block;
    position: absolute;
    left: 5%;
    top: 8%;
    background: url("../../img/ui/x.png");
    filter : alpha(opacity=40);
    opacity : 0.4;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.pop-video .close-video:hover{
    filter : alpha(opacity=60);
    opacity : 0.6;
}























/* 5 way */

#asus-5-way {
    background: #000;
}
#asus-5-way .section-inner {
    z-index: 2;
}

#asus-5-way .section-text:before,#asus-5-way .section-text:after {
    content: "";
    display: table;
}

#asus-5-way .section-text:after {
    clear: both;
}

#asus-5-way .section-text {
}

#asus-5-way .section-title-x {
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#asus-5-way .section-title-s {
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    color: #fff;
}

#asus-5-way .section-display {
    position: absolute;
    top: 150px;
    right: 0;
    float: right;
    width: 100%;
    background: #000;
}
#asus-5-way .section-display:after {
    content: '';
    display: block;
    clear: both;
}

#asus-5-way .section-display img {
    width: 70%;
    height: 70%;
    max-width: 1230px; /* not working ??? */
    max-height: 1000px;
    float: right;
}


#asus-5-way .testing {
    overflow: hidden;
    margin-top: 1.875em;
}

#asus-5-way .testing>div {
    float: left;
    width: 33.33%;
    text-align: center;
}

#asus-5-way .testing>div strong {
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    font-size: 1.25em;
    color: #02b1e4;
}
#asus-5-way small.ps {
    margin-left: 17px;
    margin-right: 20px;
}





@media (max-width: 48em) {
    #asus-5-way .section-descr {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

    #asus-5-way .section-display img {
        width: 100%;
        height: 100%;
        float: none;
    }
    #asus-5-way .section-display .closeup {
        position: static;
        width: 100%;
    }

    #asus-5-way .section-display .closeup img {
        width: 100%;
        height: auto;
    };
}

#system-aspects-2 {
    background: #0a0a0a;
}

.system-aspects .section-inner {
    padding-top: 0.625em;
}

.system-aspects .tabing-cont .screenshot img {
    display: block;
    width: 100%;
    height: auto;
}
#system-aspects-2 .tabing-cont .screenshot{
    margin-top: 30px;
}

.system-aspects .tabing-cont .caption {
    margin-bottom: .2em;
    font-weight: 700;
    color: #02b1e4;
}

.system-aspects .tabing-page {
    padding-top: 3.75em;
}

.system-aspects .tabing-page .title {
    position: absolute;
    left: 25px;
    top: 0.625em;
    float: left;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    font-size: 1.375em;
    font-weight: 400;
    color: #02b1e4;
    padding: .3em .5em;
    line-height: 1;
}




#zone {
    background: #0a0a0a;
}

#zone .section-inner {
    padding-top: 0.625em;
}

#zone ul{
    padding-top: 30px;
}
#zone ul:after{
    content: '';
    display: block;
    clear: both;
}
#zone li{
    width: 30%;
    float: left;
    margin-right: 1.5%;
    margin-left: 1.5%;
}
#zone ul h3{
    background: #02b1e4;
    text-align: center;
    color: #fff;
    padding: 10px 0;
    margin: 0;
    font-weight: normal;
    font-size: 1.2em;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
}
#zone ul h4{
    color: #02b1e4;
    padding: 10px 0;
    margin: 0;
    font-size: 1.4em;
    font-weight: normal;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
}
#zone ul p{
    color: #fff;
}
#zone ul .notice{
    font-size: 0.7em;
    padding-top: 10px;
}
#zone ul img{
    width: 100%;
}

@media (max-width: 48em) {
    #zone li{
        width: 100%;
        float: none;
        margin-right: 0;
        margin-left: 0;
    }
}





#uefi-bios {
    background: #fff;
}

#uefi-bios .section-inner {
    z-index: 2;
}

#uefi-bios .brief .section-text {
    width: 636px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#uefi-bios .brief .screenshot {
    position: relative;
    margin: 8.125em auto 9.375em;
}

#uefi-bios .brief .screenshot .line .text strong {
    color: #02b1e4;
}

#uefi-bios .brief .screenshot .p1 {
    left: 10px;
    top: -33px;
}

#uefi-bios .brief .screenshot .p2 {
    left: 310px;
    top: -39px;
}

#uefi-bios .brief .screenshot .p3 {
    left: 132px;
    top: 221px;
}

#uefi-bios .brief .screenshot .p4 {
    left: 472px;
    top: 306px;
}

#uefi-bios .brief .screenshot .p5 {
    left: 789px;
    top: 281px;
}

#uefi-bios .brief .screenshot .p1 .text {
    width: 255px;
}

#uefi-bios .brief .screenshot .p2 .text {
    width: 475px;
}

#uefi-bios .brief .screenshot .p3 .text {
    width: 305px;
}

#uefi-bios .brief .screenshot .p4 .text {
    width: 292px;
}

#uefi-bios .brief .screenshot .p5 .text {
    width: 222px;
}

#uefi-bios .modes:before,#uefi-bios .modes:after {
    content: "";
    display: table;
}

#uefi-bios .modes:after {
    clear: both;
}

#uefi-bios .modes {
    zoom: 1;
}

#uefi-bios .mode:before,#uefi-bios .mode:after {
    content: "";
    display: table;
}

#uefi-bios .mode:after {
    clear: both;
}

#uefi-bios .mode {
    zoom: 1;
}

#uefi-bios .mode .title {
    float: left;
    margin-bottom: 1em;
    padding-left: 0.20833em;
    padding-right: 0.20833em;
    line-height: 30px;
    border: 2px solid #02b1e4;
    font-size: 1.5em;
    font-family: "Roboto";
    font-weight: 400;
    color: #02b1e4;
}

#uefi-bios .mode ul {
    clear: both;
}

#uefi-bios .mode ul li {
    margin-bottom: .3em;
}

#uefi-bios .mode ul strong {
    color: #02b1e4;
}

#uefi-bios .gaming-bg {
    position: absolute;
    left: 50%;
    bottom: 100px;
    float: left;
    z-index: 1;
    width: 1139px;
    margin-left: -569.5px;
}

#uefi-bios .gaming-bg img {
    width: 100%;
    height: auto;
}

@media (max-width: 48em) {
    #uefi-bios .brief .screenshot {
        margin-top: 1em;
        margin-bottom: 1em;
    };
}

@media (max-width: 30em) {
    #uefi-bios .mode {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    #uefi-bios .ez {
        margin-bottom: 2em;
    };
}

#memory {
    height: 31.5em;
}

#memory .section-text {
    position: relative;
    z-index: 3;
}

#memory .section-display {
    position: absolute;
    right: -430px;
    top: 0;
    float: left;
}

@media (max-width: 48em) {
    #memory {
        height: auto;
    }

    #memory .section-inner {
        padding-bottom: 0 !important;
    }

    #memory .section-display .mb img {
        width: 100%;
        height: auto;
    };
}

#speed {
    background: #fff;
}

#speed .section-inner {
    padding-top: 5.5em !important;
}

#speed .belttitle {
    position: absolute;
    left: 50%;
    top: 0;
    float: left;
    width: 300%;
    height: 2em;
    margin-left: -150%;
    background: #02b1e4;
    color: #fff;
    text-align: center;
    line-height: 2em;
}
#speed .part-1 .section-text {
    width: 55%;
    margin-left: 15%;
}
#speed .part-2 .section-text {
    width: 50%;
    margin-left: 40%;
    margin-top: 100px;
    z-index: 2;
}
#speed .part-2 .section-display {
    margin-top: -150px;
    z-index: 1;
}








@media (max-width: 48em) {
    #speed .belttitle {
        width: 100%;
        position: static;
        float: none;
        margin-left: 0;
    }

.m-wrap #speed .section-inner {
        width: 100%;
}

    #speed .part-1 .section-display{
        width: 100%;
    }
    #speed .part-1 .section-display .img{
        max-width: 100%;
    }
    #speed .part-2 .section-display .img{
        max-width: 100%;
    }
    #speed .part-2 .section-display {
        margin-top: 0;
    }
    #speed .section-inner {
        padding-top: 0 !important;
    }


}







/* add USB 3.1 */

#special-sectionOverview #speed .USB-sec-1{
    margin-top: 80px;
}
#special-sectionOverview #speed .USB-sec-1:after{
    content: '';
    clear: both;
    display: block;
}
#special-sectionOverview #speed .USB-sec-1 p{
    width: 48%;
    float: left;
}
#special-sectionOverview #speed .USB-sec-1 img{
    float: left;
}

#special-sectionOverview #speed .USB-sec-2:after{
    content: '';
    clear: both;
    display: block;
}
#special-sectionOverview #speed .USB-sec-2a{
    width: 60%;
    margin-right: 5%;
    float: left;
    margin-top: -70px;
}
#special-sectionOverview #speed .USB-sec-2a img{
    max-width: 100%;
}
#special-sectionOverview #speed .USB-sec-2a p{
    font-size: 1em;
}



#special-sectionOverview #speed .USB-action{
    width: 220px;
    height: 53px;
    padding-left: 150px;
    padding-top: 47px;
    margin-top: -150px;
    margin-right: 80px;
    float: right;
    background: url(../../img/hp/performance/sec-2c.png) 0 0 no-repeat;
}
#special-sectionOverview #speed .USB-action a{
    width: 220px;
    height: 48px;
    display: block;
    text-indent: -9999px;
    background: url(../../img/hp/performance/sec-2d.png) 0 0 no-repeat;
}
#special-sectionOverview #speed .USB-action a:hover{
    background-position: left -48px;
}

@media (max-width: 1050px) {
#special-sectionOverview #speed .USB-sec-1{
    margin-left: 2%;
}
#special-sectionOverview #speed .USB-sec-1 p{
    width: 98%;
    float: none;
}
#special-sectionOverview #speed .USB-sec-1 img{
    float: none;
}
#special-sectionOverview #speed .USB-sec-2a{
    width: 95%;
    float: none;
    margin-top: 0px;
}
#special-sectionOverview #speed .USB-action{
    margin-top: 20px;
    margin-right: 0px;
    float: none;
}
}











#gaming-scenario {
    position: relative;
    margin-top: 100px; /* fix the nav positioning */
    background: url("../../img/ui/bg-rubber2.jpg");
}

#gaming-scenario .divider {
    position: relative;
    z-index: 3;
}

#gaming-scenario .section {
    z-index: 2;
}

#gaming-scenario .section.first {
    background: url("../../img/ui/bg-black-gradient-top.png") repeat-x 50% 0;
}

#gaming-scenario .section.last {
    background: url("../../img/ui/bg-black-gradient-btm.png") repeat-x 0% 100%;
}

#gaming-scenario:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    float: left;
    z-index: 1;
    width: 134px;
    margin-left: -654px;
    height: 100%;
    background: url("../../img/ui/circuit.png") no-repeat 50% 50%;
    overflow: hidden;
}

#turbo-app .section-inner {
    padding-bottom: 0.625em;
}

#turbo-app .section-text {
    width: 97.96748%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#turbo-app .section-title-s {
    width: 65.9751%;
    margin-left: auto;
    margin-right: auto;
}

#turbo-app .section-display {
    clear: both;
    position: relative;
    margin-left: 157px;
}

#turbo-app .section-display .line .text strong {
    font-weight: 400;
    white-space: nowrap;
}

#turbo-app .section-display .p1 {
    left: 90px;
    top: 244px;
}

#turbo-app .section-display .p2 {
    left: 69px;
    top: 184px;
}

#turbo-app .section-display .p3 {
    left: 25px;
    top: 467px;
}
#turbo-app .section-display .p4 {
    left: 30px;
    top: 240px;
}

#turbo-app .section-display .p1 .text {
    width: 220px;
    margin-top: -3.5em;
}

#turbo-app .section-display .p1 .text span {
    width: 234px;
}

#turbo-app .section-display .p2 .text {
    width: 202px;
}

#turbo-app .section-display .p2 .text span {
    width: 234px;
}

#turbo-app .section-display .p3 .text {
    width: 160px;
}

#turbo-app .section-display .p3 .text span {
    width: 288px;
}
#turbo-app .section-display .p4 .text {
    width: 165px;
}

#turbo-app .section-display .p4 .text span {
    width: 288px;
}
    #turbo-app .mb .base img {
        max-width: 130% !important;
    };

@media (max-width: 48em) {
    #turbo-app .mb .base img {
        width: 130% !important;
    };
}











#crystal-sound2 .section-inner {
    padding-top: 200px;
    padding-bottom: 0.625em;
}

#crystal-sound2 .section-inner:before,#crystal-sound2 .section-inner:after {
    content: "";
    display: table;
}

#crystal-sound2 .section-inner:after {
    clear: both;
}

#crystal-sound2 .section-inner {
    zoom: 1;
}


#crystal-sound2 .section-text {
    position: relative;
    width: 96%;
}

#crystal-sound2 .section-title-x {
    width: 117.37288%;
}

#crystal-sound2 .section-display {
    position: relative;
    width: 96%;
    margin-top: 1em;
    margin-bottom: 2em;
}
#crystal-sound2 .section-display .mobile{
    display: none;
}

#crystal-sound2 .mb .line .text {
    font-size: 1.0625em;
}

#crystal-sound2 .mb .line .text strong {
    font-weight: 400;
    color: #02b1e4;
}

#crystal-sound2 .mb .line .text span {
    width: 600px;
}

#crystal-sound2 .mb .p1 {
    left: -285px;
    top: 260px;
}

#crystal-sound2 .mb .p2 {
    left: -285px;
    top: 289px;
}

#crystal-sound2 .mb .p3 {
    left: -342px;
    top: 378px;
}

#crystal-sound2 .mb .p4 {
    left: -238px;
    top: 447px;
}

#crystal-sound2 .mb .p5 {
    left: -40px;
    top: 473px;
}

#crystal-sound2 .mb .p6 {
    left: 436px;
    top: 358px;
}

#crystal-sound2 .mb .p1 .text {
    width: 147px;
}

#crystal-sound2 .mb .p2 .text {
    width: 137px;
}

#crystal-sound2 .mb .p3 .text {
    width: 89px;
}

#crystal-sound2 .mb .p4 .text {
    width: 194px;
}

#crystal-sound2 .mb .p5 .text {
    width: 387px;
}

#crystal-sound2 .mb .p6 .text {
    width: 270px;
    margin-left: -135px;
}

#crystal-sound2 .mb .p6 .text span {
    width: 100%;
}
#crystal-sound2 .line {
    display: none;
}

@media (max-width: 900px) {
    #crystal-sound2 .section-display .normal{
        display: none;
    }
    #crystal-sound2 .section-display .mobile{
        display: block;
    }
    #crystal-sound2 .line {
        display: block;
    }
}




#doublewin .section-inner:before,#doublewin .section-inner:after {
    content: "";
    display: table;
}

#doublewin .section-inner:after {
    clear: both;
}

#doublewin .section-inner {
    zoom: 1;
}

#doublewin .section-display {
    position: absolute;
    left: 47.96748%;
    top: 0;
    float: left;
}

@media (max-width: 48em) {
    #doublewin .section-inner {
        padding-bottom: 0 !important;
    }

    #doublewin .mb {
        width: 150%;
    }

    #doublewin .mb img {
        width: 100%;
        height: auto;
    };
}

#turbo-lan .section-inner {
    padding-top: 10em;
}

#turbo-lan .brief .section-text {
    width: 964px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#turbo-lan .brief .section-display {
    position: relative;
    width: 581px;
    margin: 3.75em auto 4.625em;
}

#turbo-lan .brief .section-display .chart {
    position: absolute;
    right: -190px;
    top: -1.25em;
    float: left;
}

#turbo-lan .brief .screenshot .p1 {
    left: -10px;
    top: 64px;
}

#turbo-lan .brief .screenshot .p2 {
    left: -56px;
    top: 142px;
}

#turbo-lan .brief .screenshot .p3 {
    left: -28px;
    top: 335px;
}

#turbo-lan .brief .screenshot .p1 .text {
    width: 180px;
}

#turbo-lan .brief .screenshot .p2 .text {
    width: 138px;
}

#turbo-lan .brief .screenshot .p3 .text {
    width: 162px;
}

#turbo-lan .network:before,#turbo-lan .network:after {
    content: "";
    display: table;
}

#turbo-lan .network:after {
    clear: both;
}

#turbo-lan .network {
    zoom: 1;
}

#turbo-lan .network .chart {
    padding-top: 5.625em;
    position: relative;
    left: 1.875em;
}

#turbo-lan .network .row {
    margin-bottom: 3.125em;
}

#turbo-lan .network .row .title {
    color: #02b1e4;
    font-weight: 400;
}

#turbo-lan .supports ul:before,#turbo-lan .supports ul:after {
    content: "";
    display: table;
}

#turbo-lan .supports ul:after {
    clear: both;
}

#turbo-lan .supports ul {
    zoom: 1;
}

#turbo-lan .supports li .pic {
    margin-bottom: 1.25em;
}

#turbo-lan .supports li .pic img {
    vertical-align: bottom;
}

#turbo-lan .supports li strong {
    margin-bottom: .2em;
}

@media (max-width: 48em) {
    #turbo-lan .brief .section-display {
        margin-top: 0;
        margin-bottom: 0;
    }

    #turbo-lan .section-inner {
        padding-top: 2em;
    }
    #turbo-lan .network .chart {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
        left: 0;
        padding-top: 0;
        margin-bottom: 1em;
    }

    #turbo-lan .network .chart img {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        height: auto;
        max-width: 100% !important;
    }

    #turbo-lan .network .row {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
        margin-bottom: 1em;
    }

    #turbo-lan .supports {
        margin-top: 0;
    }

    #turbo-lan .supports li,#turbo-lan .supports .n1 {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

    #turbo-lan .supports li .pic,#turbo-lan .supports .n1 .pic {
        text-align: center;
    }

    #turbo-lan .supports .n1 .pic {
        min-height: 300px;
    };
}







#multi-gpu {
    background: #000;
}
#multi-gpu .bg img{
    width: 100%;
}
#multi-gpu .section-display{
    position: relative;
}
#multi-gpu ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 25%;
    position: absolute;
    right: 8%;
    top: 40%;
    z-index: 100;
}

#multi-gpu ul li{
    margin: 0 0 20px 0;
    padding: 20px;
    color: #fff;
    background: rgba(2,177,228,0.5);
    font-size: 1.6em;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    font-weight: 400;
    text-align: center;
    cursor: pointer;
}
#multi-gpu ul li:hover{
    background: rgba(2,177,228,0.7);
}
#multi-gpu ul li.active{
    background: #02b1e4;
}

#multi-gpu .item{
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
#multi-gpu .item img{
    width: 100%;
}

@media (max-width: 60em) {
    #multi-gpu ul li{
        font-size: 1em;
    }
}
@media (max-width: 48em) {
    #multi-gpu ul li{
        padding: 10px;
        margin-bottom: 10px;
        font-size: 0.8em;
    }
}








#homecloud {
    overflow: hidden;
    padding-top: 4.375em;
    padding-bottom: 2.375em;
}

#homecloud .section-inner {
    z-index: 2;
    min-height: 44.375em;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#homecloud .section-display {
    clear: both;
}

#homecloud .section-imgbg img {
    min-height: 53.125em;
}

@media (max-width: 60em) {
    #homecloud .section-inner {
        min-height: inherit;
    }

    #homecloud .section-imgbg {
        width: 100%;
        height: 100%;
        background: url("../../img/hp/homecloud/homecloud-scenario.jpg") no-repeat 50% 0;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

    #homecloud .section-imgbg img {
        display: none;
    };
}

#wifi-go .section-inner {
    padding-bottom: 0 !important;
}

#wifi-go .brief .section-text {
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#wifi-go .brief .section-descr {
    width: 79.5%;
    margin-left: auto;
    margin-right: auto;
}

#wifi-go .controls {
    margin-bottom: 1em;
}

#wifi-go .controls:before,#wifi-go .controls:after {
    content: "";
    display: table;
}

#wifi-go .controls:after {
    clear: both;
}

#wifi-go .controls {
    zoom: 1;
}

#wifi-go .controls .section-display img {
    margin-left: -2.25em;
}

#wifi-go .controls .section-text {
    font-size: 0;
}

#wifi-go .controls .section-text li {
    font-size: 16px;
}

#wifi-go .controls .section-text li {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: top;
    white-space: normal;
}

#wifi-go .controls .section-text li {
    width: 50%;
    text-align: center;
}

#wifi-go .controls .section-text li strong {
    color: #959595;
}

#wifi-go .controls .ps {
    white-space: nowrap;
}

#wifi-go .senario {
    position: relative;
    height: 446px;
}

#wifi-go .senario .section-inner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#wifi-go .senario .section-text {
    position: relative;
    z-index: 2;
}

#wifi-go .senario .section-title-b {
    position: relative;
    top: 0.63636em;
    padding-left: 1em;
    background: url("../../img/ui/icn-arrow-down-white.png") no-repeat 0 50%;
    color: #fff;
}

#wifi-go .senario .bg {
    position: absolute;
    left: 50%;
    top: 0;
    float: left;
    z-index: 1;
    width: 300%;
    height: 100%;
    overflow: hidden;
    margin-left: -150%;
    background: url("../../img/hp/homecloud/wifigo-bg.jpg") repeat-x;
}

#wifi-go .senario .bg img {
    position: absolute;
    left: 50%;
    top: 0;
    float: left;
    width: 2000px;
    height: 100%;
    margin-left: -1000px;
}

@media (max-width: 48em) {
    #wifi-go .brief .section-descr {
        width: 100%;
    }

    #wifi-go .controls .section-display .device {
        margin-bottom: 1.25em;
        text-align: center;
    }

    #wifi-go .controls .section-display .device img {
        margin-left: auto;
        margin-right: auto;
    }

    #wifi-go .senario {
        height: 240px;
        background: url("../../img/hp/homecloud/wifigo-senario.jpg") no-repeat 50% 0;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

    #wifi-go .senario .bg {
        display: none;
    };
}

@media (max-width: 48em) {
    #wifi-go .controls .section-text li {
        display: block;
        width: 100%;
    };
}

#media-streamer {
    overflow: hidden;
    padding-top: 4.375em;
    padding-bottom: 4.375em;
    background: black;
}

#media-streamer .section-inner {
    z-index: 2;
    min-height: 41.875em;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#media-streamer .section-text {
    text-align: center;
}

#media-streamer .section-descr {
    width: 64.63415%;
    margin-bottom: 1.25em;
    margin-left: auto;
    margin-right: auto;
}

#media-streamer .section-display {
    margin-left: 1.875em;
}

#media-streamer .section-imgbg img {
    min-height: 53.75em;
}

@media (max-width: 60em) {
    #media-streamer .section-inner {
        min-height: inherit;
    }

    #media-streamer .section-imgbg {
        width: 100%;
        height: 100%;
        background: url("../../img/hp/homecloud/mediastreamer-bg.jpg") no-repeat 50% 0;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

    #media-streamer .section-imgbg img {
        display: none;
    };
}

@media (max-width: 48em) {
    #media-streamer .section-descr {
        width: 100%;
    }

    #media-streamer .section-display .device img {
        width: 110%;
        height: auto;
    };
}

#nfc {
    height: 38.125em;
    overflow: hidden;
    background: #fff url("../../img/hp/homecloud/nfc-bg.png") no-repeat 50% 0;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.no-backgrouondsize #nfc {
    background-repeat: repeat-x;
}

#nfc .section-text {
    position: relative;
    z-index: 3;
    padding-top: 4.6875em;
}

#nfc .section-title-s {
    color: #585858;
}

#nfc .section-display {
    position: relative;
}

#nfc .device {
    position: absolute;
    left: 0;
    top: 20px;
    float: left;
}

#nfc .device2 {
    position: absolute;
    left: -799px;
    top: 200px;
    float: left;
}

@media (max-width: 48em) {
    #nfc {
        height: auto;
    }

    #nfc .section-text {
        padding-top: 0;
    }

    #nfc .section-display .device {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

    #nfc .section-display .device2 {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

    #nfc .section-display .device img {
        width: 100%;
        height: auto;
    };
}

#intel-supports .section-title-x {
    margin-bottom: 1.36364em;
    text-align: center;
}

#intel-supports ul {
    width: 81.30081%;
    margin: 0 auto;
}

#intel-supports li {
    position: relative;
    padding-left: 23%;
    margin-bottom: 3.125em;
}

#intel-supports li>* {
    position: relative;
    z-index: 2;
}

#intel-supports li strong {
    margin-bottom: 0.3125em;
    color: #02b1e4;
}

#intel-supports li img {
    position: absolute;
    left: 0;
    top: 0;
    float: left;
    z-index: 1;
}

@media (max-width: 60em) {
    #intel-supports li img {
        width: 20.5%;
    };
}

@media (max-width: 48em) {
    #intel-supports ul {
        width: 100%;
    }

    #intel-supports li {
        margin-bottom: 1.25em;
    };
}

@media (max-width: 48em) {
    #intel-supports li {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    #intel-supports li img {
        position: static;
        float: none;
        display: block;
        margin-left: auto;
        margin-right: auto;
        min-width: 150px;
    };
}

#proven-quality-top {
    background: black;
}

#proven-quality-top .section-inner {
    padding-top: 1.25em;
    height: 52.125em;
}

#proven-quality-top .section-text {
    position: relative;
    z-index: 2;
    text-align: center;
}

#proven-quality-top .section-text .title {
    margin-bottom: 1.81818em;
    color: #fff;
}

#proven-quality-top .columns {
    margin-bottom: 3.4375em;
}

#proven-quality-top .columns:before,#proven-quality-top .columns:after {
    content: "";
    display: table;
}

#proven-quality-top .columns:after {
    clear: both;
}

#proven-quality-top .columns {
    zoom: 1;
}

#proven-quality-top .columns .col {
    height: 18.0625em;
    padding-top: 182px;
}

#proven-quality-top .columns .col strong {
    position: relative;
    z-index: 2;
    margin-bottom: 0.83333em;
    color: #fff;
    font-size: 2.25em;
}

#proven-quality-top .columns .col span {
    position: relative;
    z-index: 2;
    padding: 0 1.375em;
}

#proven-quality-top .columns .col .icon {
    position: absolute;
    left: 0;
    top: 0;
    float: left;
    z-index: 1;
    width: 100%;
}

#proven-quality-top .columns .col .icon img {
    width: 100%;
    height: auto;
    display: block;
}

#proven-quality-top .section-display {
    position: absolute;
    left: 0;
    top: 0;
    float: left;
    z-index: 1;
    width: 100%;
    height: 100%;
}

#proven-quality-top .section-display .bg {
    position: absolute;
    left: 50%;
    top: 0;
    float: left;
    width: 300%;
    height: 100%;
    margin-left: -150%;
    background: #000 url("../../img/hp//proven-quality/proven-quality.jpg") 50% 0;
}

@media (max-width: 60em) {
    #proven-quality-top .columns .col {
        padding-top: 20%;
    }

    #proven-quality-top .columns .col strong {
        margin-bottom: 0.41667em;
    };
}

@media (max-width: 48em) {
    #proven-quality-top {
        background: #000 url("../../img/hp//proven-quality/proven-quality.jpg") 50% 0;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

    #proven-quality-top .section-inner {
        height: auto;
    }

    #proven-quality-top .section-display {
        display: none !important;
    }

    #proven-quality-top .columns {
        margin-bottom: 1em;
    }

    #proven-quality-top .columns .col {
        height: 200px;
        padding-top: 18%;
    }

    #proven-quality-top .columns .col strong {
        font-size: 1.25em;
    }

    #proven-quality-top .columns .col span {
        display: block;
        padding: 0 0.625em;
        line-height: 1;
        font-size: 16px;
    };
}

@media (max-width: 37.5em) {
    #proven-quality-top .columns .col span {
        display: none;
    };
}

#protection {
    background: #050203;
}

#protection .section-inner {
    padding-bottom: 0 !important;
}

#protection .brief {
    margin-bottom: 5em;
}

#protection .brief .section-text {
    text-align: center;
}

#protection .brief .section-descr {
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
}

#protection .detail {
    position: relative;
    margin-bottom: 1.5625em;
}

#protection .detail .section-text {
    position: relative;
    z-index: 2;
}

#protection .detail .section-text li {
    margin-bottom: 2.1875em;
}

#protection .detail .section-text li:before,#protection .detail .section-text li:after {
    content: "";
    display: table;
}

#protection .detail .section-text li:after {
    clear: both;
}

#protection .detail .section-text li {
    zoom: 1;
}

#protection .detail .section-text .icon {
    padding-top: 4px;
}

#protection .detail .section-text .descr strong {
    color: #02b1e4;
}

#protection .detail .section-display {
    position: absolute;
    left: 37.9375em;
    top: -1.5625em;
    float: left;
    z-index: 1;
}

#protection .ports .section-display {
    position: relative;
    margin-left: 32.9375em;
}

#protection .ports .section-display .line .text {
    font-size: 1.0625em;
}

#protection .ports .section-display .line .text strong {
    color: #02b1e4;
}

#protection .ports .section-display .line .text span {
    width: 380px;
}

#protection .ports .section-display .line .text .icon {
    position: absolute;
    right: 100%;
    top: 0;
    float: left;
    margin-right: 15px;
}

#protection .ports .section-display .p1 {
    left: -112px;
    top: 120px;
}

#protection .ports .section-display .p2 {
    left: -245px;
    top: 235px;
}

#protection .ports .section-display .p3 {
    left: -189px;
    top: 353px;
}

#protection .ports .section-display .p4 {
    left: -299px;
    top: 478px;
}

#protection .ports .section-display .p5 {
    left: -237px;
    top: 618px;
}

#protection .ports .section-display .p1 .text {
    width: 290px;
}

#protection .ports .section-display .p2 .text {
    width: 157px;
}

#protection .ports .section-display .p3 .text {
    width: 210px;
}

#protection .ports .section-display .p4 .text {
    width: 100px;
}

#protection .ports .section-display .p5 .text {
    width: 162px;
}

#protection .section-display .closeup {
    position: relative;
    z-index: 1;
}

#protection .section-display .effect {
    position: absolute;
    right: -100px;
    top: 80px;
    float: left;
    z-index: 2;
    width: 760px;
    height: 760px;
}

@media (max-width: 48em) {
    #protection .section-inner {
        padding-bottom: 1.875em !important;
    }

    #protection .brief {
        margin-bottom: 1.875em;
    }

    #protection .detail .section-text li {
        margin-bottom: 1.25em;
    }

    #protection .detail .section-text .icon img {
        width: 100%;
        height: auto;
    }

    #protection .detail .section-text .descr {
        width: 81.30081%;
    }

    #protection .section-display {
        margin-top: -350px;
    };
}

#compatible-devices {
    background: #fff;
}

#compatible-devices .brief {
    margin-bottom: 3.125em;
}

#compatible-devices .brief .section-text {
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#compatible-devices .detail {
    position: relative;
    height: 40.125em;
    margin-bottom: 3.75em;
}

#compatible-devices .detail:before,#compatible-devices .detail:after {
    content: "";
    display: table;
}

#compatible-devices .detail:after {
    clear: both;
}

#compatible-devices .detail {
    zoom: 1;
}

#compatible-devices .detail .section-text {
    position: relative;
    z-index: 3;
}

#compatible-devices .detail .section-display {
    position: absolute;
    left: 0;
    top: 0;
    float: left;
}

#compatible-devices .detail .section-display .heading {
    position: absolute;
    right: 0;
    top: 9.875em;
    float: left;
    z-index: 2;
}

#compatible-devices .detail .section-display .pics {
    position: relative;
    z-index: 1;
}

#compatible-devices .qvl:before,#compatible-devices .qvl:after {
    content: "";
    display: table;
}

#compatible-devices .qvl:after {
    clear: both;
}

#compatible-devices .qvl {
    zoom: 1;
}

#compatible-devices .qvl .section-text {
    position: relative;
    z-index: 2;
}

#compatible-devices .qvl .section-text .section-title-x {
    font-size: 3.75em;
    font-weight: 700;
}

#compatible-devices .qvl .section-text .section-title-s {
    font-size: 1.1875em;
    color: #02b1e4;
}

#compatible-devices .qvl .section-display {
    position: relative;
    z-index: 1;
    left: 0.625em;
    padding-top: 1.25em;
}

@media (max-width: 85.3125em) {
    #compatible-devices .detail .section-display .heading {
        left: 50%;
        right: auto;
    };
}

@media (max-width: 62.5em) {
    #compatible-devices .detail .section-display {
        width: 100%;
    }

    #compatible-devices .detail .section-display .heading {
        right: 0;
        left: auto;
    }

    #compatible-devices .detail .section-display .pics img {
        width: 100%;
        height: auto;
    }

    #compatible-devices .detail .section-text {
        width: 27.96748%;
        background: white;
    };
}

@media (max-width: 48em) {
    #compatible-devices .brief {
        margin-bottom: 1.25em;
    }

    #compatible-devices .detail {
        height: auto;
        margin-bottom: 1.25em;
    }

    #compatible-devices .detail .section-display .heading {
        width: 45%;
        left: 0;
        top: 12px;
        right: auto;
        background: #222;
        background: rgba(34,34,34,0.7);
        padding: 5px;
    }

    #compatible-devices .detail .section-display .heading img {
        width: 100%;
        height: auto;
    }

    #compatible-devices .detail .section-text {
        background: none;
    }

    #compatible-devices .qvl .section-display {
        margin-bottom: -3.75em;
    }

    #compatible-devices .qvl .section-display .screenshot {
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }

    #compatible-devices .qvl .section-display .screenshot img {
        width: 100%;
        height: auto;
    };
}

#compatible-others {
    background: url("../../img/ui/bg-scratch.jpg") 50% 0;
}

#compatible-others .section-inner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 23.125em;
}

#compatible-others .section-inner:before,#compatible-others .section-inner:after {
    content: "";
    display: table;
}

#compatible-others .section-inner:after {
    clear: both;
}

#compatible-others .section-inner {
    zoom: 1;
}

#compatible-others .section-text {
    padding-top: 2.5em;
}

#compatible-others .section-text .section-title-b2 {
    width: 153.24675%;
}

#compatible-others .section-display {
    position: relative;
    height: 100%;
}

#compatible-others .section-display .mb {
    position: absolute;
    left: 1.25em;
    bottom: 0;
    float: left;
}

@media (max-width: 48em) {
    #compatible-others .section-inner {
        height: auto;
    }

    #compatible-others .section-text {
        width: 81.30081% !important;
        margin-left: 2% !important;
    }

    #compatible-others .section-display .mb {
        position: static;
        width: 120%;
        margin-left: 10%;
        margin-top: -15%;
    }

    #compatible-others .section-display .mb img {
        width: 100%;
        height: auto;
    };
}

#validation-hours .section-inner {
    padding-bottom: 0 !important;
}

#validation-hours .section-text {
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-bottom: 5.125em;
}

#validation-hours .section-display {
    position: relative;
    height: 37.875em;
    padding-top: 1.875em;
}

#validation-hours .section-display:before,#validation-hours .section-display:after {
    content: "";
    display: table;
}

#validation-hours .section-display:after {
    clear: both;
}

#validation-hours .section-display {
    zoom: 1;
}

#validation-hours .section-display .bg {
    position: absolute;
    left: 50%;
    top: 0;
    float: left;
    z-index: 1;
    width: 300%;
    height: 100%;
    margin-left: -150%;
    background: #fff url("../../img/hp//proven-quality/validation-hours-bg.jpg") 50% 0;
}

#validation-hours .section-display .heading {
    position: relative;
    z-index: 2;
    margin-top: -5.125em;
    margin-bottom: 1.25em;
}

#validation-hours .section-display .pics {
    position: relative;
    z-index: 2;
}

#validation-hours .section-display .pics ul {
    overflow: hidden;
}

#validation-hours .section-display .pics li {
    float: left;
    position: relative;
    width: 14.75em;
    overflow: hidden;
    margin: 2px;
}

#validation-hours .section-display .pics li .title {
    position: absolute;
    left: 0;
    top: 0;
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    z-index: 2;
    min-height: 4.875em;
    padding: .5em .8em 0;
    background: url("../../img/ui/02b1e470.png");
    color: #fff;
    line-height: 1;
}

#validation-hours .section-display .pics li .title strong {
    margin-bottom: .2em;
    font-size: 1.125em;
    font-family: "Oswald","Arial Narrow",Impact,"Roboto";
    font-weight: 400;
}

#validation-hours .section-display .pics li .title span {
    font-size: 0.9375em;
}

#validation-hours .section-display .pics li .pic {
    position: relative;
    z-index: 1;
    width: 100%;
}

#validation-hours .section-display .pics li .pic img {
    display: block;
    width: 100%;
    height: auto;
}

#validation-hours .section-display .pics .n4 {
    width: 29.6875em;
}

#validation-hours .section-display .list {
    position: relative;
    z-index: 2;
}

#validation-hours .section-display .list li {
    width: 246px;
    margin-bottom: 8px;
    padding: 6px 0 5px 10px;
    line-height: 1;
    background: #02b1e4;
    color: #fff;
    font-size: 0.9375em;
}

#validation-hours .section-display .list li .icon {
    display: inline;
    vertical-align: middle;
}

#validation-hours .section-display .list li span {
    display: inline;
}

@media (max-width: 62.5em) {
    #validation-hours .section-display {
        width: 100% !important;
        height: auto;
        background: #fff url("../../img/hp//proven-quality/validation-hours-bg.jpg") 50% 0;
    }

    #validation-hours .section-display .bg {
        display: none;
    }

    #validation-hours .section-display .heading {
        padding-left: 6.30081%;
        width: 39.63415%;
        max-width: 325px;
        margin-top: 0;
    }

    #validation-hours .section-display .heading img {
        width: 100%;
        height: auto;
    }

    #validation-hours .section-display .list {
        width: 47.96748%;
    }

    #validation-hours .section-display .list li {
        width: 96%;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    #validation-hours .section-display .pics {
        clear: both;
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        margin-left: auto;
        margin-right: auto;
        width: 45em;
        margin-bottom: 1.25em;
    };
}

@media (max-width: 48em) {
    #validation-hours .section-display .heading,#validation-hours .section-display .list {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

    #validation-hours .section-display .pics {
        width: 98%;
    }

    #validation-hours .section-display .pics li {
        width: 49% !important;
    }

    #validation-hours .section-display .pics li .pic {
        height: 180px;
        overflow: hidden;
    };
}

#easy-pcdiy {
    background: #fff;
}

#pcdiy {
    background: #818180 url("../../img/hp/pcdiy/bg-tools.jpg") 50% 50% repeat-x;
}

#pcdiy .section-inner {
    padding-bottom: 0 !important;
}

#pcdiy .section-text {
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5em;
    text-align: center;
}

#pcdiy .steps li {
    width: 400%;
    margin-left: -150%;
    -webkit-transition: background 0.2s ease-out;
    -moz-transition: background 0.2s ease-out;
    -o-transition: background 0.2s ease-out;
    transition: background 0.2s ease-out;
}

#pcdiy .steps li a {
    display: block;
    position: relative;
    width: 984px;
    margin-left: auto;
    margin-right: auto;
}

#pcdiy .steps li a:before,#pcdiy .steps li a:after {
    content: "";
    display: table;
}

#pcdiy .steps li a:after {
    clear: both;
}

#pcdiy .steps li a {
    zoom: 1;
}

#pcdiy .steps li .pic {
    background: white;
}

#pcdiy .steps li .pic img {
    vertical-align: bottom;
}

#pcdiy .steps li .descr .inner {
    position: relative;
    margin-top: 3.125em;
    padding-left: 5em;
    padding-right: 3.125em;
    zoom: 1;
}

#pcdiy .steps li .descr b {
    position: absolute;
    float: left;
    top: -5px;
    left: 0.2em;
    font-size: 6.25em;
    font-weight: 400;
    color: #fff;
    line-height: .9;
}

#pcdiy .steps li .descr .section-title-b {
    color: #02b1e4;
}

#pcdiy .steps li .descr .section-descr {
    margin-top: 0;
    font-weight: 400;
}

#pcdiy .steps li:hover {
    background: #000 !important;
}

#pcdiy .steps li:nth-child(odd) {
    background: rgba(0,0,0,0.2);
}

#pcdiy .steps li:nth-child(odd) a {
    padding-left: 62px;
}

#pcdiy .steps li:nth-child(odd) .descr .inner {
    padding-left: 5em;
}

#pcdiy .steps li:nth-child(even) a {
    padding-right: 62px;
}

#pcdiy .steps li:nth-child(even) .descr .inner {
    padding-right: 5em;
    text-align: right;
}

#pcdiy .steps li:nth-child(even) .descr b {
    right: 0.2em;
    left: auto;
}

@media (max-width: 48em) {
    #pcdiy .section-text {
        margin-bottom: 1em;
    }

    #pcdiy .steps li {
        width: 100%;
        margin-left: 0;
    }

    #pcdiy .steps li a {
        width: 100%;
        padding: 0 !important;
    }

    #pcdiy .steps li .pic {
        display: none;
    }

    #pcdiy .steps li .descr {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

    #pcdiy .steps li .descr .inner {
        padding: 1.25em !important;
        margin: 0;
        text-align: left !important;
    }

    #pcdiy .steps li .descr b {
        position: relative;
        left: auto !important;
        right: auto !important;
        float: left;
        margin-right: 10px;
    };
}

#pcdiy-step1 .section-inner {
    padding-top: 1.875em;
    padding-bottom: 1.875em;
}

#pcdiy-step1 .section-text:before,#pcdiy-step1 .section-text:after {
    content: "";
    display: table;
}

#pcdiy-step1 .section-text:after {
    clear: both;
}

#pcdiy-step1 .section-text {
    zoom: 1;
}

#pcdiy-step1 .section-title-x {
    margin-bottom: 0.68182em;
    text-align: center;
}

#pcdiy-step1 .heading {
    position: relative;
    left: -1.25em;
}

#pcdiy-step1 .detail li {
    margin-bottom: 0.625em;
}

#pcdiy-step1 .detail li:before,#pcdiy-step1 .detail li:after {
    content: "";
    display: table;
}

#pcdiy-step1 .detail li:after {
    clear: both;
}

#pcdiy-step1 .detail li {
    zoom: 1;
}

#pcdiy-step1 .detail li:nth-child(odd) {
    background: #e5e5e5;
}

#pcdiy-step1 .detail .pic {
    position: relative;
    float: left;
    width: 39.63415%;
    margin-right: 2%;
    margin-left: 0;
    overflow: hidden;
}

#pcdiy-step1 .detail .pic img {
    vertical-align: bottom;
}

#pcdiy-step1 .detail .pic .play {
    position: absolute;
    left: 50%;
    top: 50%;
    float: left;
    z-index: 2;
    margin-left: -49px;
    margin-top: -49px;
}

#pcdiy-step1 .detail .descr {
    float: left;
    width: 56.30081%;
    margin-right: 0;
    padding-top: 2.5em;
}

#pcdiy-step1 .detail .descr strong {
    color: #02b1e4;
}

@media (max-width: 48em) {
    #pcdiy-step1 .heading {
        display: none;
    }

    #pcdiy-step1 .detail {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    #pcdiy-step1 .detail li {
        border-bottom: 2px solid #ddd;
        padding-bottom: 1em;
        margin-bottom: 1em;
    }

    #pcdiy-step1 .detail li:nth-child(odd) {
        background: none;
    }

    #pcdiy-step1 .detail .pic {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }

    #pcdiy-step1 .detail .pic img {
        width: 100%;
        height: auto;
    }

    #pcdiy-step1 .detail .descr {
        display: block;
        width: 95%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
        padding-top: 0;
    };
}

#pcdiy-step2 .section-inner {
    padding-bottom: 0 !important;
}

#pcdiy-step2 .section-text {
    position: relative;
    z-index: 2;
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.875em;
    text-align: center;
}

#pcdiy-step2 .section-display {
    position: relative;
    z-index: 1;
    width: 1307px;
    margin-left: -161.5px;
}

#pcdiy-step2 .section-display .screenshot {
    position: relative;
    z-index: 1;
}

#pcdiy-step2 .section-display .screenshot img {
    width: 100%;
    height: auto;
}

@media (max-width: 75em) {
    #pcdiy-step2 .section-display {
        width: 100%;
        margin-left: 0;
    };
}

#pcdiy-step3 .section-inner {
    padding-bottom: 0 !important;
}

#pcdiy-step3 .section-text {
    position: relative;
    z-index: 2;
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#pcdiy-step3 .section-display {
    position: relative;
    z-index: 1;
    width: 1077px;
    margin-left: -46.5px;
    margin-top: -1.875em;
}

#pcdiy-step3 .section-display .demo {
    position: relative;
    z-index: 1;
}

#pcdiy-step3 .section-display .demo img {
    width: 100%;
    height: auto;
}

@media (max-width: 68.75em) {
    #pcdiy-step3 .section-display {
        width: 100%;
        margin-left: 0;
    };
}

@media (max-width: 48em) {
    #pcdiy-step3 .section-display {
        margin-top: 0;
    };
}

#pcdiy-step4 .section-text {
    width: 81.30081%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#pcdiy-step4 .row1 {
    margin-bottom: 3.125em;
}

#pcdiy-step4 .steps:before,#pcdiy-step4 .steps:after {
    content: "";
    display: table;
}

#pcdiy-step4 .steps:after {
    clear: both;
}

#pcdiy-step4 .steps {
    zoom: 1;
}

#pcdiy-step4 .steps li {
    text-align: left;
}

#pcdiy-step4 .steps li .ps {
    color: #979797;
}

#pcdiy-step4 .steps .n3 .icon {
    position: relative;
    left: -1.25em;
}

@media (max-width: 48em) {
    #pcdiy-step4 .row1 {
        margin-bottom: 2.5em;
    }

    #pcdiy-step4 .steps li {
        text-align: center;
    }

    #pcdiy-step4 .steps .n1,#pcdiy-step4 .steps .n2 {
        width: 47.96748%;
        padding-right: 0;
    }

    #pcdiy-step4 .steps .n3 {
        width: 97.96748%;
        margin-top: 2em;
    };
}

#pcdiy {
    padding-bottom: 46px;
}

#pcdiy .section-inner {
    z-index: 1;
}

#pcdiy-learndetail {
    padding-bottom: 46px;
}

#proven-quality-top {
    padding-bottom: 46px;
}

#proven-quality-top .section-inner {
    z-index: 1;
}

#proven-quality-learndetail {
    padding-bottom: 46px;
}


#high-performance .zection-image-set-1a{
    padding-bottom: 50px;
    text-align: center;
}
#high-performance .zection-image-set-1a img:first-child{
    width: 428px;
}
#high-performance .zection-image-set-1a img:nth-child(3){
    margin-bottom: 40px;
}
#high-performance .zection-image-set-1a img:nth-child(5){
    margin-bottom: 40px;
}
#high-performance .zection-image-set-1a p{
    color: #fff;
    text-align: center;
}
#high-performance .zection-image-set-1a p:last-child{
    color: #999;
    text-align: left;
    width: 70%;
    margin: 0 auto;
    font-size: 0.8em;
}
@media (max-width: 48em) {
    #high-performance .zection-image-set-1a img:first-child{
        width: 100%;
    }
    #high-performance .zection-image-set-1a .go-video-1{
        width: 95%;
        margin-bottom: 30px;
    }
    #high-performance .zection-image-set-1a .go-video-1 img{
        width: 54px;
        height: 54px;
    }
    #high-performance .zection-image-set-1b img:first-child{
        width: 100%;
    }
    #high-performance .zection-image-set-1b img:last-child{
        width: 95%;
    }
    #high-performance .zection-image-set-2{
        background: none;
        padding-top: 0px;
    }
    #high-performance .zection-image-set-2 img{
        width: 90%;
    }

    #high-performance .zection-image-set-1a p:last-child{
        width: 95%;
    }

}