.main {font-family: 'Open Sans', sans-serif; font-size: 16px; line-height: 1.25em;}
.textFitted {line-height: 1em;}

.main img, .header-bg img {max-width: 100%;}

h1, h2, h3, h4, p, ul, li, em {margin: 0; padding: 0;}

h1 {font-size: 3em; line-height: 1em;}
h2 {font-size: 2em; line-height: 1em;}
h3 {font-size: 1.5em; line-height: 1em;}
h4 {font-size: 1.25em; line-height: 1em;}
p {font-size: 1.25em; line-height: 1.25em; margin-bottom: 1em;}
p:last-child {margin-bottom: 0;}

.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}

.img-center {margin-left: auto; margin-right: auto;}

.flex-center {display: flex; align-items: center; justify-content: center;}

.lc {text-transform: lowercase;}
.uc {text-transform: uppercase;}

.left {float: left;}
.both {clear: both;}

.f300 {font-weight: 300;}
.f400 {font-weight: 400;}
.f700 {font-weight: 700;}
.f800 {font-weight: 800;}
.f900 {font-weight: 900;}

.features-bg .row {padding-top: 0; margin-top: 0;}
.features-bg .row:first-child {padding-top: 0; margin-top: 0;}
.features-bg .row-bar {margin: 3em 0; border-bottom: 1px solid #444;}

.nav-bg {background: rgba(0,0,0,0.5); z-index: 9999; width: 100%; text-align: center; border-bottom: 1px solid #555;}
.nav-bg ul {list-style: none; font-size: 0;}
.nav-bg li {display: inline-block; font-size: 14px; cursor: pointer; padding: 0.5em 2em; text-transform: uppercase; margin: 0; border-bottom: 1px solid #777; width: 25%; position: relative;}
.nav-bg .nav-active {border-bottom: 1px solid #00fe00;}
.nav-bg li:hover {background: rgba(100,100,100,0.5); border-bottom: 1px solid #00fe00;}
.nav-bg li:hover .nav-sub {display: block; position: absolute;}
.nav-sub {display: none; z-index: 100; margin-top: 8px; margin-left: -28px; width: 100%;}
.nav-sub li {width: 100%; padding: 0.5em; background: rgba(50,50,50,0.95);}
.nav-sub li:hover {background: rgba(100,100,100,0.95);}
.back-to-top {display: none; width: 64px; height: 64px; position: fixed; top: 40px; right: 25px; cursor: pointer; z-index: 9999; }

.green {color: #00fe00;}
.blue {color: #0066ff;}
.red {color: #fc0005;}
.white {color: #fff;}
.gray {color: #c8c7cc;}

.header-bg {font-family: 'Lato', sans-serif; padding-top: 2em;}
.header-bg .mcontainer {position: relative;}
.header-bg .row {position: relative;}
.header-bg .text-right img {margin-top: 8%;}
.header-bg .column-8 {margin-bottom: 2em;}
.header-bg .top {position: absolute; right: 2.5%; top: 0; width: 35%; z-index: 10;}
.header-bg .patent {line-height: 1.25em; letter-spacing: 0.25em; font-weight: 300; text-transform: uppercase; text-align: right; font-size: 1em;}
.header-bg .bottom {position: absolute; width: 100%; bottom: 5%; width: 71%;}
.header-bg .bottom h3 {line-height: 1.25em;}
.header-bg .column-6 {z-index: 10;}
.header-bg .column-rgb {position: relative; background: url('images/header/header.jpg') center no-repeat; background-size: 100% auto;}
.header-bg .column-rgb .rgb {position: absolute; width: 45px; height: 40px;}
.header-bg .column-rgb .gpm_g {top: 18.5%; left: 30%;}
.header-bg .column-rgb .gpm_p {top: 22.3%; left: 38.3%;}
.header-bg .column-rgb .gpm_m {top: 26.6%; left: 47%;}
.header-bg h1 {line-height: 1.25em; letter-spacing: 0;}
.header-bg h2 {line-height: 1em; letter-spacing: 0.25em; margin-left: 0.25em;}
.header-bg h3 {line-height: 2em; letter-spacing: 0.1em; margin-left: 0.1em;}

.awards-images {list-style: none; flex-wrap: wrap;}
.awards-images li {display: inline-block; width: 85px; margin-left: 0.5em; margin-right: 0.5em;}

.menu-bg {font-size: 1.7em; line-height: 0.75em;}
.menu-bg .row {margin-bottom: 1em;}
.menu-bg .row:last-child {margin-bottom: 0;}
.menu-bg .column-6 {cursor: pointer;}
.menu-bg .column-6:hover {color: #fff;}
.menu-bg .column-6:hover i {color: #00fe00;}
.menu-bg .left {font-size: 3.6em; line-height: 0.8em;}
.menu-bg p {font-size: 0.75em;}

.intro-bg .row {margin-bottom: 1em;}
.intro-bg .row:last-child {margin-bottom: 0;}
.intro-bg h2 {text-transform: uppercase;}
.intro-bg .column-6 h2 {line-height: 1.25em; letter-spacing: 0.25em; font-weight: 300; text-transform: uppercase; text-align: center; font-size: 1.5em;}
.intro-bg ul {margin-left: 2em;}
.intro-bg ul li {font-size: 1.25em; padding: 0.25em 0;}
.intro-bg .cooler {font-size: 2em;}
.intro-bg .new {font-size: 1.5em;}

.row-efficient p {font-size: 1.5em; line-height: 1.25em; font-weight: 300;}
.row-efficient .textFitted {line-height: 0.75em;}
.row-efficient .column-12 {clear: both; text-align: center;}

.row-asynchronous .text1 {font-weight: 300; font-size: 6em; line-height: 0.8em;}
.row-asynchronous .text2 {font-weight: 800; font-size: 5em; line-height: 0.8em; text-align: right; text-transform: uppercase;}

.row-rgb {background: url('images/features/rgb.png') bottom center no-repeat; background-size: 100% auto; min-height: 662px; position: relative;}
.row-rgb .text1 {font-size: 3em; font-weight: 300;}
.row-rgb .text2 {font-size: 3.8em; text-transform: uppercase;}
.row-rgb .text3 {font-size: 2.7em; font-weight: 300;}
.row-rgb .column-6 p {font-size: 1.5em; line-height: 1.25em; font-weight: 300;}
.row-rgb .column-4{clear: both; position: absolute; bottom: 0; left: 0;}
.row-rgb .column-4 p {font-weight: 300;}

.row-diecast {background: url('images/features/diecast.jpg') top center no-repeat; min-height: 854px; position: relative;}
.row-diecast .text1 {font-weight: 300; font-size: 4em;}
.row-diecast .text2 {font-weight: 800; font-size: 4em;}
.row-diecast .text3 {font-weight: 300; font-size: 4em;}
.row-diecast .bottom {position: absolute; bottom: 0; left: 0;}
.row-diecast .bottom p {font-size: 1.5em; font-weight: 300;}

.row-pinfin {background: url('images/features/pinfin.jpg') top center no-repeat; min-height: 440px; position: relative;}
.row-pinfin h3 {text-align: center; font-size: 4em;}
.row-pinfin p {text-align: center; font-size: 1.5em; font-weight: 300;}
.row-pinfin .bottom {position: absolute; bottom: 0;}

.row-airflow .text1 {font-size: 3em;}
.row-airflow .text2 {font-size: 4em;}
.row-airflow p {font-size: 1.5em; font-weight: 300; line-height: 1.25em;}

.row-gaming {background: url('images/features/peace.jpg') top center no-repeat; background-size: 100% auto; min-height: 850px; position: relative;}
.row-gaming h3 {font-size: 6em;}
.row-gaming .f800 {font-style: italic;}
.row-gaming .white {color: #fff;}
.row-gaming .bottom {position: absolute; bottom: 0;}
.row-gaming p {font-size: 1.5em; font-weight: 300; line-height: 1.25em;}

.row-overclock .f800 {font-size: 4em; font-style: italic;}
.row-overclock .f300 {font-size: 3em;}
.row-overclock p {font-size: 1.5em; font-weight: 300; line-height: 1.25em;}
.row-overclock .column-12 {clear: both; background: url('images/features/overclock.jpg') top center no-repeat; min-height: 669px;}

.row-pxoc .f800 {font-size: 4em; font-style: italic;}
.row-pxoc .f300 {font-size: 2.8em; padding-bottom: 0.5em;}
.row-pxoc p {font-size: 1.5em; font-weight: 300; line-height: 1.25em; padding-bottom: 0.5em;}

.row-interactive h3 {font-size: 3em;}

.row-video {padding-top: 1em;}
.video-bg .mcontainer {max-width: 900px;}
.video-container {margin: auto; position: relative; padding-bottom: 53.25%; padding-top: 30px; height: 0; overflow: hidden;}
.video-container, .video-container iframe {max-width: 1280px; max-height: 720px;}
.video-container iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.products-bg h2 {color: #fff; font-size: 1.4em; text-transform: none; margin-bottom: 0.5em; }
.products-bg h2.prod-second { margin-top: 0.5em; }
.products-bg .mcontainer {background: #000; padding-top: 15px; padding-bottom: 15px;}
.prod-column-specs { padding-left: 1em; }
.prod-accord-header {border: 1px solid #333; color: #777; cursor: pointer; margin-top: 3px; padding: 5px; font-size: 0.85em; }
.itemSKU {float: right; margin: 0 5px;}
.arrow-left {width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right: 9px solid #555; float: right;}
.prod-accord-header.active {border-color: #fff; color: #fff; font-weight: bold;}
.prod-accord-header.active .arrow-left {border-top: 9px solid #fff; border-left: 6px solid transparent; border-right: 6px solid transparent; margin-top: 3px;}
.prod-specs {position: absolute; top: 0; right: 0; padding-left: 15px; padding-right: 15px; width: 50%;}
.prod-accord-content {display: none; overflow: hidden;}

.product-images {list-style: none; margin: 5px 0; overflow: hidden;}
.product-images li {float: left; margin: 3px 5px 3px 0;}
.product-images img {max-width: 50px;}
.product-buttons {list-style: none; margin: 15px 0 0;}
.product-buttons a {color: #fff; display: block; padding: 4px 8px; text-decoration: none; border: 1px solid #666666; font-size: 0.75em; text-transform: uppercase;}
.product-buttons a:hover {color: #999;}
.product-buttons li {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: inline-block; font-size: 1em; margin: 0 1% 10px 0; width: 30%; padding: 0; background: url(/images/common/75_black_trans.png);}
.product-buttons .statusComingSoon {display: block; padding: 4px 8px; border: 1px solid #666666;}
.product-group-specs {display: none;}
.product-group-specs h3 {font-size: 1em; font-style: italic;}
.specs-column {float: left; width: 50%;}
.specs-column ul {list-style: none; margin: 5px 10px;}
.specs-column ul li {text-indent: -4px;}
.specs-column ul li:before {content: "-"; position: relative; left: -5px;}
.specs-memoryheader {margin-top: 50px;}

.footer-section img {display: block; margin: 0 auto; max-width: 100%;}

@media (max-width: 850px)
{
  .main {font-size: 14px;}
  
  .section-bg {padding: 1em;}
  
  .header-bg {padding: 1em; font-size: 14px;}
  .header-bg img {display: block !important; margin: 0 auto 1em !important;}
  .everything {font-size: 2em;}
  .detected {font-size: 1.5em;}
  .header-bg .column-rgb .gpm_g {top: 18.5%; left: 30%;}
  .header-bg .column-rgb .gpm_p {top: 21.8%; left: 38.3%;}
  .header-bg .column-rgb .gpm_m {top: 26%; left: 47%;}
  .header-bg .row {position: initial;}
  .header-bg .top {position: initial; width: 100%;}
  .header-bg .bottom {position: initial; width: 100%; text-align: center;}
  
  .menu-bg .row {margin-bottom: 0;}
  .menu-bg {font-size: 1.25em; line-height: 1.25em;}
  
  .intro-bg .flex-center {display: block;}
  
  .features-bg .row {margin-bottom: 1em;}
  .features-bg p {font-size: 1em !important;}
  
  .row-sensors {min-height: initial;}
  .row-sensors .first {margin-top: 65%; padding-left: 15px;}
  .row-sensors .second {margin-top: 0;}
  .row-sensors h3 {font-size: 1.3em; display: inline; line-height: 1.25em}
  .row-sensors .left {float: none; display: inline; font-size: 1.3em; line-height: 1.25em;}
  .row-sensors .right {float: none; display: inline; font-size: 1.3em; line-height: 1.25em;}
  .row-sensors p {width: 100%; margin-right: 0; margin-left: 0; font-size: 1em; line-height: 1.25em; text-align: left;}
 
  .row-asynchronous .text1 {font-size: 2.5em;}
  .row-asynchronous .text2 {font-size: 2em;}
  
  .row-rgb .text2 {font-size: 2.8em;}
  .row-rgb .text3 {font-size: 2em;}
  
  .row-diecast {background-size: 100% auto;}
  .row-diecast .text1 {font-size: 1.8em;}
  .row-diecast .text2 {font-size: 1.8em;}
  .row-diecast .text3 {font-size: 1.8em;}
  
  .row-pinfin {background-size: 100% auto;}
  .row-pinfin h3 {font-size: 1.5em;}
  
  .row-airflow .text1 {font-size: 2em;}
  .row-airflow .text2 {font-size: 2em;}
  
  .row-gaming h3 {font-size: 3em;}
  
  .row-overclock .column-12 {background-size: 100% auto;}
  .row-overclock .f800 {font-size: 2.5em;}
  .row-overclock .f300 {font-size: 2em;}
  
  .row-pxoc .f800 {font-size: 2.7em;}
  .row-pxoc .f300 {font-size: 2.4em;}
  
  .row-interactive h3 {font-size: 1.5em;}
}