@charset "utf-8";
body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #FFFFFF;
	margin: 0;
	padding: 0;
	text-align: center; 
	color: #000000;
	background-image: url(images/bg.jpg);
	background-repeat: repeat;
}

a:active, a:focus { outline: 0; }

#content {
	position:relative;
	width:772px;
	margin:0 auto;
}

#header {
	margin: 20px 0 0 0;
	position:relative;
	width:772px;
	height:382px;
	background:url(images/header/1.jpg) left top no-repeat;
    text-indent:-9999em;

}
#header a {
	display:block;
	width:772px;
	height:382px;
}
#header a:hover {
	background-position:0 -50px;
}

#header a img {
    border:none;
}

#nav {
	position:relative;
	width:772px;
	height:111px;
}

#nav ul, #nav li {
	list-style:none;
	list-style-type:none;
	margin:0;
	padding:0;
}

#nav li {
	position:relative;
	float:left;
	height:111px;
}

#nav a {
	text-decoration:none;
	
}

#nav a:hover {
	background-position:0;
	background-position:0px -111px;
}

#nav .nav1 { background:url(images/rollover_01.jpg); no-repeat; width:110px; height:111px; text-indent:-9999em; display:block; }
#nav .nav2 { background:url(images/rollover_02.jpg); width:110px; height:111px; text-indent:-9999em; display:block; }
#nav .nav3 { background:url(images/rollover_03.jpg); width:109px; height:111px; text-indent:-9999em; display:block; }
#nav .nav4 { background:url(images/rollover_04.jpg); width:112px; height:111px; text-indent:-9999em; display:block; }
#nav .nav5 { background:url(images/rollover_05.jpg); width:110px; height:111px; text-indent:-9999em; display:block; }
#nav .nav6 { background:url(images/rollover_06.jpg); width:110px; height:111px; text-indent:-9999em; display:block; }
#nav .nav7 { background:url(images/rollover_07.jpg); width:111px; height:111px; text-indent:-9999em; display:block; }

#content_box {
	position:relative;
	width:742px;
	background:#CCC;
	float:none;
	clear:both;
	text-align:left;
	padding: 10px 10px 5px 20px;
	margin:0 auto;
	margin-bottom:20px; 
	}

h1 { font-size:17px; color:#1c2630; font-weight:bolder; }
p { font-size: 12px; }
.blue { font-size:12px; color:#3a4865; }
.red { font-size:12px; color:#900000; }
.footer { font-size: 10px; color:#666; text-align:left; 	}

.productimage { float:left; border:1px solid #324252; margin: 0 15px 15px 0;}
.clear { float:none; clear:both; }

a:link {
	color: #3a4865;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #3a4865;
}
a:hover {
	text-decoration: none;
	color: #000000;
}

    a.otherLink:link    { color:red; text-decoration:none; }
    a.otherLink:visited { color:red; text-decoration:none; }


.product_box {
   width:750px; 
   float:left; 
   margin:0 25px 10px 0;
   overflow:hidden; (this means if anything doesn't fit inside the box it will be clipped and not push everything out of whack)
}

.product_photo {
   width:198px; height:198px; (make it less 2px all around to accommodate the border, otherwise
       it will push the size of the container to 202px wide which may mess things up)
   border:solid 1px #000000; (defines a border around the outside of the photo)
}

.product_text {
}