/* layout related styles */

/* NOTE: use ems or percentages when possible, except for image sizes and borders */

/* a few helper classes */

.clear {
	clear: both;
}

#lastclear {
	height: 2em;
}

.replace {
	margin-left: -10000px;
}

/* set up the background */

html, body {
	background: #6DA5BC;
	height: 100%;
}

body {
	text-align: center;
}

body.TYPE_H {
	background: url(../_images/background_1.gif) top center no-repeat;
}

body.TYPE_L {
	background: url(../_images/background_2.gif) top center no-repeat;
}

body.TYPE_S1 {
	background: url(../_images/background_3.gif) top center no-repeat;
}

body.TYPE_S2 {
	background: url(../_images/background_3.gif) top center no-repeat;
}

body.TYPE_G {
	background: url(../_images/background_3.gif) top center no-repeat;
}

/* main page wrapper */

#main {
	margin: 0 auto 0; /* 10px force the scroll bar on */
	text-align: left;
	width: 60em;
}

/* main left column */

#wrapper-left {
	float: left;
	padding-top: 40px;
	width: 18%;
}

#forces-image {
	text-align: center;
}

/* main right column */

#wrapper-right {
	float: right;
	padding-top: 32px;
	width: 82%;
}

/* the header above the main article */

#header {
}

#header h1 {
	height: 34px; /* depends on the image below */
	background: url(../_images/Smithsonian_logo.gif) top left no-repeat;
}

/* the guts of the page */

#article-gutter { /* the bark dlue border */
	margin-top: 1em;
	background: #004964;
	padding: 1em;
}

#article {
	background: #FFFFFF;
}

#article-gutter2 { /* the white border in the article w/o the nav-top */
	padding: 1em;
}

/* primary page image */

#image-main {
	border-bottom: 1px solid #cccccc;
	padding-bottom: 1em;
	text-align: center;
}

/* top half of the article */

#article-top {
	margin-top: 1em;
}

/* secondary page image */

#image-eyewitness {
	margin-top: 1em;
	text-align: center;
}

/* optional article top */

#article-top-content {
	display: none;	
}

body.HAS_TOP #article-top-content {
	display: block;	
}

/* top half, left side */

#article-top-left, .article-top-left-rep{
	float: left;
	margin-bottom: 1em;
}

/* top half, right side */

#article-top-right, .article-top-right-rep {
	float: right;
	margin-bottom: 1em;
	background-color: #ECF3FB;
	border: 1px solid #cccccc;
	padding: 1em;
}

body.PLAIN_RIGHT #article-top-right, body.PLAIN_RIGHT .article-top-right-rep {
	background-color: #FFFFFF;
	border: 0;
	padding: 0;
}

body.COL_50_50 #article-top-left,  body.COL_50_50 .article-top-left-rep  { width: 50%; }
body.COL_50_50 #article-top-right, body.COL_50_50 .article-top-right-rep { width: 43%; }

body.COL_70_30 #article-top-left,  body.COL_70_30 .article-top-left-rep  { width: 61%; }
body.COL_70_30 #article-top-right, body.COL_70_30 .article-top-right-rep { width: 31%; }

body.COL_30_70 #article-top-left,  body.COL_30_70 .article-top-left-rep  { width: 34%; }
body.COL_30_70 #article-top-right, body.COL_30_70 .article-top-right-rep { width: 58%; }

body.COL_SPLIT #article-top-left,  body.COL_SPLIT .article-top-left-rep  { width: 48%; }
body.COL_SPLIT #article-top-right, body.COL_SPLIT .article-top-right-rep { width: 48%; }

body.COL_100 #article-top-left  { width: 100%; }
body.COL_100 #article-top-right { display: none; }

/* bottom half of the article */

#article-bottom {
/*	border-top: 1px solid #cccccc;
	padding-top: 1em; */
	display: none;
}

body.HAS_BOTTOM #article-bottom  {
	display: block;
}

/* article footer */

#footer {
	margin-top: 1em;
}

#footer ul {
	list-style-type: none;
}

#footer ul li {
	margin: 0;
	border-right: 1px solid white;
	padding: 0 0.5em;	
	display: inline;
}

#footer ul li a {
	margin: 0;
	color: white;
	font-size: 80%;
	text-decoration: none;
}

#footer ul li a:hover {
	text-decoration: underline;
}

#footer-left {
	float: left;
}

#footer-left ul li {
}

#footer-right {
	float: right;
}

#footer ul li.footer-last {
	border: 0;
}

#footer ul li.nopadleft {
	padding-left: 0;
}

#footer ul li.nopadright {
	padding-right: 0;
}