/* 
 * Project: The Hydrogeologist Time Capsule
 * Created: 15.03.2007
 * Modified: 18.01.2008
 *
 * This file (c) copyright 2007-2008 Ecodev www.ecodev.ch
 *
*/

body { padding: 0; margin: 0; font: 0.7em Tahoma, Arial, sans-serif; line-height: 1.6em; background: #fff; color: #454545; }

/* links */
a
{
	color: #06C;
	text-decoration: none;
}
a:hover { color: #9EC068; }

/* image */
img {border-style: none;}

/* headings */
h1 { font: bold 2.5em "Arial", Sans-Serif; margin: 0; letter-spacing: -1px; }
h2 { font: bold 2em Arial, Sans-Serif; margin: 0; padding: 0; }
h1 a, h2 a { color: #F3BB51; background: #fff; text-decoration: none; }
h1 a:hover, h2 a:hover { color: #2b2b2b; background: #FFF; }
.title { color: #808080; background: #fff; }
.orange { color: #F3BB51; }

/* lists and form elements */
ul { margin: 0; padding : 0; list-style : none; }

/* for all browsers that understand min-width */
.width {width: 90%; min-width: 960px; margin: 10px auto;}
/* min-width hack for IE6 */
* html .content { border-left:960px solid #fff; position: relative; float: left; z-index: 1; }
/* #content { margin: 10px auto; width: 960px; } */
* html .holder { margin-left:-960px; position: relative; float: left; z-index: 2; }

/* header */
#header { background: #fff; height: 98px; overflow: hidden; } 
/* #header { height: 100px; } */
#logo { padding: 0px 0px 0px 8px; margin-left: 0px; }
#logo p { margin: 0; padding: 0 0 0 5px; color: #808080; }
#timecap { float:right; overflow: hidden; }
#iah { float:right; margin-right: 50px; overflow: hidden; }
#top_info { float: right; width: 570px; margin: 20px 5px 0 0; text-align: right; }

/* horizontal tabbed menu */	
#tabs { color: #000; height: 64px; text-align: center; padding: 20px 0 0px 0px; }
#tabs li { display: inline; height: 45px; }
#tabs li a { float: left; background: #fff url('../images/barbg.gif') no-repeat; color: #808080; padding: 7px 0; width: 108px; text-align: center; font-weight: bold; font-size: 1.1em; text-decoration: none; }
#tabs li a:hover { background: #fff url('../images/barcurrent.gif') no-repeat; color: #000; }	
#tabs li a.current { background: #fff url('../images/barcurrent.gif') no-repeat; color: #F3BB51; }	
.key { text-decoration: underline; }

/* grey subheader */
.gboxtop { width: 420px; clear: both; height: 8px; background: #dedede url('../images/gboxtop3.gif') no-repeat; color: #000; }
.gbox { width: 394px; background: #dedede url('../images/gbox3.gif') no-repeat bottom left; color: #444; padding: 1px 13px 7px 13px; margin: 0 0 20px 0; }
.gbox p { padding: 7px 0; margin: 0;}

/* people */
.big {font-size: 1.1em;}
div.people
{
	margin-top: 10px;
	margin-bottom: 15px;
	border: 1px #F3BB51 dashed;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
}
.personName { font-weight: bold; font-size: 1.2em; }
.personStatement { color: #808080; }
.gray { color: gray; }

/* player page */
#movieContainer {}

#vidDetails dd {
	color: #808080;
}

#vidDetails .left_text {
	width: 450px;
	float: left;
	padding-top: 0;
}

#vidDetails #right-left {
	width: 360px;
	text-align: justify;
	color: #000;
}

.sizeBox {
	text-align: center;
	font-size: 12px;
}

.hilite {
	background-color: #F2DAA3;
	color: black;
}

#chapterList {
	font-size: 10px;
}

#chapterList .clip {
	text-decoration: none;
	font-weight: bold;
	display: block;
}

#chapterList .chapter {
	text-decoration: none;
	display: block;
	padding: 2px;
	margin: 3px 0;
}

/* left side */
.left { float: left; width: 65%; margin: 0 0 10px 0; }
/* .left { float: left; width: 650px; margin: 0 0 10px 0; } */
.left_articles {
	margin: 0 20px 15px 10px;
	padding: 10px 0 0 0;
	text-align: justify;
	border-bottom: 1px dotted #ccc;
	color: #000;
	background: #fff;
}
	
.left_text {
	margin: 0 20px 15px 10px;
	padding: 10px 0 0 0;
	text-align: justify;
	color: #000;
	background: #fff;
}
	
.description { padding: 0 0 2px 0; margin: 0 0 5px 0; border-bottom: 1px dotted #ccc; }
.thumbnail { float: left; margin: 0 18px 8px 0; border: 1px solid #dedede; }
.thumbnailRight { float: right; margin: 0 0 8px 15px; border: 1px solid #dedede; }

/* bottom thirds */
.thirds { float: left; width: 203px; background: #eee; margin: 0 12px 0 0; color: #5d5d5d; }
.smallboxtop { height: 14px; background: #fff url('../images/smallboxtop.gif') no-repeat; color: #000; }
.smallbox { background: #fff url('../images/smallbox.gif') no-repeat bottom left; color: #444; padding: 1px 10px 10px 10px;  }
.smallbox p { padding: 0; margin: 0; }

/* right side */
#right {
	float: right;
	margin: 0 10px 10px 0;
}
#right-left {
	float: left;
	margin: 0 0 0 10px;
}
.boxtop { width: 292px; height: 14px; background: #fff url('../images/boxgraytop.gif') no-repeat; color: #000; }
.box h3 { font: bold 1.2em Arial, Sans-Serif; margin: 0 0 10px 0; padding: 0 0 5px 0; border-bottom: 2px solid #ccc;}
.box {  width: 272px; background: #fff url('../images/boxgray.gif') no-repeat bottom left; color: #5b5b5b; padding: 0 10px 15px 10px; margin: 0 0 10px 0; }
.box p { padding: 0; margin: 0;}

.image { float: left; margin: 0 9px 3px 0; border-style: none; }
li
{
	font-family: Arial,Helvetica,Geneva,sans-serif;
	font-size: 10px;
}

/* misc */
.buttons { text-align: right; padding: 4px 3px 0 0;}
.left_articles .buttons { float: right; height: 20px; }
.bluebtn { background: #488EB2 url('../images/bluebtn.gif') no-repeat; width: 100px; padding: 1px 16px 5px 16px; color: #fff; text-decoration: none; }
.greenbtn { background: #488EB2 url('../images/greenbtn.gif') no-repeat; padding: 1px 17px 5px 16px; color: #fff; text-decoration: none; }
.purplebtn { background: #488EB2 url('../images/purplebtn2.gif') no-repeat; padding: 1px 17px 5px 16px; color: #fff; text-decoration: none; }
.bluebtn:hover, .greenbtn:hover { background: #488EB2 url('../images/hoverbtn.gif') no-repeat; color: #fff; }
.purplebtn:hover { background: #488EB2 url('../images/hoverbtn3.gif') no-repeat; color: #fff; }

/* footer  */
.footer { clear: both; text-align: center; line-height: 1.8em; padding: 10px 0 10px 0; border-top: 1px solid #ccc; }
.topbar { clear: both; text-align: center; line-height: 1.8em; padding: 10px 0 10px 0; border-top: 2px solid #ccc; }

/* related links table/list */
table.links { clear: left; border: 1px solid #808080; border-collapse: collapse; }
table.links td { border: 1px solid #808080; padding: 3px; text-align: center; }
table.links tr.vidHeader td { background: #d9dadc url('../images/trbg.png') repeat-x top left; }
table.links tr.vidHeaderCurrent td { background: #eae6c0 url('../images/trbgcurrent.png') repeat-x top left; }
table.links td.title {
	text-align: left;
}
table.links tr.vidHeaderCurrent td.title {
	color: black;
}
table.links td.title {
	cursor: pointer;
}
table.links td.title .arrow {
	width: 16px;
	height: 17px;
	background-position: center left;
	margin-right: 3px;
	float: left;
}
table.links td.title .arrow {
	background-image: url('../images/right.png');
}
table.links td.title .arrow-selected {
	background-image: url('../images/bottom.png');
}

table.links tr.even td { background-color: #fdefd0; }

.hidden { display: none; }

table.links tr.vidDetails td {
	background-color: #ede9c6;
	text-align: left;
	border-style: none;
	font-size: 0.9em;
	vertical-align: top;
	padding: 5px;
}

dl.vidProperties {
	margin-top: 0;
	margin-bottom: 0;
}
dl.vidProperties dt {
	clear: left;
	font-weight: bold;
}
dl.vidProperties dd {
	margin-left: 1.2em;
}

ul.links li
{
	padding-left: 37px;
	background-image: url('/images/link.gif');
	background-repeat: no-repeat;
	background-position: 12px 0;
	padding-top: 0;
	padding-bottom: 0.5em;
}

ul.links li.pdf {
	background-image: url('/images/pdf.png');
}

ul.links li.doi {
	background-image: url('/images/doi.gif');
	background-position: 0 0;
}

ul.links li a {background-image: none;}

/* sponsors */
#sponsorsLogos {
	height: 485px;
}
#sponsorsLogos img {
	float: left;
	margin: 2px;
}

/* help / FAQ */
dl.faq {}
dl.faq dt { font-weight: bold; margin-bottom: 0.5em; }
dl.faq dd { margin-bottom: 1em; padding:0; margin-left: 2.5em; }