/*Default CSS*/
body {
	background-color:#1c1c1c;	
}
#container {
	width: 100%;
	margin: 0px auto;
}
header {
	padding-bottom: 30px;
}
header .navbar{
	background-color: rgb(34,34,34);
	width: 100%;
	height: 50px;
	margin-bottom:10px;	
	border-bottom-color: rgb(8,8,8);
	border-bottom-style:solid;
	border-bottom-width:1px;
}
header .navbar ul{
	list-style-type: none;
    margin: 0;
    padding: 0;
	padding-left:20px;
	padding-top:3px;
}
header .navbar li {
    float: right;
}

header .navbar li a {
    display: block;
    font-family: pragmatica-web, helvetica, arial, sans-serif;
	color: rgb(153,153,153);
	font-size: 14px;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

header .navbar li a:hover {
	
    color: #FFFFFF;
}
header img{
	clear:both;
	padding-bottom: 42px;	
}
hr{
	margin-right: 20px;
	margin-left: 20px;
}
header p{
	font: 14px/19px pragmatica-web, sans-serif;
	color: #EBEBEB;
	padding-left: 20px;
	padding-right: 80px;
	padding-top: 20px;
}	
footer {
	clear: both;
	box-sizing:border-box;
	color: rgba(255,255,255,1.00);
	font-size:14px;
	line-height:19px;
	padding-top:20px;
	text-align:right;
}
footer p{
	padding-right:20px;	
}
.gridMaster {
	width: 100%;
}
.gridItem {
	position: relative;
	width: 25%;
	padding-bottom: 25.01%;
	float: left;
	margin: 0px;
}
.gridContent {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.gridContent img{
	width:100%;
}

/*

Small Screen below 767

*/
@media screen and (max-width:767px) {
.gridItem {
	width: 50%;
	padding-bottom: 50.01%;
}
header img{
	width:75%;
	height:75%;	
	padding-left:10px;
}

header p{
	font: 12px/17px pragmatica-web, sans-serif;
	padding-right: 20px;
}	
}

/*

Target Screen 768 to 1366

*/
@media screen and (min-width:768px) and (max-width:1366px) {
}

/*

Large Screen Above 1367

*/
@media screen and (min-width:1367px) {
#container {
	width: 1367px;
	margin: 0px auto;
}
.gridItem {
	width: 20%;
	padding-bottom: 20.01%;
}
}