/*
-----------------------------------------------
ncam
daniel_bulli@wgbh.org
----------------------------------------------- */

/* -- initialize base -- */
	*, td, img	{margin : 0; padding : 0;}
	img { border: 0; }
	
	form, fieldset	{font: 100%/120% verdana, arial, sans-serif}
	p	{padding: 0 0 0 0; margin: 0 0 1em 0}

	form label	{cursor: pointer}
	fieldset	{border: none}
	input, select, textarea {font-size: 100%}
	
/* -- body -- */
	body	{
		background: #fff;
		color: #333; 
		font: 62.5%/1.4em verdana, arial, sans-serif;
	}
	
	body#ncam-home	{
		background: #fff url(../i/db/h-bg.gif) repeat-y top left
	}	


/* -- [ access - instructions ]
-----------------------------------------------*/
	p.access-instructions { 
		line-height: 3.6em; 
		margin: 0 0 0 223px;
		padding: 0 0 0 18px;
		display: block;
		width: 373px;
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
	}
	
		p.access-instructions a:link,
		p.access-instructions a:visited	{color: #ccc; text-decoration: underline;}
		p.access-instructions a:hover,
		p.access-instructions a:active,
		p.access-instructions a:focus		{color: #f90; text-decoration: underline;}	


/* -- [ left-content ]
-----------------------------------------------*/
	#left-content {
		width: 207px;
		margin-right: 16px;
		float: left;
	}
	
	#message {
		margin-left: 16px;
		border-top: 1px solid #ccc;
		padding-top: 2px;
		color: #333;
		font: 1.3em/1.35em Georgia, serif;
	}
	#message p {
		border-top: 1px solid #ccc;
		padding-top: 7px;
	}
	
	#whatsnew {
		margin-left: 16px;
		border-top: 1px solid #ccc;
		padding-top: 2px;
		color: #666;
	}	
	
	#whatsnew h2 {
		border-top: 1px solid #ccc;
		padding: 7px 0;	
		font-size: 1em;
		color: #6288af;
		border-bottom: 1px dotted #ccc;
		margin-bottom: 11px;
	}
	
	#whatsnew ul {
		margin-left: -16px;
		list-style: none;
	}
	#whatsnew ul li {
		list-style: none;	
		background-image: url(../i/arrow_right.gif);
		background-repeat: no-repeat;
		background-position:  5px 0;		
		margin-top: 11px;
		padding-left:16px;
		padding-bottom: 11px;
		border-bottom: 1px dotted #ccc;	
	}
	#whatsnew ul li.more  {
		border-bottom: none;	
		background-image: none;
	}		
	#whatsnew ul li.more p {
		margin: 10px 16px;
		padding-bottom: 11px;
		border-bottom: 1px dotted #ccc;		
		border-bottom: none;	
		background-image: none;
	}		
	
/* -- [ middle-content ]
-----------------------------------------------*/
	#middle-content {
		color: #ccc;
		width: 391px;
		margin: 0 16px 0 0;
		float: left;	
	}
	
	img.img-logo { 
		width: 391px; 
		border-bottom: 1px solid #fff;
	}
	
	
		/* -- [ site-info ]
		-----------------------------------------------*/
		#site-info {
			padding: 19px;
			border-bottom: 1px solid #fff;
		}	
		
		a.a-box {
			display: block;
			width: 194px;
			padding: 0 9px;
			padding: .5em 9px .2em 9px;
			border: 1px solid #b1c4d6;
			background-color: #6388ad;
			margin: 0 0 .5em 0;
			float: left;
			/** height: 3.6em; **/
		}
		
		#middle-content a.a-box:link,
		#middle-content a.a-box:visited	{color: #fff; text-decoration: none;}
		#middle-content a.a-box:hover,
		#middle-content a.a-box:active,
		#middle-content a.a-box:focus		{text-decoration: none;border: 1px solid #f90;}		
		
		#site-main-nav { float: left; width: 194px; margin-bottom: 1.7em;}
		#site-info h2 { font-size:1em;  font-weight: normal;}
		#site-info h2 small { font-size:1em; }
		
		
		#site-tool {
			width: 107px;
			padding: .4em 9px;
			float: right;
			background-color: #484848;
			border-top: 1px solid #b1c4d6;
			border-bottom: 1px solid #b1c4d6;
			margin-bottom: 1.7em;
			line-height: 2em;
		}
		
		#site-tool ul 
		{
			list-style: none;
			line-height: 1.5em;
		}	

		#middle-content a:link,
		#middle-content a:visited	{color: #ccc; text-decoration: underline;}
		#middle-content a:hover,
		#middle-content a:active,
		#middle-content a:focus		{color: #f90; text-decoration: underline;}	
		
		form#frm-search {
			margin-top: 2em;
		}
		
		form#frm-search label {
			color: #ccc;
		}
		
		form#frm-search input#q {
			background-color: #a4a4a4;
			border: 1px solid #8b8b8b;
			color: #fff;
			margin-bottom: .5em;
		}		
		
		.mission { 
			margin: 0 0 0 0; 
			clear: both;
		}
		
		
		.middle-box h3 {
			font-size: 1em;
		}
		
		.middle-box {
			float: left;
			padding: 19px;
			width: 119px;
		}
		#funding-from {
			width: 190px;
			padding: 19px 0;
		}

		.middle-box ul {
			margin-bottom: 1em;
		}
		
		.middle-box ul,
		.middle-box ul li {
			list-style: none;
		}

/* -- [ right-content ]
-----------------------------------------------*/
	#right-content {
		width: 135px;
		float: left;
	}	
	
	#highlights {
		border-top: 1px solid #ccc;
		padding-top: 2px;
		color: #666;
	}	
	
	#highlights h2 {
		border-top: 1px solid #ccc;
		padding: 7px 0;	
		font-size: 1em;
		color: #6288af;
		border-bottom: 1px solid #ccc;
		margin-bottom: 11px;
		font: 1.4em/1.35em Georgia, serif;
		font-weight: normal;
	}
	
	.hi-box {
		margin-top: 15px;
		background-color: #e0e7ef;
		border: 1px solid #aec1d5;
		padding: 7px;
		background-image: url(../i/arrow_down.gif);
		background-repeat: no-repeat;
		background-position:  120px 13px;
		
	}
	
	.hi-box a { 
		display: block;
		margin: 7px 0 0 0;
	}
	.hi-box a:link,
	.hi-box a:visited	{font-weight: bold; text-decoration: none;}
	.hi-box a:hover,
	.hi-box a:active,
	.hi-box a:focus		{font-weight: bold; text-decoration: underline; color: #c60;}		
	
/* -- [ footer ]
-----------------------------------------------*/
	
	#footer {
		clear: both;
		padding-top: 3em;
		color: #999;
		margin-left: 223px;
		width: 391px;
	}
	
	#footer p {
		display: block;
		border-top: 1px solid #999;
		padding: 2em 19px;
		font-size: 0.9em;
		line-height: 2em;		
	}	

	#footer a:link,
	#footer a:visited	{color: #999; text-decoration: underline;}
	#footer a:hover,
	#footer a:active,
	#footer a:focus		{color: #f90; text-decoration: underline;}	

/* -- [ links ]
-----------------------------------------------*/		
	
	/* -- general -- */
		a:link,
		a:visited	{color: #6588AE; text-decoration: underline;}
		a:hover,
		a:active,
		a:focus		{color: #c60; text-decoration: underline;}
		
		
		/* SKIPPER */			
		p#skipper {
			position: absolute;		
		}
		
		p#skipper a {
			position: absolute;
			display: block;
			width: 8em;
			text-indent: -9000px;	
		}		
		
		p#skipper a:active,
		p#skipper a:focus {
			position: absolute;
			display: block;
			width: 8em;
			text-indent: 0;
			font-size: 2em;
			padding: .5em;
			left: 0px;
			top: 0px;
			background: #eee;
			border: 1px dotted #c90;
		}