@charset "utf-8";
/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */


.middle-box {
	-webkit-filter:grayscale(0);
	filter:grayscale(0);
}
.middle-box:hover {
	-webkit-filter:grayscale(1) contrast(1.2);
	filter:grayscale(1) contrast(1.2);
}
.middle-box h4 {
	font-size:21px;
	font-size:2.1rem;
	font-weight:800;
	color:#fff;
	text-transform:uppercase;
	letter-spacing:2px;	
	margin-bottom:0;
}
.middle-box p {
	font-size:11px;
	font-size:1.1rem;
	font-weight:400;
	color:#fa5b1d;
	text-transform:uppercase;
	letter-spacing:1px;	
	margin-bottom:0;
}
.middle-box a {
	height:auto;
	width:100%;
	display:table;
	text-align:center;
	padding:60px 0;
}
.middle-box:hover a {
	color:#fff;
}
.middle-box img {
	margin-bottom:15px;
}



/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
.middle-box a {
	height:auto;
	width:100%;
	display:table;
	text-align:center;
	padding:60px 0;
}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
.middle-box a {
	height:280px;
	width:100%;
	display:table;
	text-align:center;
	padding:0;
}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
.middle-box a {
	height:320px;
	width:100%;
	display:table;
	text-align:center;
}
}
/* Large devices (xlarge desktops, 1200px and up) */
@media (min-width: 1600px) {
.middle-box a {
	height:400px;
	width:100%;
	display:table;
	text-align:center;
}	
}