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

body {
    margin:0;
    padding:0;
    background-color:#FFF;
	color:#000;
}

#container {
    width:90%;
    margin:0 auto;
    padding:0;
	max-width:960px;
}

	#header {
		margin:0;
		padding:3% 0 1% 0;
	}

		#header h1 {
			color:#000;
			margin:0;
			padding:0;
			text-align:center;
		}

	#menu {
		margin:0;
		padding:2% 0;
		background-color:#FFF;
		border-bottom: 1px solid #000;
		text-align:center;
	}
	
		ul.menu{
			margin:0;
			padding:0;
		}
		
			ul.menu li{
				margin:0 1%;
				padding:0;
				list-style-type:none;
				display:inline;
				text-align:center;
				line-height:1.5em;
			}
		
				ul.menu li a:link, ul.menu li a:visited {
					color:#000;
					text-decoration:none;
				}
				
				ul.menu li a:hover {
					color:#BDBDBD;
					text-decoration:none;
				}
		
				ul.menu li a.active:link, ul.menu li a.active:visited {
					color:#BDBDBD;
					text-decoration:none;
				}
				
				ul.menu li a.active:hover {
					color:#808080;
					text-decoration:none;
				}

	#content {
		margin:0;
		padding:3% 0;
		background-color:#FFF;
	}

		#content .hero {
			padding:0;
			width:100%;
		}

		#content h1 {
			color:#000;
			margin:0;
			padding:0 0 15px 0;
		}

			#content h1 a:link, #content h1 a:visited {
				color:#BDBDBD;
				text-decoration: none;
			}

			#content h1 a:hover {
				color:#808080;
				text-decoration: none;
			}
		
		#content p, #content td {
			margin:0;
			padding:0 0 5px 0;
		}
		
		#content a:link, #content a:visited {
			color:#BDBDBD;
			text-decoration:none;
		}

		#content a:hover {
			color:#808080;
			text-decoration:underline;
		}
		
		#content ul {
			margin:0 0 0 15px;
			padding:0 0 5px 0;
			list-style-position:inside;
			list-style:disc;
		}
		
		#content ol {
			margin:0 0 0 20px;
			padding:0 0 5px 0;
			list-style-position:inside;
			list-style:decimal;
		}
			
			#content ul li, #content ol li {
				padding:0 0 5px 0;
			}
		
		.image {
			margin:0;
			padding:0;
			border:none;
			outline:none;
		}

		#detail {
			position:relative;
			padding:0;
			margin:0;
		}

			#detail-image {
				float:left;
				width:40%;
				padding:0;
				margin:0;
			}
	
			#detail-text {
				float:right;
				width:57%;
				padding:0;
				margin:0;
			}
			
		#items {
			position:relative;
			width:102%;
			padding:0;
			top:0;
			left:-2%;
		}

			#item {
				vertical-align:top;
				display:inline-block;
				width:23%;
				padding:0;
				margin:0 -4px 0 2%;  /* -4px addresses inline-block bug*/
			}
	
				#image {
					float:left;
					width:100%;
					padding:0;
					margin:0;
				}
	
					.image {
						margin:0;
						padding:0;
						border:none;
						outline:none;
						width:100%;
					}
	
				#text {
					float:left;
					width:100%;
					padding:3% 0;
					text-align:left;
					margin:0;
				}	
							
		#info {
			margin:0;
			padding:0 0 3% 0;
		}
			
	#footer {
		margin:0;
		padding:2% 0;
		border-top: 1px solid #000;
	}
	
		#footer p {
			margin:0;
			padding:0 0 3% 0;
			color:#000;
			float:right;
		}

		#footer a:link, #footer a:visited {
			color:#BDBDBD;
			text-decoration:none;
		}

		#footer a:hover {
			color:#808080;
			text-decoration:none;
		}

#clear{
	clear:both;
}		

#media{
}

.icon {
	padding:0 3px 3% 0;
	margin:0;
	outline:0;
	border:0;
	opacity:0.5;
    filter:alpha(opacity=50);
    text-decoration: none;
}

/* Mobile and Tablet Styles */

@media only screen 
and (min-width : 0px) 
and (max-width : 450px) {


#items {
	width:100%;
	left:0;
}

	#item {
		width:100%;
		margin:0 -4px 0 0;  /* -4px addresses inline-block bug*/
	}

#detail-image {
	width:100%;
}

#detail-text {
	width:100%;
	padding:5% 0 0 0;
}

#media{
	clear:both;
	float:right;
}

#footer {
	padding:4% 0;
}

}

@media only screen 
and (min-width : 451px) 
and (max-width : 800px) {


#item {
	width:31.333333%;
}

#media{
	clear:both;
	float:right;
}

}