@charset "utf-8";
/* CSS Document */

html{
height:100px;	
}

body{
	font-family:helvetica;
	font-size:12px;
	background:url(images/newBG.jpg) repeat-x;
	background-color:#AFCCDE;
	margin:0px;
	padding:0px;
	height:100%
}

.clearer{
clear:both;	
}
#overLayContainer{
	width:100%;
	position:absolute;
	z-index: 200;
	top:0px;
	left:0px;
}

#mainContainer{
	width:100%;
}

#header{
	left:-454px;
	position:absolute;
	top: -70px;
}

#logo{
	width:220px;
	height:100px;
	position:absolute;
	left:350px;
	top:-20px;
	z-index:2;
}


.header{
	
font-size:24px;	
color:#FF0066
}

.subHeader{
color:#C03;
font-size:14px;
}
.pageHeader{
	font-size:24px;
	margin-top:35px;
	margin-bottom: 10px;
	color: #FF0066;
}
#overlay{position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; filter:alpha(opacity=50); opacity:0.5; display:none;}

/* Home Styles */

#homeBg{
	width:50%;
	height:340px;
	background: url(images/homeBg.jpg) repeat-x;
	margin-top:320px;
	margin-bottom:30px;
	z-index: 85;
}

#homeContentFloater{
	float:right;
	height:2px;
	width:2px;
	position:relative;
}

#homeContent{
	width:910px;
	height:357px;
	position:absolute;
	left:-455px;
	top:0px;
	background: url(images/homeBg.jpg) repeat-x;
}

#homeFlash{
	width:910px;
	height:300px;
	position:absolute;
	left:-455px;
	top:-320px;
}

#homeLeft{
	width:480px;
	padding-left:30px;
	padding-top:35px;
	float:left;	
}

#leftInfo{
	width:445px;
	padding:10px;


	float:left;
}

#leftTitle{
}

#leftInfoText{
	float:left;
	margin-top:10px;
}

#rightInfoText{
	width:150px;
	float:left;
	margin-top:10px;
	margin-left:10px;
}

#homeRight{
	width:400px;
	float:left;	
}

#homeBottomContent{
	width:910px;
	float:left;
}

#benefitsLabel{
	width:114px;
	height:39px;
	float:left;
	margin-right:10px;
	margin-left:30px;
}


#bottomInfo{
	width:225px;
	height:29px;
	float:left;
	margin-right:10px;
	padding:5px;
	background: url(images/gradientBoxBg.jpg) no-repeat;
	color:#FFFFFF;
	text-align:center;
}

#rokLogoHome{
	width:90px;
	height:45px;
	position:absolute;
	left:-45px;
	top:330px;
}

#accountTab{
	width:161px;
	height:24px;
	position:absolute;
	color:#FFFFFF;
	text-align:center;
	padding-top:15px;
	top:-330px;
	left:265px;
}

#accountTab a{
	color:#000;
	text-decoration:none;
}

#accountTab a:hover{
	color:#000;
	text-decoration:underline;
}

#flagTab{
	width:41px;
	height:27px;
	padding-top:12px;
	position:absolute;
	text-align:center;
	top:-330px;
	left:-425px;
}

/* Login Panel */

#popupContainer{
	width:535px;
	margin:auto;
}
#loginPanel{
	width:535px;
	background-color: #FF0066;
	border: solid 10px #990000;
	padding:10px;
	float:left;
	margin-top:200px;
	display:none;
}

#loginPanelInnards{
	width:505px;
	background-color: #B63055;
	padding:10px;
}

.loginClose{
	width:15px;
	height:15px;
	float:left;
}

#loginLeft{
	width:320px;
	float:left;
	border-right: dotted 1px #9D1539;
}

.loginEntryPanel{
	float:left;
	width:160px;
	color: #FFF;
}

.loginEntryPanel input{
	background-color:#990000;
	color: #FFFFFF;
	width:140px;
	border: 0px;
}

#loginRight{
	width:203px;
	padding-left:10px;
	float:left;
}

.loginFeedback{
	width:290px;
	background-color:#FCDB8E;
	margin-top:10px;
	margin-right:10px;
	padding:10px;
	float:left;
}

.panelTitles{
	color:#FFF;
	font-size:20px;
}

/* Add Contacts */

#addContactPanel{
	width:390px;
	background-color: #990000;
	border: solid 10px #990000;
	padding:10px;
	float:left;
	margin-top:200px;
	display:none;
}

.addContactPanel{
	float:left;
	width:190px;
	color: #FCDB8E;
}

.addContactPanel input{
	background-color:#990000;
	color: #FFFFFF;
	width:175px;
	border: 0px;
}

.contactFeedback{
	width:370px;
	background-color:#FCDB8E;
	margin-top:10px;
	margin-right:10px;
	padding:10px;
	float:left;
}


/* Delete Contacts */

#deleteContactPanel{
	width:390px;
	background: #990000;
	border: 10px solid #990000;
	padding:10px;
	float:left;
	margin-top:200px;
	display:none;
}

#deleteContactPanel p{
	padding:0px;
	margin:0px;
	color:#FFDC9B;
	float:left;
	width:350px;
}

.deleteButtonDiv{
	width:70px;
	float:left;
	margin-top:15px;
}

/* Sub Pages */

#subPageBg{
	width:50%;
	height:584px;
	background-color:#FFF;
	margin-top:40px;
	margin-bottom:30px;
}

#subContent{
	width:910px;
	height:584px;
	position:absolute;
	left:-455px;
	top:0px;
	background-color:#FFF;
}

#rokLogoSub{
	width:90px;
	height:45px;
	position:absolute;
	left:-45px;
	top:555px;
}


/* Address Book */

#addressBook{
	/*background: url(images/addressBook.jpg) no-repeat;*/
	float:left;
	width:602px;
	height:471px;
	margin-left:20px;
	margin-top:42px;
	position:relative;
}

#addressTabs{
	height:22px;
	width:557px;
	margin-top:16px;
	padding-left:40px;
	float:left;
}

.startTab{
	width:5px;
	height:22px;
	float:left;
}

.endTab{
	width:5px;
	height:22px;
	float:left;
	margin-right:5px;
}

#contactTab{
	height:19px;
	background: url(images/tabContact.gif) repeat-x;
	padding-top:3px;
	text-align:center;
	float:left;
}

#deleteTab{
	height:19px;
	padding-top:3px;
	background: url(images/tabDelete.gif) repeat-x;
	text-align:center;
	float:left;
}

#deleteTab a, #deleteTab a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-weight:bold;
	text-decoration:none;
	color:#FFFFFF;
}

#deleteTab a:hover {
	text-decoration:underline;
}

#viewAllTab{
	height:19px;
	padding-top:3px;
	background: url(images/tabViewAll.gif) repeat-x;
	text-align:center;
	float:right;
}

.viewAllStartTab{
	width:5px;
	height:22px;
	float:right;
}

.viewAllEndTab{
	width:5px;
	height:22px;
	float:right;
	margin-right:5px;
}

.numLetterTab{
	width:29px;
	height:19px;
	padding-top:3px;
	background: url(images/tabNumLetter.gif) no-repeat;
	margin-right:3px;
	text-align:center;
	float:right;
}

.tabLink a, .tabLink a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-weight:bold;
	text-decoration:none;
	color:#333333;
}

.tabLink a:hover {
	text-decoration:underline;
}

#numberHolderHeader{
	float:left;
	width:500px;
	padding-left:85px;
	padding-top:13px;
	padding-bottom:8px;
}

#numberHolder{
	float:left;
	width:500px;
	padding-left:85px;
	padding-top:5px;
	padding-bottom:5px;
}

#selectAllTick{
	float:left;
	width:30px;
}

#nameHeader{
	float:left;
	margin-top:3px;
	width:180px;
}

#numberHeader{
	float:left;
	margin-top:3px;
	width:260px;
}

#editEntry{
	float:left;
	width:18px;
}

#paginationHolder{
	width:400px;
	height:30px;
	position:absolute;
	top:430px;
	left:190px;
}

#arrowHolder{
	width:19px;
	height:15px;
	float:right;
}

.pageNumHolder{
	width:15px;
	height:15px;
	text-align: center;
	float:right;
}

.pageNumHolder a, .pageNumHolder a:visited, #nameHeader a,  #nameHeader a:visited{
	font-family: Arial, Helvetica, sans-serif;
	text-decoration:none;
	color:#333333;
}

.pageNumHolder a:hover, #nameHeader a:hover {
	text-decoration:underline;
}

/* Charge Account */

#chargeAccountMain{
	width:630px;
	height:550px;
	float:left;
	margin-top:5px;
}

#chargeAccountText{
	width:300px;
	height:80px;
	float:left;
	padding:0px;
	margin-top:20px;
	margin-left:30px;
	color:#000;
}

#chargeAccountTop{
	width:610px;
	height:220px;
	float:left;
	border: 5px solid #FF0066;
}

#chargeAccountBottom{
	width:610px;
	height:150px;
	float:left;
	border: 5px solid #FF0066;
	margin-top: 15px;
}

#chargeAccountBottomLeft{
	width:150px;
	padding-left:50px;
	height:150px;
	float:left;
}
#chargeAccountBottomRight{
	width:400px;
	height:150px;
	float:left;
}

#chargeAccountBottomRight p{
	color:#FFD67D;
	font-size:17px;
	padding:0px;
	margin-top:25px;
}

#chargeAccountBottomRight h1{
	color:#FFD67D;
	font-size:30px;
	padding:0px;
}

.cashOptions{
	width:100px;
	color:#000;
	font-size:15px;
	float:left;
}


/* Preferences */

#preferencesMain{
	width:630px;
	float:left;
	margin-top:5px;
}

#preferencesText{
	width:400px;
	padding:0px;
	margin-top:10px;
	margin-left:30px;
	margin-bottom:10px;
	color:#000000;
	font-size:14px;
}

.preferencesOptions{
	width:300px;
	margin-top:5px;
	color:#000;
	margin-left:30px;
	font-size:14px;
}

#prefsFeedback{
	float:left;
	width:200px;
	margin-left:30px;
	margin-top:15px;
	background-color:#FFD374;
	color:#000000;
	padding:5px;
}


/* About */

#aboutTextColumn{
	width:320px;
	padding-left:10px;
	padding-top:10px;
	float:left;
}

#aboutTextColumn h1{
	color:#F03;
	font-size:20px;
	padding:0px;
	margin:0px;
}

#aboutTextColumn p{
	color:#000;
	padding:0px;
	margin-top:5px;
}

#aboutMatrixColumn{
	width:510px;
	padding-left:30px;
	padding-top:10px;
	float:left;
}

#aboutMatrixColumn h1{
	color:#F36;
	font-size:20px;
	padding:0px;
	margin:0px;
}

#tableHolder{
	border: solid 5px #8E2444;
	float:left;
	margin-top:5px;
}


.matrixTable{
	background-color:#F69;
	float:left;
	font-size:11px;
}

.matrixTable td{
	padding:5px;
	text-align:center;
	width:86px;
	font-weight:bold;
}

.tableHeaderWhite{
	background-color:#FFFFFF;
	border-bottom: solid 1px #000000;
	border-right: solid 1px #000000;
}

.tableHeaderPink{
	background-color:#F2D3DA;
	color:#CC0000;
	border-bottom: solid 1px #000000;
}

.borderRightBottomWhite{
	background-color:#FFFFFF;
	border-bottom: solid 1px #000000;
	border-right: solid 1px #000000;
	color:#999999;
}

.borderRightWhite{
	background-color:#FFFFFF;
	border-right: solid 1px #000000;
	color:#999999;
}

.borderBottomWhite{
	background-color:#FFFFFF;
	border-bottom: solid 1px #000000;
	color:#999999;
}

.borderRightBottomYellow{
	background-color:#FFA1B2;
	border-bottom: solid 1px #000000;
	border-right: solid 1px #000000;
	color:#900;
}

.borderRightYellow{
	background-color:#FFA1B2;
	border-right: solid 1px #000000;
	color:#900;
}

/* Help */

#helpTextColumn{
	width:350px;
	padding-left:10px;
	padding-top:25px;
	float:left;
}

#helpTextColumn h1{
	color:#333;
	font-size:20px;
	padding:0px;
	margin:0px;
}

#helpTextColumn p{
	color:#333;
	padding:0px;
	margin-top:5px;
}

#helpFormColumn{
	width:490px;
	padding-left:30px;
	padding-top:35px;
	float:left;
}

.helpEntryDiv{
	color:#333;
	width:230px;
	float:left;
	font-size:13px;
	padding-top:10px;
}

.helpEntryDiv input{
	background-color:#CCC;
	color: #333;
	border: 0px;
	width:200px;
}

.helpEnquiryDiv{
	color:#333;
	width:450px;
	float:left;
	font-size:13px;
	padding-top:10px;
}

.helpEnquiryDiv textarea{
	background-color:#CCC;
	color: #333;
	border: 0px;
	width:430px;
}

#helpSend{
	width:83px;
	float:right;
	margin-right:50px;
	margin-top:15px;
}

#helpFeedback{
	float:left;
	width:325px;
	margin-top:15px;
	background-color:#FFD374;
	color:#000000;
	padding:5px;
}

/*Navigation */

#navContainer{
	background: url(images/navBg.jpg) no-repeat;
	width:885px;
	height:36px;
	padding-top:3px;
	padding-left:25px;
	position:relative;
	float:left;
}

#menu {
  padding:0;
  margin:0;
}
  
#menu li {
  list-style-type:none;
  border-right: dotted #FFFFFF 1px;
  float:left;
  color:#FFF;
}

#menu a, #menu a:visited {
  display:block;
  color: #FFFFFF;
  font-size:13px;
  font-weight:bold;
  text-decoration:none;
  padding-left:8px;
  padding-right:8px;
  padding-top:4px;
  padding-bottom:3px;
}

#menu a:hover {
  text-decoration:underline;
 
  color:#FFFFFF;
}

#logoutBtn {
	height:20px;
	padding-top:5px;
	padding-left:25px;
	padding-right:10px;
	float:right;
	background: url(images/new_logoutBtn.jpg) no-repeat;
	color: #FFF;
	text-decoration:none;
}


#logoutBtn a, #logoutBtn a:visited {
	color: #FFF;
	text-decoration:none;
}

#logoutBtn a:hover {
  text-decoration:underline;
  color:#FFF;
}

/* Options Nav */

#leftNav{
	width:205px;
	height:175px;
	float:left;

	margin-top:42px;
	margin-left:22px;
	padding-top:40px;
	padding-left:38px;
}

#options {
  padding:0;
  margin:0;
}
  
#options li {
  list-style-type:none;
  border-bottom: dotted #996600 1px;
  text-align:center;
  width:160px;
  float:left;
}

#options a {
  display:block;
  color: #000000;
  font-size:13px;
  font-weight:bold;
  text-decoration:none;
  padding-left:8px;
  padding-right:8px;
  padding-top:4px;
  padding-bottom:3px;
}

#options a:hover {
  text-decoration:underline;
  background-color:#996600;
  color:#FFFFFF;
}


.termsHolder{
background-color:#FFF;
padding:10px;
height:100%;	
}


#charterMain{
	width:630px;
	float:left;
	margin-top:5px;
	height:500px;
	overflow:auto;
}

#footerMenu{
	clear:both;
	width:100%;
	background-color:#000;
	position:fixed;
	bottom:0px;
	color:#FFF;
	padding-left:10px;
	padding-top:10px;
	padding-bottom:5px;
	height:40px;
}

#footerMenu ul{
margin:0px;
padding:0px;
}

#footerMenu li{
list-style:none;
display:inline;
padding-right:15px;
}

#footerMenu img{
border:0px;
}