/* template.css overwrites -- use only when absolutely necessary
================================*/
.banner-img {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	max-height: 450px;
	background: url(../images/hero.jpg) no-repeat 0 0;
	background-size: 189.72%;
}


/* custom CSS on a per project basis
================================*/

.banner-logo {
    top: 18%;
    left: 65%;
    width: 10%;
}

@media only screen and (max-width: 641px) {
	.banner-logo {
    top: 24%;
	width: 12%;
	}
}



/* responsive CSS on a per project basis
================================*/

@media only screen and (max-width: 1024px) {
	/* insert responsive CSS for screens below 1024px */
}

@media only screen and (min-width: 375px) {
	/* insert responsive CSS for screens above 375px */
}
@media only screen and (min-width: 481px) {
	/* insert responsive CSS for screens above 481px */
}
@media only screen and (min-width: 641px) {
	/* insert responsive CSS for screens above 641px */
	.banner-img {
		background-position: 0 100%;
		background-size: 100%;
	}
	
}
@media only screen and (min-width: 769px) {
	/* insert responsive CSS for screens above 769px */
	
.items-grid .item-cell{ width:22%;}	
	
	
}
@media only screen and (min-width: 1025px) {
	/* insert responsive CSS for screens above 1025px */
}