/* htis is the stylesheet for the origional idea of 2 state annimated background  devised by anthony forsey in March 2005
this is the style sheet for the origional'fun with backgrounds in orange'
*/

body {
	margin: 0px;
	padding: 0px;
	background-image: url(images/white_lines.gif);
	background-repeat:repeat-y;
	background-attachment: scroll;
	background-color: #000033;
	background-position: 0px 14px;
}

p {
	font-family: Verdana;
	font-size: 0.9em;
	color: #000000;
	margin: 0px 10px 10px 10px;
	}
h3 {
	font-family: Verdana;
	font-size: 15px;
	
	color: #FF6600;
	margin: 0px;
	}
h4 {font-family: Verdana;
	font-size: 15px;
	
	color: #000033;
	margin: 0px;}

	
a:link { 
	text-decoration: none; 
	color: #000033;
	font-weight: bold
	}
a:visited { 
	text-decoration: none; 
	color: #000033;
	font-weight: bold
	}
a:hover, a:active { 
	text-decoration: underline; 
	color: #ff0000;
	}

img, img:hover, img:active {
	text-decoration: block;
	padding: 5px 5px 0px 0px;
	border: none;
	}


/* specific divs */
#container {
	background: #FFFFFF;
	padding: 10px;
	margin: 0px 0px 0px 194px;
	border: 6px solid #000000;
	color: #000000;
	text-align: left;
	width: 50%;
	z-index:13;
	position: absolute;
	}

#intro {background-image: url(images/zen_title_tree.gif);
	background-repeat: no-repeat;
	background-position: right top;
	}
#pageHeader {	font-family: Verdana;
	font-size: .8em;
	color: #000000;
	background-color: #FFFFFF;
	position: relative;
	top: 140px;
	}
#pageHeader h1 {
	padding-top: 10px;
	}
#quickSummary {
	width: 200px;
	float: right;
	border: 3px solid #000000;
	margin: 140px 0px 6px 6px;
	padding: 4px;
	}
#preamble {
	clear: left;
	padding-top: 120px;
	}	
#footer {
	text-align: center;
	}
	
/* sets the right menu bar grid to solid black combining with the otehr bg rid */
#linkList {
	background-image: url(images/1px_grid_blk.gif);
	position: absolute;
	top: 63px;
	left: 570px;
	width: 140px;
	border-top: 3px solid #000000;
	border-right: 3px solid #000000;
	border-bottom: 3px solid #000000;
	border-left: 0px solid #000000;
	}
#linkList2 {
font-family: Verdana;
	padding: 5px;
	margin-top: 5px;
	width:100%;
	font-size: 10px;
	color: #000000;
	}
	#linkList h3 {
	font-family: Verdana;
	color: #000000;
	font-size: 1em;
	width: 125px;
	height: 16px;
	background-color: #FF6600;
margin: 10px 0px 5px 0px; 
	padding-left: 5px;
	}
#linkList ul {
	margin: 0px;
	padding: 0px;

	}
#linkList li {display:in-line; width:120px;
	line-height: 1.5em;
	list-style-type: none;
	padding: 5px;
	margin-bottom: 5px;
	border: thin solid #000000;
	background-color: #FFFFFF;
	}

	
#linkList li a:link {
	color: #FF6600;
	border-bottom: thin solid #000000;
	}
#linkList li a:visited {
	color: #999999;
	}
/* sets the placement of the grid and fills in the right menu bar to solid black combining with the otehr bg rid */
#extraDiv1 {
	background-image: url(images/1px_grid_blk.gif);
	height: 2400px;
	width: 100%;
	background-attachment: scroll;
	background-repeat: repeat;
	top: 0px;
	position: absolute;
	z-index: 10;
	left: 0px;
}

#Layer1 {
	position:absolute;
	z-index:1;
	left: 190px;
	top: 22px;
}
        .style1 {
	font-size: 40px;
	color: #FFFFFF;
	padding-top: 0px;
	font-family: Verdana;
}
        .style2 {
	font-size: 15px;
	color: #FFFFFF;
	font-style: italic;
	font-family: Verdana;
}
        #Layer2 {
	position:absolute;
	z-index:2;
	left: 232px;
	top: 174px;
	font-size: 18px;
}
        #Layer3 {
	position:absolute;
	height:37px;
	z-index:3;
	float: right;
	color: #FFFFFF;
	left: 709px;
	top: 16px;
}
        #Layer4 {
	position:absolute;
	z-index:4;
	left: 86px;
	top: 22px;
}
        #Layer5 {
	position:absolute;
	width:740px;
	height:400px;
	z-index:5;
	left: 26px;
	top: 227px;
	background-color: #FFFFFF;
}
        .style3 {font-size: 12px}
		.style4 {font-size: 14px}
		
/* Naviation from body glove */
/* NAVIGATION
----------------------------------------------- */

#titleContainer{
	width: 750px;
	height: 70px;
	margin: 10px auto 0 auto;
	font-size: 95%;
	background: transparent url(images/navGradient.jpg) left bottom no-repeat;
	clear:right;  /* Required for everything except IE Win. */
}

#bodyContainer{
	width: 744px;
	margin: 10px auto 0 auto;
	background: transparent url(images/navGradient.jpg) left bottom no-repeat;
	clear:right;
	background-color: #FFFFFF;
}

/* This is for Thin Navs */
#navContainer{
	width: 744px;
	height: 36px;
	margin: 10px auto 10px auto;
	font-size: 14px;
	background: transparent url(images/navGradient.jpg) left bottom no-repeat;
	clear:right;
}
/* This is for Thick Navs */
/*
#navContainer{
	width: 744px;
	height: 53px;
	margin: 10px auto 10px auto;
	font-size: 14px;
	background: transparent url(images/navGradient.jpg) left bottom no-repeat;
	clear:right;  
}

/* Required for everything except IE Win. */


div#navigation{
	height:36px; /* 54px for thickness */
	width:744px;
	margin:0;
	padding:0;
	border:0;
	background:transparent;
	float:left;
}


div#navigation ul#menu{
	height:36px;
	width:744px;
	background:transparent url(images/nav.gif) top left no-repeat;
	margin:0;
	padding:0;
	position:relative;
	overflow: hidden;
}

div#navigation ul#menu li{
	margin:0;
	padding:0;
	list-style:none;
	position: absolute;
	text-align: center;
	top:0;
}

ul#menu li,ul#menu a{
	height:36px;
	display:block;
}

div#navigation ul#menu li a{
	text-decoration: none;
	color: #000033;
	font-family: Verdana;
	padding-top: 10px;
}

div#navigation ul#menu a:hover {
	color: #000033;
	text-decoration: none;
}	

li#nav_home {left: 0; width: 124px;}
li#nav_products {left: 124px; width: 124px;}
li#nav_tips {left: 248px; width: 124px;}
li#nav_links {left: 372px; width: 124px;}
li#nav_about {left: 496px; width: 124px;}
li#nav_map {left: 620px; width: 124px;}

#nav_home a:hover,body#nav_homeon #nav_home{
	background:transparent url(images/nav.gif) 0 -36px no-repeat;
	
}
#nav_products a:hover,body#nav_productson #nav_products{
	background:transparent url(images/nav.gif) -124px -36px no-repeat;
}
#nav_tips a:hover,body#nav_tipson #nav_tips{
	background:transparent url(images/nav.gif) -248px -36px no-repeat;
}
#nav_links a:hover,body#nav_linkson #nav_links{
	background:transparent url(images/nav.gif) -372px -36px no-repeat;
}
#nav_about a:hover,body#nav_abouton #nav_about{
	background:transparent url(images/nav.gif) -496px -36px no-repeat;
}
#nav_map a:hover,body#nav_mapon #nav_map{
	background:transparent url(images/nav.gif) -620px -36px no-repeat;
}

.skip {position:absolute; left:-200em; width:19em}

/* YOU ARE HERE */
body#home #nav_home {background: transparent url(images/nav.gif) 0px -36px no-repeat;}
body#products #nav_products {background: transparent url(images/nav.gif) -124px -36px no-repeat;}
body#tips #nav_tips  {background: transparent url(images/nav.gif) -248px -36px no-repeat;}
body#links #nav_links  {background: transparent url(images/nav.gif) -372px -36px no-repeat;}
body#about #nav_about {background: transparent url(images/nav.gif) -496px -36px no-repeat;}
body#map #nav_map {background: transparent url(images/nav.gif) -620px -36px no-repeat;}

/* the end of nav */

/* PAGE STRUCTURE
----------------------------------------------- */
#container {
	width: 770px;
	margin: 0 auto 0 auto;
	padding: 0;
	background: #262626;
    border-bottom: 2px solid #FAC934;
}

#header  {
	display: block;
	background: url(images/header.gif) 0 0 no-repeat;
	float: left;
	margin: 0 0 0 10px;
}
#logo  {
	display: block;
	background: url(images/header.gif) 0 0 no-repeat;
	float: left;
	margin: 5px 0 0 0;
}

#content {
	width: 750px;
	margin: 10px;
	font-size: 90%;
}

#topcontent {
	width:744px;
	height:20px;
	z-index:5;
	background-image: url(images/top.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#bodycontent {
	z-index:auto;
	background-repeat: no-repeat;
	background-color: #FFFFFF;
	margin: 0px 15px 0px 15px;
	font-size: 13px;
}

#feature_right {
	width: 100px;
	float: right;
	margin: 0px, auto;
	
}

#feature_left {
	float: left;
	width: 500px;
	margin: 0px 20px 0px 0px, auto;
	padding-right: 20px;
	}
.rr_ed_rate{
	background-image:url(images/rate_bg.gif);
	background-repeat:no-repeat;
	float: left;
	width: 55px;
	margin: 10px 10px 10px 10px;
	padding: 5px 10px 10px 10px;
}
.rr_summary{
	background-image:url(images/details.gif);
	background-repeat:no-repeat;
	float: right;
	width: 180px;
	margin: 0px 10px 10px 10px;
	padding: 5px 10px 10px 20px;
	color: #FFFFFF;
}
.rr_summary:link{
color: #FFFFFF
}
.rr_summary:hover { 
	text-decoration: underline; 
	color: #000033;
	}
	
.rr_details{
	background-image:url(images/summary.gif);
	background-repeat:no-repeat;
	float: right;
	width: 72px;
	margin: 0px 0px 0px 0px;
	padding: 5px 10px 10px 15px;
	color: #FFFFFF;
}
.rr_details:link{
color: #FFFFFF
}
.rr_details:hover { 
	text-decoration: underline; 
	color: #000033;
	}
.rr_eyeicon {
background-image:url(images/reye2.gif);
	background-repeat:no-repeat;
	float: left;
	width: 32px;
	margin: 0px 0px 0px 60px;
	padding: 0 0 0 0px;
	height: 18px;
}
.rr_magicon {
background-image:url(images/mglass2.gif);
	background-repeat:no-repeat;
	float: left;
	width: 32px;
	margin: 0px 0px 0px 20px;
	padding: 0 0 0px 0px;
	height: 18px;
}
.rr_checkicon {
	background-image:url(images/fcheck2.gif);
	background-repeat:no-repeat;
	float: left;
	width: 32px;
	margin: 0px 0px 0px 60px;
	padding: 0 0 0 0px;
	height: 18px;
}
#feature_top{
}

.feature_image{
float: left;
	width: 200px;
	margin: 0px, auto;
	padding-right: 10px;
}
.feature_details{
width: 200px;
	float: left;
	margin: 0px, auto;
}
#slideshow_preview{MARGIN: 0 0 0 0;clear:both;}
#slideshow_preview .slideshow_preview_item_left{MARGIN:0 5 0 0;  }
#slideshow_preview .slideshow_preview_item{MARGIN:0 5 0 0;}
#slideshow_preview .slideshow_preview_item_right{MARGIN:0 0 0 0;}
#slideshow_preview .slideshow_preview_item_right{MARGIN:0 0 0 0;}

/* Working on this one for a while now */

TABLE.compare TD    {FONT-SIZE: 9px; font-family: Verdana;}
TR.no_border TD { BORDER-LEFT: 0px; BORDER-RIGHT: 0px}

.numeric {FONT-SIZE: 9px; TEXT-ALIGN: center;}
.newrow {FONT-SIZE: 9px; TEXT-ALIGN: left; font-family: Verdana; BORDER-LEFT: #E8E0DC 1px solid;
padding-top: 2px; padding-bottom: 2px; padding-left: 8px }
.newrowright {FONT-SIZE: 9px; BORDER-LEFT: #E8E0DC 1px solid; BORDER-RIGHT: #E8E0DC 1px solid; padding-left: 10px; TEXT-ALIGN: left}
.newrow a {border: 0; }
.newrow a img {border: 0; }

.product_order {FONT-SIZE: 9px; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; COLOR: #FFF; TEXT-ALIGN: center; FONT-WEIGHT: bold; BACKGROUND-COLOR: #000033}

.orange_row   {BACKGROUND-COLOR: #eeeeee; font-family: Verdana;}

.white_row  {BACKGROUND-COLOR: #FFFFFF; font-family: Verdana;}
.white_yes    { line-height: 20px; background-image: url("images/white_yes.gif"); background-repeat: no-repeat; background-position: center }

.bold_heading    { color: #FFFFFF; font-size: 7pt; font-family: Verdana; font-weight: bold; padding-top: 2px; padding-bottom: 2px; padding-left: 4px }

.dark_blue    {BACKGROUND-COLOR: #000033} 
.blue_row   {BACKGROUND-COLOR: #eeeeee}
.white_row  {BACKGROUND-COLOR: #FFFFFF}
.blue_yes    { line-height: 20px; background-image: url("images/blue_yes.gif"); background-repeat: no-repeat; background-position: center }

#bottomcontent {
	width:744px;
	height:20px;
	z-index:5;
	background-image: url(images/h2_about_us.png);
	background-repeat: no-repeat;
	background-position: 0 100%;
	margin: 0px, auto;
	;
}


#footer {
	margin: 0;
	font-size: 13px;
	text-align: center;
	color: #FFFFFF;
	clear:both;
}

#footer a:link{
	margin: 0;
	font-size: 13px;
	text-align: center;
	color: #FFFFFF;
	clear:both;
}

#footer a:visited{
	color: #FFFFFF;
	clear:both;
}
/* NAVIGATION
----------------------------------------------- */

 
/* round corners huh? */
.roundcont {
	width: 250px;
	background-color: #F27D21;
}

.roundcont p {
	margin: 0 10px;
}

.roundtop { 
	background: url(images/tr.png) no-repeat top right; 
}

.roundbottom {
	background: url(images/br.png) no-repeat top right; 
}

img.corner {
   width: 15px;
   height: 15px;
   border: none;
   display: block !important;
}

/* end round corners */
#pup {
  position:absolute;
  z-index:200; /* aaaalways on top*/
  padding: 3px;
  margin-left: 10px;
  margin-top: 5px;
  width: 250px;
  border: 1px solid black;
  background-color: #777;
  color: white;
  font-size: 0.95em;
}
/*End of pop ups*/