/* ============================== 
GERERAL
============================== */
@import url("https://fast.fonts.net/t/1.css?apiType=css&projectid=9cf91264-16ea-4445-bb68-981ae82be08c");

@font-face{
    font-family:"Helvetica Neue LT W05_45 Light";
    src:url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/cb0d1e8a-e111-4dbf-82c2-e948aba954c0.eot?#iefix");
    src:url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/cb0d1e8a-e111-4dbf-82c2-e948aba954c0.eot?#iefix") format("eot"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/f9c5199e-a996-4c08-9042-1eb845bb7495.woff2") format("woff2"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/2a34f1f8-d701-4949-b12d-133c1c2636eb.woff") format("woff"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/fdf10d5e-4ce0-45e5-a6c1-5eaff6cb1c11.ttf") format("truetype");
}
@font-face{
    font-family:"Helvetica Neue LT W05_65 Medium";
    src:url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/5640036d-d549-4f16-b31e-87da78d9e832.eot?#iefix");
    src:url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/5640036d-d549-4f16-b31e-87da78d9e832.eot?#iefix") format("eot"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/240c57a0-fdce-440d-9ce3-85e0cb56f470.woff2") format("woff2"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/7802e576-2ffa-4f22-a409-534355fbea79.woff") format("woff"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/14d824a2-2a5c-4692-8e30-74f6e177b675.ttf") format("truetype");
}
@font-face{
    font-family:"Helvetica Neue LT W01_75 Bold";
    src:url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/9697cfef-7816-47cc-81ed-c56c029d3bcf.eot?#iefix");
    src:url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/9697cfef-7816-47cc-81ed-c56c029d3bcf.eot?#iefix") format("eot"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/1f4274cd-2674-481e-9023-69e33ffca161.woff2") format("woff2"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/5e8d493c-be01-44b9-962e-504a5cf10dd8.woff") format("woff"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/ae36b4a0-aa2c-46cc-98d8-d8b7d22241dc.ttf") format("truetype");
}
@font-face{
    font-family:"Trade Gothic LT W00 Bd Cn No.20";
    src:url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/b56091df-0934-490f-8ba1-44ac7c71ac12.eot?#iefix");
    src:url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/b56091df-0934-490f-8ba1-44ac7c71ac12.eot?#iefix") format("eot"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/e4276c67-820d-46ce-b8e4-68d5b4734d69.woff2") format("woff2"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/c0a119b8-eafb-490d-8445-a9c16f425279.woff") format("woff"),url("https://cwsmgmt.corsair.com/fonts/10122018/Fonts/0790eb68-9916-43f6-9519-7c8f367464cb.ttf") format("truetype");
}

.main-content #pdp-678c section .font-header-condensed{
    font-family:"Trade Gothic LT W00 Bd Cn No.20";
    letter-spacing:0em;
}

.font-header{
    font-family:'Gotham XNarrow A', 'Gotham XNarrow B';
    font-weight: 800 !important;
    letter-spacing: 0em !important;
    line-height:0.9em;
}

.font-subheader{
    font-family:'Gotham XNarrow A', 'Gotham XNarrow B';
    font-weight: 400 !important;
    letter-spacing: 0em !important;
    line-height:0.9em;
}

.font-header-body{
    font-family:'Gotham XNarrow A', 'Gotham XNarrow B';
    font-weight: 800 !important;
    letter-spacing: 0.1em !important;
    line-height:1em;
}

.font-body{
    font-family:'Gotham SSm A', 'Gotham SSm B';
    font-size:12px;
}

.font-script{
    font-family: verveine, sans-serif !important;
    font-weight: 400 !important;
    font-style: normal;
}

.font-color-blue,
h3.font-color-blue{
    color:#306dfb !important;
}

.font-color-white{
    color:#fff;
}

.font-color-black,
h3.font-color-black{
    color:#000;
}

.font-color-dark-gray,
h3.font-color-dark-gray{
    color:#3f3f3f !important;
}


#pdp-678c .cta.white{
    background:white;
    color:#000;
    display:inline-block;
    margin:4em auto 0em;
}

#pdp-678c .cta.white:hover{
    color:#c5c5c5;
}

#pdp-678c p{
    font-size:1.2em;
}

#pdp-678c h1.section-title{
    margin-bottom:1em;
}

.absoluteContainer{
    position: absolute;
}

.relativeContainer{
    position: relative;
}

#pdp-corsair #pdp-678c section h1{
    font-size:2.5em !important;
}

/* ============================== 
HERO
============================== */

#pdp-678c .hero {
    background: url(https://cwsmgmt.corsair.com/pdp/678c/img/hero-bg.jpg)no-repeat center #000 !important;
    background-size: cover;
    display: table;
    height: 692px;
    margin-top: 0px;
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index:0;
}

#pdp-678c .hero #hero-img {
    
    position:absolute;
    left: 0;
    top: 0;
    z-index:-1;

    max-width: 100%;
    max-height: 100%;
    height: auto;
}
    
#pdp-678c .hero video {
    position:absolute;
    z-index:0;
    display:block;
}

#pdp-678c  .hero .wrapper {
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    height:100%;
    color:#fff;
    position: relative;
    width: 100%;
    padding: 0 5%;
    background: rgba(0,0,0,1);
}
    

#pdp-678c .hero .content_wrapper {
    color: #fff;
    display:table-cell;
    max-width: 100%;
    padding: 9em 1em 0;
    position: relative;
    text-align: center;
    vertical-align:middle;
    width: 100%;
}

#pdp-678c .hero p small {
    color:#306dfb;
    position: relative;
    font-size: 1.5em !important;
    font-weight: 400;
    display:block;
    margin: 0;
    max-width: 1200px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin: 0 auto 0em;
    z-index:1;

}

#pdp-678c .hero h1 {
    color:#fff;
    position: relative;
    font-weight: 400 !important;
    display:block;
    margin: 0;
    max-width: 1200px;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    margin: 0 auto 0em;
    z-index:1;
}

#pdp-corsair #pdp-678c section.hero h1{
    font-size: 5em !important;
}

#pdp-678c .hero h2{
    font-size: 4em;
}


#pdp-678c .hero .content_wrapper h3 {
    position: relative;
    color: #fff;
    display: block;
    text-transform: uppercase;
    width: 90%;
    font-size: 1.4em;
    z-index: 1;
    font-weight: 400;
    letter-spacing: 0.3em;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    margin: .5em auto 0;
}

#pdp-678c .hero .content_wrapper h3 span{
    font-size:0.6em;
}

#pdp-678c .hero span {
    line-height:2em;
    font-size:1em;
    letter-spacing:0.3em;
}

/* ============================== 
SOPHISTICATED
============================== */
#pdp-678c #sophisticated{
    background:#ededed;
    padding-top:8em;
    z-index:2;
}

#pdp-678c #sophisticated .background{
    background:#dcdcdc;
    bottom:0;
    height:35%;
    position: absolute;
    width:100%;
}

#pdp-678c #sophisticated .header{
    left:0;
    position: absolute;
    top:0;
    width:400px;
}

#pdp-678c #sophisticated .left,
#pdp-678c #sophisticated .right{
    display:inline-block;
    vertical-align:top;
    width:50%;
}

#pdp-678c #sophisticated .left .square,
#pdp-678c #sophisticated .right .square{
    height:500px;
    position: relative;
    width:500px;
}

#pdp-678c #sophisticated .left .square h3,
#pdp-678c #sophisticated .right .square h3{
    bottom:4px;
    position: absolute;
}

#pdp-678c #sophisticated .left img,
#pdp-678c #sophisticated .right img{
    width:100%;
}

#pdp-678c #sophisticated .left{
    text-align:right;
}

#pdp-678c #sophisticated .left .square{
    background:rgba(0,0,0,0.8);
    margin-left:auto;
    margin-right:0;
    margin-top:26em;
    opacity:0;
    transform:translateX(50px);
}

#pdp-678c #sophisticated.triggered .left .square{
    opacity:1;
    transition:500ms opacity 800ms;
}

#pdp-678c #sophisticated .left img{
    opacity:0;
    transform:translateX(-80px) translateY(-70px);
}

#pdp-678c #sophisticated.triggered .left img{
    opacity:1;
    transform:translateX(-130px) translateY(-70px);
    transition:500ms opacity 1200ms, 500ms transform 1200ms;
}

#pdp-678c #sophisticated .left .square h3{
    color:#fff;
    left:20px;
}


#pdp-678c #sophisticated .right{
    text-align:right;
}

#pdp-678c #sophisticated .right .square{
    background:rgba(255,255,255,0.8);
    margin-left:0;
    margin-right:auto;
    margin-top:50px;
    opacity:0;
    transform:translateX(-50px);
}

#pdp-678c #sophisticated.triggered .right .square{
    opacity:1;
    transition:500ms opacity;
}


#pdp-678c #sophisticated .right img{
    opacity:0;
    transform:translateX(70px) translateY(-60px);
}


#pdp-678c #sophisticated.triggered .right img{
    opacity:1;
    transform:translateX(120px) translateY(-60px);
    transition:500ms transform 400ms, 500ms opacity 500ms
}

#pdp-678c #sophisticated .right .square h3{
    color:#000;
    right:20px;
}


/* ============================== 
EXPLODE
============================== */
#pdp-678c #explode{
    background:#dcdcdc;
}

#pdp-678c #explode #canvas{
    width:100%;
}

#pdp-678c #explode .wrapper{
    overflow:hidden;
    position: relative;
}

#pdp-678c #explode .wrapper .header{
    right:0;
    text-align:center;
    top:10%;
    width:300px;
    z-index:2;
}

#pdp-678c #explode .wrapper .header h3{
    margin:0;
}

#pdp-678c #explode .wrapper .bulletping{
    background:#306dfb;
    border-radius:50%;
    cursor:pointer;
    height:16px;
    opacity:0;
    right:0;
    top:0;
    width:16px;
}

#pdp-678c #explode .wrapper .bulletping.selected{
    background:#acc3e2;
}

#pdp-678c #explode .wrapper .bulletping.visible{
    opacity:1;
}

#pdp-678c #explode .wrapper .bulletping:before{
    border-radius:50%;
    border:1px solid #306dfb;
    content:'';
    left:0px;
    height:100%;
    pointer-events:none;
    position: absolute;
    top:0px;
    transform:scale(1.2);
    width:100%;

    animation: bulletPingAnimation 1200ms  infinite;
}

#pdp-678c #explode .wrapper .bulletping.selected:before{
    border:1px solid #acc3e2;
}

@keyframes bulletPingAnimation{
    0%{
        transform: scale(0.8);
        opacity:1;
    }
    100%{
        transform: scale(3);
        opacity:0;
    }
}

#pdp-678c #explode .wrapper .bulletping#ping1{
    right:19%;
    top:46%;
}

#pdp-678c #explode .wrapper .bulletping#ping2{
    right:47%;
    top:19%;
}

#pdp-678c #explode .wrapper .bulletping#ping3{
    right:75%;
    top:25%;
}

#pdp-678c #explode .wrapper .bulletping#ping4{
    right:31%;
    top:46%;
}

#pdp-678c #explode .wrapper .bulletping#ping5{
    right:34%;
    top:35%;
}

#pdp-678c #explode .wrapper .bulletping#ping6{
    left:38%;
    top:42%;
}

#pdp-678c #explode .wrapper .bulletping#ping7{
    left:42%;
    top:69%;
}

#pdp-678c #explode .wrapper .bulletping#ping8{
    left:22%;
    top:33%;
}

#pdp-678c #explode .wrapper .bulletping#ping9{
    left:30%;
    top:36%;
}

#pdp-678c #explode .wrapper .bulletping#ping10{
    right:24%;
    top:73%;
}

#pdp-678c #explode .wrapper .bulletping#ping11{
    left:36%;
    bottom:10%;
    top:auto;
}

#pdp-678c #explode .wrapper .bulletping#ping12{
    left:44%;
    top:22%;
}

#pdp-678c #explode .wrapper .bulletping#ping13{
    bottom:37%;
    right:54%;
    top:auto;
}

#pdp-678c #explode .wrapper .description{
    background:rgba(255,255,255, 0.9);
    border:1px solid #bbb;
    opacity:0;
    padding:1em;
    pointer-events:none;
    max-width:250px;
}

#pdp-678c #explode .wrapper .description h3{
    font-size:11px;
    margin:0;
    letter-spacing:0;
}

#pdp-678c #explode .wrapper .description.selected{
    opacity:1;
    transition:500ms opacity;
}

#pdp-678c #explode .wrapper .description#d-1a{
    right:20%;
    bottom:56%;
}

#pdp-678c #explode .wrapper .description#d-1b{
    right:43%;
    top:26%;
}

#pdp-678c #explode .wrapper .description#d-1c{
    right:55%;
    top:26%;
}

#pdp-678c #explode .wrapper .description#d-2{
    left:55%;
    top:51%;
}

#pdp-678c #explode .wrapper .description#d-3{
    right:27%;
    top:41%;
}

#pdp-678c #explode .wrapper .description#d-4{
    left:43%;
    top:50%;
}

#pdp-678c #explode .wrapper .description#d-5a{
    left:39%;
    bottom:36%;
}

#pdp-678c #explode .wrapper .description#d-5b{
    left:20%;
    top:37%;
}

#pdp-678c #explode .wrapper .description#d-5c{
    left:33%;
    top:34%;
}

#pdp-678c #explode .wrapper .description#d-6a{
    right:24%;
    bottom:30%;
}

#pdp-678c #explode .wrapper .description#d-6b{
    left:40%;
    bottom:8%;
}

#pdp-678c #explode .wrapper .description#d-6c{
    left:43%;
    top:26%;
}

#pdp-678c #explode .wrapper .description#d-7{
    left:40%;
    bottom:31%;
}

#pdp-678c #explode .wrapper .description p{
    line-height:1.5em;
}


#pdp-678c #explode .loader{
    left:50%;
    position: absolute;
    top:50%;
    transform:translateX(-50%);
    width:40px;
}

#pdp-678c #explode .loader.hidden{
    display:none;
}

#pdp-678c #explode .loader .dot{
    border-radius:50%;
    background:#306dfb;
    display:inline-block;
    height:10px;
    margin-left:5px;
    width:10px;

    
}

#pdp-678c #explode .loader .dot:first-child{
    margin-left:0;
    animation:1000ms loadDot infinite;
}

#pdp-678c #explode .loader .dot:nth-child(2){
    animation:1000ms loadDot infinite 250ms;
}

#pdp-678c #explode .loader .dot:nth-child(3){
    animation:1000ms loadDot infinite 250ms;
}

@keyframes loadDot{
    0%{
        opacity:0;
    }

    50%{
        opacity:1;
    }

    100%{
        opacity:0;
    }
}






/* ============================== 
DOUBLE CONTENT
============================== */
#pdp-678c .double-content{
    background:#141414;
    background-size:cover;
    color:#fff;
    padding:8em 0;
    position: relative;
}

#pdp-corsair #pdp-678c .half{
    vertical-align: middle;
    width:50%;
}

#pdp-678c .double-content p{
    display: block;
    max-width:440px;
}



/* DAMPENING */
#pdp-678c .double-content#dampening{
    background:#000;
    color:#fff;
    height:600px;
    padding:0;
}

#pdp-678c .double-content#dampening .wrapper{
    height:100%;
    padding:0;
}

#pdp-678c .double-content#dampening .half{
    vertical-align:middle;
}

#pdp-678c .double-content#dampening .half.right{
    height:100%;
    margin:0;
}

#pdp-678c .double-content#dampening .half.right img{
    height:100%;
}


/* MULTITUDE */
#pdp-678c .double-content#multitude{
    background:#d9d9d9;
    color:#000;
}

#pdp-678c .double-content#multitude .models ul{
    margin:0;
    padding:0;
    width:130px;
}

#pdp-678c .double-content#multitude .models ul li{
    color: #858786;
    cursor: pointer;
    font-size: 1.1em;
    list-style-type: none;
    padding: 5px 6px 6px 8px;
    text-align:left;
}

#pdp-678c .double-content#multitude .models ul li.selected{
    background:#d8dfdf;
}

#pdp-678c .double-content#multitude .models ul li.selected:before{
    background:#6a93ce;
}

#pdp-678c .double-content#multitude .models ul li:before{
    background:#878787;
    border-radius:50%;
    content:' ';
    display:inline-block;
    height:8px;
    margin-right:10px;
    width:8px;
}

#pdp-678c .double-content#multitude .models ul li a{
    opacity:0.5;
    transition:250ms opacity;
}

#pdp-678c .double-content#multitude .models ul li a:hover,
#pdp-678c .double-content#multitude .models ul li a.selected{
    opacity:1;
}

#pdp-678c .double-content#multitude .models ul li img{
    border-radius:50%;
    box-shadow: 0 0 0 2px #fff;
    width:100%;
}

#pdp-678c .double-content#multitude .item-rotation img {
    outline:none;
}

#pdp-678c .double-content#multitude .item-rotation {
    display:block;
    margin:0 auto;
    max-width:100%;
    opacity:0;
    outline:none;
    position: relative;
}

#pdp-678c .double-content#multitude .item-rotation#radiators{
    position: absolute;
    top:0;
}

#pdp-678c .double-content#multitude .item-rotation.active{
    opacity:1;
    z-index:2;
}

#pdp-678c .double-content#multitude .slick-dots{
    display:block;
    list-style-type:none;
    margin-top:4em;
    padding:0;
    text-align:center;
}

#pdp-678c .double-content#multitude .slick-dots li{
    display:inline-block;
    margin-right:4px;
}

#pdp-678c .double-content#multitude .slick-dots li button{
    background: #333;
    border-radius:50%;
    border:0px;
    display:inline-block;
    font-size:0px;
    outline:none;
    padding-top:12px;
    margin-right:10px;
    transform:scale(1);
    -webkit-transition:250ms transform;
    transition:250ms transform;
    width:12px;
    height:10px;
    color:#ddd;
}

#pdp-678c .double-content#multitude .slick-dots li button:hover,
#pdp-678c .double-content#multitude .slick-dots li.slick-active button{
    transform:scale(1);
    background:#ddd;
    -webkit-transition:250ms transform;
    transition:250ms transform;
}

/* ============================== 
MULTI-PANEL
============================== */
#pdp-678c .multi-panel{
    background:#f7f7f7;
    padding:4em 0;
}

#pdp-678c .multi-panel h1{
    font-size: 1.8em;
    line-height: 1.2;
    letter-spacing: 0.1em;

}

#pdp-678c .multi-panel p{
    color:#000;
    font-size: 1.2em;
    font-weight: 300;
    line-height: 1.75em;
}

#pdp-678c .multi-panel .wrapper{
    display:block;
}

#pdp-678c .multi-panel .wrapper:after{
    content:none;
}

#pdp-678c .multi-panel .header{
    margin:0 auto;
    text-align:center;
    width:500px;
}

#pdp-678c .multi-panel .header h1{
    color:#000;
    font-weight:100;
}

#pdp-678c .multi-panel .header .description{
    max-width:100%;
}

#pdp-678c .multi-panel .content{
    background:none;
    position:relative;
}

#pdp-678c .multi-panel .content .spacer{
    opacity:0;
    position:relative;
    min-height:500px;
}

#pdp-678c .multi-panel .content .slide{
    height:100%;
    left:50%;
    opacity:0;
    pointer-events:none;
    position:absolute;
    top:0;
    transform:translateX(-50%);
    transition:500ms opacity;
    width:100%;
}

#pdp-678c .multi-panel .content .slide.selected{
    pointer-events:auto;
}

#pdp-678c .multi-panel .content .slide .slide-relative{
    position:relative;
}

#pdp-678c .multi-panel .content .slide .slide-relative p{
    margin:0;
    text-align:center;
}

/* ============================== 
DIMENSIONS TAB
============================== */
#pdp-678c .multi-panel .content .slide#dimensions{
    transform:translateX(-50%) scale(0.9) translateY(-20px);
    width:auto;
}

#pdp-678c .multi-panel .content .slide#dimensions .dimensions-img{
    height:100%;
}

#pdp-678c .multi-panel .content .slide#dimensions .slide-relative .measurement-container{
    display:inline-block;
    position:absolute;
}

#pdp-678c .multi-panel .content .slide#dimensions .slide-relative .measurement-container#dimension_1{
    left:9%;
    bottom:93%;
    width:22%;
}

#pdp-678c .multi-panel .content .slide#dimensions .slide-relative .measurement-container#dimension_2{
    left:38%;
    bottom:93%;
    width:52.5%;
}

#pdp-678c .multi-panel .content .slide#dimensions .slide-relative .measurement-container#dimension_3{
    left:71%;
    bottom:45.5%;
    transform:rotate(90deg);
    width:52%;
}

#pdp-678c .multi-panel .content .slide#dimensions .slide-relative .measurement-container#dimension_3 p{
    transform:translateX(-2%);
}

#pdp-678c .multi-panel .content .slide#dimensions .slide-relative .measurement-container:after{
    border-bottom:1px solid #797979;
    content:"";
    position:absolute;
    transform: scaleX(0);
    transition:1200ms transform;
    width:100%;
}

#pdp-678c .multi-panel .content .slide#dimensions.selected .slide-relative .measurement-container:after{
    transform: scaleX(1);
}

/* ============================== 
FAN CAPACITY TAB
============================== */
#pdp-678c .multi-panel .content .slide#fans .slide-relative #key{
    bottom:89%;
    position: absolute;
    right:83.5%;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #key .key-element{
    opacity:0;
    position: relative;
    transform:translateX(10px);

}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #key .key-element#key-120{
    transition:500ms opacity 500ms, 500ms transform 500ms;
}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #key .key-element#key-140{
    transition:500ms opacity 800ms, 500ms transform 800ms;
}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #key .key-element#key-120,
#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #key .key-element#key-140{
    opacity:1;
    transform:translateX(0);
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #key .key-element:before{
    border-radius:50%;
    content:"";
    height:1em;
    position:absolute;
    top:0.3em;
    transform:translateX(-20px);
    width:1em;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #key .key-element p{
    transform:translateY(-2px);
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #key .key-element#key-120:before{
    background: #30b8fe;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #key .key-element#key-140:before{
    background: #a930fe;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #top-bars{
    bottom:90.5%;
    left:28%;
    position:absolute;
    width:47%;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #top-bars .bar-container .bar-120{
    border-radius: 4px;
    display:inline-block;
    margin-right:2%;
    height:8px;
    width:8px;
    transition:500ms width 600ms;
}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #top-bars .bar-container .bar-120{
    width:27%;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #top-bars .bar-container .bar-140{
    border-radius: 4px;
    display:inline-block;
    height:8px;
    margin-right:2%;
    width:8px;
    transition:500ms width 900ms;
}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #top-bars .bar-container .bar-140{
    width:35%;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #right-bars{
    top:20.5%;
    left:calc(81.5% + 1em);
    position:absolute;
    transform:rotate(90deg);
    transform-origin:left top;
    width:40%;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #right-bars p{
    opacity:0;
    position:absolute;
    text-align:right;
    transition:500ms opacity 1200ms;
    width:96%;
}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #right-bars p{
    opacity:1;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #right-bars .bar-container .bar-120{
    border-radius: 4px;
    display:inline-block;
    margin-right:2%;
    height:8px;
    position: relative;
    transition:500ms width 600ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #right-bars .bar-container .bar-120{
    width:32%;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #right-bars .bar-container .bar-120:last-child{
    margin-right:0;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #right-bars .bar-container .bar-140{
    border-radius: 4px;
    display:inline-block;
    height:8px;
    margin-right:2%;
    position: relative;
    transition:500ms width 900ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #right-bars .bar-container .bar-140{
    width:41%;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #left-bars{
    top:23.5%;
    right:calc(33% + 1em);
    position:absolute;
    transform:rotate(90deg);
    transform-origin:left top;
    width:40%;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #left-bars p{
    opacity:0;
    position:absolute;
    text-align:left;
    transition:500ms opacity 1200ms;
    width:96%;
}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #left-bars p{
    opacity:1;
}

#pdp-678c .multi-panel .content .slide#fans .slide-relative #left-bars .bar-container .bar-120{
    border-radius: 4px;
    display:inline-block;
    margin-right:1%;
    height:8px;
    position: relative;
    transition:500ms width 600ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#fans.selected .slide-relative #left-bars .bar-container .bar-120{
    width:30%;
}

/* ============================== 
RADIATOR TAB
============================== */

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #top-bars{
    bottom:90.5%;
    left:28%;
    position:absolute;
    width:47%;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #top-bars .bar-container .bar-120{
    border-radius: 4px;
    display:inline-block;
    margin-right:2%;
    height:8px;
    transition:500ms width 600ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #top-bars .bar-container .bar-120{
    width:35%;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #top-bars .bar-container .bar-140{
    border-radius: 4px;
    display:inline-block;
    height:8px;
    transition:500ms width 600ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #top-bars .bar-container .bar-140{
    width:76%;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #top-bars p{
    opacity:0;
    position: absolute;
    text-align:right;
    transform:translateX(-90% ) translateY(-4px);
    transition:500ms opacity 900ms, 500ms transform 900ms;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #top-bars p{
    opacity:1;
    transform:translateX(calc( -100% - 6px) ) translateY(-4px);

}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars{
    top:20.5%;
    left:calc(81.5% + 9em);
    position:absolute;
    transform:rotate(90deg);
    transform-origin:left top;
    width:43%;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars p{
    margin-left:22%;
    opacity:0;
    text-align:left;
    transition: 500ms opacity 900ms;
    width:78%;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #right-bars p{
    opacity:1;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container .bar-120{
    border-radius: 4px;
    display:inline-block;
    margin-right:2%;
    height:8px;
    position: relative;
    transition:500ms width 600ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container .bar-120:last-child{
    margin-right:0;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container .bar-240{
    border-radius: 4px;
    display:inline-block;
    margin-right:2%;
    height:8px;
    position: relative;
    transition:500ms width 600ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container .bar-280{
    border-radius: 4px;
    display:inline-block;
    margin-right:2%;
    height:8px;
    position: relative;
    transition:500ms width 600ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container .bar-360{
    border-radius: 4px;
    display:inline-block;
    margin-right:2%;
    height:8px;
    position: relative;
    transition:500ms width 600ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #right-bars .bar-container .bar-120{
    width:29%;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #right-bars .bar-container .bar-240{
    width:69%;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #right-bars .bar-container .bar-280{
    width:83%;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #right-bars .bar-container .bar-360{
    width:100%;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #left-bars{
    top:23.5%;
    right:calc(33% + 1em);
    position:absolute;
    transform:rotate(90deg);
    transform-origin:left top;
    width:40%;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #left-bars p{
    opacity:0;
    position:absolute;
    text-align:center;
    top:1em;
    transition:500ms opacity 1000ms;
    width:100%;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #left-bars p{
    opacity:1;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #left-bars .bar-container .bar-120{
    border-radius: 4px;
    display:inline-block;
    margin-right:1%;
    height:8px;
    position: relative;
    transition:500ms width 600ms;
    width:8px;
}

#pdp-678c .multi-panel .content .slide#radiators.selected .slide-relative #left-bars .bar-container .bar-120{
    width:30%;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative .bar-container{
    display:block;
    position:relative;
}

#pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container{
    display:block;
    line-height:8px;
    position:relative;
}

#pdp-678c .multi-panel .content .slide .blue-bar{
    
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-repeat: no-repeat;

    background-image: -webkit-linear-gradient(left, #2079a5  0%, #399ea6 100%);
    background-image: -moz-linear-gradient(left, #2079a5  0%, #399ea6 100%);
    background-image: -o-linear-gradient(left, #2079a5  0%, #399ea6 100%);
    background-image: linear-gradient(to right, #2079a5  0%, #399ea6 100%);
    
}

#pdp-678c .multi-panel .content .slide .purple-bar{
    
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-repeat: no-repeat;

    background-image: -webkit-linear-gradient(left, #6e1fa5  0%, #9c39a6 100%);
    background-image: -moz-linear-gradient(left, #6e1fa5  0%, #9c39a6 100%);
    background-image: -o-linear-gradient(left, #6e1fa5  0%, #9c39a6 100%);
    background-image: linear-gradient(to right, #6e1fa5  0%, #9c39a6 100%);
    
}

#pdp-678c .multi-panel .content .slide .green-bar{
    
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-repeat: no-repeat;

    background-image: -webkit-linear-gradient(left, #14a57a  0%, #24a69f 100%);
    background-image: -moz-linear-gradient(left, #14a57a  0%, #24a69f 100%);
    background-image: -o-linear-gradient(left, #14a57a  0%, #24a69f 100%);
    background-image: linear-gradient(to right, #14a57a  0%, #24a69f 100%);
    
}


#pdp-678c .multi-panel .content .slide .slide-relative .sub-slide{
    height:94%;
    left:50%;
    opacity:0;
    position:absolute;
    top:50%;
    transform:translateX(-50%) translateY(-50%);
    transition:500ms opacity;
}



#pdp-678c .multi-panel .content .slide .slide-relative .sub-slide .mobile-imgs{
    display:none;
}

#pdp-678c .multi-panel .content .slide .slide-relative .sub-slide.to-width{
    height:auto;
    top:calc(50% - 30px);
    transform:translateX(-50%) translateY(-50%);
    width:100%;
}

#pdp-678c .multi-panel .content .slide .slide-relative .sub-slide.to-width img{
    width:100%;
}

#pdp-678c .multi-panel .content .slide .slide-relative .sub-slide.selected{
    opacity:1;
}

#pdp-678c .multi-panel .content .slide .slide-relative .options-nav{
    margin-top:-8em;
    min-width:560px;
    position: relative;
}

#pdp-678c .multi-panel .content .slide .slide-relative .spacer{
    min-height:400px;
}

#pdp-678c .multi-panel .content .slide .slide-relative .legend{
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
}

#pdp-678c .multi-panel .content .slide .slide-relative ul{
    display:block;
    list-style-type: none;
    padding:0;
}

#pdp-678c .multi-panel .content .slide .slide-relative ul li{
    display:inline-block;
    margin-left:16px;
    text-align:center;
    vertical-align: top;
    width:calc(50% - 8px);
}

#pdp-678c .multi-panel .content .slide .slide-relative ul li:nth-child(1){
    margin-left:0px;
}

#pdp-678c .multi-panel .content .slide .slide-relative ul li a{
    color:#000;
    display:block;
    font-weight:500;
    letter-spacing:0.2em;
    line-height:3em;
    text-align:center;
    width:100%;
}

.no-touch #pdp-678c .multi-panel .content .slide .slide-relative ul li a:hover,
#pdp-678c .multi-panel .content .slide .slide-relative ul li a.selected{
    background: #ffffff;
    color:#30b8fe;
}

#pdp-678c .multi-panel .content .slide.selected{
    opacity:1;
}

#pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-button{
    color:#a5a5a5;
    display:inline-block;
    letter-spacing:0.1em;
    position:relative;
    text-align:center;
    transition:250ms color;
    vertical-align:middle;
    width:10%;
}

#pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-button .non-break{
    display:inline;
}

#pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-button:before{
    background:#306dfb;
    bottom:-8px;
    content: "";
    height:2px;
    left:0;
    position:absolute;
    transform:scaleX(0);
    transition:250ms transform;
    width:100%;
}

#pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-button:hover,
#pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-button.selected{
    color:#306dfb;
}

#pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-button:hover:before,
#pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-button.selected:before{
    transform:scaleX(1);
}

#pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-connector{
    border-top:1px solid #6d6d6d;
    display:inline-block;
    vertical-align:middle;
    width:35%;
}

#pdp-678c .multi-panel .asterisks{
    display: block;
    margin:0 auto;
    max-width:500px;
    width:calc(100% - 30px);
}
#pdp-678c .multi-panel .asterisks p{
    line-height:0.8em;
    margin:1em 0 0;
}
#pdp-678c .multi-panel .asterisks p small{
    font-size:0.7em;
}


/* COMMAND */
#pdp-678c .double-content#command{
    background:#fff;
    color:#000;
    padding:0;
}

#pdp-678c .double-content#command .half.right{
    position: relative;
}

#pdp-678c .double-content#command .half.right img.product{
    width:100%;
}

#pdp-678c .double-content#command .half.right img.airflow{
    left:10%;
    position: absolute;
    top:14%;
    width:130%;
}


/* ACCESSIBILITY*/
#pdp-678c .double-content#accessibility{
    background:#d9d9d9;
}

#pdp-678c .double-content#accessibility .models ul{
    margin:0;
    padding:0;
    width:100%;
}

#pdp-678c .double-content#accessibility .models ul li{
    color: #858786;
    cursor: pointer;
    display:inline-block;
    font-size: 1.1em;
    list-style-type: none;
    padding: 5px 6px 6px 8px;
    text-align:left;
    width:50%;
}

#pdp-678c .double-content#accessibility .models ul li.selected:before{
    background:#6a93ce;
}

#pdp-678c .double-content#accessibility .models ul li:nth-child(1){
    text-align:right;
}

#pdp-678c .double-content#accessibility .models ul li:nth-child(1):after{
    border:1px solid #858786;
    border-radius:50%;
    content:' ';
    display:inline-block;
    height:8px;
    margin-left:10px;
    width:8px;
}

#pdp-678c .double-content#accessibility .models ul li:nth-child(2):before{
    border:1px solid #858786;
    border-radius:50%;
    content:' ';
    display:inline-block;
    height:8px;
    margin-right:10px;
    width:8px;
}

#pdp-678c .double-content#accessibility .models ul li:nth-child(1).selected:after,
#pdp-678c .double-content#accessibility .models ul li:nth-child(2).selected:before{
    background:#000;
    border:1px solid rgba(0, 0,0, 0);
}

#pdp-678c .double-content#accessibility .models ul li a{
    opacity:0.5;
    transition:250ms opacity;
}

#pdp-678c .double-content#accessibility .models ul li a:hover,
#pdp-678c .double-content#accessibility .models ul li a.selected{
    opacity:1;
}

#pdp-678c .double-content#accessibility .models ul li img{
    border-radius:50%;
    box-shadow: 0 0 0 2px #fff;
    width:100%;
}

#pdp-678c .double-content#accessibility .item-rotation img {
    outline:none;
    width:100%;
}

#pdp-678c .double-content#accessibility .item-rotation {
    display:block;
    margin:0 auto;
    max-width:100%;
    opacity:0;
    outline:none;
    position: relative;
    transition:500ms opacity;
}

#pdp-678c .double-content#accessibility .item-rotation#radiators{
    position: absolute;
    top:0;
}

#pdp-678c .double-content#accessibility .item-rotation.active{
    opacity:1;
    z-index:2;
}

#pdp-678c .double-content#accessibility .slick-dots{
    display:block;
    list-style-type:none;
    margin-top:4em;
    padding:0;
    text-align:center;
}

#pdp-678c .double-content#accessibility .slick-dots li{
    display:inline-block;
    margin-right:4px;
}

#pdp-678c .double-content#accessibility .slick-dots li button{
    background: #333;
    border-radius:50%;
    border:0px;
    display:inline-block;
    font-size:0px;
    outline:none;
    padding-top:12px;
    margin-right:10px;
    transform:scale(1);
    -webkit-transition:250ms transform;
    transition:250ms transform;
    width:12px;
    height:10px;
    color:#ddd;
}

#pdp-678c .double-content#accessibility .slick-dots li button:hover,
#pdp-678c .double-content#accessibility .slick-dots li.slick-active button{
    transform:scale(1);
    background:#ddd;
    -webkit-transition:250ms transform;
    transition:250ms transform;
}

/* HIGH SPEED */
#pdp-678c .double-content#high-speed{
    height:600px;
}

#pdp-678c .double-content#high-speed .wrapper{
    height:100%;
}

#pdp-678c .double-content#high-speed .half.left{
    height:100%;
}

#pdp-678c .double-content#high-speed .half.right{
    vertical-align:middle;
}

#pdp-678c .double-content#high-speed .background{
    background:url(https://cwsmgmt.corsair.com/pdp/678c/img/highspeed-product.jpg)no-repeat center right;
    background-size:cover;
    height:100%;
    position: absolute;
    top:0;
    width:50%;
}



/* OPTIONS */
#pdp-678c .double-content#options{
    background:#e1e1e1;
    height:600px;
}
#pdp-678c .double-content#options .wrapper{
    height:100%;
}

#pdp-678c .double-content#options .half.left{
    vertical-align:middle;
}

#pdp-678c .double-content#options .half.right{
    height:100%;
}

#pdp-678c .double-content#options .background{
    background:url(https://cwsmgmt.corsair.com/pdp/678c/img/options_product.gif)no-repeat left center;
    background-size:contain;
    height:100%;
    position: absolute;
    right:0;
    top:0;
    width:50%;
}

#pdp-678c .double-content#options .background:before{
    content:'';
    height:100%;
    position:absolute;
    top:0;
    width:150px;

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e1e1e1+0,e1e1e1+100&1+0,0+100 */
    background: -moz-linear-gradient(left, rgba(225,225,225,1) 0%, rgba(225,225,225,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(225,225,225,1) 0%,rgba(225,225,225,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(225,225,225,1) 0%,rgba(225,225,225,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e1e1e1', endColorstr='#00e1e1e1',GradientType=1 ); /* IE6-9 */
}







/* ============================== 
BETTER TOGETHER 
============================== */
#pdp-678c .better_together{
    background:#fff;
    width:100%;
}

#pdp-678c .better_together .content_wrapper_1200{
    margin:0 auto;
    max-width:1200px;
    overflow:auto;
    padding:0 0 12em;
    width:100%;
}

#pdp-678c .better_together .content_wrapper_1200 h1{
    padding:1em 0 1em;
    text-align:center;
    width:100%;
    margin:3em 0 1em;
}


#pdp-678c .better_together .content_wrapper_1200 h1 {
    font-weight:600;
    font-size:2.5em;
}

#pdp-678c .better_together .content_wrapper_1200 h2.item_name {
    font-weight:400;
}

#pdp-678c .better_together .content_wrapper_1200 .sell_item{
    background:#fafafa;
    display:inline-block;
    margin-right:2.25%;
    position:relative;
    text-align:center;
    vertical-align:top;
    width:23%;
}

#pdp-678c .better_together .content_wrapper_1200 .sell_item:last-child{
    margin-right:0;
}


#pdp-corsair #pdp-678c .better_together .content_wrapper_1200 .sell_item .item_name{
    color:#000;
    margin-bottom: 0;
    margin-top: 1em;
    min-height: 3em;
    padding-bottom:0.25em;
    font-size: 2em;
}

#pdp-678c .better_together .content_wrapper_1200 .sell_item .item_image{
    background:#eeeeee;
    padding:2em 0;
    width:100%;
}

#pdp-678c .better_together .content_wrapper_1200 .sell_item .item_image img{
    transform:scale(1);
    width:82%;

    transition:250ms transform;
}

#pdp-678c .better_together .content_wrapper_1200 .sell_item:hover .item_image img{
    transform:scale(1.1);
}

#pdp-corsair #pdp-678c .better_together .content_wrapper_1200 .sell_item .item_subheader{
    color:#9a9a9a;
    font-size:0.9em;
    letter-spacing:0.1em;
    margin-left:7.5px;
    margin-top:0.5em;
    min-height: 35px;
    width:calc(100% - 15px);
}

#pdp-678c .better_together .content_wrapper_1200 .sell_item .item_description,
#pdp-678c .better_together .content_wrapper_1200 .sell_item .item_price{
    color:#959595;
    margin-left:7.5%;
    width:85%;
}

#pdp-678c .better_together .content_wrapper_1200 .sell_item .item_price{
    margin-bottom:7%;
    margin-top:7%;
}

#pdp-678c .better_together .content_wrapper_1200 .sell_item .item_description{
    min-height: 9em;
    line-height: 1.5em;
    letter-spacing: 0em;
}


#pdp-678c .better_together .content_wrapper_1200 .sell_item .cta{
    background:#000;
    color:#fff;
    display:block;
    letter-spacing:0.3em;
    padding:2em 0;
    text-align:center;
    width:100%;

    transition:500ms background;
}

#pdp-678c .better_together .content_wrapper_1200 .sell_item:hover .cta{
    background:#333;
}


/* ============================== 
VIDEO GALLERY
============================== */
#pdp-678c #video-gallery{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#191919+0,292929+100 */
    background: rgb(25,25,25); /* Old browsers */
    background: -moz-linear-gradient(left, rgba(25,25,25,1) 0%, rgba(41,41,41,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(25,25,25,1) 0%,rgba(41,41,41,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(25,25,25,1) 0%,rgba(41,41,41,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#191919', endColorstr='#292929',GradientType=1 ); /* IE6-9 */

    padding:8em 0;
}

#pdp-678c #video-gallery .slideshow{
    margin-top:3em;
}

#pdp-678c #video-gallery .slick-slide{
    height:20vw;
    position:relative;
}

#pdp-678c #video-gallery .slick-slide .slide-thumbnail{
    display:block;
    height:100%;
    margin:0 auto;
    width:80%;
}

#pdp-678c #video-gallery .slick-slide .play-btn{
    cursor:pointer;
    left:50%;
    height:28%;
    position: absolute;
    top:50%;
    transform:translateX(-50%) translateY(-50%);

}

#pdp-678c #video-gallery .header{
    margin:0 auto;
    text-align:center;
    width:600px;
}

#pdp-678c #video-gallery .slick-dots{
    margin-top:3em;
}


#pdp-678c #icue{
    background:black;
    min-height:600px;
    padding:8em 0;
    position: relative;
    text-align:center;
}

#pdp-678c #icue:before{
    background:url(https://cwsmgmt.corsair.com/pdp/678c/img/icue-bg.jpg)no-repeat center;
    background-size:cover;
    content:'';
    height:100%;
    opacity:0.5;
    position: absolute;
    top:0;
    width:100%;
}

#pdp-678c #icue p{
    display: block;
    color:#fff;
    margin:3em auto;
    width:700px;
}




/* ============================== 
GALLERY
============================== */
.homepage-grid {
    padding: 0em ;
    margin:0 0 -1px;
    background-image:-webkit-linear-gradient(top, #000 0%, #fff 100%);
    background-image:-moz-linear-gradient(top, #000 0%, #fff 100%);
    background-image:-0-linear-gradient(top, #000 0%, #fff 100%);
    background-image:linear-gradient(to bottom, #000 0%, #fff 100%);
}

.grid-item  {
    overflow:hidden;
}

.grid-item img {
    width:101%;
    position:absolute;
    top:0;
    left:0;
    
    cursor:pointer;
    
    transform:scale(1);   
    -webkit-transform:scale(1);   
    
    transition: all 500ms ease;
    -webkit-transition: all 500ms ease;

}
.grid-item img:hover {
    transform:scale(1.08);   
    -webkit-transform:scale(1.08);   
    
    transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
}

.grid-item {
    color:#000;
}

.grid-item.horiz-one {
    width:18.75%;   
    height:20.6vw;
}

.grid-item.horiz-two {
    width:31.20%; 
    height:20.6vw;
}

.grid-item.horiz-three {
    width:50%;   
    height:41.2vw;
}

.full_res_image {
    position:absolute !important;
    width: 100% !important;
    height:100% !important;
    top:0;
    left:0;
    display:none;
}

.full_res_image.displaying{
    display:block !important;
}

.full_res_image .close {   
    position: absolute;
    top: 8%;
    right: 7%;
    cursor: pointer;
    background: rgba(255,255,255,0.8);
    padding: 1em;
    border-radius: 50%;
}

.full_res_image .prev_button,
.full_res_image .next_button {
    background:rgba(255, 255, 255, 0.2);
    cursor: pointer;
    display:inline-block;
    height:15%;
    /*padding: 1em;*/
    position: absolute;
    top: 42.5%;
}

.full_res_image .prev_button {
    left: 4%;
}

.full_res_image .next_button {
    right: 4%;
}

.full_res_image .prev,
.full_res_image .next {
    height:100%;
}

.full_res_image .prev,
.full_res_image .next{
    transform:scale(1);
    transition:250ms transform;
}

.full_res_image .prev_button:hover .prev,
.full_res_image .next_button:hover .next{
    transform:scale(0.8);
}

.full_res_image .full_res_container{
    height:100%;
    left:0;
    position:absolute;
    top:0;
    width:100%;
}

.full_res_image .full_res_container .full_res{
    height:100%;
    left:0;
    opacity:0;
    position:absolute;
    top:0;
    width:100%;

    transition:500ms opacity;
}

.full_res_image .full_res_container .full_res.displaying{
    opacity:1;
}

@media only screen and (min-width: 2500px) {}


@media only screen and (max-width: 1400px) {

    /* ============================== 
    DAMPENING
    ============================== */
    #pdp-678c .double-content#dampening{
        height:auto;
    }

    #pdp-678c .double-content#dampening .half.right{
        height:auto;
    }

    #pdp-678c .double-content#dampening .half.right img{
        height:auto;
        width:100%;
    }
}

@media only screen and (max-width: 1200px) {
    /* ============================== 
    HERO
    ============================== */
    #pdp-678c .hero {
        background-position:bottom center;
        background-size:cover;
    }

    #pdp-678c .hero h1 {
        max-width:93%;
    }

    #pdp-678c .hero p:first-child{
        margin-top:0;
    }

    /* ============================== 
    SOPHISTICATED
    ============================== */
    #pdp-678c #sophisticated .left .square, 
    #pdp-678c #sophisticated .right .square{
        height:calc(50vw - 130px);
        width:calc(50vw - 130px);
    }



    /* ============================== 
    BETTER TOGETHER 
    ============================== */
    #pdp-678c .better_together .compare .product,
    #pdp-678c .better_together .compare .product:last-child{
        width:47%;
        margin-left:2%;
        margin-right:0;
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item{
        margin-left:1.8%;
        margin-right:0;
        width:22.5%;
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item .item_name{
        font-size:2em;
        min-height: 71px
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item .item_description{
        min-height:9em;
    }

}

@media only screen and (max-width: 1160px) {
    #pdp-678c .better_together .content_wrapper_1200 .sell_item .item_description{
        min-height:12em;
    }
}

@media only screen and (max-width: 1050px) {
    /* ============================== 
    SOPHISTICATED
    ============================== */
    #pdp-678c #sophisticated .header{
        left:auto;
        margin:0 auto;
        position: relative;
        right:auto;
        text-align:center;
    }

    #pdp-678c #sophisticated .left, 
    #pdp-678c #sophisticated .right{
        display: block;
        margin:0 auto;
        width:395px;
    }

    #pdp-678c #sophisticated .wrapper{
        overflow:hidden;
    }

    #pdp-678c #sophisticated .left .square{
        height:395px;
        margin-top:8em;
        transform:translateX(0);
        width:395px;
    }

    #pdp-678c #sophisticated .right .square{
        height:395px;
        transform:translateX(0);
        width:395px;
    }

    #pdp-678c #sophisticated .left img{
        transform:translateX(-60px) translateY(-40px);
    }

    #pdp-678c #sophisticated .right img{
        transform:translateX(45px) translateY(-19px);
    }

    /* ============================== 
    EXPLODE
    ============================== */
    #pdp-678c #explode{
        margin-top:0;
    }
}

@media only screen and (max-width: 990px) {
    /* ============================== 
    HERO
    ============================== */

    #pdp-678c .hero p:first-child{
        margin-top:0;
    }
    
    #pdp-678c .hero .shop .content_wrapper {
        padding-bottom:50px;   
    }

    /* ============================== 
    SOPHISTICATED
    ============================== */
    #pdp-678c #sophisticated .background{
        height:18%;
    }

    /* ============================== 
    DAMPENING
    ============================== */
    #pdp-678c #dampening{
        overflow:hidden;
    }

    #pdp-678c #dampening .half{
        width:100%;
    }

    #pdp-678c #dampening .half.left{
        display: block;
        margin:8em auto 0;
        text-align:center;
        width:400px;
    }

    #pdp-678c .double-content#dampening .half.right{
        padding-bottom:0;
    }

    /* ============================== 
    COMMAND
    ============================== */
    #pdp-678c #command{
        overflow:hidden;
    }

    #pdp-678c #command .half{
        width:100%;
    }

    #pdp-678c #command .half.left{
        display: block;
        margin:8em auto 0;
        text-align:center;
        width:400px;
    }

    #pdp-678c .double-content#command .half.right{
        padding-bottom:0;
    }

    /* ============================== 
    HIGH SPEED
    ============================== */
    #pdp-678c .double-content#high-speed{
        height:auto;
        padding:0;
    }

    #pdp-678c .double-content#high-speed .background{
        background: url(https://cwsmgmt.corsair.com/pdp/678c/img/highspeed-product.jpg)no-repeat bottom left;
        background-size:contain;
        height:60vw;
        width:100%;
    }

    #pdp-678c .double-content#high-speed .half.left{
        height:60vw !important;
        width:100%;
    }

    #pdp-678c .double-content#high-speed .half.right{
        display:block;
        margin:4em auto 8em;
        text-align:center;
        width:400px;
    }

    /* ============================== 
    OPTIONS
    ============================== */
    #pdp-678c .double-content#options{
        background:#fff;
        height:auto;
        overflow:hidden;
        padding:0;
    }

    #pdp-678c .double-content#options .background{
        background-color:#e1e1e1;
        background-size:contain;
        height:50vw;
        width:100%;
    }

    #pdp-678c .double-content#options .background:before{
        content:none;
    }

    #pdp-678c .double-content#options .half.left{
        display:block;
        margin:calc(50vw + 4em) auto 8em;
        text-align:center;
        width:400px;
    }

    #pdp-678c .double-content#options .half.right{
        height:0;
    }


    /* ============================== 
    BETTER TOGETHER
    ============================== */
    #pdp-678c .hero .better_together .content_wrapper_1200 {
        padding-bottom:50px;   
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item{
        margin-left:2%;
        margin-right:0;
        margin-top:2%;
        width:47%;
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item .item_name{
        font-size:2.8em;
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item:nth-child(2),
    #pdp-678c .better_together .content_wrapper_1200 .sell_item:nth-child(3){
        margin-top:0;
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item .item_description{
        min-height:8em;
    }

}

@media only screen and (max-width: 960px) {
    /* ============================== 
    MULTI-PANEL
    ============================== */
    #pdp-678c .multi-panel .content{
        margin-bottom:2em;
    }

    #pdp-678c .multi-panel .content .spacer{
        height:auto;
        width:100%;
    }

    #pdp-678c .multi-panel .content .slide{
        height:auto;
        width:100%;
    }

    #pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-button{
        display:table;
        margin:auto auto 2em;
        width:auto;
    }

    #pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-connector{
        display:none;
    }

    #pdp-678c .multi-panel .multi-panel-sub-nav .sub-nav-button .non-break{
        display:none;
    }
}

@media only screen and (max-width: 870px) {

    /* ============================== 
    EXPLODE
    ============================== */
    #pdp-678c #explode .wrapper .header{
        right:auto;
        left:50%;
        transform:translateX(-50%);
    }

    #pdp-678c #explode .wrapper .canvasContainer{
        margin-top:8em;
    }

    /* ============================== 
    MULTI
    ============================== */
    #pdp-678c .multi-panel .content .slide .slide-relative .options-nav{
        margin-top:-5em;
    }
}

@media only screen and (max-width: 815px) {  

    /* ============================== 
    MULTI PANEL
    ============================== */
    #pdp-678c .multi-panel .content .slide .slide-relative ul li,
    #pdp-678c .multi-panel .content .slide .slide-relative ul li:nth-child(1){
        display:block;
        margin:0 auto;
        max-width:420px;
        width:100%;
    }
}

@media only screen and (max-width: 768px) {

    /* ============================== 
    HERO 
    ============================== */

    #pdp-678c .hero .content_wrapper{
        padding:0 15px;
    }

    #pdp-678c .hero h1{
        font-size:11em;
        color:white !important;
    }

   
    #pdp-678c .hero p {
        padding-top:0.5em;
    }

    #pdp-678c .hero p small{
        color:white;
    }

    #pdp-678c .hero .bg_product{
        margin: 0 auto 2%;
    }

    #pdp-678c .cta {
        margin-top: 2em;
    }
    
    #pdp-678c .hero video {
        display:none !important;        
    }

    #pdp-678c .hero .cta{
        margin:4em auto 0;
    }

    /* ============================== 
    SOPHISTICATED
    ============================== */

    #pdp-678c #sophisticated.triggered .left img{
        transform: translateX(-30px) translateY(-30px);
    }

    #pdp-678c #sophisticated.triggered .right img{
        transform:translateX(30px) translateY(-30px);
    }

    /* ============================== 
    MULTITUDE
    ============================== */
    #pdp-678c .double-content#multitude{
        padding:2em 0;
    }

    #pdp-678c .double-content#multitude .wrapper{
        text-align:center;
    }

    #pdp-678c .double-content#multitude .right{
        margin-left:0;
        width:100%;
    }

    #pdp-678c .double-content#multitude .right p{
        width:100%;
    }
    
    #pdp-678c .double-content#multitude .left {
        width:calc(60% - 15px);
    }

    #pdp-678c .double-content#multitude .models ul{
        margin:0 auto;
    }

    /* ============================== 
    ACCESSIBILITY
    ============================== */
    #pdp-678c .double-content#accessibility{
        padding:2em 0;
    }

    #pdp-678c .double-content#accessibility .wrapper{
        text-align:center;
    }

    #pdp-678c .double-content#accessibility .right{
        margin-left:0;
        width:100%;
    }

    #pdp-678c .double-content#accessibility .right p{
        width:100%;
    }
    
    #pdp-678c .double-content#accessibility .left {
        width:100%;
    }

    #pdp-678c .double-content#accessibility .models ul{
        margin:0 auto;
    }

    /* ============================== 
    DOUBLE CONTENT
    ============================== */

    #pdp-678c .double-content .wrapper{
        width:calc(100% - 10%);
    }

    #pdp-678c .double-content .half.right{
        margin:0;
        width:100%;
    }

    #pdp-678c .double-content h1{
        /*margin-bottom:0;*/
    }

    #pdp-678c .double-content p{
        max-width:100%;
    }


    /* ============================== 
    MULTI PANEL
    ============================== */
    #pdp-678c .multi-panel .wrapper{
        margin:0;
        width:100%;
    }
    #pdp-678c .multi-panel .content{
        margin-bottom:0;
    }

    #pdp-678c .multi-panel .content .slide#dimensions{
        transform: translateX(-50%) scale(0.9) translateY(10vw);
        width:100%;
    }

    #pdp-678c .multi-panel .content .slide#dimensions .dimensions-img{
        height:auto;
        width:100%;
    }

    #pdp-678c .multi-panel .content .slide#dimensions .slide-relative .measurement-container:after{
        transform:translateX(-50%) scale(0);
    }

    #pdp-678c .multi-panel .content .slide#dimensions.selected .slide-relative .measurement-container:after{
        /*transform:translateX(-50%) scale(1);*/
    }

    #pdp-678c .multi-panel .content .spacer{
        height:83vw;
        min-height:0;
    }

    #pdp-678c .multi-panel .content .slide .slide-relative .spacer{
        height:auto;
    }

    #pdp-678c .multi-panel .content .slide .slide-relative .sub-slide .desktop-img{
        display:none;
    }

    #pdp-678c .multi-panel .content .slide .slide-relative .sub-slide .mobile-imgs{
        display:block;
    }

    #pdp-678c .multi-panel .content .slide .slide-relative .sub-slide,
    #pdp-678c .multi-panel .content .slide .slide-relative .sub-slide.to-width{
        height:auto;
        left:0;
        opacity:0;
        position:absolute;
        top:30px;
        transform:none;
        width:100%;
    }

    #pdp-678c .multi-panel .content .slide .slide-relative .sub-slide.selected{
        opacity:1;
    }

    #pdp-678c .multi-panel .content .slide .slide-relative .sub-slide.to-width{
        width:100%;
    }

    #pdp-678c .multi-panel .content .slide .slide-relative .options-nav{
        margin-top:0;
        position:absolute;
        top:0;
        width:100%;
    }

    #pdp-678c .multi-panel .content .slide .slide-relative .legend{
        top:103px;
    }

    #pdp-678c .multi-panel .asterisks{
        text-align:left;
    }


    /* ============================== 
    BETTER TOGETHER 
    ============================== */
    #pdp-678c .better_together .compare .product .product_title img{
        width:55%;
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item{
    }

    #pdp-678c .content_wrapper_1200 .sell_item .item_description{
        min-height:8em;
    }

    /* ============================== 
    ICUE
    ============================== */
    #pdp-678c #icue p{
        width:100%;
    }

    #pdp-678c #icue img{
        width:60vw;
    }

    /* ============================== 
    GRID 
    ============================== */
    .grid-item img{
        width:105%;
    }

    .grid-item.horiz-one{
        height:40vw;
        width:40%;
    }
    
    .grid-item.horiz-two{
        height:40vw;
        width:60%;
    }
    
    .grid-item.horiz-three{
        height:60vw;
        width:100%;
    }

}

@media only screen and (max-width: 678px) {
    #pdp-678c .better_together .content_wrapper .sell_item .item_description{
        min-height:7em;
    }
}


@media only screen and (max-width: 650px) {
    /* ============================== 
    MULTI-PANEL
    ============================== */

    #pdp-678c .multi-panel .content .slide#fans .slide-relative #right-bars{
        left:auto;
        right:15px;
        top:82.5%;
        transform-origin:right top;
    }

    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars{
        left:calc(81.5% + 6.5em);
    }

    #pdp-678c .multi-panel .content .slide#fans .slide-relative #right-bars .bar-container .bar-120,
    #pdp-678c .multi-panel .content .slide#fans .slide-relative #right-bars .bar-container .bar-140,
    #pdp-678c .multi-panel .content .slide#fans .slide-relative #top-bars .bar-container .bar-120,
    #pdp-678c .multi-panel .content .slide#fans .slide-relative #top-bars .bar-container .bar-140,
    #pdp-678c .multi-panel .content .slide#fans .slide-relative #left-bars .bar-container .bar-120,
    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #left-bars .bar-container .bar-120,
    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #top-bars .bar-container .bar-120,
    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #top-bars .bar-container .bar-140,
    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container .bar-120,
    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container .bar-240,
    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container .bar-280,
    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container .bar-360{
        border-radius:2px;
        height:4px;
    }

    #pdp-678c .multi-panel .content .slide#radiators .slide-relative .bar-container{
        margin-top:0;
    }

    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars .bar-container{
        line-height:2px;
    }

    #pdp-678c .multi-panel .content .slide#radiators .slide-relative #right-bars p{
        line-height:1em;
        margin-top:3px;
    }

    /* ============================== 
    BETTER TOGETHER
    ============================== */
    #pdp-678c .better_together .content_wrapper_1200 .sell_item,
    #pdp-678c .better_together .content_wrapper_1200 .sell_item:last-child{
        display:block;
        margin:6% auto 0;
        max-width:345px;
        width:96%;
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item:nth-child(2),
    #pdp-678c .better_together .content_wrapper_1200 .sell_item:nth-child(3){
        margin:6% auto 0;
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item .item_name{
        min-height:0;
    }

    #pdp-678c .better_together .content_wrapper_1200 .sell_item .item_description{
        min-height:0;
    }

    /* ============================== 
    VIDEO GALLERY
    ============================== */
    #pdp-678c #video-gallery .header{
        width:100%;
    }

    #pdp-678c #video-gallery .slick-slide{
        height:38vw;
    }
}


@media only screen and (max-width: 579px) {

    #pdp-678c .hero .cta{
        margin-top:2em;
    }

    #pdp-678c .hero h1{
        font-size:10em;
    }

    #pdp-678c .hero h2{
        font-size:3em;
    }

    /* ============================== 
    SOPHISTICATED
    ============================== */
    #pdp-678c #sophisticated .header{
        width:100%;
    }

    #pdp-678c #sophisticated .left, 
    #pdp-678c #sophisticated .right{
        width:100%;
    }
    
    #pdp-678c #sophisticated .left .square,
    #pdp-678c #sophisticated .right .square{
        height:80vw;
    }

    #pdp-678c #sophisticated .left .square{
        width:calc(100% - 43px);
    }

    #pdp-678c #sophisticated .left img{
        transform:translateX(0px) translateY(0px);
    }

    #pdp-678c #sophisticated .right .square{
        width:calc(100% - 43px);
    }

    #pdp-678c #sophisticated .right img{
        transform:translateX(0px) translateY(0px);
    }

    /* ============================== 
    EXPLODE
    ============================== */
    #pdp-678c #explode .wrapper{
        margin:0;
        width:100%;
    }



 #pdp-678c #explode .wrapper .bulletping{
        background:#acc3e2;
    }

    #pdp-678c #explode .wrapper .bulletping.selected{
        background:#306dfb;
    }

    #pdp-678c #explode .wrapper .bulletping:before{
        border:1px solid #acc3e2;
    }

    #pdp-678c #explode .wrapper .bulletping.selected:before{
        border:1px solid #306dfb;
    }


}


@media only screen and (max-width: 570px) {

    /* ============================== 
    MULTI-PANEL
    ============================== */
    #pdp-678c .multi-panel .header{
        width:100%;
    }

    #pdp-678c .multi-panel .content .slide .slide-relative .options-nav{
        min-width:0;
        width:100%;
    }

}

@media only screen and (max-width: 540px) {
    #pdp-678c .multi-panel .content .spacer{
        height:85vw;
        min-height:0;
    }
}


@media only screen and (max-width: 500px) {

    /* ============================== 
    HERO
    ============================== */
    
    #pdp-678c .hero {
        min-height: 140vw;
        margin-top: 16px;
    }
    
    #pdp-678c .hero .content_wrapper {
        overflow:hidden;
        padding-bottom:40px;
        text-align: center;
    }

    #pdp-678c #hero .ces{
        left:20px;
        transform:none;
        width:calc(100vw - 40px);
    }

    #pdp-678c .hero .ces p{
        bottom:74%;
        font-size:0.8em;
        left:0%;
        width:calc(100% - 70px);
    }

 ===#pdp-678c .hero .content_wrapper h3{
        top:69%;
    }

    #pdp-678c .hero .content_wrapper .bg_name{
        margin: 4% auto;
    }

    #pdp-678c .hero .content_wrapper .hero_mouse{
        margin: 19% auto 0;
    }

    /* ============================== 
    EXPLODE
    ============================== */
    #pdp-678c #explode .wrapper .canvasContainer{
        margin-bottom:10em;
    }

    #pdp-678c #explode .wrapper .description#d-1a,
    #pdp-678c #explode .wrapper .description#d-1b,
    #pdp-678c #explode .wrapper .description#d-1c,
    #pdp-678c #explode .wrapper .description#d-2,
    #pdp-678c #explode .wrapper .description#d-3,
    #pdp-678c #explode .wrapper .description#d-4,
    #pdp-678c #explode .wrapper .description#d-5a,
    #pdp-678c #explode .wrapper .description#d-5b,
    #pdp-678c #explode .wrapper .description#d-5c,
    #pdp-678c #explode .wrapper .description#d-6a,
    #pdp-678c #explode .wrapper .description#d-6b,
    #pdp-678c #explode .wrapper .description#d-6c,
    #pdp-678c #explode .wrapper .description#d-7{
        bottom:18px;
        left:50%;
        text-align:center;
        top:auto;
        transform:translateX(-50%);
        width:calc(100% - 36px);

    }



    /* ============================== 
    DOUBLE CONTENT
    ============================== */
    #pdp-678c .double-content .wrapper{
        width:calc(100% - 30px);
    }


    /* ============================== 
    BETTER TOGETHER 
    ============================== */

    #pdp-678c .better_together .compare .product,
    #pdp-678c .better_together .compare .product:last-child{
        width:90%;
        margin-left:5%;
    }

    #pdp-678c .better_together .compare .product:last-child{
        margin-top:10%;
    }

}


@media only screen and (max-width: 479px) {


    /* ============================== 
    DAMPENING
    ============================== */
    #pdp-678c #dampening .half.left{
        width:100%;
    }

    /* ============================== 
    COMMAND
    ============================== */
    #pdp-678c #command .half.left{
        width:100%;
    }

    /* ============================== 
    HIGH SPEED
    ============================== */
    #pdp-678c .double-content#high-speed .half.right{
        width:100%;
    }

    /* ============================== 
    OPTIONS
    ============================== */
    #pdp-678c .double-content#options .half.left{
        width:100%;
    }

    /* ============================== 
    MULTI
    ============================== */
    #pdp-678c .multi-panel .content .slide .slide-relative ul li a{
        font-size:0.8em;
    }
}

@media only screen and (max-width: 400px) {}