/* 
Eric Meyer's Reset Styles.
http://meyerweb.com/ 
*/


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-family: inherit;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/* end Erics resets... tyEric! */



sup {
   vertical-align: baseline;
   font-size: 0.8em;
   position: relative;
   top: -0.4em;
}
/* Positioning Styles Start*/

body{
/*margin:10px 0 0 10px;*/
font-family:Arial, Helvetica, sans-serif;
background-color:#261a40;
}

#wrapper{
width:1024px;
height:auto;
/*margin:0px auto;*/
text-align:left;
font-family:Arial, Helvetica, sans-serif;
background-color:#c6bdcf;
}

#contentWrapper{
float:left;
width:1024px;
height:669px;
margin: 0 0 0 0;
padding: 0 0 0 0;
background:url(../images/bkg.jpg) no-repeat 0px 0;
background-color:#bfb6ca;
}

#contentWrapperLG{
float:left;
width:1024px;
height:819px;
background:url(../images/bkg2.jpg) no-repeat 0px 0;
background-color:#bfb6ca;
}

#contentWrapperCar{
float:left;
width:1024px;
height:795px;
background:url(../images/bkg3.jpg) no-repeat 0px 0;
background-color:#bfb6ca;
}

#logo{
float:left;
}

#mainCopy{
float:left;
padding: 25px 0 0 50px;
width:590px;
}

#mainCopy2{
float:left;
padding:10px 0 0 225px;
width:640px;
}

#errorCopy{
float:left;
padding: 50px 0 0 50px;
width:745px;
}

#mainCopyCarousel{
float:left;
padding: 25px 0 0 50px;
width:700px;
}

.copy14Grey{
font: 14px/16px Arial, Helvetica, sans-serif;
color:#444;
}
	
#cardHolder{
position:absolute;
top:80px;
left:0px;
padding:0 0 0 100px;
}

	#loginForm{
	position:relative;
	width:410px;
	padding: 120px 0 0 400px;
	}
	
	#rotatingCard{
	position:absolute;
	left:70px;
	top:75px;
	}

#cardHolder2, #cardHolder2b {
position:relative;
float:left;
padding:0 0 0 135px;
}

#cardHolder3{
position:relative;
float:left;
padding:0 0 0 110px;
 /* z-index:300; */
}

#cardHolderQue{
position:relative;
float:left;
padding:0 0 0 50px;
}

#carouselHolder{
	background-color:#2f1a4a;
	position:relative;
	float:left;
	display:inline;
	margin-top:-19px;
	/*padding:0 0 0 0px; */
}

#cardsSelect{
float: left;
padding: 10px 0 0 90px;
}

#tempCard{
position:relative;
float:left;
margin: 20px 0 0 0;
z-index:100;
}

#tempCardTest{
position:absolute;
left:-500px;
top:100px;
/*padding:15px 30px 0 0;
margin: 10 40px 0 0;*/
z-index:100;
}

#tempCardPhoto{
position:absolute;
left:0px;
top:0px;
z-index:1;
}

#tempCardColor{
position:absolute;
left:0px;
top:0px;
z-index:2;
}

#cardName{
position:absolute;
left:27px;
top:230px;
font: bold 14px/18px Arial, Helvetica, sans-serif;
color:#fff;
width:265px;
z-index:200;
}

#cardButton{
position:relative;
padding:320px 0 0 0;
width:386px;
z-index:400;
}



#cardLogo{
	position:absolute;
	left:17px;
	top:21px;
	z-index:200;
}

#cardLogoRt{
	position:absolute;
	left:320px;
	top:21px;
	z-index:200;
}


#cardDestination{
	position:absolute;
	left:175px;
	top:12px;
	font: bold .58em Arial, Helvetica, sans-serif;
	text-align:right;
	color:#fff;
	width:320px;
	z-index:200;
}

#cardDestinationRt{
	position:absolute;
	left:25px;
	top:21px;
	font: bold .58em Arial, Helvetica, sans-serif;
	color:#000;
	width:275px;
	z-index:200;
}

#tempCardPicture{
/*position: absolute;*/
margin:-363px 0 0 0;
}
	
#previewLinks{
position:relative;
float:left;
width:300px;
margin: 75px 0 0 200px;
padding:0 0 0 0;
line-height:15px;
z-index:400;
}

	.copy14B{
	font: bold 14px Arial, Helvetica, sans-serif;
	color:#000;
	}
	
	.copy14Bwht{
	font: bold 14px Arial, Helvetica, sans-serif;
	color:#fff;
	}
	
	.copy18B{
	font: bold 18px/18px Arial, Helvetica, sans-serif;
	color:#000;
	}
	
	.copy16B{
	font: bold 16px/18px Arial, Helvetica, sans-serif;
	color:#000;
	}

#footer {
	background-color: #301A4B;
}

#footer ul li{
float:left;
display:inline;
color:#867E94;
background-color:#301a4b;
}

#footerCopy{
	float:left;
	width:994px;
	font: 9px Arial, Helvetica, sans-serif;
	color:#867E94;
	background-color:#301a4b;
	padding: 10px 0 20px 30px;
	position: relative;
}

#boxTop, #boxTop2, #boxTop3{
float:left;
margin:15px 0 0 0;
width:841px;
height:18px;
background-image: url(../images/boxTop.png) !important;
background-repeat:no-repeat;
background-image: none; /* this is so that IE lt 7 does not see the background image.  A hack but seems to work. */
}

#questionBox, #questionBox2, #questionBox3{
float:left;
width:791px;
height:auto;
padding:0 25px 0 25px;
background-image: url(../images/box2.png) !important;
background-repeat:repeat;
background-image: none; /* this is so that IE lt 7 does not see the background image.  A hack but seems to work. */
z-index:1;
}
#boxBottom, #boxBottom2, #boxBottom3{
float:left;
width:841px;
height:18px;
background-image: url(../images/boxBottom.png) !important;
background-repeat:no-repeat;
background-image: none; /* this is so that IE lt 7 does not see the background image.  A hack but seems to work. */
}

	.copy14Grey22{
	font: 14px/22px Arial, Helvetica, sans-serif;
	color:#444;
	}
	
	.copy12Grey16{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#444;
	}

	.copy12Red16{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color:#f00;
	}

#cardHolderAll{
float:left;
width:1000px;
vertical-align:text-top;
z-index:1;
}
	
#cards01{
float: left;
padding: 25px 0 0 55px;
z-index:300;
}

#cards02, #cards03{
float: left;
padding: 25px 0 0 20px;
z-index:300;
}

.copy12Wht{
font: 12px/16px Arial, Helvetica, sans-serif;
color:#fff;
}

.cardCopy12B{
font: bold 12px Arial, Helvetica, sans-serif;
color:#444;
padding-right:20px;
}

.cardCopy12{
font: normal 12px Arial, Helvetica, sans-serif;
color:#444;
padding-right:20px;
}

.cardCopy12Blk{
font: normal 12px Arial, Helvetica, sans-serif;
color:#000;
}

.cardCopy12Black{
font: bold 11px Arial, Helvetica, sans-serif;
color:#000;
padding-right:20px;
}

.cardCopy11{
font: normal 11px Arial, Helvetica, sans-serif;
color:#444;
}

.Copy16Blk{
font: normal 16px Arial, Helvetica, sans-serif;
color:#000;
padding-right:20px;
}

#navHolder {
	position:relative;
	float:left;
	top: 75px;
	height: 20px;
	left:550px;
	width:240px;
	z-index:10;
}

#cardSelectNav {
	position:relative;
	top: 75px;
	height: 20px;
	left:550px;
	width:240px;
	z-index:10;
}

#buttons{
position:absolute;
height:24px;
width:60px;
/*left: 160px;*/
/*margin:-20px 0 0 0;*/
z-index:10;
}

.buttons{
position: relative;
float: left;
left:240px; 
margin-top:-5px;
}

#buttons2{
position:relative;
width:250px;
margin:-15px 0 0 220px;
}

#cardSelectNav2 {
position:relative;
top: 5px;
left:320px;
width:300px;
}


#questionNav{
position:relative;
float:right;
width:300px;
padding:20px 250px 0 0;
}

#questionBtns{
position:relative;
left:190px;
top:-20px;
width:250px;
padding:0 0 0 20px;
}


#topChoicesContainer, #topChoicesContainerCar{
position:absolute;
left:715px;
top:0px;
float:right;
width:320px;
padding: 20px 0 0 0;
}

#topChoicesContainerCar{
padding: 0 0 0 0;
}

#choicePics ul li{
position:relative;
float:left;
display:inline;
padding:7px 4px 0 0;
margin:15px 0 -12px 0;
}

#choiceBars ul li{
position:relative;
float:left;
display:inline;
padding:0 20px 0 20px;
margin:15px 0 -15px 0;
}

#choiceCopy {
	position:relative;
	float:left;
	text-align:center;
	width:275px;
	padding: 0px 0 0;
	margin: 15px 0 0 0;
}

#choiceCopy2 {
	position:relative;
	float:left;
	text-align:center;
	width:275px;
}

#disclaimer {
position:relative; 
width:500px;
padding:10px 0 0 100px;
font: normal 10px Arial, Helvetica, sans-serif;
line-height:10px;
}




/* 
PRINT CARD BOX
*/

#tempCardPrint{
position:relative;
float:left;
margin: 20px 0 0 0;
z-index:100;
}

#CardPhotoPrint{
position:absolute;
left:0px;
top:0px;
z-index:1;
}

#CardColorPrint{
position:absolute;
left:0px;
top:0px;
z-index:2;
}

#cardNamePrint{
position:absolute;
left:19px;
top:158px;
font: bold 10px/12px Arial, Helvetica, sans-serif;
color:#000;
width:200px;
z-index:200;
}

#cardLogoPrint{
	position:absolute;
	left:15px;
	top:7px;
	z-index:200;
}

#cardDestinationPrint{
	position:absolute;
	left:135px;
	top:7px;
	font: bold 8px Arial, Helvetica, sans-serif;
	text-align:right;
	color:#fff;
	width:195px;
	z-index:200;
}

#cardLogoPrintRt{
	position:absolute;
	left:220px;
	top:7px;
	z-index:200;
}

#cardDestinationPrintRt{
	position:absolute;
	left:10px;
	top:7px;
	font: bold 8px Arial, Helvetica, sans-serif;
	color:#000;
	width:200px;
	z-index:200;
}


a.footerLink, a.footerLink:visited, a.footerLink:link{
	font: 9px Arial, Helvetica, sans-serif;
   	color: #867E94;
	text-decoration: none;
}

a:hover, a.footerLink:hover {
	text-decoration: underline;
}

a.purple14, a.purple14:visited, a.purple14:link, a.purple14:hover{
	font: normal normal 14px/16px Arial, Helvetica, sans-serif;
   	color: #2f1a4a;
	text-decoration: underline;
}

a.purple11B, a.purple11B:visited, a.purple11B:link, a.purple11B:hover{
	font: bold normal 11px/16px  Arial, Helvetica, sans-serif;
   	color: #2f1a4a;
	text-decoration: underline;
}

a.links12B, a.links12B:visited, a.links12B:link{
	font: bold normal 12px/16px  Arial, Helvetica, sans-serif;
   	color: #444;
	text-decoration: none;
}

a:hover, a.links12B:hover {
	text-decoration: underline;
}


a.links12BU, a.links12BU:visited, a.links12BU:link, a.links12BU:hover{
	font: bold normal 12px/16px  Arial, Helvetica, sans-serif;
   	color: #444;
	text-decoration: underline;
}

#footerCopy{
	position: relative;
}

/* Styles for the bar animation on 5 most popular cards */
.barWrap {
	height:47px;
	width:12px;
	overflow:hidden;
	position: relative;
	background-color: #706084;
	z-index:1;
}

.innerBar {
	width:12px;
	height: 47px;
	background-color: #8f829e;
	position: absolute;
	top:0px;
	left:0px;
	z-index:2;
}

#abandon a, #abandon a:hover, #abandon a:visited {
	color: #301a4b;
}

/*******************************************************/
/*   Brand Bar Popup Styles                            */
/*******************************************************/

#brandNavBrandList {
	background-color: #FFFFFF;
	border: 1px solid #ECECEC;
	padding: 8px 0px;
	padding-top:8px;
	width: 142px;
	text-align: left;
	position:absolute;
	top: -130px;
	left:0px;
	font-family: Arial,Helvetica,Sans Serif;
}

#brandNavBrandList hr {
	border-color:#AFAFAF;
	border-style:solid;
	border-width:0pt 0pt 1px;
	margin:3px 10px;
}

#bb_other_brands {
	text-decoration: underline;
}

#brandNavBrandList a, #brandNavBrandList a:hover, #brandNavBrandList a:visited  {
	color:#3E3061;
	display:block;
	font-size:11px;
	font-weight:normal;
	margin:0pt 0pt 1px;
	padding:0pt 10px;
	text-decoration:none;
}

#brandNavBrandList a:hover {
	background-color: #E49F43;
	color: #fff;
}

