#mb {
    width: 100%;
    margin: 0 auto;
    padding: 0;
    overflow-x: hidden;
	font-family:'DINPro-Medium';
	color:#fff;
}
#mb .a1 , #mb .a2{
	padding:2% 0px;
	}
#mb h1{
	font-family:'din_pro_bold'!important;
	font-size:3em;
	padding-bottom:25px;
	color:#fff !important;
	padding-top:5%;
	}
#mb h2{
	background: url(http://asset.msi.com/event/mb/2015/shoutout/images/title_icon.png) no-repeat 0 5px;
    padding-left: 30px;
    color: #FFF;
    font-family: 'din_pro_bold',Arial, Helvetica, 'Microsoft JhengHei',sans-serif !important;
    margin-top: 50px;
	font-size:2em;
	}
#mb p{
	line-height:2em;
	font-size:1.5em;
	color:#777;
	font-family:'DINPro-Regular';
	}
#mb a{
	font-family:'DINPro-Medium';
	color:#FF0004;
	padding-bottom:2px;
	border-bottom:solid 1px #ff0004;
	transition:1s;
    -webkit-transition:1s; /* Chrome & safari */
    -moz-transition:1s; /* firefox */
	}
#mb a:hover{
	background:#FF0004;
	color:#FFFFFF;
	}
#mb ul{ margin-top:2%;}
#mb li{line-height:1.8em; list-style:disc;}
#mb .red{color:#FF0004;}
#mb .box{
	border:#FF0004 solid 1px;
	padding:20px 0px;
	margin-top:30px;
	}
#mb .box p{
	font-size:1.2em;
	line-height:1.2em;
	padding:20px 0px;
	color:#fff;
	}
#mb .box strong{ font-size:1.5em;}
#mb article{ margin-top:30px; }
#mb article a{ border-bottom:none; padding:2% 10% 1% 10%; background:rgba(255,255,255,0.1)}
#mb article span{font-size:2em;}
@media only screen and (max-width: 1366px) {

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

}

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


}

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

}

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

}

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

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

}
/*--按鈕--*/
.ui-box {
  text-decoration: none;
  border: none;
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  position: relative;
  vertical-align: baseline;
  padding: 10px;
}


.border-inOutSpread:before, .border-inOutSpread:after, .border-inOutSpread > .ui-border-element:before, .border-inOutSpread > .ui-border-element:after {
  content: '';
  position: absolute;
}

.border-inOutSpread:before {
  border-top: 2px solid #f00;
  left: 51%;
  right: 51%;
  top: 0px;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -moz-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -o-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -webkit-transition-duration: 200ms;
  -moz-transition-duration: 200ms;
  -o-transition-duration: 200ms;
  transition-duration: 200ms;
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}

.border-inOutSpread:hover:before {
  left: 0%;
  right: 0%;
}

.border-inOutSpread:not(:hover):before {
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}

.border-inOutSpread:before, .border-inOutSpread:after, .border-inOutSpread > .ui-border-element:before, .border-inOutSpread > .ui-border-element:after {
  content: '';
  position: absolute;
}

.border-inOutSpread .ui-border-element:after {
  border-right: 2px solid #f00;
  top: 50%;
  bottom: 50%;
  right: 0px;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -moz-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -o-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -webkit-transition-duration: 200ms;
  -moz-transition-duration: 200ms;
  -o-transition-duration: 200ms;
  transition-duration: 200ms;
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}

.border-inOutSpread:hover .ui-border-element:after {
  top: 0%;
  bottom: 0%;
}

.border-inOutSpread:not(:hover) .ui-border-element:after {
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}

.border-inOutSpread:before, .border-inOutSpread:after, .border-inOutSpread > .ui-border-element:before, .border-inOutSpread > .ui-border-element:after {
  content: '';
  position: absolute;
}

.border-inOutSpread:after {
  border-bottom: 2px solid #f00;
  left: 51%;
  right: 51%;
  bottom: 0px;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -moz-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -o-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -webkit-transition-duration: 200ms;
  -moz-transition-duration: 200ms;
  -o-transition-duration: 200ms;
  transition-duration: 200ms;
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}

.border-inOutSpread:hover:after {
  left: 0%;
  right: 0%;
}

.border-inOutSpread:not(:hover):after {
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}

.border-inOutSpread:before, .border-inOutSpread:after, .border-inOutSpread > .ui-border-element:before, .border-inOutSpread > .ui-border-element:after {
  content: '';
  position: absolute;
}

.border-inOutSpread .ui-border-element:before {
  border-left: 2px solid #f00;
  top: 50%;
  bottom: 50%;
  left: 0px;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -moz-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -o-transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  transition-timing-function: cubic-bezier(0, 0.98, 0.51, 0.93);
  -webkit-transition-duration: 200ms;
  -moz-transition-duration: 200ms;
  -o-transition-duration: 200ms;
  transition-duration: 200ms;
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}

.border-inOutSpread:hover .ui-border-element:before {
  top: 0%;
  bottom: 0%;
}

.border-inOutSpread:not(:hover) .ui-border-element:before {
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}