*{
	padding:0;
	margin:0;
}
body{
	font-family: 'Open Sans', sans-serif;
	background-color: #FFF;
	font-size:12px;
}
a{
	color:#777;
	font-weight:600;
	text-decoration:none;
}
a:hover{
	text-decoration:underline;
}
#bar{
	width:1000px;
	height:10px;
	margin:auto;
	margin-bottom:25px;
	background-color: #231F20;
}
#main{
	width:1000px;
	overflow: hidden;
	margin:auto;
}
h1{
	text-align:center;
	font-size:3em;
	font-weight:600;
}
h2{
	text-align:center;
	font-size:2.2em;
	font-weight:400;
	margin-bottom:1em;
}
h3{
	font-size:1.7em;
	font-weight:600;
	margin-top:1em;
	margin-bottom:1em;
}
h4{
	font-size:1.3em;
	font-weight:400;
	margin-bottom:0.7em;
}
h5{
	font-size:1.1em;
	font-weight:600;
	margin-bottom:0.2em;
}
p, form{
	text-align:center;
	margin-bottom:0.5em;
}
.clear{
	clear:both;
}
.grid-item{
	width:25%;
	float:left;
}
.grid.fix .grid-item{
	height:210px;
}
.grid-item .content{
	padding:25px;
	padding-top:0;
	padding-bottom:30px;
}
.grid-item img{
	width:198px;
	border:1px solid #222;
}
@media only screen and (max-width: 1024px) {
	#bar, #main{
		width:750px;
	}
	.grid-item{ 
		width:33%;
	}
}
@media only screen and (max-width: 775px) {
	#bar, #main{
		width:500px;
	}
	.grid-item{ 
		width:50%;
	}
}
@media only screen and (max-width: 525px) {
	#bar, #main{
		width:100%;
	}
	#main{
		padding:15px;
	}
	.grid-item{ 
		width:250px;
		margin:auto;
		float: initial;
	}
}