/* these styles used ONLY on front page ONLY for phone sizes */

@media only screen and (min-width: 768px) {
	
	#fast_facts_container .fast_fact{
		margin: 3% 0 3% 1%;
		padding: 1.5%;
		width: 27.66666666666666666666%;	
	}

	#prevfact, #nextfact{
		height: 9em;	
		float: left;
		width: 2%;
		margin: 3% 0 0 0%;
		padding: 1.5% 0;
		cursor: pointer;
		
	}
	
	#nextfact{
		margin-left: 1%;	
		float:right;
	}
	
	#prevfact img, #nextfact img{
		height: 100%;	
	}
	
}

@media only screen and (max-width: 767px) {
		
	/* phones  */
	
	/*
	Base values
	
	Paddings/margins from sides: 3%
	line-height for titles: 120%
	line-height for copy: 150%
	main titles: 1.4em
	subtitles: 1.2em
	normal text: 1.0em
	small text: 0.9em
	
	*/
		
	
	body.active #nav { margin-left: 0; margin-bottom: 0; width:80%; }
	
	
	#rotatingfeature #slider .nivo-caption{ /*main page slider */
		height: 11em;
		max-height: 11em;
		position: relative;
		background: inherit;
		width: 100%;
		padding: 0;
	}
	
	.nivo-controlNav a {
		width: 7.0%;
	}
	
	#rotatingfeature a{
		color: #639;
	}	
			
	#rotatingfeature p{
		text-align: left;	
		color: inherit;
	}
	
		
	#rotatingfeature p:nth-of-type(1){
		font-size: 1.2em;
		font-weight: bold;
		padding: 0.5em 0.25em;
		line-height: 120%;
	}
	
	#rotatingfeature p:nth-of-type(2){
		font-size: 1.0em;
		font-weight: normal;
		padding: 0em 0.25em 0.5em 0.25em;
		line-height: 140%;
	}
	
	#rotatingfeature p:nth-of-type(2) a{
		font-weight: bold;
		color: #639;
	}
	
	#news_events{
		width: 94%;
		border: 1px solid #AAA;
		margin: 0 3%;
		background: white;
	}
	
			
	#news_selector, #events_selector{
		padding: 1.5em 0;
		background: #FFF url(../../images/graybar.jpg) no-repeat right top;	
		float: left;
		width: 30%;
		height: 1em;
	}
	
		
	#news_selector a, #events_selector a{
		color: #AAA;	
	}
	
	#news_selector.selected, #events_selector.selected{
		border-bottom: none;	
	}
	
	#news_selector.selected a, #events_selector.selected a{
		color: black;	
	}
	
	#news_selector, #events_selector, #more_selector{
		border-bottom: 1px solid #AAA;
	}	
			
	#more_selector{
		padding: 1.5em 0;
		float: left;
		width: 40%;
		height: 1em;
		text-align: right;
	}
		
	#more_selector img{
		margin: -5% 10% 0 0;	
	}
	
			
	#news_selector h3, #events_selector h3{
		font-size: 1.2em;	
		font-weight: bold;
		text-align: center;
	
	}	
	
	#news_content, #events_content{
		position: absolute;
		left: -200%;
		bottom: -200%;	
	}
			
	#news_content.selected, #events_content.selected{
		position: relative;
		left: 0;
		bottom: 0;
		width: 94%;
		clear: both;	
		padding: 0 3% 3% 3%;
	}

	#news_content .featured_news{
		
		width: 97%;
		padding: 4% 3% 4% 0%;	
		overflow: hidden;
		border-bottom: 1px solid #AAA;
	}
	
	#news_content .featured_news img{
		width: 33%;
		float: right;
		margin: 0 0 0 3%;
	}
	
	#news_content .featured_news .news_details{
		width: 100%;	
		float: left;
	}
	
	#news_content .featured_news .news_date{
		color: #AAA; 
		font-size: 0.9em;
		float: left;
	}
	
	#news_content .featured_news .headline{
		font-size: 1.4em;
		font-weight: bold;
		padding-top: 2%;
		clear: left;
		line-height: 120%;
	}
	
	#news_content .featured_news .headline a{
		color: black;
	}
	
	#news_content .featured_news .teaser{
		color: black; 
		font-size: 1.0em;
		padding-top: 2.5%;
		clear: left;
		line-height: 150%;
	}
	
	#events_content .featured_event{
		
		width: 97%;
		padding: 4% 3% 4% 0%;	
		overflow: hidden;
		border-bottom: 1px solid #AAA;
	}	
	
	#events_content .featured_event .event_date{
		float: left;
		margin: 0 3% 0 0;
		font-size: 1.4em;
		max-width: 20%;
		width: 20%;
		text-align: center;
	}
	
	#events_content .featured_event .event_date{
		line-height: 150%;	
	}
	
	#events_content .featured_event .event_date a{
		font-weight: bold;
		color: #639;	
	}
	
	#events_content .featured_event .event_title{
		line-height: 150%;	
		font-size: 1.4em;
	}
		
	#events_content .featured_event .event_title a{
		font-weight: bold;
		color: black;	
	}
	
	#events_content .featured_event .event_details_container{
		max-width: 	77%;
		float:left;
	}
	
	#events_content .featured_event .event_time,.event_location{
		line-height: 150%;
	}
	
	#bottom_more_selector{
		font-size: 1.0em;
		font-weight: bold;
		height: 3em;
		width: 94%;
		padding: 0 3% 0 3%;
	}
	
	#bottom_more_selector #more_icon{
		margin-left: 37%;	
		float: left;
	}
	
	#bottom_more_selector p{
		float: left;	
		padding: .35em 0 0 0.5em;
	}
	
	#spotlight_container{
		width: 94%;
		border-bottom: 1px solid #AAA;
		border-left: 1px solid #AAA;
		border-right: 1px solid #AAA;
		background: #CCC;
		margin: 0 3%;
	}
	
	#spotlight_container .spotlight{
		width: 94%;
		padding: 4% 3% 4% 3%;	
		overflow: hidden;	
	}
	
	#spotlight_container .spotlight #slider2{ /*spotlight page slider */
		background: white;
	}
	
	#spotlight_container .spotlight #slider2 .nivo-directionNav a{ 
		bottom: 24em;
	}
	
	#spotlight_container .spotlight #slider2 .nivo-caption{ 
		background: white;
		height: 22em;
		max-height: 22em;
	}
	
	#spotlight_container .spotlight .nivo-controlNav{ 
		background: white;
	}
	
	#spotlight_container .spotlight img{
		width: 100%;	
	}
	
	#spotlight_container .spotlight .spotlight_details{
		background: white;
	}
	
	#spotlight_container .spotlight .spotlight_title{
		font-weight: bold;	
		font-size: 1.4em;
		padding: 2.5% 3%;
		line-height: 120%;
	}
	
	#spotlight_container .spotlight .spotlight_title a{
		color: black;
	}
	
	#spotlight_container .spotlight .spotlight_teaser{
		color: black; 
		font-size: 1.0em;
		padding: 0 3% 2.5% 3%;
		line-height: 120%;
	}
	
	#spotlight_container .spotlight .spotlight_link{
		font-size: 1.0em;
		line-height: 150%;
		font-weight: bold;
		padding: 0% 3% 2.5% 6%;
		margin: 3% 0 0 3%;
		background: url('../../images/green_arrow.gif') no-repeat left top;
	}
	
	#current_feature_container{
		width: 94%;
		border-top: 1px solid #AAA;
		border-left: 1px solid #AAA;
		border-right: 1px solid #AAA;
		background: #CCC;
		margin: 0 3%;
		padding-top: 3%;
	}
	
	#current_feature_container #current_feature{
		background: white;
		margin: 0 3%;	
		width: 94%;
		overflow: hidden;
	}
	
	#current_feature_container #current_feature img{
		width: 	33%;
		float: right;
		padding: 0 0 3% 3%;
	}
	
	#current_feature_container #current_feature #current_feature_title{
		font-weight: bold;	
		font-size: 1.4em;
		padding: 2.5% 3%;
		line-height: 120%;
	}
	
	#current_feature_container #current_feature #current_feature_teaser{
		color: black; 

		font-size: 1.0em;
		padding: 0 3% 2.5% 3%;
		line-height: 150%;
	}
	
	#current_feature_container #current_feature #current_feature_teaser a{
		color: #639;
		font-weight: bold;	
	}
	
	#fast_facts_container{
		width: 94%;
		background: #FFF;
		margin: 3%;
		overflow: hidden;
		height: 24em;
	}
	
	#fast_facts_container .fast_fact{
		margin: 3% 0.5%;
		padding: 1.5%;
		width: 46%;	
		height: 9em;	
		max-height: 9em;	
		float: left;
	}
	
	#fast_facts_container .fast_fact h3{
		font-size: 2.5em;
	}
	
	#fast_facts_container .fast_fact h3.fact1{
		color: #d17021;
	}
	
	#fast_facts_container .fast_fact h3.fact2{
		color: #80aa2a;
	}
	
	#fast_facts_container .fast_fact h3.fact3{
		color: #639;
	}
	
	#fast_facts_container .fast_fact p{
		color: #888;	
		line-height: 150%;
		padding-top: 1em;
	}
	#prevfact img{
		display:none;
	}
	
	#nextfact{
		height: 9em;	
		float: right;
		margin: 3% 0.5% 3% 6%;
		padding: 1.5%;
		width: 40%;	
		vertical-align: middle;
	}
	
	#nextfact a{
		color: #333;
		font-weight: bold;	
	}
	
	#nextfact a:before{
		content: "more";	
	}
	
	#nextfact img{
		height: 100%;	
		vertical-align:middle;
	}
	
} /*  end of @media screen and (max-width: 768px) */