@charset "utf-8";
/* CSS Document */
*{
	margin:0px;
	padding:0px;
}
#container
{
	margin:0 auto;
	width:100%;
	max-width:1440px;
}

#header
{
	background-color:#FFF;
	width:100%;
	margin:50px 10px 10px 10px;
}

#nav
{
	background-color: #fff;
	visibility:hidden;
	

}
	#nav ul li
	{
		display:inline-block;
		list-style:none;
		font-family: Arial, Helvetica, sans-serif; sans-serif;
		color:#000000;
		font-size:1rem;
		width:300px;
		height:auto;
		text-align:center;
		margin:0;
		padding:10px 0 10px 0;
		border-top:#fff solid 2px;
	}
		#nav ul li:hover
		{
			background-color:#f0f0f0;
			color:#006bb7 !important;
			border-top:#f78f1e solid 2px;
			font-family: Arial, Helvetica, sans-serif; sans-serif;
			font-size:1.25rem;
			color:#555;
			
		}
			#nav ul li a
			{
				font:inherit;
				font-size:1.25rem;
				color:#000;
				color:#777;
				text-decoration:none;
				width:100%;
				display:block;
			}
				#nav ul li a:hover
				{
					font:inherit;
					color:#006bb7;
					display:block;
				}

#content
{
	background-color:#fff;
	width:100%;
	overflow:auto;
	margin-bottom:30px;
}

#footer
{	
	background:#FFF;
	width:100%;
	margin-bottom:30px;
}
	#footer p
	{
		line-height:25px;
		font-family: Arial, Helvetica, sans-serif;
		font-size:0.75rem;
		color:#555;
		margin:10px auto;
		padding:5px;
	}



.span_1_of_4 {
	width: 23.8%; 
	display: block;
	float:left;
	
}


.box
{
	background-color:#FFF;
	border-left:none;
	border-top:none;
	border-bottom:none;
	line-height:25px;
    font-family: Arial, Helvetica, sans-serif;
	padding:0;
	text-align:left;
	padding:5px;
	margin:4px;
}

	.box ul
	{
		clear:left;
		border-top:solid 1px #f78f1e;
		padding-top:1rem;
	}
		.box ul li
		{
			list-style-type:none;
			font-family: Arial, Helvetica, sans-serif; sans-serif;
			font-size:0.85rem;
			color:#777;
			padding:5px 10px 5px 10px;
		}
			.box ul li a
			{
				font:inherit;
				color:#000;
				color:#777;
				text-decoration:none;
				display:block;
				width:100%;
			}
				.box ul li a:hover
				{
					color:#006bb7;
					background-color:#f0f0f0;
					display:block;
				}
				.box h3
				{
					color:#555;
					font-family: Arial, Helvetica, sans-serif;
					font-size:1rem;
					font-weight:bold;
					text-align:left;
					padding:10px;
					margin:10px 10px 10px 0;
					float:left;
				}
				

.logo
{
    max-width: 37%;
    height: auto;
}

.icon
{
	width: 25px;
	height:auto;
	margin:20px 0 0 0; 
	float:left;
}

p
{
	line-height:25px;
    font-family: Arial, Helvetica, sans-serif;
	font-size:0.75rem;
	color:#777;
	margin:10px auto;
}

@media only screen and (max-width: 750px) {
	.logo
	{
		max-width: 60%;
		height: auto;
	}
	
	.icon
	{
		width: 50px !important;
		height:auto;
		margin:0 !important; 
		float:left;
	}

	
	#nav
	{
		visibility:visible !important;
	}
		#nav ul li
		{
			width:100% !important;
		}
	
	.span_1_of_4 {
		width: 99.9%; 
	}
	.box
	{
		border-right:#C5C5C5 solid 1px !important;
		border-left:#C5C5C5 solid 1px !important;
		border-top:#C5C5C5 solid 1px !important;
		border-bottom:#C5C5C5 solid 1px !important; 
	}
		.box h3
		{
			font-size:1.25rem;
		}
}


@media only screen and (max-width: 480px) {

	
	.logo
	{
		max-width: 96%;
		height: auto;
		margin:2%;
	}
	
	.icon
	{
		width: 50px !important;
		height:auto;
		margin: 0 !important; 
		float:left;
	}
	
	#nav
	{
		visibility:visible !important;
	}
	
	.span_1_of_4 
	{
		width: 99%;
	}
	.box
	{
		border-right:#C5C5C5 solid 1px !important;
		border-left:#C5C5C5 solid 1px !important;
		border-top:#C5C5C5 solid 1px !important;
		border-bottom:#C5C5C5 solid 1px !important; 
	}
}