codepen.io/anon/pen/yeombd

Ну если не менять position у нижней кнопки тогда сделайте 2.7%

.about-us a.read-more {
  float: right;
  margin: 20px 2.7% 20px 0;

а если поменять хотите можно так у кнопки

.about-us a.read-more {
  position: absolute;
  right: 5%;

и у дива с классом .container

.container {
  position: relative;
  margin-bottom: 7%;

У картинок поставь эти свойства:
Не background-size: cover; а background-size: 100% 100%;

<a href="#" style="background-image: url('http://fess.in.net/wp-content/uploads/2016/01/Block-Home-page3-01.png');background-size: 100% 100%;">
		<div class="box">
			<div class="name_project"><h3>Your Text</h3></div>
			<div class="line_project"></div>
			<div class="type"><p>Your Text</p></div>
		</div>
		<div class="bg"></div>
	</a>

У меня и без z-index ставит его поверх окна. codepen.io/anon/pen/Nxjadj
Я еще не понял у вас этот блок виден при наведении или он всегда виден?
Скинте пожалуйста свой css.

Можно и в div не засовывать их просто класс добавить картинкам
codepen.io/anon/pen/EPXgxg