
body {
    font-family: Arial, sans-serif;
    font-size: 0.75em;
    line-height: 1.4em;
    color: #000000;
    margin: 0
}

#outer_wrapper {
	/* because "min-width" is not supported by IE, these pages use a script from PVII */
	min-width: 740px;
	/* this is to "minimize" an IE bug related to background painting, but because it creates a gap below the footer, the same declaration is also added to #footer */
	width: 100%;
	margin: 0 -1px;
	/* faux-column technique, this is the left one */
}

#wrapper {
	/* faux-column technique, this is the right one */
	/*background-image: url(http://images.sotn.info/bbar936.gif);
	background-repeat: repeat-x;
	background-position: left top;*/
	margin: 10px;
}

#header {
	/* this is to "give layout" to the element and fix some peek-a-boo bug in  IE (v6 sp2) */
	width: 100%;
	/* the above declaration creates an horizontal scroll bar in IE, this is to get rid of it */
	margin: 0 -1px;

	/*background-image: url(http://images.sotn.info/lbar936.gif);
	background-repeat: no-repeat;
	background-position: left top;*/
}


#header h1
{
	margin: 0;
	padding: 10px;
}

#headertext
{
	text-align: right
}

#headertext p
{
	margin: 0;
	padding: 0;
	font-size: 0.75em
}

#container {
	float: left;
	width: 100%;
	/* IE doubles the margins on floats, this takes care of the problem */
	display: inline;
	/* this is where Ryan Brill (author of the ALA's article) and I go in "opposite directions" */
	margin-left: -150px
}

#left {
	float: left;
	width: 150px;
	/* IE doubles the margins on floats, this takes care of the problem */
	display: inline;
	margin-left: 150px;
}

#main,
#navcontainer
{
	/* the width from #left (200px) + the negative margin from #container (200px) */
	margin-left: 300px;
	border: solid 2px #306;
	border-top: 0;
	padding: 10px
}

#mainfp
{
	text-align: cente
}

#pathfp
{
	border-top: solid 2px #306;
	border-right: solid 2px #306;
	background-color: #99f;
	padding: 2px;
	color: #fff;
	font-weight: bold;
	
}

#nav
{
	/* the width from #left (200px) + the negative margin from #container (200px) */
	margin-left: 300px;
}

#path
{
	margin-left: 150px;
	border-top: solid 2px #306;
	border-right: solid 2px #306;
	background-color: #99f;
	padding: 2px;
	color: #fff;
	font-weight: bold;
	
}

#path a,
#path a:link,
#path a:visited
{
	color: #fff;
	font-weight: bold;
	text-decoration: none
}

#path a:hover
{
	text-decoration: underline
}

/* good to know: if #sidebar is to be shorter than #main, then there is no need for this rule */
#right {
	/* this is to keep the content of #right to the right of #main even if the content of "main is shorter */
	padding-left: 100%;
	/* this is to "bring back" the #right that has been moved out of the viewport because of the padding value */
	margin-left: -150px;
	border-top: solid 2px #306;
}

#rightinner
{
	/*
	border-top: solid 2px #306;
	margin-left: 8px;
	*/
}

#rightinner2
{
	/*
	padding: 5px;
	*/
}

#rightinner p {
	/* this is to make sure IE (v6 sp2) *displays* this element (same problem as #header, but using a different fix) */
	margin: 0;
	padding: 0;
	position: relative;
}

#footer {
	/* see #outer_wrapper  */
	/*width: 100%;
	margin: 0 -1px;*/
	/* this is to clear #container */
	
	/*
	clear: left;
	border-top: solid 2px #306;
	margin: 10px*/
	text-align: center
	
}

#footer p
{
	text-align: center
}

/* this is the class that is applied to 2 structural hacks in the markup. The first "meaningless" element is used to clear #left in NN6 and the last one is used to clear #container in NN4 */
.clearing {height:0;clear:both}

#navtop {
    width: 100%;
    height: 31px;
    padding-left: 15px;
    margin-bottom: 1px;
    background-image: url(http://images.sotn.info/vgrad2.gif);
}

#navtop ul {
    margin: 0;
    padding: 0;
    font-size: 0.8em;
    font-weight: bold;
    color: #000;
    line-height: 31px;
    white-space: nowrap;
}

#navtop li {
    list-style-type: none;
    display: inline;
}

#navtop li a {
    text-decoration: none;
    color: #000;
}


a,
a:link,
a:visited {
    font-family: Arial,sans-serif;
    font-size: 1em;
    font-weight: normal;
    color: #339;
    text-decoration: underline;
}

a:hover {
    font-family: Arial,sans-serif;
    font-size: 1em;
    font-weight: normal;
    text-decoration: underline;
}

a.boldlink:link,
a.boldlink:visited {
    font-family: Arial,sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: #000;
    text-decoration: underline;
}

a.boldlink:hover {
    font-family: Arial,sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: #c60;
    text-decoration: underline;
}



#left ul
{
	line-height: 16px;
	padding-left: 15px;
	margin-left: 5px;
	margin-top: 0
}

#left li
{
	font-size: 0.9em;
	list-style-type: none;
	list-style-image: url(http://images.sotn.info/listarrow.gif)
}


#left li a,
#left li a:link,
#left li a:visited
{
	text-decoration: none
}

#left li a:hover
{
	text-decoration: underline
}


#logo
{
	float: left;
}

#logo img
{
	border-style: none;
}

#navtr
{
    padding-right: 15px;
    float: right
}

#navtr ul
{
    margin: 0;
    padding: 0;
    line-height: 31px;
    white-space: nowrap
}

#navtr li
{
    list-style-type: none;
    display: inline
}

#navtr li a
{
	font-weight: bold;
    text-decoration: none
}

#navtr li a:hover
{
	text-decoration: underline
}

#navtr input
{
    background-color: #fff;
    border: solid 1px #936
}

#footer
{
	padding: 10px
}

#main h1
{
	font-size: 1.5em;
}

#main h2
{
	font-size: 1.3em;
}

p.errmsg
{
	color: #f00;
}


A.help,
A.help:link,
A.help:visited,
A.help:hover 
{
	color: #000;
	font-weight: normal;
	text-decoration: none;
}



A.help sup,
A.help:link sup,
A.help:visited sup,
A.help:hover sup 
{	padding: 1px 2px 1px 2px;
	background-color: #ddd;
	line-height: 0
}

div.otresult
{
	width: 100%;
	margin: 0 -1px;
}
	
div.otresult p
{
	margin: 3px 
}

div.otresult img
{
	float: right;
	border: 0px; 
	margin-left: 10px;
}

div.otresult a.title,
div.otresult a.title:link,
div.otresult a.title:visited
{
	display: block;
	background-color: #eaf2ff;
	padding: 2px 5px 2px 5px;
	font-weight: bold;
	text-decoration: none;
}


a.producttitle 
{
	font-size: 1.25em;
	font-weight: bold	
}

span.productprice
{
	font-size: 1.25em;
	font-weight: bold	
}

div.topbar1
{
	float: right;
	clear: right;
	background-image: url(http://images.sotn.info/bar_r.gif);
	padding-right: 4px;
	background-repeat: no-repeat;
	background-position: top right
}

div.topbar2
{
	clear: right;
	height: 47px;
	background-image: url(http://images.sotn.info/header-fade.gif);
	background-repeat: repeat-x
}

div.topbar3
{
	float: left;
	padding: 2px;
	padding-left: 70px;
	height: 47px;
	font-size: 0.75em;
	color: #fff;
	font-weight: bold;
	background-image: url(http://images.sotn.info//bar_l.gif);
	background-repeat: no-repeat;
	background-position: top left
}

a.navnextgrey
{
	border: solid 2px #306;
	border-top: 0;
	padding: 4px;
	float: right;
	padding-right: 25px;
	background-color: #ECEAFF;
	background-repeat: no-repeat;
	background-position: center right;
	background-image: url(http://images.sotn.info/rarrow-grey.gif);
	color: #fff;
}

a.navprevgrey
{
	border: solid 2px #306;	
	border-top: 0;
	padding: 4px;
	float: left;
	padding-left: 25px;
	background-color: #ECEAFF;
	background-repeat: no-repeat;
	background-position: center left;
	background-image: url(http://images.sotn.info/larrow-grey.gif);
	color: #fff;
}

a.navnextactive
{
	border: solid 2px #306;	
	border-top: 0;
	padding: 4px;
	float: right;
	padding-right: 25px;
	background-color: #99f;
	background-repeat: no-repeat;
	background-position: center right;
	background-image: url(http://images.sotn.info/rarrow-active.gif);
	color: #fff;
}

a.navprevactive
{
	border: solid 2px #306;	
	border-top: 0;
	padding: 4px;
	float: left;
	padding-left: 25px;
	background-color: #99f;
	background-repeat: no-repeat;
	background-position: center left;
	background-image: url(http://images.sotn.info/larrow-active.gif);
	color: #fff;
}

div.leftbox,
div.rightbox
{
	background-color: #e0e0e0;
	padding: 10px;
	border-bottom: solid 1px black;
	margin-bottom: 5px
}

div.leftbox p,
div.rightbox p
{
	margin: 0;
	padding: 0;
}

div.leftboxtitle,
div.rightboxtitle
{
	background-color: #99f;
	padding: 1px;
	color: #fff;
	font-weight: bold;
	text-align: center
}

div.righttoptitle
{
	background-color: #99f;
	padding: 1px;
	color: #fff;
	font-weight: bold;
	text-align: center
}

#footer a:link {
	font-size: 11px;
	font-weight: bold;
	color: #999;
	text-decoration: none;
}

#footer a:visited {
	font-size: 11px;
	font-weight: bold;
	color: #999;
	text-decoration: none;
}

#footer a:hover {
	font-size: 11px;
	font-weight: bold;
	color: #999;
	text-decoration: underline;
}

a.catnav1:link {
font-size: 13px;
font-weight: bold;
text-decoration: none;
color: #339;
}

a.catnav1:visited {
font-size: 13px;
font-weight: bold;
text-decoration: none;
color: #339;
}

a.catnav1:hover {
font-size: 13px;
font-weight: bold;
text-decoration: underline;
color: #339;
}

a.catnav2:link {
font-size: 11px;
font-weight: normal;
text-decoration: none;
color: #000;
}

a.catnav2:visited {
font-size: 11px;
font-weight: normal;
text-decoration: none;
color: #000;
}

a.catnav2:hover {
font-size: 11px;
font-weight: normal;
text-decoration: underline;
color: #000;
}
