.boxes{
padding-bottom:3em;
}

.boxes  .box{
	background: #fff;
	position: relative;
	overflow: hidden;
	margin-bottom:2em;

}
.boxes  .box img{
	width: 100%;
	max-width: 100%;
	position: relative;
}
.boxes  .box p{
	position:absolute;
	color:#fff;
	text-align: center;
	top:45%;
	width: 90%;
	font-size: 23px;
}
.boxes  .box a{
	display: block;
	border:1px solid #fff;
	position: absolute;
	top: 55%;
	width: 50%;
	min-width: 200px;
	color:#fff;
	text-decoration: none;
	text-align: center;
	left:0;
	right: 0;
	margin:auto;
	padding:0.2em;
	font-size: 23px;
	transition:all 0.3s ease-out;
}
.boxes  .box a:hover{
	background: #ff7f06;
}
@media screen and (max-width: 800px){
	.boxes  .box p{
	top:10%;
	width: 90%;
	font-size: 20px;
}
.boxes  .box a{
	top: 55%;
	width: 50%;
	min-width: 200px;
	font-size: 20px;
}
}
@media screen and (max-width: 767px){
	.boxes  .box{
		width: 60%;
		margin:2em auto;
	}
		.boxes  .box p{
	font-size: 23px;
	}

}
@media screen and (max-width: 480px){
		.boxes  .box{
		width: 100%;
		margin:2em auto;
	}
			.boxes  .box p{
		font-size: 20px;
		}
}