/*fonts*/
@font-face { font-family: 'DIN Pro Bold'; src: url('font/path/din_pro_bold.eot'); src: url('font/path/din_pro_bold.eot?#iefix') format('embedded-opentype'), url('font/path/din_pro_bold.svg#DIN Pro Bold') format('svg'), url('font/path/din_pro_bold.woff') format('woff'), url('font/path/din_pro_bold.ttf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'bignoodletitlingregular'; src: url('../fonts/big_noodle_titling-webfont.eot'); src: url('../fonts/big_noodle_titling-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/big_noodle_titling-webfont.woff') format('woff'),  url('../fonts/big_noodle_titling-webfont.ttf') format('truetype'),  url('../fonts/big_noodle_titling-webfont.svg#bignoodletitlingregular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'bebas_neue_cyrillicregular'; src: url('../fonts/bebas_neue_cyrillic-webfont.eot'); src: url('../fonts/bebas_neue_cyrillic-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/bebas_neue_cyrillic-webfont.woff') format('woff'),  url('../fonts/bebas_neue_cyrillic-webfont.ttf') format('truetype'),  url('../fonts/bebas_neue_cyrillic-webfont.svg#bebas_neue_cyrillicregular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'DINCondMediumRegular'; src: url('../fonts/ff_din_condensed_medium-webfont.eot'); src: url('../fonts/ff_din_condensed_medium-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/ff_din_condensed_medium-webfont.woff') format('woff'),  url('../fonts/ff_din_condensed_medium-webfont.ttf') format('truetype'),  url('../fonts/ff_din_condensed_medium-webfont.svg#DINCondMediumRegular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'PTSansNarrowRegular'; src: url('../fonts/PTN57F-webfont.eot'); src: url('../fonts/PTN57F-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/PTN57F-webfont.woff') format('woff'),  url('../fonts/PTN57F-webfont.ttf') format('truetype'),  url('../fonts/PTN57F-webfont.svg#PTSansNarrowRegular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'DINPro-Regular'; src: url('dinpro-regular-webfont.eot'); src: url('../fonts/DINPro'), local('../fonts/DINPro-Regular'), url('../fonts/dinpro-regular-webfont.woff') format('woff'), url('dinpro-regular-webfont.ttf') format('truetype'), url('../fonts/dinpro-regular-webfont.svg#webfontVeJgLD7F') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'DINPro-Medium'; src: url('../fonts/dinpro-medium-webfont.eot'); src: url('../fonts/DINPro'), url('../fonts/DINPro-Medium'), url('../fonts/dinpro-medium-webfont.woff') format('woff'), url('../fonts/dinpro-medium-webfont.ttf') format('truetype'), url('../fonts/dinpro-medium-webfont.svg#webfontL4kg7A4n') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'DINPro-Light'; src: url('../fonts/dinpro-light-webfont.eot'); src: url('../fonts/DINPro'), url('../fonts/DINPro-Light'), url('../fonts/dinpro-light-webfont.woff') format('woff'), url('../fonts/dinpro-light-webfont.ttf') format('truetype'), url('../fonts/dinpro-light-webfont.svg#webfontWuXhsnZ0') format('svg'); font-weight: normal; font-style: normal; }

#eyegame {
	background: #000;font-family: 'DINPro-Regular', Arial, Helvetica, 'Microsoft JhengHei', sans-serif !important;
}
#eyegame .top{ background: url(../images/top.jpg) no-repeat top center;background-size:auto;}
#eyegame .nod{ color:#FFF; text-decoration:none; font-family: 'DINPro-Regular', Arial, Helvetica, 'Microsoft JhengHei', sans-serif !important;}
#eyegame .nod:hover{text-decoration:none; font-family: 'DINPro-Regular', Arial, Helvetica, 'Microsoft JhengHei', sans-serif !important; color: #f00;}

#eyegame h2{ text-decoration:none; font-family: 'DINPro-Regular', Arial, Helvetica, 'Microsoft JhengHei', sans-serif !important;}
#eyegame h2:hover{ text-decoration:none; font-family: 'DINPro-Regular', Arial, Helvetica, 'Microsoft JhengHei', sans-serif !important; color:f00;}

#eyegame .intellogo-header{ float:right;}
#eyegame .intellogo-header{ float:right;}

#eyegame .top .fs_01 { font-family: 'DINCondMediumRegular',Arial, Helvetica, 'Microsoft JhengHei',sans-serif !important; padding-top:155px; padding-bottom:180px;}

#eyegame .s3{ vertical-align:bottom;} 


#eyegame .box1{   
 position:absolute;  
 bottom: 0px;  }
#eyegame .box2{                   
 height: 480px; 
 position: relative;
}



#eyegame .top h1{ font-family: 'DINCondMediumRegular',Arial, Helvetica, 'Microsoft JhengHei',sans-serif !important; font-size:67px; margin:0; padding:0; color: #FFF; padding-top:170px;}
.top p{ font-size:18px; margin:0; padding:0; color: #FFF;}

#eyegame .banner {	background: url(//asset.msi.com/event/2015/promod/images/banner.jpg) no-repeat;	background-size: cover;	border-bottom: 5px solid #F00; }

#banner_owl-demo img {display: block;width: 100%;height: auto;}
#banner_M5_owl-demo img {display: block;width: 100%;height: auto;}

#eyegame .text-title { font-size: 30px; padding-bottom:5px; margin-bottom: 30px; text-align:center; text-transform: uppercase; font-weight:bold;}

#eyegame h2 { color:#fff;text-align: center;	border-bottom: 5px solid #F00;font-size:30px; text-align:center;}


#eyegame .step-box { background: none; margin-bottom: 15px; }
#eyegame .step-box .triangles { position: absolute; width: 0; height: 0; border-style: solid; border-width: 30px 30px 0 0; border-color: #f00 transparent transparent transparent;}
#eyegame .step-box .inner { background: #333; padding: 10px; color: #FFF; min-height: 125px; padding-left: 30px; border: 1px solid #f00;}
#eyegame .step-wrapper .step .step-box .inner .title { font-size: 30px; }
#eyegame .title {	color: #F00;font-size: 20px;font-weight: bold;text-align: center; text-align:center;
}

#eyegame h3 { color:#f00;text-align: center;	font-size:20px; text-align:center; font-weight: bold;}

 
 
#eyegame a.link, #tcr a.link:link { text-decoration: underline; color: #F00; }

/*icon*/
#eyegame a.link2{-webkit-border-radius: 5px;-moz-border-radius: 5px; border-radius: 5px; text-decoration: none;text-decoration:none; color:#FFF; display:block; padding:10px 0; background-color:#F00; text-align:center; margin:5px 0; font-size:23px;  padding:10px; }
#eyegame a.link2:hover{ background:#191919; color:#FFF; text-decoration:none;}
#eyegame .down{	border-top: 2px solid #F00;}

#eyegame ul.album{list-style-type:none;padding:0px;clear:both; padding-top:80px;}
#eyegame ul.album li{height:88px;float:left;margin:2px;background-color:#000; text-align:center;}
#eyegame ul.album li div{height:68px;
display:table-cell;text-align:center;vertical-align:middle;;}

/*bootstrap


#tcr .navbar-header{ float:right;}
#tcr .navbar-collapse{ float:left; font-size:22px; font-weight:500; font-family: 'DINCondMediumRegular',Arial, Helvetica, 'Microsoft JhengHei',sans-serif !important; }

.navbar { position: relative;min-height: 50px;margin:0 auto;border-bottom:0px solid #76b800;}
.navbar-brand {padding: 6px 0px 0 0;}
.navbar-nav>li>a{padding-top: 15px;}

.navbar-inverse .navbar-nav>li>a{ background-color:#555; color:#FFF;}
.navbar-inverse .navbar-nav>li>a:hover{ background-color:#F00; color:#FFF;}
.navbar-inverse .navbar-nav>li>a:focus, .navbar-inverse .navbar-nav>li>a:hover {
color: #ff0000;
background-color: #fff;
}


*/

.navbar-inverse{ background:#212121; } 








.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover {
color: #fff;
background-color: #ff0000;
text-decoration:none;
}


.navbar-tt{ padding-top:5px;}
.navbar-tt p{ font-size:16px; color:#fff;}

#eyegame .step p{ font-size:16px;}

ul.nav { list-style:none; background:#121212; height:40px; padding:5px 5px 0 20px; margin:0; }
ul.nav li { display: block; float:left; line-height:40px; padding:0 15px; color: #fff; display: block; font-size:16px; cursor:pointer; background:url(../images/line-b.gif) right 10px no-repeat; }
ul.nav li.on { background:#850000; -khtml-top-left-border-radius: 5px; -moz-top-left-border-radius: 5px; -webkit-top-left-border-radius: 5px; border-top-left-radius: 5px; -khtml-top-right-border-radius: 5px; -moz-top-right-border-radius: 5px; -webkit-top-right-border-radius: 5px; border-top-right-radius: 5px; margin-left:-1px; }
#eyegame .fbox { position:relative; line-height:1.5em;}


@media (min-width:1621px) and (max-width:1920px) {
#eyegame .mv { margin-top: 0px;}
#eyegame .top h1{ padding-top:150px;}
}
@media (min-width:1350px) and (max-width:1620px) {
#eyegame .mv { margin-top: 30px;}

#eyegame .top h1{ padding-top:90px;}
}

@media (min-width:1101px) and (max-width:1399px) {
#eyegame .mv { margin-top: 90px;}
#eyegame .top h1{ padding-top:70px;}

}

@media (min-width:992px) and (max-width:1100px) {
#eyegame .mv { margin-top: 100px;}
#eyegame .top h1{ padding-top:100px;}
}
@media (min-width:768px) and (max-width:991px) {
#eyegame .mv { margin-top:10px;}
}
@media (max-width:768px) {
#eyegame .mv { margin-top: 100px;}
}






.lan-nav { height:30px; position:absolute; top:0px; left:0; z-index:9999999;}
.lan {}
.lan .selectricWrapper { width:270px;}
.selectricWrapper { position: relative; margin: 0 3px 0; width: auto; cursor: pointer; float: left; width: auto; }
.selectricDisabled { filter: alpha(opacity=50); opacity: 0.5; cursor: default; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.selectricOpen { z-index: 9999; }
.selectricOpen .selectricItems { display: block; }
.selectricHideSelect { position: relative; overflow: hidden; width: 0; height: 0; }
.selectricHideSelect select { position: absolute; left: -100%; display: none; }
.selectricInput { position: absolute !important; top: 0 !important; left: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; margin: 0 !important; padding: 0 !important; width: 1px !important; height: 1px !important; outline: none !important; border: none !important; _font: 0/0 a; background: none !important; }
.selectricTempShow { position: absolute !important; visibility: hidden !important; display: block !important; }
.selectricOpen .selectric { border-color: #2f2f2f; background: #000000; z-index: 9999; }
.selectric { border: 2px solid #c80000; background: #000; position: relative; border-radius: 5px; }
.selectric .label { display: block; white-space: nowrap; overflow: hidden; margin: 0 27px 0 0; padding: 5px 6px; font-size: 14px; line-height: 15px; color: #f00; min-height: 15px; }
.selectric .button { background: none; border-radius: 0px; display: block; position: absolute; right: 0; top: 0; width: 27px; height: 27px; color: #FC0000; text-align: center; font: 0/0 a;   /* IE Fix */
  *font: 12px/27px Lucida Sans Unicode, Arial Unicode MS, Arial;
}
.selectric .button:after { content: " "; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 0; height: 0; border: 4px solid transparent; border-top-color: #c80000; border-bottom: none; }
.selectricHover .selectric { border-color: #c80000; }
.selectricHover .selectric .button { color: #f00; }
.selectricHover .selectric .button:after { border-top-color: #fff; }
/* Items box */

.selectricItems { display: none; position: absolute; overflow: auto; top: 100%; left: 0; background: #c80000; border: 1px solid #000; z-index: 999999; -webkit-box-shadow: 0 0 10px -6px; box-shadow: 0 0 10px -6px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.selectricItems ul, .selectricItems li { list-style: none; padding: 0; margin: 0; min-height: 20px; line-height: 20px; font-size: 12px; }
.selectricItems li { padding: 5px 10px; cursor: pointer; display: block; border-bottom: 0px solid #333; color: #fff; border-top: 0px solid #000; }
.selectricItems li.selected { background: #c80000; color: #fff; border-top-color: #E0E0E0; font-weight: bold; }
.selectricItems li:hover { background: #ff0000; color: #fff; font-weight: bold; }
.selectricItems li.disabled { background: #F5F5F5; color: #BBB; border-top-color: #FAFAFA; cursor: default; }
.more{ border: 2px solid #333; color:#fff; font-size:12px; padding:5px;
}
.more:hover{ color:#f00;}
