@import url("reset.css");

/**********************
  COLORS & TYPOGRAPHY
**********************/

@font-face {
    font-family: 'BebasNeueRegular';
    src: url('BebasNeue-webfont.eot');
    src: url('BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('BebasNeue-webfont.woff') format('woff'),
         url('BebasNeue-webfont.ttf') format('truetype'),
         url('BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body { 
	background: #FFF; 
	color: #3c2719; 
	font: 100 80% Helvetica, sans-serif; }

p, blockquote, li, span { line-height: 1.5em }

#Main { text-align: left; }

h2, h3, h4, h5, #Navigation, #Countdown #cd strong, .Important { 
	color: #f2901d;
	font-family: "BebasNeueRegular", "Trebuchet MS", Arial, Helvetica, sans-serif; 
	text-transform: uppercase;
	font-weight: normal; }
	
h1 { text-indent: -999em; }
h2 { font-size: 4em; }
	#Content .Container h2:first-child { 
	color: #aaaba3;
		line-height: 1em;
		font-size: 8em; 
	filter:alpha(opacity=40);
		 -moz-opacity: 0.4;
	   -khtml-opacity: 0.4;
			  opacity: 0.4;
			  margin-bottom: 0; }
h3 { font-size: 3em; color: #a3be56; }
h4 { font-size: 2em; }
h5 { font-size: 1.5em; }

a { color: #ea7f00; outline:none; text-decoration: none; }
a:hover, a:active, a:focus, .Box a:hover, .Box a:active, .Box a:focus { color: #ffa030; text-shadow: 0px 0px 10px #FFF; }

.Small { font-size: .85em; }


/**********************
		DESIGN
**********************/

body { background: url(../img/design/Background.jpg) repeat center top; }
#Main { background: url(../img/design/Main-Background.jpg) repeat-x center top; }
#Container2 { background: url(../img/design/Container2-Background.jpg) no-repeat center top; min-height: 890px; }


/**********************
		LAYOUT
**********************/

html, body { text-align: center; /* IE <5.5 Fix */ height: 100%; width: 100%; }
#Header, #Content, #Footer { width: 865px; margin: 0 auto; position: relative; }
#Header { padding-top: 80px; height: 200px; margin-bottom: 25px; }
#Content { min-height: 400px; }
#Content .Container, #Footer .Container { width: 620px; float: right; }
#Footer { height: 90px; margin-bottom: 40px; }

#MetroLIVE a { position: absolute; top: 0px; right: 0px; display: block; width: 400px; height: 280px; background: url(../img/design/RadioWaves.gif) no-repeat 67px 10px; }


/*** NAVIGATION ***/

	#Navigation, #SubNavigation { padding-left: 10px; }

	#Navigation li.NavTop {
		display: block;
		clear: both; }

		#Navigation li a.NavMain { 
			display: block; 
			width: 150px; 
			height: 40px;
			line-height: 40px;
			font-size: 54px;
			color: #a4bf56; /*
			text-indent: -999em;
			background: url(../img/design/Navigation.gif) no-repeat 0 0; */
			float: left; }
			
				#Navigation li:hover a.NavMain, 
				#Navigation li:focus a.NavMain,
				#Navigation li.sfhover a.NavMain { color: #FFF; background-color: #f7941e; text-shadow: none; }
		
	/** DROP DOWN **/
			#Navigation li ul { 
				display: none; 
				background: #f7941e; 
				float: left;
				padding: 0; margin: 0; }
				
				#Navigation li:hover ul, #Navigation li.sfhover ul { display: block; }
				
				#Navigation li ul li { float: left; padding: 0; margin: 0; }
				
					#Navigation li li a { 
						display: block; 
						height: 16px;
						font-size: 18px;
						font-weight: bold;
						line-height: 18px; 
						color: #FFF; 
						left: auto; 
						padding: 24px 10px 0;
						vertical-align: bottom; }
					
						#Navigation li li a:hover { color: #272727; text-shadow: none; }
				
		
	/** SUB NAVIGATION **/
		#SubNavigation { position: absolute; bottom: 5px; left: 0; font-size: 10px; }
		#SubNavigation li { float: left; }
		
		#SubNavigation li a { 
			display: block; 
			padding: 3px 60px 0 0;
			color: #3d2619; 
			font-weight: bold; }			
	
		#SubNavigation li a:hover, #SubNavigation li a:focus { color: #604536; }

/*
	#Navigation, #SubNavigation { padding-left: 10px; }

	#Navigation li.NavTop {
		display: block;
		clear: both; }

		#Navigation li a.NavMain { 
			display: block; 
			width: 150px; 
			height: 38px;
			text-indent: -999em;
			background: url(../img/design/Navigation.gif) no-repeat 0 0;
			float: left; }
			
			#Navigation li#NavAbout a.NavMain { background-position: 0 0px; width: 120px; }
			#Navigation li#NavMedia a.NavMain { background-position: 0 -50px; width: 115px; }
			#Navigation li#NavServing a.NavMain { background-position: 0 -100px; width: 155px;  }
			#Navigation li#NavSupport a.NavMain { background-position: 0 -150px; width: 160px; }
			
				#Navigation li:hover a.NavMain, 
				#Navigation li:focus a.NavMain,
				#Navigation li.sfhover a.NavMain { background-color: #b71f24; }
				
				#Navigation li#NavAbout:hover a.NavMain, 
				#Navigation li#NavAbout:focus a.NavMain, 
				#Navigation li#NavAbout.sfhover a.NavMain { background-position: 0 -300px; }
				#Navigation li#NavMedia:hover a.NavMain, 
				#Navigation li#NavMedia:focus a.NavMain, 
				#Navigation li#NavMedia.sfhover a.NavMain { background-position: 0 -350px; }
				#Navigation li#NavServing:hover a.NavMain, 
				#Navigation li#NavMedia:focus a.NavServing, 
				#Navigation li#NavServing.sfhover a.NavMain { background-position: 0 -400px; }
				#Navigation li#NavSupport:hover a.NavMain, 
				#Navigation li#NavSupport:focus a.NavMain, 
				#Navigation li#NavSupport.sfhover a.NavMain { background-position: 0 -450px; }
		
	/** DROP DOWN *
			#Navigation li ul { 
				display: none; 
				background: #b71f24; 
				float: left;
				padding: 0; margin: 0; }
				
				#Navigation li:hover ul, #Navigation li.sfhover ul { display: block; }
				
				#Navigation li ul li { float: left; padding: 0; margin: 0; }
				
					#Navigation li li a { 
						display: block; 
						height: 16px;
						font-size: 18px;
						font-weight: bold;
						line-height: 18px; 
						color: #FFF; 
						left: auto; 
						padding: 22px 10px 0;
						vertical-align: bottom; }
					
						#Navigation li li a:hover { color: #272727; }
				
		
	/** SUB NAVIGATION *
		#SubNavigation { position: absolute; bottom: 5px; left: 0; }
		#SubNavigation li { float: left; }
		
		#SubNavigation li a { 
			display: block; 
			padding: 3px 60px 0 0;
			color: #272727; 
			font-weight: bold; }			
	
		#SubNavigation li a:hover, #SubNavigation li a:focus { color: #b71f24; } */

/************************
	SPECIFIC ELEMENTS 
************************/


p { margin-bottom: 1em; }
strong, b { font-weight: bold; }
em, i { font-style: italic; }
small { font-size: .75em; text-transform: none; }

hr { display: none; }

.hr { 
	width: 100%; 
	height: 10px; 
	margin: 45px 0 40px;
	background: url(../img/design/hr.gif) no-repeat center top; }

.border { border: solid 2px #171717; }
.Photo-Border { 
	border: solid 5px #eee;
	-moz-box-shadow: 0px 0px 7px rgba(0,0,0,.5); /* FF3.5+ */
	-webkit-box-shadow: 0px 0px 7px rgba(0,0,0,.5); /* Saf3.0+, Chrome */
	box-shadow: 0px 0px 7px rgba(0,0,0,.5); /* Opera 10.5, IE 9.0 */  }
a:hover .border, a.border:hover, a:focus .border, a.border:focus { border: solid 2px #e5171e; }

.subtle, .Subtle { color: #b9b6b2; }

.text-left, .Text-Left { text-align: left; }
.text-right, .Text-Right { text-align: right; }
.text-center, .Text-Center { text-align: center; }
	
.center, .Center { margin-left: auto; margin-right: auto; }
img.center, .center img { display: block; margin: 0 auto; }

.FloatLeft { float: left; }
.FloatRight { float: right; }

/* Clear Fix */
.Clear:after, .clear:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0; }
* html .Clear, * html .clear	{ zoom: 1; } /* IE6 */
*:first-child+html .Clear, *:first-child+html .clear	{ zoom: 1; } /* IE7 */

.Clear-Left { clear: left; }
.Clear-Right { clear: right; }

img.FloatRight { margin: 0 0 20px 20px; }
img.FloatLeft { margin: 0 20px 20px 0; }
	
.Podcast p { margin-bottom: 0; /* width: 620px; */}

.Podcast-Link { 
	display: inline-block; 
	padding-right: 24px; 
	background: url(../img/design/Podcast-Icon.gif) no-repeat right 4px; }

#Tag-Line {
	text-indent: -999em;
	width: 500px;
	height: 55px;
	margin: 20px auto;
	background: url(../img/design/Tag-Line.gif) no-repeat center top; }
	
#Tag-Line i { text-indent: -999em; }
		
		
/*** BOXES ***/

	.ThreeBoxes, .TwoBoxes, .OneBox { 
		background: url(../img/design/Boxes.jpg) no-repeat right bottom; 
		float: right; 
		min-height: 350px;
		padding-bottom: 60px;
		margin: 0 0 20px 20px; }
		
	.ThreeBoxes { width: 625px; }
	.TwoBoxes { width: 416px; }
	.OneBox { width: 200px; }

	.Box {
		float: right;
		padding: 5px 10px;
		margin-left: 10px;
		width: 178px; }
	
	.Box h2, .Box h3, .Box h4, .Box h5, .Box h2 a, .Box h3 a, .Box h4 a, .Box h5 a { text-align: left; color: #aaaba3; margin-bottom: .25em; }
	
	.Box a { color: #3d2619; display: inline-block; }
	.Box a:hover { color: #66675b; }
	
	.Box a:hover img, .Box a:focus img { border-color: #b9b6b2; }
	
	.Podcast li { padding: 5px 0; border-bottom: solid 1px #40534f; }
	
	.Box .hr { background: none; height: 1px; padding: 5px 0; border-bottom: solid 1px #5a5a4b; }
	

		
/*** HORIZONTAL LIST ***/
	.Horizontal-List { width: 105%; margin: 20px 0 20px -5%; }
		.Horizontal-List li { float: left; width: 45%; padding: 0; list-style-type: none; margin: 0 0 5% 5%; }
		.Horizontal-List.One-Up li { width: 95%; }
		.Horizontal-List.Three-Up li { width: 28%; }
		.Horizontal-List.Four-Up li { width: 20%; }
	
		
.Image-List li a img {
	filter:alpha(opacity=40);
		 -moz-opacity: 0.4;
	   -khtml-opacity: 0.4;
			  opacity: 0.4; }
			
	.Image-List li a:hover img, .Image-List li a:focus img {
			filter:alpha(opacity=80);
			-moz-opacity: 0.8;
			-khtml-opacity: 0.8;
			opacity: 0.8; }
			
.Box .Image-List li a img { padding-bottom: 5px; }
			
/*** STANDARD LISTS ***/
	.List { 
		list-style-position: inside;
		width: 500px;
		margin: 0 auto 1em;
		padding-bottom: 10px;
		background: transparent url(../img/design/hr.gif) no-repeat center bottom;
		font-size: 14px;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; }
	.List > li { 
		padding: 15px 20px 10px;
		background: transparent url(../img/design/hr.gif) no-repeat center top; }
	.List li:nth-child(odd) { 
		background-color: #f4f4f1; }
	ol.List { list-style-type: decimal-leading-zero; }
	ul.List { list-style-type: none; }
	.List .List {
		width: 100%;
		margin: 0;
		list-style-type: circle; 
		background: none; 
		font: 100 80% Helvetica, sans-serif; }
		
	.List ul.List { list-style-type: disc; }
	.List ol.List { list-style-type: lower-alpha; }
	
	.List .List li { 
		padding-top: 5px; 
		padding-bottom: 0; 
		margin: 0 10px;
		background: transparent;
		font-size: 14px; }
		
	.List time { display: inline-block; width: 100px; font-weight: bold; text-align: center; }
	.List .Subtle { padding-left: 20px; }
		
/*** Button Links ***/

.Button-Link {  
		background-color: #bf2424;
		display: inline-block; 
		padding: .4em .5em; 
		margin: 0 1px 1px 0; 
		color: #FFF !important; 
		font-weight: bold; 
		text-decoration: none !important; 
		line-height: 1em; 
		-moz-border-radius: .25em; 
		-webkit-border-radius: .25em;
		border-radius: .25em; }
		
	.Button-Link.Large { font-size: 1.25em; }
	.Button-Link small { font-weight: normal; text-transform: uppercase; }
	.Button-Link:hover, .Button-Link:focus { 
		background-color: #FFF;
		color: #bf2126 !important;  }

	.Button-Link.Alt { background-color: #507874; }
	.Button-Link.Alt:hover, .Button-Link.Alt:focus { background-color: #fff; color: #507874 !important;  }
		

/*** FAQs ***/

	.Question, .Answer { 
		background: url(../img/design/Q-A.gif) no-repeat 0 0; 
		padding: 0 0 10px 40px; 
		margin-top: 10px;
		height: 35px; }
	.Question { 
		font-weight: bold; 
		font-size: 1.25em; 
		background-position: 0 0;
		color:#f39020;
		padding-top: 5px; }
	.Answer { background-position: 0 -100px; }
	
		
/*** COUNTDOWN CLOCK ***/
	
	#Countdown {
		position: absolute;
		top: 280px; 
		left: 0px;
		height: 100px;
		padding: 2px 0 20px; }
		
	#Countdown p#Next-Metro {
		filter:alpha(opacity:60);
			 -moz-opacity: 0.6;
		   -khtml-opacity: 0.6;
			      opacity: 0.6;
		background: #F9F8F4;
		height: 30px; 
		padding: 5px 20px 5px 0; 
		margin-bottom: 20px;
		line-height: 20px;
		font: 100 16px "Trebuchet MS", Arial, Helvetica, sans-serif; 
		text-align: right;
		text-transform: uppercase; }
		
		#Countdown p#Next-Metro strong { color: #a3be56; }
	
	#Countdown #cd { 
		padding-left: 150px;
		filter:alpha(opacity=50);
			 -moz-opacity: 0.5;
		   -khtml-opacity: 0.5;
			      opacity: 0.5;
		-webkit-user-select: none;
		   -moz-user-select: none;
				user-select: none;
		-webkit-transition: all .2s linear;
		   -moz-transition: all .2s linear;
				transition: all .2s linear; }
	

	#Countdown .countdown_section, #Countdown #cd small { 
		font: 100 12px "Trebuchet MS", Arial, Helvetica, sans-serif;
		width: 80px;
		height: 20px;
		margin-bottom: 25px;
		display: block;
		text-align: center;
		text-transform: uppercase;
		font-weight: bold;
		color: #a3be56; }
	
	#Countdown span.countdown_amount, #Countdown #cd strong {
		font: 100 54px "BebasNeueRegular", "Trebuchet MS", Arial, Helvetica, sans-serif;
		display: block; 
		height: 40px;
		width: 80px;
		margin-bottom: 10px;
		text-align: center;
		line-height: 1em;
		font-weight: normal;
		 color: #f2901d; }
			
	
		
/*** FOOTER LINKS ***/
	#Footer-Links { width: 625px; height: 90px; padding-bottom: 20px; margin-left: auto; margin-right: auto; }
	#Footer-Links li { float: left; width: 200px; height: 90px; }
	#Footer-Links li a, #Footer-Links .eNewsletter { display: block; width: 200px; height: 90px; background: url(../img/design/Footer.gif) no-repeat 0 0; padding-right: 5px; }
	#Footer-Links li a, #Footer-Links li div { text-indent: -999em; }
	
	#Footer-Links .Facebook-Link a { background-position: 0 0; }
	#Footer-Links .eNewsletter { background-position: -200px 0; }
	#Footer-Links .Twitter-Link a { background-position: -400px 0; }
	
	#Footer-Links .Facebook-Link a:hover { background-position: 0 -100px; }
	#Footer-Links .Twitter-Link a:hover { background-position: -400px -100px; }
	
	#Footer-Links .eNewsletter iframe { display: block; border: solid 1px #f5921e; width: 170px; height: 40px; margin: 20px 0 0 22px; }
	
	
/*** TWEETS ***/
	#Twitter-Feed {
		width: 615px; 
		margin-bottom: 40px; }
	
	#Tweets ul, #Tweets li { 
		font-size: 11px;
		background: none; 
		list-style-type: none; 
		padding:0; 
		margin: 0; }
	
	#Tweets ul { 
		height: 130px; }
		
	#Twitter-Feed h3 { display: none; }
			
			#Tweets li { 
				padding: 2%;
				float: left; 
				width: 29.3%;
				height: 96%; 
				text-align: left;
				background-color: rgb(240,240,240);
				background-color: rgba(200,200,200,.2); }
			#Tweets li.tweet_odd { 
				background-color: rgb(220,220,220);
				background-color: rgba(180,180,180,.2); }
			
				#Tweets .tweet_list .tweet_avatar {
				  padding-right: .5em;
				  float: left; }
				  
				 #Tweets .tweet_list .tweet_avatar img {
					vertical-align: middle; }
					
/*** HOUSTON PROJECT ***/

#Houston-Project {
	border: solid 2px #eee;
	background: url(../img/Houston-Project/Background-Texture.jpg) repeat 0 0; 
	width: 536px;
	padding: 40px;
	color: rgb(230,230,230);
	color: rgba(250,250,250,.8); }
	
	#Houston-Project #HP-Container {
		background: url(../img/Houston-Project/Ink-Blot.png) no-repeat 0 5px; }
		
		#Houston-Project .Float-Left { 
			float: left; 
			width: 220px; }
		#Houston-Project .Float-Right { 
			float: right; 
			width: 260px;
			height: 310px; }
		
			#Houston-Project h3 {
				display: block;
				background: url(../img/Houston-Project/Logo.png) no-repeat 0 0; 
				width: 220px; 
				height: 290px;
				margin-bottom: 20px;
				text-indent: -999em; }
				
			#Houston-Project h4, #Houston-Project h5, #Houston-Project h3, #Houston-Project .Button-Link, .HP-Button { 
				font-family: "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif; 
				text-transform: uppercase;
				line-height: .9em; 
				letter-spacing: -.02em;
				font-weight: bold;
				color: #4d5654;
				color: rgba(102,149,139,.5); }
				
			a.HP-Button {
				background: url(../img/design/rgba.php?r=75&g=57&b=43&a=60) repeat;
				background: rgba(75,57,43,.6);
				color: #FF9200;
				display: block;
				height: 40px;
				width: 96%;
				padding: 5px 2%;
				margin: 0 0 2px;
				text-align: right;
				font-size: 2em;
				line-height: .9em;
				position: relative; }
				
				a.HP-Button span, 
				a.HP-Button small { position: absolute; bottom: 0px; right: 5px; }
				
				
				.HP-Button.Alt { 
					background: url(../img/design/rgba.php?r=75&g=57&b=43&a=30) repeat;
					background-color: rgba(75,57,43,.3); }
				
				a.HP-Button:hover, a.HP-Button:focus {
					background-color: #d78300;
					text-decoration: none;
					filter:alpha(opacity=100);
					-moz-opacity: 1;
					-khtml-opacity: 1;
					opacity: 1; }
				
			#Houston-Project .Button-Link { 
				display: block; 
				width: 96%; 
				font-size: 1.25em;
				-moz-border-radius: 0em; 
				-webkit-border-radius: 0em;
				border-radius: 0em;
				background-color: rgba(75,57,43,.6); 
				padding: 1em 2%;
				margin: 2px 0;
				color: #d78300 !important; }
				
				#Houston-Project .Button-Link.Alt { background-color: rgba(75,57,43,.3); }
				
				#Houston-Project .Button-Link:hover, #Houston-Project .Button-Link:focus {
					background-color: #d78300;
					color: #ffb645 !important; }