/*******************/
/* Science Matters */
/*******************/

body {
	font: medium Arial, Verdana, sans-serif;
	/* background: #c4c4c4 url(/images/bg.gif) repeat-x 0px 0px; */
	padding: 0px;
	margin: 0px;
	color: #000000;
}

p {
	line-height: 140%;
	padding: 0px;
	margin: 5px 0px;
}
a {
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
}

img {
	display: block;
}

h1 {
	color: #006699;
	font-size: 180%;
	line-height: 120%; /* added by TMW */
	font-weight: normal;
	margin: 20px 0px 10px;
}

h2 {
	color: #006699;
	font-size: 150%;
	line-height: 110%; /* added by TMW */
	font-weight: normal;
	margin: 20px 0px 5px;
}

h3 {
	color: #006699;
	font-size: 130%;
	line-height: 120%; /* added by TMW */
	font-weight: bold;
	margin: 20px 0px 3px;
}

h4 {
	background: transparent;
	color: #006699; /* tentatively changed from #333 by TMW */
	font-size: 110%;
	line-height: 125%; /* added */
	text-transform: none;
	/* text-decoration: underline; tentatively added by TMW */
	font-weight: bold;
	margin: 12px 0px 3px;
	padding: 0px 0px 2px; /* added by TMW */
}

.callout { /* for use in anticipation of the new h6 style */
	color: #000099;
	/* color: #b74d37;  looks too much like a link */
	font-size: 130%;
	font-weight: normal;
	line-height: 140%;
	margin: 20px 0px;
	padding: 10px;
	border-top: 1px solid #d8d8d8;
	border-bottom: 1px solid #d8d8d8;
}

p.callOutSmall {
	/* color: #b74d37; looks too much like a link */
	color: #000099;
	font-size: 90%;
	font-weight: normal;
	line-height: 130%;
	margin: 10px 5px;
	padding: 5px;
	border-top: 1px solid #d8d8d8;
	border-bottom: 1px solid #d8d8d8;
}

.underscore {
	border-bottom: 1px solid #999999;
	padding: 0 0 7px;
}

.text-box {
    border: 1px dotted #333333;
    padding: 12px;
    margin: 12px 0;
}

.mediumText {
	font-size: 90%;
	line-height: 150%;
}

.mediumTextBold {
	font-size: 90%;
	line-height: 150%;
	font-weight:bold;
}

.contentBold {
	line-height: 150%;
	font-weight:bold;
}

.mediumRedText {
	font-size: 90%;
	line-height: 150%;
	color: red;
}

.mediumRedTextBold {
	font-size: 90%;
	line-height: 150%;
	color: red;
	font-weight:bold;
}

.smallText {
	font-size: 80%;
	line-height: 150%;
}

.redText {
    color: red;
}

.bigText {
    font-size: 120%;
    line-height: 150%;
    font-weight: bold;
    color: gray;
}

.bigTextRed {
    font-size: 120%;
    line-height: 150%;
    font-weight: bold;
    color: red;
}

a {
	color: #983927;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

a img {
    border: 0px;
}

ul {
	margin: 10px 0px 10px 12px; /* TMW added the left indent and increased bottom */
	padding: 0px;
	line-height: 150%; /* added by Ryan to match p */
}

ul ul {
	margin: 0px 0px 0px 12px; /* TMW added the left indent */
}

ul li {
	background: transparent url(/images/bullet_redarrow.gif) no-repeat 0px 9px; /* TMW increased last element from 2px to bring it even with text */
	padding-left: 12px;
	/* margin: 5px 0px; */
	list-style-type: none;
	position: relative; 
}

ul li img {
    display: inline;
}

/* TMW added all the ordered-list formatting below;
   some elements may be unnecessary */

ol {
	margin: 5px 0px 5px 30px; /* TMW added the left indent */
	padding: 0px;
	line-height: 150%; /* added by Ryan to match p */
}

ol.decimal li {
	background: none;
	padding-left: 0px;
	/* margin: 5px 0px; */
	list-style-type: decimal;
	position: relative;
}

ol.lower-alpha li {
	background: none;
	padding-left: 0px;
	/* margin: 5px 0px; */
	list-style-type: lower-alpha;
	position: relative;
}

ol.upper-alpha li {
	background: none;
	padding-left: 0px;
	/* margin: 5px 0px; */
	list-style-type: upper-alpha;
	position: relative;
}

ol.lower-roman li {
	background: none;
	padding-left: 0px;
	/* margin: 5px 0px; */
	list-style-type: lower-roman;
	position: relative;
}

ol.upper-roman li {
	background: none;
	padding-left: 0px;
	/* margin: 5px 0px; */
	list-style-type: upper-roman;
	position: relative;
}

table.data {
	margin: 15px 0px;
	/* width: 100%; tentatively disabled by TMW */
	border-left: 1px solid #d8d8d8;
}

table.data th {
	background: #d8d8d8;
	color: #666;
	text-align: left; /* was tentatively disabled by TMW; can't remember why */
	padding: 4px 10px;
}
table.data th.left {
	background: #d8d8d8;
	color: #666;
	text-align: left; 
	padding: 4px 10px;
}

table.data td.darkBackground {
	background: #d8d8d8;
	color: #666;
	padding: 4px 10px;
}

table.data td {
	padding: 4px 10px;
	border-right: 1px solid #d8d8d8;
	border-bottom: 1px solid #d8d8d8;
}

table.data td.shading {
    padding: 4px 10px;
    border-right: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
    background: whitesmoke;
}

table.data td.plusTop {
	padding: 4px 10px;
	border-right: 1px solid #d8d8d8;
	border-bottom: 1px solid #d8d8d8;
	border-top: 1px solid #d8d8d8;
}

td.borders {
	border-top: 1px solid #d8d8d8;
	border-bottom: 1px solid #d8d8d8;
}

td.bottomBorder {
	border-bottom: 1px solid #d8d8d8;
}

.image-caption-right {
	margin: 5px 0px 5px 15px; /* bottom orig 10px */
	float: right;
	position: relative; /* added for IE6 */
}

.image-caption-right p {
	color: #666;
	line-height: 115%;
	margin-top: 6px;
	/* width: 225px; use a style div to set this in each case, based on image width */
}

.image-caption-left { /* the left versions added by TMW */
	margin: 5px 15px 5px 0px; /* bottom orig 10px */
	float: left;
	position: relative; /* added for IE6 */
}

.image-caption-left p {
	color: #666;
	line-height: 115%;
	margin-top: 6px;
	/* width: 225px; */
}

.image-left,
.image-left-border {
	float: left;
	margin: 0px 15px 5px 0px;
}

.image-right,
.image-right-border {
	float: right;
	margin: 0px 0px 5px 15px;
}

.image-left-border,
.image-right-border {
	border: 1px solid #c3c3c3;
}

.contentMedium {
    font-size: 100%;
	color: Black;
	font-weight : normal;
}

.long {
	display: none;
	visibility: hidden;
}
.short {
	display: inline;
}

hr {
    height: 2px;
    /* width: 30%; */
    background: #983927;
    margin: 24px 120px 18px 120px;
}

/* @group Navigation */

#nav-sm-main {
	margin: 0;
	padding: 0;
	width: 897px;
}

#nav-sm-main li {
	float: left;
	display: block;
	font-size: 11px;
	margin: 0;
	padding: 0;
}

#nav-sm-main li a:link,
#nav-sm-main li a:visited {
	background: transparent url('/images/nav-main.png') no-repeat scroll 0 0;
	display: block;
	height: 35px;
	line-height: 14px;
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	text-align: center;
	/* white-space: nowrap; */
}

#nav-sm-main li ul li a:link,
#nav-sm-main li ul li a:visited {
	font-weight: normal;
}

#nm-sm-home a {
	width: 52px;
}

#nm-sm-why a {
	width: 128px;
}

#nm-sm-quality a {
	width: 152px;
}

#nm-sm-checklist a {
	width: 118px;
}

#nm-sm-newsletters a {
	width: 84px;
}

#nm-sm-tips a {
	width: 91px;
}

#nm-sm-photos a {
	width: 54px;
}

#nm-sm-websites a {
	width: 126px;
}

#nm-sm-store a {
	width: 89px;
}

#nav-sm-main li a:hover {
	background: transparent url('/images/nav-main.png') no-repeat scroll 0 -35px;
}

#nav-sm-main #nm-sm-home a:link,
#nav-sm-main #nm-sm-home a:visited {
	background-position: -2px 0;
}

#nav-sm-main #nm-sm-home a:hover {
	background-position: -2px -35px;
}

#nav-sm-main li ul {
	display: none;
	position: absolute;
	z-index: 200;
	margin: 0 0 0 2px;
}

#nav-sm-main #nm-sm-home ul {
	margin: 0;
	height: auto;
}

#nav-sm-main li li {
	float: none;
}

#nav-sm-main li li a:link,
#nav-sm-main li li a:visited {
	/* background: #558399; old color? */
	/* background: #52a2ca; too light */
	/* background: #2d6f96; = bottom edge */
	background: #3e89b1;
	height: auto;
	width: 180px;
	line-height: 1.5em;
	padding: 1px 4px;
	border-bottom: 1px solid #ccc;
	text-align: left;
}

#nav-sm-main li li a:hover {
	/* background: #92B3C2; old color? */
	background: #52a3c9;
}

#nav-sm-main li:hover ul,
#nav-sm-main li.over ul {
	display: block;
}

/* @end */

