.movieflex{
	display: flex;
	flex-direction: column;
}
.movieflex .block{
	margin-bottom: 15px;
	padding: 5px;
	background: #fff;
	border-radius: 4px;
	border: 1px solid #5fac9c;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.movieflex .block a{
	display: flex;
    width: 100%;
    position: relative;
}
.movieflex .block a .imgbox {
	display: block;
    width: 35%;
    position: relative;
	margin-right: 5px;
}
.movieflex .block a img {
    display: block;
    width: 100%;
}
.movieflex .block a p {
    flex: 1;
}
@media (min-width: 768px) {
	.movieflex{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		margin: 10px 0 10px 10px;
	}
.movieflex .block{
	display: block;
	width: calc((100% - 42px) / 3);
	margin:0 10px 15px 0;
	padding: 0;
	background: #fff;
	border-radius: 4px;
	border: 2px solid #5fac9c;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.movieflex .block:hover {
  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.5);
  transform: translateY(-2px);
}
.movieflex .block a{
	display: block;
}
.movieflex .block a .imgbox {
	display: block;
    border-radius: 2px 2px 0 0;
    width: 100%;
    height: 0;
    overflow: hidden;
    padding-top: 56%;
    position: relative;
}
.movieflex .block a img {
    display: block;
    border-radius: 4px 4px 0 0;
    width: 100%;
    height: 140px;
    object-fit: cover;
    transform: scale(1.1, 1.1);
    transition: .7s all;
    position: absolute;
    top: 0;
    margin: auto;
    bottom: 0;
    left: 0;
    right: 0;
}
.movieflex .block:hover a img {
    transform: scale(1.04, 1.04);
    transition: .7s all;
}
	
}
