/*  
	SkyReporter
	Universal Styles
	CSS by Ian Russell @ EVOLVS.COM
	www.evolvs.com | ian@evolvs.com
	
	Colour Scheme:
	Green: #9ecf72 | Blue: #72c6e4
	
	Hacks:
	Uses min-height: 1px; to fix IE "peek-a-boo" bug
	
	--------------------------------------------------------------------	
*/



/* 
--------------------------------------------------------------------
GENERICS 
--------------------------------------------------------------------
*/

body {
	padding: 0px;
	margin: 0px;
	background: #4D4D4D url(../images/gradient-bg.jpg) 0px 0px repeat-x;
	
}

div {
	font-family: Helvetica, Arial, Verdana, sans-serif;
	min-height: 1px;
}


body a:link, body a:visited {
	color: #9ecf72;
	text-decoration: none;
}

body a:hover {
	color: #72c6e4;
}


h2 {
	padding:0px;
	margin:0px;
	font-size: 16px;
}



/* 
--------------------------------------------------------------------
STRUCTURE
--------------------------------------------------------------------
*/

#masterContainer {
	padding-top: 0px;
	background: url(../images/top-header-bg.jpg) center top no-repeat;
}

#topHeaderContent {
	width: 770px;
	height: 155px;	
}

#contentArea {
	width: 770px;
	margin-top: 5px;
	text-align: left;
}

	#contentArea  h3 {
		padding:0px;
		margin:0px 0px 5px 0px;
		color: #72c6e4;
		text-transform: capitalize;
		font-size: 22px;
		text-shadow: #000 2px 2px 3px;	
	}

#contentArea  h3 i {
		color: #fff;
		font-style: normal;stress
	}

h4 {
	margin:0px 0px 2px 0px;
	color: #72c6e4;
	text-transform: uppercase;
	font-size: 16px;
	text-shadow: #000 2px 2px 3px;
}



/* 
--------------------------------------------------------------------
TOPBAR
--------------------------------------------------------------------
*/

#logo { 
	border: 0px solid red; 
	text-align: left;
	padding: 19px 0px 20px 0px;
}

#logo h1	{
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	width: 356px;
	height: 74px;
	}

#logo h1 a	{
	display: block;
	margin: 0;
	padding: 0;
	width: 356px;
	height: 100%;
	text-decoration: none;
	background: transparent url(../images/logo.jpg) left top no-repeat;
	}

#logo h1 a:hover	{
	background: transparent url(../images/logo.jpg) 0 -74px no-repeat;
	}


/* 
--------------------------------------------------------------------
NAVIGATION BAR
--------------------------------------------------------------------
*/


#nav {
	height: 31px;
}


#nav  h1 {
	padding: 0px;
	margin: 0px;
	border-top: 1px solid #fdf643;
	border-bottom: 1px solid #fdf643;
	float:left;
}

#nav  a {
	text-decoration: none;
	color: #000;
	height: 29px;
	overflow: hidden;
	vertical-align: middle;
	display: block;
	text-indent: -9999px;
	background: red;
	background-position: left top;
	background-repeat: no-repeat;
}

	#nav a.home {
		width: 52px;
		background: url(../images/nav/home.png);
	}
	
	#nav a.about {
		width: 53px;
		background: url(../images/nav/about.png);
	}
	
	#nav a.book {
		width: 71px;
		background: url(../images/nav/book.png);
	}
	
	#nav a.archive {
		width: 69px;
		background: url(../images/nav/archive.png);
	}
	
	#nav a.record {
		width: 97px;
		background: url(../images/nav/record.png);
	}
	
	#nav a.news {
		width: 99px;
		background: url(../images/nav/news.png);
	}
	
	#nav a.contact {
		width: 64px;
		background: url(../images/nav/contact.png);
	}

	#nav a:hover {
		background-position: 0px -29px;
	}
		
	#nav  h1.current {
	background: url(../images/nav/current-arrow.gif) center bottom no-repeat;

	}




/* 
--------------------------------------------------------------------
CONTENT
--------------------------------------------------------------------
*/

#leftColumn {
	float: left;
}

#rightColumn {
	float: right;
}

#recentBox, #archiveBox, #nextBox, #welcomeBox {
	font-size: 10px;
	background: #404040;
	padding-top:5px;
	color: #a5a5a5;
	margin-bottom: 10px;
}
	
#recentBox {
	line-height:  16px;
}

	#recentBox .header {
		line-height:  23px;
	}
	
	#recentBox .thumbBox {
		padding: 5px 5px;
		margin: 2px 0px;
	}
	
	#recentBox  p, #welcomeBox p {
		clear: both;
		margin: 0px;
		padding: 0px;
		height: 1px !important;
		overflow: hidden;
	}
	
	#recentBox  .current {
		background: #4b4b4b url(../images/current-story.gif) right center no-repeat;
	}	

	#recentBox  a.thumbnail, #recentBox  a.thumbnail:link, #recentBox  a.thumbnail:visited {
		color: #a5a5a5;
		display: block;
		border-width: 0px;
		margin: 0;
		padding: 0;
	}

	#recentBox  a.thumbnail:hover   {
		color: #fff !important;
		cursor: hand;
	}

	#recentBox  a.thumbnail img, #recentBox  a.thumbnail:link img, #recentBox  a.thumbnail:visited img {
		border: 5px solid #666;
		float: left;		
	}

	#recentBox a.thumbnail:hover img {
		border-color: #adadad;
	}
	
	#recentBox .thumbBox .storyBlurb {
		float: right;
		width: 190px;
	}
	
	span.video, span.article, .comments  {
		color:#cdcdcd;
		padding-left: 16px;
		margin: 2px 0px;
		line-height: 16px;
	}
	
	.comments {
		background: transparent url(../images/icons-comments.png) left top no-repeat;
	}

	span.video {
		background: transparent url(../images/icons-video.png) left top no-repeat;
	}
	
	span.article {
		background: transparent url(../images/icons-article.png) left top no-repeat;
	}
	
	span b {
		font-weight: normal;
		margin-right: 10px;
	}
	
	#recentBox .thumbBox h3 {
		padding:0px;
		margin:0px;
		color: #80b7cb;
		text-transform:uppercase;
		font-size: 12px;
	}

	#recentBox .thumbBox a:hover h3 {
		color: #72c6e4;
	}

#archiveBox {
}

#archiveBox div.archiveContent a {
	color: #666;
	display: block;
	padding: 5px;
}

#archiveBox div.archiveContent a:hover {
	background: #4d4d4d;
	
}

#archiveBox div.archiveContent {
	
}

#archiveBox div.archiveContent b {
	font-size: 12px;
	color: #eee;
}


#featureBox .topRadius {
	background: #535353 url(../images/feature-topradius.gif) left top no-repeat;
	color: #a5a5a5;
	font-size: 10px;
	padding: 10px;
}

	#featureBox h1 {
		padding:0px;
		margin:0px;
		color: #72c6e4;
		text-transform:uppercase;
		font-size: 22px;
		text-shadow: #000 2px 2px 3px;	
	}
	
	#featureBox .blurb {
		font-size: 14px;
		color: #fff;
		/*margin-left: 50px;*/
	}	
	
	#featureBox #dateBox {
		background: url(../images/date-frame.gif) left top no-repeat;
		width: 48px;
		float: left;
		margin-bottom: 20px;
	}

	#featureBox #dateBox div {
		background: url(../images/date-frame-bot.gif) left bottom no-repeat;
		color: #fff;		
		font-size: 10px;
		padding: 8px;
		text-align: center;
		
	}
	
	#featureBox #dateBox h1 {
		padding:0px;
		margin:0px;
		color: #9ecf72;
		text-transform:uppercase;
		font-size: 22px;
		line-height: 18px;
	}

	#featureBox #dateBox b {
		font-size: 10px;
		font-family: Georgia, Times New Roman, Times, serif;
		text-transform:uppercase;
	}
	#featureBox #dateBox span {
		padding: 0px;
		font-size: 10px;
		color: #808080;
	}	

/* WELCOME */

#welcomeBox {
	font-size: 12px;
	font-weight: bold;
	line-height: 16px;
}

#welcomeBox .header {
	font-size: 14px;
	text-transform: uppercase;
	border: none;
	line-height: 23px;
}

	#welcomeBox .thumbBox {
		padding: 0px 5px 5px 5px;
		margin: 2px 0px;
	}

	#welcomeBox  a.thumbnail, #welcomeBox  a.thumbnail:link, #welcomeBox  a.thumbnail:visited {
		color: #a5a5a5;
		display: block;
		border-width: 0px;
		margin: 0;
		padding: 0;
	}

	#welcomeBox  a.thumbnail:hover   {
		color: #fff !important;
		cursor: hand;
	}

	#welcomeBox  a.thumbnail img, #welcomeBox  a.thumbnail:link img, #welcomeBox  a.thumbnail:visited img {
		border: 5px solid #666;
		float: left;		
	}

	#welcomeBox a.thumbnail:hover img {
		border-color: #adadad;
	}
	
	#welcomeBox .thumbBox .storyBlurb {
		float: right;
		width: 190px;
	}

/*  NEXT ON */

#nextBox {
	background: #535353;
}

#nextBox .content {
	padding: 5px;
}

#nextBox p {
	padding: 3px 18px;
	margin: 0px;
	background: transparent url(../images/icons-video.png) left center no-repeat;
	font-weight: bold;
}
	
/* SKYREPORTER NEWS */

#newsBox {
	font-size: 10px;
	background: #535353;
	padding-top:5px;
	color: #fff;
	margin-bottom: 10px;
}

#newsBox .content {
	padding: 5px;
}

#newsBox h4 {
	font-size: 20px;
}



/* HEADER*/
.header {
	margin: 0px 5px;
	line-height: 23px;
	border-top: 1px solid #8c8c8c;
	border-bottom: 1px solid #8c8c8c;
}

	.header b {
		color: #fff;
		text-transform: uppercase;
		text-shadow: #000 1px 1px 3px;	
	}

	.header b b {
		color: #b7ddf4;
			
	}
	
	.header div {
		float: right;
	}
	
	.header div b {
		color: #fff;
		text-decoration: underline;
	}
	
	.header a, .header a:link, .header a:visited {
		color: #adadad;
		padding: 0px 2px 0px 2px;
	}
	
	.header a:hover {
		color: #fff;
	}

a:link.nextArrow img, a:visited.nextArrow img {
	background: #000;
}	

a:hover.nextArrow img {
	background: #fff;	
}


/* COMMENTS */

#commentsThread {
	background: #505050;	
}

#commentsThread .header {
	font-size: 10px;
	text-transform: uppercase;
	border: none;
	line-height: 23px;
	margin: 0px;
	padding: 0px 0px 0px 5px;
}


.commentWrapper {
	background: #2d2d2d;
	margin: 2px 0px;
	padding: 4px;
}

#commentsThread .commentNumber {
	line-height: 22px;
	float: left;
	width: 30px;
	font-size: 24px;
	font-weight: bold;
	text-align: right;
	color: #666666;
}

.commentItem {
	color: #fff;
	margin-left: 35px;
	font-size: 12px;
	line-height: 17px;
	padding: 0px 5px 0px 0px;
}

span.commentTitle {
	font-size: 10px;
	color: #b8b8b8;
	display: block;
	line-height: 12px;
	padding-top: 2px;
}

span.commentTitle b {
	font-size: 14px;
	font-weight: bold;
}

span.commentTitle i {
	font-style: normal;
	font-weight: bold;
	color: #9ecf72;
}

/* POST A COMMENT */

#postComment {
	background: #686868;
	font-size: 10px;
	padding: 10px;
	color: #fff;
}

#postComment p {
	height: 20px;
	vertical-align: middle;
	line-height: 20px;
}

#postComment form {
	padding: 0px;
	margin: 0px;
}

#postComment label {
	display: block;
	padding-top: 5px;
	color: #d1d1d1;	
 }

#postComment label.radioButton {
	display: inline;
 }

#postComment fieldset {
	border: 0px;
 }


#postComment .commentsField {
	width: 430px;
}

.error {
	background: transparent url(../images/comments-asterisk.gif) right center no-repeat;
	padding-right: 10px;
	line-height: 14px;
	vertical-align: middle;
}

/* VIDEO NAV */
#picksNav {
	height:  15px;
	line-height: 15px;
	vertical-align: middle;
	padding: 0px;
	font-weight: bold;
}

	#picksNav .previous {
		margin-right: 25px;
		float: left;
	}

	#picksNav .next {
		margin-left: 25px;
		float: right;
	}

	#picksNav a:link, #picksNav a:visited {
	}	

	#picksNav a:hover, {
		color:#fff;
	}
#picksNav b.inactive {
	color: #888888;
}







/* 
--------------------------------------------------------------------
BOTBAR
--------------------------------------------------------------------
*/

#botBar {
	color:  grey;
	font-size: 10px;
	border-top: 1px solid #5b5a5a;
	padding-top: 10px;
	margin-top: 20px;
	margin-bottom: 
}

#botBar span {
	margin: 0px 0px 5px 10px;
	display: block;
}

#botBar div {
	text-align: left;
	width: 770px;
}

#botBar a {
	border-right: 1px solid #5c5c5c;
	padding: 0px 10px 0px 10px;
}

#botBar a:hover {
	text-decoration: underline;
}


/* 
--------------------------------------------------------------------
BOOK
--------------------------------------------------------------------
*/

#bookBox {
	background: url(../images/book-bottomradius.gif) left bottom no-repeat;
	padding-bottom: 10px;
}

#bookBox .topRadius {
	background: #535353 url(../images/book-topradius.gif) left top no-repeat;
	color: #fff;
	font-size: 12px;
	padding: 10px;
	line-height: 16px;
}

	#bookBox h1 {
		padding:0px;
		margin:0px 0px 5px 0px;
		color: #72c6e4;
		text-transform: capitalize;
		font-size: 32px;
		text-shadow: #000 2px 2px 3px;	
	}




.quoteBox {
	background: url(../images/quote-bottom.gif) left bottom no-repeat;
	padding-bottom: 9px;
	margin-top: 8px;
}

.quoteBox .topRadius {
	background:  url(../images/quote-top.gif) left top no-repeat;
	color: #fff;
	font-size: 14px;
	padding: 14px 14px 5px 14px;
	line-height: 18px;
	text-shadow: #4c722b 2px 2px 3px;		
}

.quoteBox .topRadius b {
	display: block;

}

div.pullQuote {
	color: #fff;
	font-size: 12px;
	line-height: 16px;
}

div.pullQuote b {
	text-align: left;
	font-weight: bold;
	color: #72c6e4;
	padding: 0px;
	margin: 0px;
}



/* 
--------------------------------------------------------------------
BOOK
--------------------------------------------------------------------
*/

#fullBox {
	background: url(../images/full-bottomradius.gif) left bottom no-repeat;
	padding-bottom: 10px;
	/*border: 1px solid blanchedalmond;*/
}

#fullBox .topRadius {
	background: #535353 url(../images/full-topradius.gif) left top no-repeat;
	color: #fff;
	font-size: 12px;
	padding: 10px;
	line-height: 16px;
	/*border: 1px solid pink;*/
}


/* 
--------------------------------------------------------------------
PHOTOS
--------------------------------------------------------------------
*/

.photoFrame {
	background: url(../images/photoframe-bottom.gif) left bottom no-repeat;
}

.photoFrame .top {
	background:  url(../images/photoframe-top.gif) left top no-repeat;
}

 .photoFramePortrait {
	background: url(../images/photoframe-bottom-portrait.gif) left bottom no-repeat;
}

.photoFramePortrait .top {
	background:  url(../images/photoframe-top-portrait.gif) left top no-repeat;
}

.photoFrame, .photoFramePortrait {
	padding-bottom: 35px;
	margin-top: 0px;
}

.photoFrame .top,  .photoFramePortrait .top {
	font-size: 12px;
	padding: 10px 10px 0px 10px;
}

.photoFrame .top img,  .photoFramePortrait .top img {
	border: 1px  solid #fff;
}



.onTheRecord h4 {
	padding:0px 0px 0px 5px;
	margin:0px 0px 5px 0px;
	color: #72c6e4;
	text-transform: uppercase;
	font-size: 16px;
	text-shadow: #000 2px 2px 3px;
	border-left: 3px  solid #9ecf72;
}

.onTheRecord b {
	color: #a9a9a9;
}

.clearMe {
	clear: both;
}



.topRadius p, .topRadius h3 {
	min-height:  1px;
}



/* ARTICLE VIEW */

#articleImage {
	background: url(../images/article-background-bot.gif) left bottom no-repeat;
	float: left;
	margin-right: 5px;
	margin: -5px 5px 0px -5px;
	padding-bottom: 5px;
}

#articleImage .top {
	background:  url(../images/article-background-top.gif) left top no-repeat;
	padding: 9px;
}

#articleImage .caption {
	width: 220px;
	color: #505050;
	font-size: 10px;
	font-weight: bold;
	line-height: 11px;
}


#featureBox div.article {
 	font-size: 13px;
 	color: #ffffff;
 	line-height:  17px;
}