@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese');

@import url('https://use.typekit.net/lgv1xst.css');

.Titlebar {
    display: block;
    width: 100%;
    padding: 0 15px;

}

.Titlebar img {
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

.Titlebar h2 {
    font-size: 54px;
    line-height: 1.5;
    /* font-family: 'Sarpanch',
        'din_pro_bold',
        'cwTeXHei',
        'Microsoft JhengHei'; */

    font-family: "industry-inc-base",
        sans-serif;

}

@media screen and (max-width: 960px) {
    .Titlebar h2 {
        font-size: 32px;
        font-weight: bold;
    }
}

.Titlebar h3 {
    font-size: 20px;
    line-height: 1.2;
    font-weight: normal;
    color: #FFF;
    font-size: 17px;
    text-transform: uppercase;
}

.Titlebar__txtBox {
    display: block;
    width: 90%;
    margin: 0 auto;
    padding: 15px;
}

.sub-group .pd-block .title--main {
    color: #fff;
}

.theme .sub-feature-nav .slick-slide {
    position: relative;
}

.theme .sub-feature-nav .slick-slide>div {
    position: relative;
    z-index: 5;
}

.theme .sub-feature-nav li {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    text-transform: uppercase;
    text-align: center;
    /* font-weight: 700; */
    border-bottom: #262626 1px solid;
    border-top: #262626 1px solid;
    padding: 10px 15px;
    margin: 0;
}



.theme .sub-feature-nav li img {
    /* width: 80px; */
    display: none;
}

.theme .sub-feature-nav li span {
    line-height: 1;
    height: 50px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.theme .pd-container img {
    max-width: 100%;
}

.theme .pd-container {
    position: relative;
    top: -65px;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

.theme .sub-group {

    background-position: center top;
}

.theme .sub-group .sub-titlebox {
    width: 100%;
    border-top: none;
    text-align: center;
    /* font-family: "DINCond-Bold"; */
    color: #fff;
    margin: 0px auto;
    padding: 100px 0px 0px;
    position: relative;
    max-width: 1280px;
}

.theme .sub-tabbox {
    position: relative;
    z-index: 2;
    padding: 40px 0px 60px;
    /* background: url(../images/sub-tabbox-bg.png) repeat-x center top; */
}

.theme .slider__class1-prev {
    left: -20px;
    cursor: pointer;
}

.theme .slider__class1-next {
    right: -20px;
    cursor: pointer;
}

@media (max-width: 1024px) {
    .theme .slider__class1-prev {
        left: 0px;
    }

    .theme .slider__class1-next {
        right: 0px;
    }
}

@media (max-width: 574px) {
    .theme .slick-slide {}

    .theme .sub-tabbox {
        padding: 0px 0px 40px;
    }

    .theme .sub-tabbox .slick-slide {
        padding: 0px;
        min-width: auto;
        /* font-size: 24px; */
    }

    .theme .sub-tabbox .slick-slide li {}

    .theme .sub-feature-nav li span {
        min-height: 70px;
    }

    .theme .pd-container {
        top: -40px;
    }
}

/*MEG*/
.theme-meg {

    background-image: url("https://storage-asset.msi.com/global/picture/image/feature/PC-Case/MEG_PROSPECT_700RL/images/msi-meg-prospect-700rl-background.jpg");
    background-position: center;
    background-attachment: fixed;
    background-size: 100%;
    background-repeat: no-repeat;
}

@media screen and (max-width: 1920px) {
    .theme-meg {
        background-image:
            url("https://storage-asset.msi.com/global/picture/image/feature/PC-Case/MEG_PROSPECT_700RL/images/msi-meg-prospect-700rl-bg-1920.jpg");

    }
}

@media screen and (max-width: 960px) {
    .theme-meg {
        background-image:
            url("https://storage-asset.msi.com/global/picture/image/feature/PC-Case/MEG_PROSPECT_700RL/images/msi-meg-prospect-700rl-bg-mobile.jpg");

    }
}

.theme-meg .title--main {
    color: #E2C080;
}

.theme-meg .Titlebar h2 {
    color: #E2C080;
}

.theme-meg .sub-tabbox .slick-slide {
    /* white-space: nowrap; */
    color: #fff;
    font-size: 20px;
    /* font-family: 'Sarpanch', 'din_pro_bold', 'cwTeXHei', 'Microsoft JhengHei'; */
    cursor: pointer;
}

.theme-meg .sub-tabbox .slick-current {
    color: #E2C080;
    position: relative;
}

.theme-meg .sub-tabbox .slick-current::after,
.theme-meg .sub-feature-nav .slick-slide:hover::after {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    bottom: 0;
    z-index: 1;
    /* background: #E2C080; */
    background: rgb(226, 192, 128);
    background: radial-gradient(circle, rgba(226, 192, 128, 0.7511598389355743) 9%, rgba(226, 192, 128, 0.45704219187675066) 37%, rgba(226, 192, 128, 0.41222426470588236) 53%, rgba(226, 192, 128, 0.4402354691876751) 74%, rgba(226, 192, 128, 0.02006740196078427) 100%);
}


.theme-meg .sub-tabbox .slick-current::before,
.theme-meg .sub-feature-nav .slick-slide:hover::before {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    top: 0;
    z-index: 1;
    /* background: #E2C080; */
    background: rgb(226, 192, 128);
    background: radial-gradient(circle, rgba(226, 192, 128, 0.7511598389355743) 9%, rgba(226, 192, 128, 0.45704219187675066) 37%, rgba(226, 192, 128, 0.41222426470588236) 53%, rgba(226, 192, 128, 0.4402354691876751) 74%, rgba(226, 192, 128, 0.02006740196078427) 100%);

}

/*slick Arrow color*/
.theme-meg .theme-arrow .slick-prev:before,
.theme-meg .theme-arrow .slick-next:before {
    color: #E2C080;
}

/*MPG*/
.theme-mpg {

    background-image: url("https://storage-asset.msi.com/global/picture/image/feature/PC-Case/MPG-GUNGNIR-120R/images/seriesMPG.jpg");
    background-position: center;
    background-attachment: fixed;
    background-size: 100%;
    background-repeat: no-repeat;
}

@media screen and (max-width: 1920px) {
    .theme-mpg {
        background-image:
            url("https://storage-asset.msi.com/global/picture/image/feature/PC-Case/MPG-GUNGNIR-120R/images/seriesMPG.jpg");

    }
}

@media screen and (max-width: 960px) {
    .theme-mpg {
        background-image:
            url("https://storage-asset.msi.com/global/picture/image/feature/PC-Case/MPG-GUNGNIR-120R/images/seriesMPG-xs.jpg");

    }
}

.theme-mpg .title--main {
    color: #E81F76;
}

.theme-mpg .Titlebar h2 {
    color: #E81F76;
}

.theme-mpg .sub-tabbox .slick-slide {
    /* white-space: nowrap; */
    color: #fff;
    font-size: 20px;
    /* font-family: 'Sarpanch', 'din_pro_bold', 'cwTeXHei', 'Microsoft JhengHei'; */
    cursor: pointer;
}

.theme-mpg .sub-tabbox .slick-current {
    color: #E81F76;
    position: relative;
}

.theme-mpg .sub-tabbox .slick-current::after,
.theme-mpg .sub-feature-nav .slick-slide:hover::after {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    bottom: 0;
    z-index: 1;

    background: #E81F76;
    background: radial-gradient(circle, rgba(229, 8, 168, 0.87) 9%, rgba(249, 39, 214, 0.457) 37%, rgba(250, 74, 188, 0.412) 53%, rgba(253, 111, 191, 0.44) 74%, rgba(34, 15, 239, 0.79) 100%);
}


.theme-mpg .sub-tabbox .slick-current::before,
.theme-mpg .sub-feature-nav .slick-slide:hover::before {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    top: 0;
    z-index: 1;
    background: #a21653;
    background: radial-gradient(circle, rgba(229, 8, 168, 0.87) 9%, rgba(249, 39, 214, 0.457) 37%, rgba(250, 74, 188, 0.412) 53%, rgba(253, 111, 191, 0.44) 74%, rgba(34, 15, 239, 0.79) 100%);
}

/*slick Arrow color*/
.theme-mpg .theme-arrow .slick-prev:before,
.theme-mpg .theme-arrow .slick-next:before {
    color: #E81F76;
}


/*MAG--GREEN*/
.theme-mag {

    background-image: url("https://storage-asset.msi.com/global/picture/image/feature/PC-Case/MAG-FORGE-M100R/images/seriesMAG-bg.jpg");
    background-position: center;
    background-attachment: fixed;
    background-size: 100%;
    background-repeat: no-repeat;
    background-color: black;
}

@media screen and (max-width: 1920px) {
    .theme-mag {
        background-image:
            url("https://storage-asset.msi.com/global/picture/image/feature/PC-Case/MAG-FORGE-M100R/images/seriesMAG-bg.jpg");

    }
}

@media screen and (max-width: 960px) {
    .theme-mag {
        background-image:
            url("https://storage-asset.msi.com/global/picture/image/feature/PC-Case/MAG-FORGE-M100R/images/seriesMAG-xs-bg.jpg");

    }
}

.theme-mag .title--main, .theme-mag .Titlebar h2, .theme-mag h2{
    color: #d5e839;
}


.theme-mag .sub-tabbox .slick-slide {
    /* white-space: nowrap; */
    color: #fff;
    font-size: 20px;
    /* font-family: 'Sarpanch', 'din_pro_bold', 'cwTeXHei', 'Microsoft JhengHei'; */
    cursor: pointer;
}

.theme-mag .sub-tabbox .slick-current {
    color: #d5e839;
    position: relative;
}

.theme-mag .sub-tabbox .slick-current::after,
.theme-mag .sub-feature-nav .slick-slide:hover::after {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    bottom: 0;
    z-index: 1;

    background: #d3e736;
    background: radial-gradient(circle, rgba(211, 231, 54, 0.75116) 9%, rgba(211, 231, 54, 0.457042) 37%, rgba(211, 231, 54, 0.412224) 53%, rgba(211, 231, 54, 0.440235) 74%, rgba(211, 231, 54, 0.0200674) 100%);
}


.theme-mag .sub-tabbox .slick-current::before,
.theme-mag .sub-feature-nav .slick-slide:hover::before {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    top: 0;
    z-index: 1;
    background: #d3e736;
    background: radial-gradient(circle, rgba(211, 231, 54, 0.75116) 9%, rgba(211, 231, 54, 0.457042) 37%, rgba(211, 231, 54, 0.412224) 53%, rgba(211, 231, 54, 0.440235) 74%, rgba(211, 231, 54, 0.0200674) 100%);
}

/*slick Arrow color*/
.theme-mag .theme-arrow .slick-prev:before,
.theme-mag .theme-arrow .slick-next:before {
    color: #d5e839;
}


/* twentytwenty */
.theme-mag .compbox,
.theme-mag .compareBox .imgBox {
    border: 2px solid #d5e839 !important;
}

.theme-mag .twentytwenty-handle{
	border: 3px solid #d5e839 !important;
}

.theme-mag .twentytwenty-right-arrow  {
	border-left: 6px solid  #d5e839 !important;
}
.theme-mag .twentytwenty-left-arrow{
	border-right: 6px solid  #d5e839 !important;
}

.theme-mag .twentytwenty-before-label,
.theme-mag .twentytwenty-after-label{
    display: none;
}

.theme-mag .twentytwenty-horizontal .twentytwenty-handle:before,
.theme-mag .twentytwenty-horizontal .twentytwenty-handle:after,
.theme-mag .twentytwenty-vertical .twentytwenty-handle:before, 
.theme-mag .twentytwenty-vertical .twentytwenty-handle:after {
    background: #d5e839 !important;
    -webkit-box-shadow: 0 3px 0 #d5e839, 0px 0px 12px rgba(213, 232, 57, 0.5) !important;
    -moz-box-shadow: 0 3px 0 #d5e839, 0px 0px 12px rgba(213, 232, 57, 0.5) !important;
    box-shadow: 0 3px 0 #d5e839, 0px 0px 12px rgba(213, 232, 57, 0.5) !important;
}
.theme-mag .twentytwenty-handle{
    -webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5) !important;
    -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5) !important;
    box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5) !important; 
}