/* 
ABC News Fromelles Styles
Created by: Jim Whimpey, 4 September 2009
*/

/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		BODY
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

	body { 
		background: #000 url("/news/events/fromelles/images/bg.jpg") no-repeat center 30px;
		font-weight: bold;
		font-family: Arial, Helvetica, sans-serif;	
		}
		
		h1, h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif; }
		
		.page_margins { background: #6D4F35 url("/news/events/fromelles/images/bg-content.jpg") no-repeat top left; }
		
		


/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		HEADER
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
		
	#header {
		background: none;
		border-bottom: none;
		height: 113px;
		position: relative;
		}
		
		#header h1,  
		#header h2 {
			position: absolute;
			margin: 0;
			}
			
			#header h1 a,
			#header h2 a {
				display: block;
				width: 100%;
				height: 100%;
				text-indent: -9999px;
				}
			
			#header h1 {
				width: 500px;
				height: 42px;
				top: 20px;
				left: 240px;
				}
				
			#header h2 {
				width: 250px;
				height: 20px;
				top: 78px;
				left: 360px;
				}



		
		
/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		NAV
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	.nav {
		width: 100%;
		height: 30px;
		}
		
		.nav ul {
			width: 100%;
			text-align: center;
			padding: 9px 0 0 0;
			height: 30px;
			}
		
			.nav ul li {
				margin: 0;
				line-height: 1em;
				display: inline;
				}
			
				.nav ul li a, 
				.nav ul li a:visited {
					font-size: 14px;
					font-weight: bold;
					color: #FECD7F;
					text-shadow: #000 0 1px 0;
					margin: 0 30px 0 0;
					}
					
					.nav ul li a:hover {
						color: #fff;
						text-decoration: none;
						}
						


/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		CONTENT AREA
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	#main {
		position: relative;
		background: none;
		padding: 20px 20px 0 20px;
		}




/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		FRONT PAGE BLOCKS
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */						
						
	#blocks .section {
		border: 2px solid #000;
		display: block;
		background-repeat: no-repeat;
		background-position: center center;
		background-color: #666;
		margin-bottom: 30px;
		margin-right: 15px;
		}
		
		#blocks .video a, 
		#blocks .timeline a, 
		#blocks .map a, 
		#blocks .slideshow a {
			display: block;
			position: relative;
			width: 100%;
			height: 290px;
			}
			
			#blocks .timeline a, 
			#blocks .slideshow a,
			#blocks .map a { height: 76px; }
			
			#blocks .section a:hover { text-decoration: none; }
			
			#blocks .section a span.title, 
			#blocks .section h2 {
				display: block;
				width: 100%;
				padding: 6px 0;
				background: #333;
				background: rgba(0, 0, 0, 0.6);
				color: #FFF;
				font-weight: bold;
				font-size: 12px;
				}
				
				#blocks .section a:hover span.title { color: #999; }
				
				#blocks .read h2 { margin-bottom: 0; }
				
				#blocks .section a span.title span, 
				#blocks .section h2 span { 
					display: inline;
					text-transform: uppercase;
					color: #CCC;
					padding: 6px 10px 6px 25px;
					margin-right: 10px;
					background-color: #000;
					background-repeat: no-repeat;
					background-position: 6px 8px;
					}
					
					#blocks .video a span.title span { background-image: url("/news/assets/v5/images/common/icons/video-12x9-white-on-black.png"); }
					
					#blocks .slideshow a span.title span { background-image: url("/news/assets/v5/images/common/icons/slideshow-12x9-white-on-black.png"); }
					
					#blocks .read h2 span { background-image: url("/news/assets/v5/images/common/icons/doc-10x11-white-on-black.png"); background-position: 8px 7px; }
					
					#blocks .timeline a span.title span { background-image: url("/news/assets/v5/images/common/icons/timeline-12x9-white-on-black.png"); }
					
					#blocks .map a span.title span { background-image: url("/news/assets/v5/images/common/icons/map-12x9-white-on-black.png"); }
		
		.speed-selector {
			background: #000;
			color: #fff;
			font-weight: bold;
			font-size: 11px;
			text-transform: uppercase;
			padding: 4px 6px;
			margin: 0 auto;
			}
			
			.speed-selector label {
				margin: 0 20px 0 0;
				}
				
				.speed-selector label span { color: #CCC; }
				
		.play {
			display: block;
			position: absolute;
			width: 55px;
			height: 20px;
			right: 20px;
			bottom: 20px;
			background: url("/news/assets/v5/images/common/buttons/play.png");
			text-indent: -9999px;
			}
		
		#blocks .read .subcolumns .c50l {
			border-right: 2px solid #000 !important;
			height: 50px;
			}
			
			#blocks .read a {
				display: block;
				height: 40px;
				color: #FFF;
				padding: 10px 0 0 15px;
				}
				
				#blocks .read a:hover { color: #000; }
			
		#map1 { background: url("/news/events/fromelles/images/map.jpg") center center; }
		
		#slideshow1 { background: url("/news/events/fromelles/images/slideshow.jpg") center center; }
		
		#video1 { background: url("/news/events/fromelles/images/video1_alt.jpg") center center; }
		
		#video2 { background: url("/news/events/fromelles/images/video2.jpg") center center; }
				
		#timeline { background: url("/news/events/fromelles/images/timeline.jpg") center center; }
		
	



/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		MAP
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	iframe {
		border: 2px solid #000;
		margin: 10px 0 30px 10px;
		}
		



/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		SLIDESHOW
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

	#slideshowpro {
		width: 934px;
		margin: 10px 0 30px 10px;
		border: 2px solid #000;
		}



/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		VIDEO
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

	#video { text-align: center; }

		#video-holder {
			border: 2px solid #000 !important;
			margin: 0 auto;
			}
			
	
	

/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		TEXT PIECES
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	#main.text-pieces {
		margin: 20px 80px;
		color: #fff !important;
		background: transparent url("/news/events/fromelles/images/bg-black.png");
		padding-bottom: 15px !important;
		}
		
		.text-pieces h2 {
			font-size: 1.8em;
			}
			
		.text-pieces p.byline {
			color: #fff;
			font-style: italic;
			font-weight: bold;
			}
		
		.text-pieces p#quote {
			font: 1.5em Georgia, Times, serif;
			font-style: italic;
			margin: 0 0 5px 0;
			}
		
		.text-pieces p {
			line-height: 1.8em;
			font-size: 1.2em;
			font-weight: normal;
			}
			
			.text-pieces p.first { font-weight: bold; }
			
		.text-pieces blockquote {
			font: 1.2em/1.8em Georgia, Times, serif;
			font-style: italic;
			margin: 0 0 1em 30px;
			}




/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		TIMELINE
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	.timeline-page #main {
		color: #fff !important;
		background: transparent url("/news/events/fromelles/images/bg-black.png");
		margin: 30px;
		padding-bottom: 30px;
		}
		
		.timeline h2 {
			font-size: 1.8em;
			margin: 0 0 30px 0;
			}
			
		.timeline .block-of-time {
			border-top: 1px solid #585858;
			padding: 30px 0;
			}
			
		.timeline .block-of-time .date {
			font-family: Georgia, Times, serif;
			font-size: 1.3em;
			font-style: italic;
			font-weight: normal;
			}
			
		.timeline .block-of-time .events h3 {
			margin: 0 0 1.4em 0;
			line-height: 1.6em;
			}
			
		.timeline .block-of-time .events blockquote {
			margin: 0 0 0.8em 0;
			font-size: 1.2em;
			font-style: italic;
			font-weight: normal;
			line-height: 1.6em;
			}
			
		.timeline .block-of-time .events cite {
			display: block;
			margin: 0 0 2.2em 0;
			}
		
		.timeline .block-of-time .subcolumns .section {
			margin: 0 10px 0 0;
			font-weight: normal;
			font-size: 0.9em;
			}
			
			.timeline .block-of-time .subcolumns .section img {
				margin: 0 0 0.8em 0;
				}
		
	
	
	
	
/* 	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
		FOOTER
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	#footer {
		background: #000;
		padding: 30px 0 55px 0;
		}
		
		#footer .blurb .section { margin-left: 30px; }
		
			#footer .blurb .section p {
				text-transform: none;
				margin: 0 30px 0.8em 0;
				font-size: 1em;
				font-weight: normal;
				}
		
		#footer .credits { 
			text-transform: uppercase;
			color: #7B7B7B !important;	
			}
		
			#footer .credits h2 {
				margin: 0 0 10px 0;
				}
		
			#footer .credits p {
				margin: 0 0 5px 0;
				font-size: 10px;
				}
			
				#footer .credits p a { color: #7B7B7B; }
			
					#footer .credits p a.news-link {
						display: block;
						text-transform: lowercase;
						margin: 10px 0 0 0;
						font-size: 14px;
						}