/* AUTHOR */
@charset "UTF-8";
@import url("https://translate.googleusercontent.com/translate_c?depth=1&hl=es&pok=1&rurl=translate.google.com&sl=en&sp=nmt4&tl=es&u=http://fonts.googleapis.com/css%3Ffamily%3DRoboto:300,400,700%26subset%3Dlatin,cyrillic-ext,greek-ext,greek,latin-ext,cyrillic&usg=ALkJrhgxR0ybwmUQGopFIzuR_7Y46zdMKA") ;
@import url("https://translate.googleusercontent.com/translate_c?depth=1&hl=es&pok=1&rurl=translate.google.com&sl=en&sp=nmt4&tl=es&u=http://fonts.googleapis.com/css%3Ffamily%3DOswald:300,400,700%26subset%3Dlatin,latin-ext&usg=ALkJrhg4MAubwJgtiUqu_uq8uRHi2WdARg") ;
@font-face { font-family: "Jersey M54"; font-style: normal; font-weight: normal; src: url(../libs/font/jersey_m54.eot); src: url(../libs/font/jersey_m54.eot?#iefix) format("embedded-opentype") , url(../libs/font/jersey_m54.woff) format("woff") , url(../libs/font/jersey_m54.ttf) format("truetype") , url(../libs/font/jersey_m54.svg#jersey_m54regular) format("svg") }
.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 {border: 0; font: inherit; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline}
.m-wrap table {border-collapse: collapse; border-spacing: 0}
.m-wrap caption, .m-wrap th, .m-wrap td {font-weight: normal; text-align: left; 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: auto; image-rendering: optimizeQuality; ms-interpolation-mode: bicubic}
.m-wrap a {color: #444444; moz-transition: color 0.2s ease-out; o-transition: color 0.2s ease-out; text-decoration: none; transition: color 0.2s ease-out; webkit-tap-highlight-color: rgba(255, 255, 255, 0.1); webkit-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 {border: none; margin: 0; padding: 0}
.m-wrap ul, .m-wrap ol {display: block; list-style: none}
.m-wrap {color: #444444; font-family: "Roboto","STHeiti Light",STXihei,STHeiti,"Apple LiGothic Medium",微軟正黑體,"微軟正黑體","Microsoft JhengHei",Helvetica,Arial,sans-serif; font-size: 16px; line-height: 1.41176}
.m-wrap a:hover {color: inherit; text-decoration: none}
.m-wrap small.ps {display: block; font-size: 12px; margin-top: 1em}
.m-wrap {}
.m-wrap .picnav {font-size: 0; white-space: nowrap; margin-left: 14%}
.m-wrap .picnav .picnav-item {font-size: 14px}
.m-wrap .picnav .picnav-item {display: inline; display: inline-block; vertical-align: top; white-space: normal; zoom: 1}
.m-wrap .picnav-item {overflow: hidden; position: relative; border: 3px solid #333333; margin-left: 0.6%; margin-right: 0.6%}
.m-wrap .picnav-item a {display: block}
.m-wrap .picnav-item .pic {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); webkit-transition: -webkit-transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); width: 100%}
.m-wrap .picnav-item .pic img {display: block; height: auto; width: 100%}
.m-wrap .picnav-item .title {background: #000000; bottom: 0; color: #ffffff; display: table; float: left; font-family: "Oswald","Arial Narrow",Impact,"Roboto"; font-size: 1.6em; font-weight: 500; height: 65px; left: 0; line-height: 1.2; 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); position: absolute; text-align: left; transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); webkit-transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); width: 100.5%; z-index: 2}
.m-wrap .picnav-item .title span {display: table-cell; height: 60px; text-align: center; 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: #ffffff}
.m-wrap .picnav-item a:hover .pic {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); webkit-transform: scale(1.1, 1.1)}
.m-wrap .on-dark .line .text {color: #ffffff}
.m-wrap a:hover .play {opacity: 0.7}
@media (max-width: 959px) { .m-wrap img {max-width: none !important} }
#sectionOverview p, #section-overview p {margin-bottom: 1em}
#overview #sectionOverview {line-height: inherit}
.m-nav {background: #484848; border-bottom: 1px solid #dddddd; border-top: 1px solid #dddddd; font-size: 0; height: 55px; position: relative; text-align: center; top: auto; white-space: nowrap; width: 100%; z-index: 1.0101e+10}
.m-nav .m-logo {display: inline; display: inline-block; position: relative; vertical-align: baseline; vertical-align: top; width: 250px; zoom: 1}
.m-nav .m-logo img {display: block; margin-top: 13px}
.m-nav ul {border-left: 1px solid #dddddd; display: inline; display: inline-block; font-size: 0; overflow: hidden; position: relative; vertical-align: baseline; vertical-align: top; zoom: 1}
.m-nav ul li {font-size: 16px}
.m-nav ul li {display: inline; display: inline-block; vertical-align: top; white-space: normal; zoom: 1}
.m-nav li {border-right: 1px solid #dddddd; color: #ffffff; text-align: center}
.m-nav li a {background-color: transparent; color: #ffffff; display: block; font: 18px/55px "Oswald","Arial Narrow",Impact,"Roboto"; moz-transition: background-color 0.2s; o-transition: background-color 0.2s; padding: 0 40px; text-decoration: none; text-transform: uppercase; transition: background-color 0.2s; webkit-transition: background-color 0.2s}
.m-nav li.on a, .m-nav li a:active, .m-nav li a:hover {background-color: #111111}
@media (max-width: 1000px) { .m-nav li a {padding-left: 20px; padding-right: 20px} }
@media (max-width: 60em) { .m-nav .m-logo {display: none} }
@media (max-width: 60em) { .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 {margin: 0 auto; max-width: 1000px; padding: 4.375em 0; position: relative}
.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 {float: left; left: 50%; margin-left: -50%; position: absolute; top: 0; width: 100%; z-index: 1}
.m-wrap .section-imgbg img {display: block; height: auto; margin: 0 auto; width: 100%}
.m-wrap .learndetail {position: relative}
.m-wrap .open-detail {bottom: 0; float: left; left: 50%; margin-left: -95px; position: absolute; z-index: 5}
.m-wrap .close-detail {bottom: 0; float: left; left: 50%; margin-left: -95px; position: absolute; z-index: 5}
.m-wrap .close-detail.attop {bottom: auto; top: 0}
.m-wrap .section-title {background: url(http://www.gigabyte.com/FileUpload/Global/KeyFeature/img/ui/title-underline.png) no-repeat 0 100%; margin-bottom: 1.875em; padding-bottom: 1.875em}
.m-wrap .section-title .section-title-x {margin-bottom: 0.1875em}
.m-wrap .section-title-x {color: #343434; display: block; font-family: "Jersey M54","Oswald","Arial Narrow",Impact,"Roboto"; font-size: 3.125em; font-weight: 400; line-height: 1}
.m-wrap .section-title-b {color: #626262; display: block; font-family: "Oswald","Arial Narrow",Impact,"Roboto"; font-size: 1.875em; font-weight: 700; line-height: 1.1}
.m-wrap .section-blockquote {border-left: 7px solid #b1b1b1; border-right: 7px solid #b1b1b1; color: #b1b1b1; font-size: 1.5em; font-weight: 700; line-height: 1.25; padding-left: 0.9375em; padding-right: 0.9375em; text-align: center}
.m-wrap .section-descr {font-size: 1.0625em}
.dark .m-wrap .section-descr {font-weight: 300}
.m-wrap .section.dark {color: #ffffff; font-weight: 300}
.m-wrap .section.dark .section-title-x {color: #ffffff}
.m-wrap .section.dark .section-title-b {color: #bfbfbf}
.m-wrap .section.dark a {color: #ffffff}
.m-wrap .tagtitle {background: url(http://www.gigabyte.com/FileUpload/Global/KeyFeature/img/ui/tagtitle-bg.png); display: inline; display: inline-block; font-family: "Oswald","Arial Narrow",Impact,"Roboto"; font-size: 1.25em; font-weight: 500; height: 34px; line-height: 34px; margin-bottom: 0.9em; padding: 0 0.4em; vertical-align: baseline; zoom: 1}
.m-wrap .tagtitle + p {font-size: 1.125em}
.m-wrap .fontfix {font-family: impact,arial; font-size: 93%}
.m-wrap .divider {background: #4c4f53; clear: both; text-align: center}
.m-wrap .divider .title {color: #ffffff; font-family: "Oswald","Arial Narrow",Impact,"Roboto"; font-size: 2.625em; line-height: 1; margin-left: auto; margin-right: auto; max-width: 1000px; padding: 25px 0 25px}
.m-wrap .section.bg-wall {background: url(http://www.gigabyte.com/FileUpload/Global/KeyFeature/img/ui/bg-wall.jpg) repeat-x 50% -0.375em}
.m-wrap .section.bg-gradient {background: #ffffff url(http://www.gigabyte.com/FileUpload/Global/KeyFeature/img/ui/bg-gradient.jpg) repeat-x}
.m-wrap .section.dark {background-color: #000000}
.m-wrap .section.bg-white {background-color: #ffffff}
#top-wrap {background: #e0e3e6; margin: 0 auto; position: relative !important}
* html #content {zoom: 1}
*:first-child + html #content {zoom: 1}
#top {background: #000000}
#top .picnav {white-space: normal}
#top .picnav-item {width: 26%}
#top .picnav-item a:hover .title {color: #679cac}