@charset "UTF-8";
/* CSS Document */

/* Large Screen CSS Code will result in original styles being applied */

	html { background: #fff; }
	body { font-family: 'Quattrocento Sans', sans-serif, Arial, Sans-serif;
		-webkit-text-size-adjust: none; }

	#header { 	padding: 0;
				margin: 0;
				background-image:url(../img/logo-sml.png);
				background-repeat: no-repeat;
				background-color: #2b6f35;
			}
	#nav{
		 	
			width : 100%;
			height: auto;
			margin: 0;
			background-color:#568d5d;
		}


/* --- Small Device Styles ---- */
@media screen and (max-width : 400px) {

	#header {
		height: 100px;
		background-position: 3px 5px;
		
	}

	#nav ul {
		padding: 0;
		margin: 0;
		height: auto;
		font-size: 1.2em;
		text-transform: uppercase;
		line-height: 2em;
	}

	#nav ul li {
		display: block;
		border-top: 1px solid #fff;
		padding-left: 2em;
		background-color: #568d5d;
	}

	#nav ul a {
		font-weight: normal;
		text-decoration: none; 
		color: #fff;
		}


	#nav ul li a:hover {
		color: #B8D432;
		text-decoration: underline;
	}	

	.current {
		text-decoration: none;
		font-weight: bold;
		color: #000;

	}

	.current a, #nav .current a:hover { color: #6E1A86; }

	.largescreen { display: none; }

	.smallscreen { display: block; }


	h2, h1, h3 { padding: 1em 0 1em 0 ; }
 
/* --------------------  COLUMNS ------------------*/

	#first {
		display: block;
		border-top: 1px solid #fff; 
		padding: 0 2em 2em 2em;
	
	} 

	#main {		
		border-top: 1px solid #666;
		padding: 0 2em 2em 2em;
	
	}
			
	#main ul {
		margin-top:1em;
		margin-bottom:1em;
	}



	#main ul li {
		list-style-type: square;
		margin-left: -2em;
		margin-bottom: 1em;
		line-height: 1.6em;		
	}

	#about {	
		border-top: 1px solid #666; 
		display: block;
		padding: 0 2em 2em 2em;
	}
			
	#about img {
		padding-top: 2em;
	}
	
	

/* --------------- FOOTER -------------------- */


	.footercontent {	
				padding: 1em;
				font-size:0.9em;
				color: #fff;
				
				}
	.footercontentright { 
					border-left: solid 5px #FFF;
					padding-left: 1em;
					height: 2em;
					
				} 
	.footercontentright a { 
					text-decoration: none;
					color: #fff;
				}
	.footercontentright a:hover {
				color: #000;
				text-decoration: underline;
				}


} /* --- End of Small Device Styles --- /*


/* --- Tablet Device Styles --- */

@media screen and (min-width : 401px) and (max-width : 919px) {

#header {
		
		height: 135px;
		background-position: 5% 25px;
	}

	

	#nav ul {
		padding: 0;
		margin: 0;
		height: auto;
		font-size: 1.2em;
		text-transform: uppercase;
		line-height: 2em;
	}

	#nav ul li {
		display: block;
		border-top: 1px solid #fff;
		padding-left: 2em;
		background-color: #568d5d;
	}

	#nav ul a {
		font-weight: normal;
		text-decoration: none; 
		color: #fff;
		}


	#nav ul li a:hover {
		color: #B8D432;
		text-decoration: underline;
	}	

	.current {
		text-decoration: none;
		font-weight: bold;
		color: #000;

	}

	.current a, #nav .current a:hover {
	color: #6E1A86;
	}

	.largescreen {
		display: none;
	}

	.smallscreen {
		display: block;
	}


	h2, h1, h3 { padding-top: 1em;
		padding-bottom: 1em;}



/* --------------------  COLUMNS ------------------ */

	#first {
		float:left;
		padding: 0 0 5% 5%;
		width: 25%;
				} 

	#main {		
		float:left;
		width: 55%;
		padding-left: 10%;
		padding-bottom: 10%;
		clear: right;
	}

	#main ul {
		margin-top:1em;
		margin-bottom:1em;
	}

	#main ul li {
		list-style-type: square;
		padding-left: 1.4em;
		line-height: 1.6em;		
	}

	#about {	
		border-top: 1px solid #666; 
		clear: both;
		padding: 5%;
		
			}
			
	#about img {
		float: left;
		padding: 0 10% 5% 0;
		height: auto;
	
	}

	.footercontent { padding-top:1em; }


	.footercontent {	
				padding: 1em;
				font-size:0.9em;
				color: #fff;
				
				}
	.footercontentright { 
					
					float: right;
					border-left: solid 5px #FFF;
					padding: 1em;
					margin-top: 0%;
					height: 2em;
					
				} 
	.footercontentright a { 
					text-decoration: none;
					color: #fff;
				}
	.footercontentright a:hover {
				color: #000;
				text-decoration: underline;
				}


} /* --- End of Tablet Styles --- /*



/* --- Large Screen Device Styles --- */

@media screen and (min-width : 920px)  {

	html, body {
		background-color: #FFFFFF;
		background-image:url(../img/header-bkgd138.png);
		background-repeat:repeat-x;
		font-family: 'Quattrocento Sans', sans-serif, Arial, Sans-serif;
		font-size: 1em;
		line-height: 1.4em;
		height: 100%;
		margin: 0px;
		color: #666;	
	}


	#container {	
		width: 96%; /*Holding outermost div*/
		max-width: 960px;
		margin: auto;
				}

	#header {
		height:110px;
		background-color:#2b6f34;
		background-image:url(../img/logo.png);
		background-repeat: no-repeat;
		background-position: 20px 5px;
	}

	#header h1 {
		display:none;
	}


	#body {
		padding-bottom:6em;   /* Height of the footer */
	}

/* ---------------- NAV SECTION ------------------*/

	#nav {

		height: 28px;
		margin-left :  auto;
		margin-right : auto;
		background-color:#568d5d;
	}

	#nav ul {

		padding-top:3px;
		display:block;
		margin: 0px;
		padding-left: 20px;
		padding-right: 38px;
		font-size: 1em;
	}

	#nav ul a {
		text-decoration: none;
		color: #272525;
		font-weight: normal;
		padding-left: 0px;
	
	}

	#nav ul a:hover {
		color: #b8d432;
		text-decoration:underline;
	}

	#nav ul li {
		display:inline;
		font-family: Oswald, sans-serif, Arial, Sans-serif;
		text-transform:uppercase;
		margin-right: 2em;
	}	


	#nav .current {
		text-decoration: none;
		color: #FFF;
	}	

	#nav .current a, #nav .current a:hover {
		color: #FFF;
	}

/* --------------------  COLUMNS ------------------ */

	#first {
		float:left;
		padding-left: 1em;
		width: 26%;
				} 

	#main {		
		float:left;
		width: 40%;
	}
			
	#main ul {
		margin-top:1em;
		margin-bottom:1em;
	}



	#main ul li {
		list-style-type: square;
		padding-left: 1.4em;
		line-height: 1.6em;		
	}

	#about {	
		float:right;
		padding-right: 1em;
		padding-bottom: 2em;
		width: 26%;
			}
			
	#about img {
		margin-top:2em;
		height: 100%;
		width: 100%;
	}


/* --------------- FOOTER -------------------- */


	.footercontent {	

				width: 96%; /*Holding outermost div*/
				max-width:960px;
				margin:auto;
				margin-top: 0em;
				padding-top: 1em;
				padding-bottom: 0em;
				font-size:0.9em;
				
				}

	.footercontentleft { 
					width: 68%;
					float:left;
					padding-left: 1em;
				}

	.footercontentright { 
					width: 25%;
					float:left;
					border-left: solid 5px #FFF;
					padding-left: 1em;
					text-align:left;
				}


	h1{ 		font-size: 1.6em;
				padding:0em;
				margin-top:1em;
				margin-bottom: 1.2em;
			}


	h2{ 		font-size: 1.4em;
				padding:0em;
				margin-top:1.2em;
				margin-bottom: 1.2em;
			}
			
	h3{			font-size: 1.2em;
				/*text-transform:capitalize;*/
				font-weight:bold;
				padding:0em;
				margin-top:1.4em;
				margin-bottom: 0.2em;
			}

			.largescreen { display: block; }

			.smallscreen { display: none; }
} /* --- End of Large Screen Styles --- /*