@charset "UTF-8";
@import url('reset.css');
@import url('fonts.css');
@import url('common.css');


body { background-color: #000;
}	

/* fb*/
.navbar-fix{position:fixed;bottom:0;right:0;z-index:999;margin-right:0;margin-bottom:0;vertical-align:middle;text-align:right;width:100%}
.navbar-fix a{display:block;margin:0;width:50px;height:50px;line-height:50px;text-align:center;opacity:.75;vertical-align:middle}
.nav-icon a{background-color:#3b5998;display:inline-block}
.navbar-fix a:hover{opacity:1}
.fa-icon{display:block;font-size:26px;color:#FFF;padding:0;margin:0}
.nav-icon .fa-facebook-f:before,
.nav-icon .fa-facebook:before{content:"\f09a";padding:0 5px}

#mb_vc .bannerimg{ display:none;}
#mb_vc {font-family: 'DINPro-Regular', serif, sans-serif; padding: 0;	margin: 0;	background-color:#000;overflow: hidden;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all 0.3s ease;}
#mb_vc .s0{-webkit-animation-delay: 0.1s;}
#mb_vc .s1{-webkit-animation-delay: 0.2s;}
#mb_vc .s2{-webkit-animation-delay: 0.4s;}
#mb_vc .s3{-webkit-animation-delay: 0.6s;}

#mb_vc h1{background:url(https://asset.msi.com/event/mb/2017/mb_vc/images/t_bg2.png) center no-repeat;font-size:4em;color:#FF0004;text-align:center;text-transform:uppercase; margin:0 auto; padding:20px 0;}
#mb_vc .b01 { background-color:rgba(0,0,0,0.8);}
#mb_vc .b02 { padding:20px 0; background-color:rgba(0,0,0,0.7);}


#mb_vc h2{font-size:24px; color:#FFF; text-align:center; padding:5px 5%; margin:0 auto; font-weight:100; line-height:36px;}

#canvas{display:none;}
#mb_vc .banner{background-size: cover;display:table; width:100%;}
#mb_vc .banner .bannerpos{ position: relative; z-index:-1; }
#mb_vc .banner .banner-inner{ position: relative; z-index:1; }
#mb_vc .banner .banner-inner .title{ position:absolute; z-index:9999;margin-top:265px;color:#FFF; width:70%;}
#mb_vc .banner .banner-inner .title .box{ margin-top:-300px;}


#mb_vc .optane{ background:url(https://asset.msi.com/event/mb/2017/mb_vc/images/pbbg4.jpg) fixed no-repeat; padding:5%;}
#mb_vc .optane img{ border:#333 3px solid;}
#mb_vc .optane .col-sm-6{ padding-left:0px;}
#mb_vc .optane h3{ font-size:28px !important; color:#fff; padding:15%; text-align:left; line-height:50px; font-weight:100;}

#mb_vc .bigvideo{background:url(https://asset.msi.com/event/mb/2017/mb_vc/images/pbbg3.jpg) fixed no-repeat; padding:5% 7%;}
#mb_vc .videobg{ background-color:#000;  margin:0 auto; padding:0 10%;}
#mb_vc .videobg .item{ padding:10 px; margin:0 auto;}
#mb_vc .videobg .item-video{  border:#000 0px solid; text-align:center; -webkit-box-shadow: 10px 0 35px rgba(000, 0000, 000, .9) ; }
#mb_vc .videobg .col-md-12{ padding:0 80px;}

#mb_vc .pbbg{background:url(https://asset.msi.com/event/mb/2017/mb_vc/images/pbbg2.jpg) fixed no-repeat;}
#mb_vc .item{ padding:30px;}
#mb_vc .item-product{
margin:20px;
border:#f00 1px solid; text-align:center;
-webkit-box-shadow: 0 0 35px rgba(188, 52, 186, .3) ; 
-webkit-animation: neon2 1.5s ease-in-out infinite alternate;
-moz-animation: neon2 1.5s ease-in-out infinite alternate;
animation: neon2 1.5s ease-in-out infinite alternate;}
@-webkit-keyframes neon2 {
from { box-shadow: 0 0 25px  rgba(188, 52, 186, .3),  }
to {box-shadow:0 0 5px #f00 ;}}
@-moz-keyframes neon2 {
from {  box-shadow:0 0 25px  rgba(188, 52, 186, .3), }
to { box-shadow:0 0 5px #f00 ;}}


#mb_vc .item-product .cell2{ background-color:#f00; text-align:center; color:#000; padding:5px;}
#mb_vc .item-product .cell2 a{ color:#000; text-decoration:none; font-size:20px; }
#mb_vc .item-product .cell2 a:hover{ color:#FFF;}
#mb_vc .item-product .cell2:hover{ color:#3F0; background-color:#f00;}	


#mb_vc .item-product img{ margin:0 auto;}


@media (min-width:320px) and (max-width:768px) {
#sideslider{ display:none;}
#mb_vc .bannerimg{ display:block;}
#mb_vc .banner .bannerpos{ display:none; }
#mb_vc .banner{ display:none;}
#mb_vc h1{font-size:30px; padding:10px;}
#mb_vc h2{font-size:18px; line-height:30px;}

#mb_vc .optane .col-sm-6{ padding-left:0px; padding-right:0px;}
#mb_vc .optane .col-xs-12 { padding-left:15px; padding-right:15px;}
#mb_vc .optane h3{ font-size:18px !important; color:#fff; padding:0px 15px; line-height:30px; }

#canvas{display:none;}


#mb_vc .banner .banner-inner{display:table-cell; vertical-align:bottom; text-align:center; margin-top:0px;}
#mb_vc .banner .banner-inner .title{ position:relative; z-index:9999;margin-top:-200px;}
#mb_vc .banner .banner-inner .title .box{margin-top:-100px; width:50%;}
#mb_vc .videobg .item{ padding:0px; margin:0 auto; }
}
@media (min-width:769px) and (max-width:1320px) {

#mb_vc .banner .banner-inner .title{ margin-top:200px; width:65%; margin-left:15%;}
#mb_vc .banner .banner-inner .title .box{width:45%;margin-top:-200px;}
#canvas{display:none;}
#mb_vc .optane h3{ font-size:24px !important; color:#fff;padding-left:1%;padding-right:17%; text-align:left;line-height:30px;}
#mb_vc h2{ padding: 1% 10%;}

#mb_vc .banner{;}
	}
@media (min-width:1321px) and (max-width:1600px) {

#mb_vc .banner .banner-inner .title{ margin-top:180px; width:70%;  margin-left:13%;}
#mb_vc .banner .banner-inner .title .box{width:40%;margin-top:-200px;}
#mb_vc .optane h3{ font-size:26px !important; color:#fff; padding-left:1%;padding-right:17%; line-height:40px;}	
#mb_vc h2{ padding: 1% 10%;}
#mb_vc .banner{ height:600px;}	
	
@media (min-width:1601px) and (max-width:1800px) {

#mb_vc .optane h3{ font-size:26px !important; color:#fff; padding:11%;}

#mb_vc .banner{ }
	}