@import url('fonts.css');

/******reset*****/
/*a*/
#bat a{color:#666; text-decoration:none; noFocusline:expression(this.onFocus=this.blur());  outline:0; transition:0.5s all ease-out 0.1s;}
	#bat a:hover{color:#f00; text-decoration:none;}	
	#bat a:focus{-moz-outline-style:none;}

/*img*/	
#bat img{max-width:100%; width:expression(document.body.clientWidth>100?"100%":"auto"); overflow:hidden;}
#bat_wp{background:url(//asset.msi.com/event/2016/Battlefield1/images/bg.jpg) top center no-repeat; background-size:100%; background-attachment:fixed;}
#bat{width:100%; max-width:998px; margin:0 auto; color:#fff; background:url(//asset.msi.com/event/2016/Battlefield1/images/header.jpg) top center no-repeat rgba(0,0,0,0.8); background-size: 100%; font: 100%/1.4 'KlavikaLightCond';}
#bat section{padding-left:4rem; padding-right:4rem;}
#bat .hide{display:none;}

#bat_header{width:100%; height:500px; position:relative;}
#bat_header #bat_bg01{height:100%; width:100%; background:url(//asset.msi.com/event/2016/Battlefield1/images/clude2.png) bottom center repeat-x; position:absolute;}
#bat_header #bat_bg{height:100%; background:url(//asset.msi.com/event/2016/Battlefield1/images/clude.png) bottom center repeat-x;}

#bat h1, #bat h2, #bat h3, #bat h4{padding:0 !important; margin:0 !important;}

#bat_section1 h1{
	font-size:75px;
	font-family: 'KlavikaRegularCondensed';
	color:#c7c8ca;
	font-weight:normal !important;
	line-height:75px !important;
	margin:0;
	text-transform: uppercase;
	padding-bottom:10px !important;
}
#bat_section1 h2 {
	font-size:22px;
	font-family: 'KlavikaRegular';
	line-height: 28px;
	color:#ff0000;
	font-weight:bold;
	width:90%;
	padding-bottom:10px !important;
}
#bat_section1 h2 span{font-style:italic;}
#bat_section1 h3 {
	font-size:22px;
	font-family: 'KlavikaRegular';
	line-height: 28px;
	color:#fff;
	font-weight:bold;
	padding-bottom:10px !important;
}
#bat_section1 h3 div{background:#f00; padding:3px 10px; transform:skewX(10deg); float:left;}
#bat_section1 .date{font-family: 'KlavikaRegular'; font-size:22px; padding:10px 0 30px;}
#bat_section1 .datetitle{background:#f00; padding:3px 10px !important; transform:skewX(10deg); float:left; margin-bottom:10px !important;}
#bat_section1 .date span{border-bottom:#f00 2px solid; padding:6px 15px !important;}
#bat_section1 .datenote{color:#f00; font-size:18px; padding:10px 0 0 0px !important;}
#bat_section1 p{font-size:20px; letter-spacing:1px; line-height:26px !important;}

.pdimgbox{position:relative;}
.pdimgbox .pd{position:relative; z-index:3;}
.pdimgbox .bg{position:absolute; z-index:1; bottom:15%;}
.pdimgbox .logoicon{position:absolute; z-index:2; right:5%; bottom:21%;}

#bat_section2{text-align:center; background:rgba(249,4,9,0.1); padding:3rem; color:#c00; font-size:20px; margin:3rem 0;}
#bat_section2 .bt{text-align:center; padding-bottom:1rem;}
#bat_section2 .bt a{margin:0 auto; background:#f00; color:#fff; padding:0.5rem 0; width:100%; max-width:450px; font-size:32px; display:inline-block; font-family: 'KlavikaBold'; text-shadow:#f00 0 0 20px; border-radius:15px; border:#f00 5px solid;}
#bat_section2 .bt a:hover{background:none ;border-radius:0px;}

#bat_section3 .title{}
#bat_section3 .bat_pd{float:left !important; width:calc(100% / 3) !important; text-align:center; margin:1rem 0 2rem !important; position:relative !important;}
#bat_section3 .bat_pd h2{font-family: 'KlavikaRegular'; font-size:16px; color:#c00; padding-bottom:5px !important;}
#bat_section3 .bat_pd .view{display:inline-block; text-align:center; background:url(//asset.msi.com/event/2016/Battlefield1/images/shop_arrow.png) 55px 6px no-repeat #c00; color:#fff; font-size:1rem; text-transform:!important; padding:0 30px 0 20px; font-size:14px;}
#bat_section3 .bat_pd img{opacity:0.9; position:relative;}
#bat_section3 .bat_pd:hover h2{color:#f00;}
#bat_section3 .bat_pd:hover .view{background:url(//asset.msi.com/event/2016/Battlefield1/images/shop_arrow2.png) 45px 6px no-repeat #f00; transform:skewX(10deg); transition:0.5s all ease-out 0.1s;}
#bat_section3 .bat_pd:hover img{opacity:1; bottom:1px;}

#bat_footer{font-family:'KlavikaRegular';
	margin: 40px 70px 70px 70px;	
	color:#666;
	font-size:9px;
	line-height:9px;}
	
#bat_footer p{padding:0 0 4px !important;}
#bat_footer a{color:#c00; text-decoration:underline;}
#bat_footer a:hover{color:#f00;}