/*
styles.css for screen
ea + dr pepper promo styles
mod7.com + 2009 + authored by daryl claudio
*/

/*
			Notes
++++++++++++++++++++++++++++++++++++++++
	font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif;
*/

/*
			Typography
++++++++++++++++++++++++++++++++++++++++*/

.content {
font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif;
font-weight: 600;
font-size: 14px;
line-height: 1.4; }

h1 {
font-size: 24px;
font-weight: 600;
line-height: 1.4;
margin-bottom: 16px;
}

h2 {
font-size: 18px;
line-height: 1.4;
margin-bottom: 16px;
}

h3 {
font-weight: 600;
font-size: 17px;
line-height: 1.4;
margin-bottom: 16px;
}

p {
color: #868686;
margin-bottom: 16px;
}

ul {
	margin-left: 20px;
}

li {
color: #868686;
}

strong { font-weight: 600; color: #cf144d; }


.content hr {
	width: 100%;
	height: 1px;
	border: none;
	background-attachment: scroll ;
	background-image: url(/image/promotions/ea/hr.gif) ;
	background-repeat: no-repeat ;
	background-position: left top;
	padding-bottom: 14px;
	margin: 0;
}


a:link { color: #d31245; text-decoration: none; }
a:visited { color: #d31245; text-decoration: none; }
a:hover { color: #d31245; text-decoration: underline; }
a:active { color: #d31245; text-decoration: underline; }

/*
			General Layout
++++++++++++++++++++++++++++++++++++++++*/

body {
background: #000;
margin: 0;
font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif;
}

#container {
background: url(/image/promotions/ea/background-grid.png) no-repeat fixed center top;
color: #FFF;
position: relative;
padding-bottom: 140px;
}


h1#artwork {
	text-indent: -9001px;
	display: block;
	width: 800px;
	height: 450px;
	background: transparent url(/image/promotions/ea/hero.png) no-repeat scroll center top;
	margin: 0 auto;
}
h1#artwork-es {
	text-indent: -9001px;
	display: block;
	width: 800px;
	height: 450px;
	background: transparent url(/image/promotions/ea/hero-es.png) no-repeat scroll center top;
	margin: 0 auto;
}

#wrapper {
width: 754px;
margin: -26px auto 0;
}

#body {
background: url(/image/promotions/ea/content-wrapper-bottomcap.png) no-repeat scroll center bottom;
padding: 0 0 23px;
}

/* navigation */

/* a couple new styles to allow us to dynamically pick which 'topcap' to use */
.navigation_background{
	background: url(/image/promotions/ea/content-wrapper-topcap.png) no-repeat scroll center top;
}
.navigation_background-es{
	background: url(/image/promotions/ea/content-wrapper-topcap-es.png) no-repeat scroll center top;
}

/* this one doesn't have dots between words that aren't there */
.navigation_public_background{
	background: url(/image/promotions/ea/content-wrapper-topcap-public.png) no-repeat scroll center top;
}

/* =================== ENGLISH LINKS ======================= */

ul#navigation {
/*width: 754px;*/
height: 51px;
position: relative;
margin: 0 0 0 0;
}
	ul#navigation li {
	display: block;
	height: 18px;
	position: absolute;
	top: 21px;
	}
	
		ul#navigation li a {
		text-indent: -9001px;
		float: left;
		height: 18px;
		display: block;
		background: url(/image/promotions/ea/navigation-sprite.gif) no-repeat scroll;
		}
		
	ul#navigation li.home { width: 49px; left: 22px; }
	ul#navigation li.home a { width: 49px; background-position: 0 -18px; }
	ul#navigation li.home a.current,
	ul#navigation li.home a:hover  { background-position: 0 0; }
	
	ul#navigation li.myaccount { width: 101px; left: 80px; }
	ul#navigation li.myaccount a { width: 101px; background-position: -57px -18px; }
	ul#navigation li.myaccount a.current,
	ul#navigation li.myaccount a:hover  { background-position: -57px 0; }
	
	ul#navigation li.entercode { width: 97px; left: 187px; }
	ul#navigation li.entercode a { width: 97px; background-position: -165px -18px; }
	ul#navigation li.entercode a.current,
	ul#navigation li.entercode a:hover  { background-position: -165px 0; }
	
	ul#navigation li.editmyaccount { width: 137px; left: 293px; }
	ul#navigation li.editmyaccount a { width: 137px; background-position: -270px -18px; }
	ul#navigation li.editmyaccount a.current,
	ul#navigation li.editmyaccount a:hover  { background-position: -270px 0; }
	
	ul#navigation li.prizes { width: 57px; left: 436px; }
	ul#navigation li.prizes a { width: 57px; background-position: -414px -18px; }
	ul#navigation li.prizes a.current,
	ul#navigation li.prizes a:hover  { background-position: -414px 0; }
	
	ul#navigation li.tellafriend { width: 113px; left: 500px; }
	ul#navigation li.tellafriend a { width: 113px; background-position: -478px -18px; }
	ul#navigation li.tellafriend a.current,
	ul#navigation li.tellafriend a:hover  { background-position: -478px 0; }
	
	ul#navigation li.codehistory { width: 111px; left: 620px; }
	ul#navigation li.codehistory a { width: 111px; background-position: -599px -18px; }
	ul#navigation li.codehistory a.current,
	ul#navigation li.codehistory a:hover  { background-position: -599px 0; }

/* =================== SPANISH LINKS ======================= */

ul#navigation-es {
/*width: 754px;*/
height: 51px;
position: relative;
margin: 0 0 0 0;
}
	ul#navigation-es li {
	display: block;
	height: 18px;
	position: absolute;
	top: 21px;
	}
	
		ul#navigation-es li a {
		text-indent: -9001px;
		float: left;
		height: 18px;
		display: block;
		background: url(/image/promotions/ea/navigation-sprite-es.gif) no-repeat scroll;
		}
		
		
	ul#navigation-es li.home { width: 123px; left: 21px; }
	ul#navigation-es li.home a { width: 123px; background-position: 0 -18px; }
	ul#navigation-es li.home a.current,
	ul#navigation-es li.home a:hover  { background-position: 0 0; }
	
	ul#navigation-es li.myaccount {width: 78px;left: 145px;}
	ul#navigation-es li.myaccount a { width: 78px; background-position: -122px -18px; }
	ul#navigation-es li.myaccount a.current,
	ul#navigation-es li.myaccount a:hover  { background-position: -122px 0; }
	
	ul#navigation-es li.entercode {width: 160px;left: 222px;}
	ul#navigation-es li.entercode a { width: 160px; background-position: -199px -18px; }
	ul#navigation-es li.entercode a.current,
	ul#navigation-es li.entercode a:hover  { background-position: -199px 0; }
	
	ul#navigation-es li.editmyaccount {width: 120px;left: 348px;}
	ul#navigation-es li.editmyaccount a { width: 120px; background-position: -329px -18px; }
	ul#navigation-es li.editmyaccount a.current,
	ul#navigation-es li.editmyaccount a:hover  { background-position: -329px 0; }
	
	ul#navigation-es li.prizes {width: 63px;left: 470px;}
	ul#navigation-es li.prizes a { width: 63px; background-position: -450px -18px; }
	ul#navigation-es li.prizes a.current,
	ul#navigation-es li.prizes a:hover  { background-position: -450px 0; }
	
	ul#navigation-es li.tellafriend {width: 118px;left: 539px;}
	ul#navigation-es li.tellafriend a { width: 118px; background-position: -516px -18px; }
	ul#navigation-es li.tellafriend a.current,
	ul#navigation-es li.tellafriend a:hover  { background-position: -516px 0; }
	
	ul#navigation-es li.codehistory {width: 140px;left: 610px;}
	ul#navigation-es li.codehistory a { width: 140px; background-position: -589px -18px; }
	ul#navigation-es li.codehistory a.current,
	ul#navigation-es li.codehistory a:hover  { background-position: -589px 0; }





/* end of spanish links */

.content {
	background: url(/image/promotions/ea/content-background.png) repeat-y scroll center top;
	padding: 12px 28px;
}



/*
			Headers
++++++++++++++++++++++++++++++++++++++++*/

#header-login {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-login.gif) no-repeat 0 0 scroll;
width: 84px;
height: 24px;
margin: 0;
}

	#header-login-es {
	text-indent: -9001px;
	padding: 0 0 16px;
	background: url(/image/promotions/ea/header-login-es.gif) no-repeat 0 0 scroll;
	width: 98px;
	height: 24px;
	margin: 0;
	}

#header-myaccount {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-myaccount.gif) no-repeat 0 0 scroll;
width: 172px;
height: 24px;
margin: 0;
}

#header-helpcenter {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-helpcenter.gif) no-repeat 0 0 scroll;
width: 179px;
height: 24px;
margin: 0;
}

#header-codehistory {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-codehistory.gif) no-repeat 0 0 scroll;
width: 193px;
height: 24px;
margin: 0;
}

#header-createyouraccount {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-createyouraccount.gif) no-repeat 0 0 scroll;
width: 316px;
height: 24px;
margin: 0;
}

	#header-createyouraccount-es {
	text-indent: -9001px;
	padding: 0 0 16px;
	background: url(/image/promotions/ea/header-createyouraccount-es.gif) no-repeat 0 0 scroll;
	width: 152px;
	height: 30px;
	margin: 0;
	}

#header-editmyaccount {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-editmyaccount.gif) no-repeat 0 0 scroll;
width: 240px;
height: 24px;
margin: 0;
}

#header-edityouraccount {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-edityouraccount.gif) no-repeat 0 0 scroll;
width: 274px;
height: 24px;
margin: 0;
}

#header-prizes {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-learnmoreprizes.gif) no-repeat 0 0 scroll;
width: 290px;
height: 24px;
margin: 0;
}
	#header-prizes-es {
	text-indent: -9001px;
	padding: 0 0 16px;
	background: url(/image/promotions/ea/header-learnmoreprizes-es.gif) no-repeat 0 0 scroll;
	width: 199px;
	height: 30px;
	margin: 0;
	}


#header-tellafriend {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-tellafriend.gif) no-repeat 0 0 scroll;
width: 193px;
height: 24px;
margin: 0;
}
	#header-tellafriend-es {
	text-indent: -9001px;
	padding: 0 0 16px;
	background: url(/image/promotions/ea/header-tellafriend-es.gif) no-repeat 0 0 scroll;
	width: 253px;
	height: 24px;
	margin: 0;
	}

#header-faq {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-faq.gif) no-repeat 0 0 scroll;
width: 50px;
height: 24px;
margin: 0;
}
	#header-faq-es {
	text-indent: -9001px;
	padding: 0 0 16px;
	background: url(/image/promotions/ea/header-faq-es.gif) no-repeat 0 0 scroll;
	width: 338px;
	height: 24px;
	margin: 0;
	}

#header-officialrules {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-officialrules.gif) no-repeat 0 0 scroll;
width: 208px;
height: 24px;
margin: 0;
}
#header-officialrules-es {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-officialrules-es.gif) no-repeat 0 0 scroll;
width: 242px;
height: 24px;
margin: 0;
}

#header-home {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-home.gif) no-repeat 0 0 scroll;
width: 208px;
height: 24px;
margin: 0;
}

#header-playformore {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-playformore.gif) no-repeat 0 0 scroll;
width: 217px;
height: 24px;
margin: 0;
}

#header-error {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-error.gif) no-repeat 0 0 scroll;
width: 89px;
height: 24px;
margin: 0;
}

#header-ended {
text-indent: -9001px;
padding: 0 0 16px;
background: url(/image/promotions/ea/header-ended.gif) no-repeat 0 0 scroll;
width: 605px;
height: 24px;
margin: 0;
}

/*
			Content Elements
++++++++++++++++++++++++++++++++++++++++*/

#greeting {
width: 700px;
height: 84px;
background: url(/image/promotions/ea/content-greeting.png) no-repeat scroll right center;
position: relative;
}

	#greeting h3 {
	font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif;
	font-size: 24px;
	font-weight: 600;
	width: 434px;
	position: absolute;
	left: 20px;
	top: 28px;
	line-height: 1;
	}
	
	.myaccount {
	position: relative;
	}
	
	.myaccount #greeting {
	width: 492px;
	z-index: 5;
	}
	
		.myaccount #enteryourcode {
		width: 233px;
		height: 60px;
		position: absolute;
		right: 0;
		top: 12px;
		z-index: 3;
		}
			.myaccount #enteryourcode a {
			background: url(/image/promotions/ea/content-enteryourcode.jpg) 0 -60px no-repeat scroll;
			display: block;
			width: 233px;
			height: 60px;
			float: left;
			text-indent: -9001px;
			}
.teaser {
background-attachment: scroll ;
background-image: url(/image/promotions/ea/hr.gif) ;
background-repeat: no-repeat ;
background-position: center bottom;
padding-bottom: 2px;
position: relative;
}

	.teaser p {
	padding: 30px 0 30px 170px;
	width: 360px;
	background: url(/image/promotions/ea/content-triplecans.jpg) no-repeat scroll left bottom;
	margin-bottom: 0;
	}
	
	.teaser .proceed {
	width: 92px;
	height: 32px;
	position: absolute;
	bottom: 0;
	right: 20px;
	}
	
		.teaser .proceed a {
		text-indent: -9001px;
		display: block;
		width: 92px;
		height: 30px;
		background: url(/image/promotions/ea/button-submit.gif) no-repeat scroll 0 0;
		}
		
		.teaser .proceed a:hover { /* buttonfixed - this is new */
		background: url(/image/promotions/ea/button-submit.gif) no-repeat scroll 0 -30px;
		}

.codetable tr {
padding: 6px 0;
}

.codetable th {
color: #fff;
font-size: 17px;
text-transform: uppercase;
padding-bottom: 6px;
}

.codetable td {
display: table-cell;
color: #868686;
padding: 6px 0;
width: 350px;
line-height: 1.4;
}

.redeem-reward {
width: 224px;
height: 31px;
background: url(/image/promotions/ea/button-redeemreward.gif) 0 0 no-repeat scroll;
display: block;
}

	.redeem-reward a {
	width: 224px;
	height: 31px;
	float: left;
	display: block;
	text-indent: -9001px;
	}

.back {
width: 59px;
height: 31px;
display: block;
}
	.back a {
	width: 59px;
	height: 31px;
	float: left;
	display: block;
	text-indent: -9001px;
	background: url(/image/promotions/ea/button-back.gif) 0 0 no-repeat scroll;
	}
	
	.back a:hover { /* buttonfixed - this is new */
	background: url(/image/promotions/ea/button-back.gif) 0 -31px no-repeat scroll;
	}

/*
			Footer
++++++++++++++++++++++++++++++++++++++++*/
#ea_footer {
}
	
	
	/* ================== english ============================= */

	ul#ea_footer-navigation {
	background: url(/image/promotions/ea/footer-background-navigation.png) no-repeat scroll center center;
	height: 56px;
	margin: 0 auto;
	position: relative;
	padding-left: 0;
	}
	
		ul#ea_footer-navigation li {
			height: 35px;
			position: absolute;
			top: 0;
			list-style-image:none;
			list-style-position:outside;
			list-style-type:none;
		}
			
		ul#ea_footer-navigation li a {
			text-indent: -9001px;
			height: 35px;
			display: block;
			top: 0;
			background: url(/image/promotions/ea/footer-sprite.gif) no-repeat scroll;
		}
		
		
			ul#ea_footer-navigation li.helpcenter { width: 119px; left: 215px; }
			ul#ea_footer-navigation li.helpcenter a { width: 119px; background-position: 0 0; }
			ul#ea_footer-navigation li.helpcenter a.current,
			ul#ea_footer-navigation li.helpcenter a:hover { background-position: 0 -35px; }
			
			ul#ea_footer-navigation li.faq { width: 44px; left: 334px; }
			ul#ea_footer-navigation li.faq a { width: 44px; background-position: -119px 0; }
			ul#ea_footer-navigation li.faq a.current,
			ul#ea_footer-navigation li.faq a:hover { background-position: -119px -35px; }
			
			ul#ea_footer-navigation li.officialrules { width: 132px; left: 378px; }
			ul#ea_footer-navigation li.officialrules a { width: 132px; background-position: -162px 0; }
			ul#ea_footer-navigation li.officialrules a.current,
			ul#ea_footer-navigation li.officialrules a:hover { background-position: -162px -35px; }

	
	/* ================== spanish ============================= */
			
	ul#ea_footer-navigation-es {
	background: url(/image/promotions/ea/footer-background-navigation.png) no-repeat scroll center center;
	height: 56px;
	margin: 0 auto;
	position: relative;
	padding-left: 0;
	}
	
		ul#ea_footer-navigation-es li {
			height: 35px;
			position: absolute;
			top: 0;
			list-style-image:none;
			list-style-position:outside;
			list-style-type:none;
		}
			
		ul#ea_footer-navigation-es li a {
			text-indent: -9001px;
			height: 35px;
			display: block;
			top: 0;
			background: url(/image/promotions/ea/footer-sprite-es.gif) no-repeat scroll;
		}
		
		
			ul#ea_footer-navigation-es li.helpcenter {width: 147px;left: 123px;}
			ul#ea_footer-navigation-es li.helpcenter a { width: 142px; background-position: 0 0; }
			ul#ea_footer-navigation-es li.helpcenter a.current,
			ul#ea_footer-navigation-es li.helpcenter a:hover { background-position: 0 -35px; }
			
			ul#ea_footer-navigation-es li.faq {width: 178px;left: 275px;}
			ul#ea_footer-navigation-es li.faq a { width: 176px; background-position: -142px 0; }
			ul#ea_footer-navigation-es li.faq a.current,
			ul#ea_footer-navigation-es li.faq a:hover { background-position: -142px -35px; }
			
			ul#ea_footer-navigation-es li.officialrules {width: 140px;left: 456px;}
			ul#ea_footer-navigation-es li.officialrules a { width: 140px; background-position: -318px 0; }
			ul#ea_footer-navigation-es li.officialrules a.current,
			ul#ea_footer-navigation-es li.officialrules a:hover { background-position: -318px -35px; }
	
		/* ================== end spanish ============================= */
	
	
	
	.ea_thefineprint {
		margin:0 auto 40px;
		width:726px;
	}
		.ea_thefineprint p {
			color:#A50013;
			font-family:Arial,Helvetica,Verdana,Tahoma,sans-serif;
			font-size:12px;
			line-height:1.4;
			margin:0;
			padding:0 14px 10px;
		}
		.ea_thefineprint p strong {
			color:#A50013;
		}
	
/*
			Forms
++++++++++++++++++++++++++++++++++++++++*/

/* global */
.error { color: #eb0000; }
form .error { color: #eb0000; padding: 0 6px; }

form input {
background-color: #212121;
font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif;
border: 0 none;
font-weight: 400;
color: #b1b1b1;
}

form .surveyed-field {
padding: 6px 0;
}


hr.floatclear {
background: none;
border: 0;
clear: both;
display: block;
float: none;
font-size: 0;
margin: 0;
padding: 0;
overflow: hidden;
visibility: hidden;
width: 0;
height: 0;
}



/* common styles for forms */ 

		

.dp-form {
    padding-bottom: 32px;
    *padding-bottom: 32px;
    margin-bottom: 0;
	position: relative;
	background-attachment: scroll ;
	background-image: url(/image/promotions/ea/hr.gif) ;
	background-repeat: no-repeat ;
	background-position: center bottom;
}

/*
.dp-bottom-hr {
	background-attachment: scroll ;
	background-image: url(/image/promotions/ea/hr.gif) ;
	background-repeat: no-repeat ;
	background-position: center bottom;
}
*/
	.dp-form select {
		background: #212121;
		border: 0 none;
		color: #b1b1b1;
		line-height: 1.4;
	}

.dp-submit {
	width: 92px;
	height: 32px;
	position: absolute;
	bottom: 0;
	*bottom: 15px;
	right: 20px;
}
	.dp-submit a {
		text-indent: -9001px;
		display: block;
		width: 92px;
		height: 32px;
		background: url(/image/promotions/ea/button-submit.gif) no-repeat scroll 0 0;
	}
	.dp-submit a:hover { 
		background: url(/image/promotions/ea/button-submit.gif) no-repeat scroll 0 -30px;
	}


.dp-submit-es {
	width: 92px;
	height: 32px;
	position: absolute;
	bottom: 0;
	right: 20px;
}
	.dp-submit-es a {
		text-indent: -9001px;
		display: block;
		width: 92px;
		height: 32px;
		background: url(/image/promotions/ea/button-submit-es.gif) no-repeat scroll 0 0;
	}
	.dp-submit-es a:hover { 
		background: url(/image/promotions/ea/button-submit-es.gif) no-repeat scroll 0 -30px;
	}

.dp-back {
	width: 79px;
	height: 31px;
	position: relative;
	left: 40px;
}
	.dp-back a {
		text-indent: -9001px;
		display: block;
		width: 79px;
		height: 31px;
		background: url(/image/promotions/ea/button-back.gif) no-repeat scroll 0 0;
	}
	.dp-back a:hover { 
		background: url(/image/promotions/ea/button-back.gif) no-repeat scroll 0 -31px;
	}


.dp-back-es {
	width: 102px;
	height: 31px;
	position: relative;
	left: 40px;
}
	.dp-back-es a {
		text-indent: -9001px;
		display: block;
		width: 102px;
		height: 31px;
		background: url(/image/promotions/ea/button-back-es.gif) no-repeat scroll 0 0;
	}
	.dp-back-es a:hover { 
		background: url(/image/promotions/ea/button-back-es.gif) no-repeat scroll 0 -31px;
	}


.bul{
		font-weight:bold;
		text-decoration:underline;
}

.ul{
		text-decoration:underline;
}
								
								
.faq_category {
	color:#DA4144;
}								