.yellow {
    color: #e9e600;
}

.lowercase {
    text-transform: lowercase;
}

.nowrap {
    white-space: nowrap;
}

/*#pdp-corsair #domplat section p
#domplat a,
#domplat a:active {
    font-size: 1.3rem;
}*/



.main-content #domplat section .font-header-condensed {
    font-family: 'bebas-neue-pro-semiexpanded';
    letter-spacing: 0em;
}

#pdp section h2.bebas,
.main-content #domplat section h2.bebas {
    font-family: 'bebas-neue-pro-semiexpanded', sans-serif;
    font-size: 3.75rem;
    font-weight: 600;
    letter-spacing: .1rem;
    line-height: 3.75rem;
}

#pdp h6 {
    text-transform: uppercase;
    font-weight: 600;
    line-height: 2.3em;
    letter-spacing: .1em;
}

#pdp .panel-template p,
#pdp-corsair #domplat section p {
    font-family: aktiv-grotesk, sans-serif;
    font-size: 1.3rem;
    font-weight: 400;
    letter-spacing: .05rem;
    line-height: 2.25rem;
}

#pdp .panel-template p.white {
    font-weight: 400;
}

#domplat a,
#domplat a:active {
    font-family: aktiv-grotesk, sans-serif;
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: .2rem;
}

#pdp-corsair .cta.yellow,
#pdp .panel-template .white .cta {
    background-color: #e9e600;
    color: #000;
    font-family: aktiv-grotesk, sans-serif;
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: .2rem;
    padding-bottom: .75rem;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    padding-top: .95rem;
    position: relative;
}

#pdp-corsair .cta.yellow:hover,
#pdp .panel-template .white .cta:hover {
    color: #000;
    opacity: .7;
}


/* ==============================
HEADER
============================== */

#domplat .hero {
    height: auto;
    min-height: 100vh;
}

#domplat .hero .hero-overlay-mobile {
    display: none;
}

#domplat .hero .content_wrapper {
    background-color: rgba(0, 0, 0, .3);
}

.main-content #domplat section.hero h2.font-header-condensed {
    color: #fff;
    font-family: 'bebas-neue-pro-semiexpanded';
    font-size: 6rem;
    font-weight: 600;
    line-height: 5.6rem;
    text-shadow: 0 2px 13px rgb(0 0 0 / 80%);
    white-space: nowrap;
}

#domplat .hero h2 {
    color: #e9e600;
    font-family: aktiv-grotesk, sans-serif;
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: .1rem;
    line-height: 2rem;
}

#domplat .hero h3.tagline {
    font-family: verveine, sans-serif;
    font-size: 3.75rem;
    font-weight: 300;
    letter-spacing: unset;
    margin: .25em auto;
    text-shadow: 0 2px 13px rgb(0 0 0 / 80%);
}

#pdp-corsair #domplat section.hero p {
    font-size: 1.3rem;
    margin: 0 auto 20px;
    max-width: 90%;
    text-shadow: 0 2px 13px rgb(0 0 0 / 80%);
    width: 660px;
}



/* ==============================
DO IT ALL
============================== */

#pdp.std-blk #do-it {
    background: #111 url('https://assets.corsair.com/image/upload/v1/akamai/img/reusable/pdp-blk-bkg-triangle.png') center no-repeat;
    background-size: cover;
}



/* ==============================
REGULATION
============================== */

#pdp.std-blk #voltage {
    background: url('https://assets.corsair.com/image/upload/v1/akamai/img/reusable/pdp-blk-bkg-left-triangle.png') center no-repeat, url('https://assets.corsair.com/image/upload/v1/akamai/pdp/dram/vengeance-rgb-ddr5/images/veng_rgb_ddr5_voltage_2x.jpg') center no-repeat;
    background-color: #000;
    background-size: cover;
}



/* ==============================
INTEL PROFILES
============================== */

#pdp.std-blk #intel-profiles {
    background: url('https://assets.corsair.com/image/upload/v1/akamai/img/reusable/pdp-blk-bkg-right-triangle.png') center no-repeat, url('https://assets.corsair.com/image/upload/v1/akamai/pdp/dram/vengeance-rgb-ddr5/images/veng_rgb_ddr5_profiles_2x.jpg') center no-repeat;
    background-color: #000;
    background-size: cover;
}



/* ==============================
SOFTWARE
============================== */

#pdp.std-blk #software {
    background-color: #111;
}



/* ==============================
COLOR PROFILES
============================== */

#domplat #icue {
    background-color: #000;
    background-image: none;
}

#domplat #icue .wrapper {
    display: block;
    left: 50%;
    max-width: 600px;
    position: absolute;
    text-align: left;
    top: 50%;
    transform: translate(50%, -50%);
}

#domplat #icue video {
    left: 35%;
}

#domplat #icue .logo,
#pdp-corsair #domplat section p,
#domplat #icue .subnav {
    margin-left: 0;
    margin-right: 0;
}

#domplat #icue .logo {
    width: 160px;
}

#domplat #icue .cta {
    font-size: 1em;
    margin-top: 3em;
}

#domplat #icue .subnav {
    width: 100%;
}

#domplat #icue .subnav .subnav-item.square {
    border-radius: 12px;
}

#domplat #icue .subnav .subnav-item.line {
    width: 28px;
}

#domplat #icue .subnav .subnav-item.square p {
    line-height: 1rem;
}

/*.main-content #domplat section h2.bebas {
    font-family: bebas-neue-pro-semiexpanded, sans-serif;
    font-size:3.5em;
    letter-spacing:.05em;
    font-weight: 600;
}*/

#domplat #icue p {
    margin: 12.5px auto;
    width: auto;
}



/* ============================== 
FEATURES
============================== */

#smalcode-extended .features-overview {
    background: #000 url('https://assets.corsair.com/image/upload/v1/akamai/img/reusable/pdp-blk-bkg-right-triangle.png') center no-repeat;
    background-size: cover;
    color: #fff;
    padding: 5vw 0;
}


.feature-pre img {
    max-width: 100%;
}

.virtuoso-overview h2 {
    color: #fff !important;
}

#pdp-corsair .virtuoso-overview .feature-list h4:before,
.main-content .virtuoso-overview .feature-list h4:before {
    background-image: url('https://assets.corsair.com/image/upload/v1/akamai/pdp/dominator-platinum-ddr5/images/plus-circle.svg');
}

#pdp-corsair .virtuoso-overview .feature-list--se .is-yellow.is-active h4:before,
.main-content .virtuoso-overview .feature-list--se .is-yellow.is-active h4:before {
    background-image: url('https://assets.corsair.com/image/upload/v1/akamai/pdp/dominator-platinum-ddr5/images/minus-yellow.svg');
}

#pdp-corsair .virtuoso-overview .feature-list h4,
.main-content .virtuoso-overview .feature-list h4 {
    font-family: aktiv-grotesk, sans-serif;
    font-weight: 600;
    letter-spacing: .1em;
}

#pdp-corsair .virtuoso-overview .feature-list .is-active p,
.main-content .virtuoso-overview .feature-list .is-active p {
    font-family: aktiv-grotesk, sans-serif;
    font-size: .85rem;
    font-weight: 400;
    letter-spacing: .05rem;
    line-height: 1.5em;
}



/* ==============================
COMPATIBLE
============================== */

#pdp.std-blk #compatible {
    background: url('https://assets.corsair.com/image/upload/v1/akamai/img/reusable/pdp-blk-bkg-left-triangle.png') center no-repeat, url('https://assets.corsair.com/image/upload/v1/akamai/pdp/dram/vengeance-rgb-ddr5/images/veng_rgb_ddr5_compat_2x.jpg') center no-repeat;
    background-color: #000;
    background-size: cover;
}



/* ==============================
WARRANTY
============================== */

#pdp.std-blk #warranty {
    background: #000 url('https://assets.corsair.com/image/upload/v1/akamai/pdp/dram/vengeance-rgb-ddr5/images/veng_rgb_ddr5_warranty_2x.jpg') center no-repeat;
    background-size: cover;
}


@media only screen and (max-width: 1920px) {

    /* ==============================
    COLOR PROFILES
    ============================== */

    #domplat #icue .wrapper {
        transform: translate(30%, -50%);
    }

}


@media only screen and (max-width: 1600px) {

    /* ==============================
    COLOR PROFILES
    ============================== */

    #domplat #icue .wrapper {
        transform: translate(15%, -50%);
    }

}


@media only screen and (max-width: 1310px) {

    /* ==============================
    COLOR PROFILES
    ============================== */

    #domplat #icue {
        height: 105vw;
    }

    #domplat #icue .wrapper {
        margin: 0;
        top: 0;
        left: 10%;
        transform: translate(0, 0);
        width: 50%;
    }

}


@media only screen and (max-width: 1200px) {

    /* ============================== 
    HERO
    ============================== */
    #domplat .hero {
        background-position: bottom center;
        background-size: cover;
    }

    #domplat .hero h1 {
        max-width: 93%;
    }

    #domplat .hero p:first-child {
        margin-top: 0;
    }
}



@media only screen and (max-width: 990px) {

    /* ============================== 
    HERO
    ============================== */

    #domplat .hero p:first-child {
        margin-top: 0;
    }

    #domplat .hero .shop .content_wrapper {
        padding-bottom: 50px;
    }
}



@media only screen and (max-width: 960px) {

    /* ============================== 
    COLOR PROFILES
    ============================== */

    #domplat #icue .subnav .subnav-item.line {
        width: 25px;
    }

    #domplat #icue .subnav .subnav-item.square p {
        font-size: .5em;
    }
}



@media only screen and (max-width: 768px) {

    /* ============================== 
    HERO 
    ============================== */

    #domplat .hero .content_wrapper {
        background: url('https://assets.corsair.com/image/upload/v1/akamai/pdp/dram/vengeance-rgb-ddr5/images/veng_rgb_ddr5_hero_still_mobile.jpg') center no-repeat;
        background-size: cover;
        padding: 0 15px;
    }

    #domplat .hero .hero-overlay-mobile {
        background-color: rgba(0, 0, 0, .3);
        display: block;
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: 0;
    }

    .main-content #domplat section.hero h2 {
        position: relative;
    }

    .main-content #domplat section.hero h2.font-header-condensed {
        white-space: unset;
    }

    /*#domplat .hero h1{
        font-size:11em;
    }*/

    #pdp-corsair #domplat section.hero p {
        margin: 0 auto;
        padding-top: 0.5em;
        width: 90%;
    }

    #domplat .hero .bg_product {
        margin: 0 auto 2%;
    }

    #domplat .cta {
        margin-top: 2em;
    }

    #domplat .hero video {
        display: none !important;
    }

    #domplat .hero .cta {
        margin: 4em auto 0;
    }



    /* ============================== 
    COLOR PROFILES
    ============================== */

    #domplat #icue {
        background-image: url('https://assets.corsair.com/image/upload/v1/akamai/pdp/dram/vengeance-rgb-ddr5/videos/profiles/Vengeance_RGB_DDR5_WaterColor.gif');
        background-position: center 70%;
        background-repeat: no-repeat;
        background-size: contain;
    }

    #domplat #icue .wrapper {
        left: 0;
        margin-left: 5%;
        margin-right: 5%;
        max-width: unset;
        position: relative;
        transform: unset;
        width: 90%;
        text-align: center;
    }



    /* ==============================
    VOLTAGE
    ============================== */

    #pdp.std-blk #voltage {
        background-position: 75% center;
    }



    /* ==============================
    INTEL PROFILES
    ============================== */

    #pdp.std-blk #intel-profiles {
        background-position: 30% center;
    }



    /* ============================== 
    FEATURES
    ============================== */

    .feature-pre img {
        max-width: 100%;
        transform: unset;
    }



    /* ==============================
    COMPATIBLE
    ============================== */

    #pdp.std-blk #compatible {
        background-position: right center;
    }

    #compatible .col-half {
        text-align: center;
    }
}



@media only screen and (max-width: 579px) {

    /* ============================== 
    HERO 
    ============================== */

    #domplat .hero .cta {
        margin-top: 2em;
    }

    .main-content #domplat section.hero h2.font-header-condensed {
        font-size: 4.5rem;
        line-height: 4.5rem;
    }

    #domplat .hero h2 {
        font-size: 3em;
    }



    /* ============================== 
    COLOR PROFILES
    ============================== */

    #domplat #icue {
        background-position: center 85vh;
        height: 205vw;
    }

    #pdp-corsair #domplat section p {
        font-size: 1.3rem;
        font-weight: 200;
    }

    #domplat #icue .wrapper {
        left: 0;
    }

    #domplat #icue .cta {
        margin-top: 75vw;
    }

    #domplat #icue .subnav {
        margin: 2em auto 4em;
    }

}



@media only screen and (max-width: 500px) {

    /* ============================== 
    HERO
    ============================== */

    #domplat .hero {
        min-height: 140vw;
        margin-top: 16px;
    }

    #domplat .hero .content_wrapper {
        overflow: hidden;
        padding-top: 7vw;
        padding-bottom: 7vw;
        text-align: center;
    }

    #domplat #hero .ces {
        left: 20px;
        transform: none;
        width: calc(100vw - 40px);
    }

    #domplat .hero .ces p {
        bottom: 74%;
        font-size: 0.8em;
        left: 0%;
        width: calc(100% - 70px);
    }

    #domplat .hero .content_wrapper h3 {
        font-size: 3rem;
        line-height: 3.25rem;
        top: 69%;
    }

    #domplat .hero .content_wrapper .bg_name {
        margin: 4% auto;
    }

    #domplat .hero .content_wrapper .hero_mouse {
        margin: 19% auto 0;
    }
}





@media only screen and (max-width: 475px) {



    /* ============================== 
    COLOR PROFILES
    ============================== */

    #domplat #icue {
        background-position: center 70%;
        /*        height: 130vh;*/
    }

}



@media only screen and (max-width: 413px) {



    /* ============================== 
    COLOR PROFILES
    ============================== */

    #domplat #icue {
        /*        height: 150vh;*/
    }
}
