/* Not to confuse different browsers, we let them start from zero */ 
html, body {
   margin : 0;
   padding : 0;
}
 a:link {
 font-family: arial, helvetica, sans-serif;
	font-weight: bold;
	color: #5D478B;
	text-decoration: none;
}
a:visited {
font-family: arial, helvetica, sans-serif;
	font-weight: bold;
  color: #9A32CD;
  text-decoration: none;
}

a:hover { 
font-family: arial, helvetica, sans-serif;
	font-weight: bold;
	color: #1C86EE;
	text-decoration: none;
}

a:active {
font-family: arial, helvetica, sans-serif;
	font-weight: bold;
	color: #FF0000;
	text-decoration: none;
}
#leftheader {
   position : absolute;
   top : 0;
   left : 0;
   height : 122px;
   width : 540px;
   background : url(Images/magentabckgr.jpg) no-repeat;
}

#wrapper {
   width : 778px;
   margin-left : auto;
   margin-right : auto;
   margin-top : 1em;
   background : url(Images/rhw-bck.jpg) no-repeat 40em 53em;
   border : 1px solid #ccc;
}

#box {
   
   margin-left : auto;
   margin-right : auto;
   padding : 15px;
   margin-top : 1em;
   background : url(Images/magentasidenavbkgr.jpg) ; 
   border : 2px solid #ccc;
   font : bold 1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color : #483D8B;
	font-size : 1em;
}  

.box-h1 {
   margin-left : auto;
   margin-right : auto;
   padding : 2px;
   margin-top : 1em;
   background : url(Images/magentasidenavbkgr.jpg) ; 
   border : 1px solid #9400D3;
   font : bold 1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color : #483D8B;
	font-size : 1em;
}     

#navcontainer {
   margin-top : 123px;
   text-align : left; /*placing the nav flush to the left in moz*//*placing the nav flush to the left in moz*/
}

#navcontainer ul {
   margin : 0;
   padding : 0;
   white-space : nowrap; /*  not wrap the list to a new line when the window is reduced in width *//*  not wrap the list to a new line when the window is reduced in width */
}

#navcontainer ul li {
   display : inline;
   width : 95px;
   margin-right : -4px;
}

#navcontainer ul li a {
   padding : 1px 30px 1px 30px;
   color : #484500;
   text-decoration : none;
   border-bottom : 1px solid #565656;
   border-right : 1px solid #565656;
   background : #c2c2e0 url(Images/magentanav.jpg) no-repeat .5em .4em;
}

#navcontainer li a:visited {
   color : #666666;
   background : #9b9cc5 url(Images/magentanav.jpg) no-repeat .5em .4em;
}

#navcontainer ul li a:hover {
   color : #007101;
   background : #d5afa7 url(Images/magentanav.jpg) no-repeat .5em .4em;
}

ul li#dummy a  {
   display : none;
}

.container {
   width : 500px;
   padding : 15px;
   margin : 3px 0 20px 5px;
   border : 1px solid #ccc;
}
.container-index {
   width : 350px;
   padding : 15px;
   margin : 3px 0 20px 5px;
   border : 1px solid #ccc;
}
.container-index-L {
   width : 700px;
   padding : 15px;
   margin : 0px 0 0px 0px;
   border : 1px solid #ccc;
}

.container-index-XL {
   width : 760px;
   padding : 15px;
   margin : 0px 0 0px 0px;
   border : 1px solid #ccc;
   }
.container-SL {
   width : 600px;
   padding : 15px;
   margin : 0px 0 0px 0px;
   border : 1px solid #ccc;
}
/* zoom image */

#zoom a {
   float : right;
   margin : 0 0 10px 10px;
   border : 1px solid #000;
   text-indent : -1000em; /* hide the link text */
   overflow : hidden;
   display : block;
   width : 125px; /* show only thumbnail */
   height : 94px;
   background : url(Images/magentazoom.jpg) no-repeat top left;
}

#zoom a:hover {
   width : 300px; /* adjust size to zoomed photo */
   height : 225px;
   background-position : 0 -104px; /* move the image so only the big one shows */
   text-decoration : none; /* preventing  moz showing underline *//* preventing  moz showing underline */
}

.img {
   float : left;
   margin : 0 5px 0 2px;
   padding : 5px;
   border : 5px double #f0f8ff;
}

#sub {
   margin-left : auto;
   margin-right : auto;
   width : 30em;
   height : 15em;
   overflow : auto;
   border : 1px solid #c49cc7;
}

#examplelist {
	position : absolute;
	font : bold 1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color : #000033;
	margin-left : 49em;
	margin-top : 12em;
	width : 592px;
	border : 1px solid #c49cc7;
	background : url(Images/magentasidenavbkgr.jpg);
	left: -768px;
	top: -169px;
	height: 92px;
}

#examplelist ul {
   padding-left : 22px;
   margin : 0;
}

#examplelist li {
   position : relative;
   padding-top : 15px;
   padding-bottom : 5px;
   margin-bottom : -10px;
   list-style-type : none;
   background : url(Images/magentasidenav.jpg) no-repeat 0 .7em;
   padding-left : 35px;
}


#examplelist li a:link {
   text-decoration : none;
}
 
 #examplelist li a:hover {
   text-decoration : none;
   position : relative;
}


#examplelist p {
   font-family : "Trebuchet MS", Arial, Helvetica, Tahoma, sans-serif;
   font-size : .9em;
   font-weight : normal;
   text-align : left;
   padding-top : 5px;
   padding-bottom : 5px;
   padding-right : 3px;
   padding-left : 7px;
   margin-top : 20px;
   border : 1px solid #c49cc7;
}

#footer {
   padding : 10px;
   background : url(/Images/magentafooter.jpg) repeat-x;
}

#counter {
   display : none;
}

<style type="text/css" media="screen">

.pinktext { color: #941250; font-weight: normal; font-size: 8pt; font-family: Arial; text-decoration: none; text-indent: 0pt; word-spacing: 0pt; letter-spacing: 0pt; vertical-align: 100% }
.pinksubhead { color: #941250; font-weight: bolder; font-size: 12pt; font-family: Arial }
.pinksubmenu { color: #941250; font-weight: bolder; font-size: 8pt; font-family: Arial }
.button-text { color: #8B2252; font-weight: bolder; font-size: 10pt; font-family: Arial }
.pinkindent-text { color: #941250; font-size: 7pt; line-height: 2pt; font-family: Arial; text-align: left; text-indent: 8pt; vertical-align: 8pt }
.grey-body-text { color: #787878; font-size: 8pt; line-height: 12pt; font-family: Arial }
.H-text { color: #8A2BE2; font-size: 10pt; line-height: 12pt; font-family: Trebuchet MS }
.cssMain {
   font-family : "Trebuchet MS", Arial, Helvetica, Tahoma, sans-serif;
   font-size : .9em;
   font-weight : normal;
   color : #8B8989;}
   
.body-text {
   font : bold 1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
   color : #000033 }
.body-header {
   font : bold 1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
   font-weight: bolder; 
   font-size: 10pt;
   color : #9370DB }
.text {
   font : bold 1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 10pt;
   color : #8B7D7B } 
.text1 {
   font :  "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 10pt;
   color : #838B83 }   
.text2 {
   font :  "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 10pt;
   color : #483D8B }   
.textM {
   font :  "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 9pt;
   color : #838B83 }   
.table-text { color: #3c3c3c; font-size: 7.3pt; line-height: 9.7pt; font-family: Arial }
.pink-quote-text  { color: #dc61aa; font-size: 9pt; line-height: 14pt; font-family: Arial }
#layer1   { position: absolute; z-index: 2; top: 76px; left: 260px; width: 149px; height: 76px; visibility: hidden; display: block }
#layer2  { position: absolute; z-index: 2; top: 76px; left: 328px; width: 164px; height: 103px; visibility: hidden; display: block }
#layer4   { position: absolute; z-index: 1; top: 7px; left: 272px; width: 164px; height: 91px; visibility: hidden; display: block }
#layer5  { position: absolute; z-index: 3; top: 76px; left: 409px; width: 199px; height: 55px; visibility: hidden; display: block }
#layer3  { position: absolute; top: 76px; left: 515px; width: 176px; height: 145px; visibility: hidden; display: block }
.white-text { color: #fff; font-size: 8pt; line-height: 10pt; font-family: Arial }
</style>

 Style for ALL TABLES (except View Cart & Transaction History table) 
.tableborder
	{	
		background-color:		#003366;
	}

.tableheading
	{	font-family:			Arial,Helvetica;
		font-size:				10pt;
		font-weight:			bold;
		color:					#FFFFFF;
		text-decoration:		none;
		background-color:		#003366;
	}

.tablebody
	{	font-family:			Arial,Helvetica;
		font-size:				10pt;
		font-weight:			bold;
		color:					#ffffff;
		text-decoration:		none;
		background-color:		#006699;
	}

.tablebutton
	{
		text-align:     		center;
		text-decoration:		none;
		color:          		#000000;
		background:     		#006699;
		border-top:     		2px solid #cccccc;
		border-left:    		2px solid #cccccc;
		border-right:   		2px solid #003366;
		border-bottom:  		2px solid #003366;
		font-family:    		Verdana, Arial, Helvetica, sans-serif;
	}

.tablefield
	{
		border-top:     		2px solid #003366;
		border-left:    		2px solid #003366;
		border-right:   		2px solid #cccccc;
		border-bottom:  		2px solid #cccccc;
		background:				#ffffff;
	}
	
	.frame {
	font-family: Verdana;
	font-size: 10px;
	color: #000000;
	border: 1px solid #B6B6B6;
}