Responsive grid %

Container fluid grid

		<style>
				* {
				  margin: 0;
				  padding: 0;
				}

				.fluid-container-menu {
					background-color: #FFFFFF;
				}

				#site-logo {
					width: 150px;
					display: inline-block;
				}

				#trigger{
					display: inline-block;
					float: right;
					color: white;
					font-size: 8em;
				}

				.clear { clear: both; }

				.col-4 {
				  width: 25%;
				  float: left;
				  position: relative;
				}
				.col-4 img {
				  width: 100%;
				  height: 100%;
				  background-color: #000;
				  display: block;
					cursor: pointer;
				}
				.col-4 a {
				  cursor: pointer;
				  font-size: 10vw;
				  padding-top: 20%;
				  text-align: center;
				  color: white;
				  text-decoration: none;
				  width: 100%;
				  height: 100%;
				  display: block;
					-moz-transition: all .2s ease 0s;
			    -webkit-transition: all .2s ease 0s;
			    -ms-transition: all .2s ease 0s;
			    -o-transition: all .2s ease 0s;
			    transition: all .2s ease 0s;
					z-index: 1000;
				}

				.col-4 a:hover {
				  color: white;
				  background: black;
				  opacity: .6;
					-moz-box-shadow:    inset 0 0 10px #000000;
					-webkit-box-shadow: inset 0 0 100px #000000;
					box-shadow:         inset 0 0 100px #000000;
				}

				.col-4 .overlay {
				  width: 100%;
				  height: 100%;
				  position: absolute;
				  overflow: hidden;
				  top: 0;
				  left: 0;
					z-index: 1000;
				}
				</style>
			
			</header>
		</div>
<div class="clear"></div>
		<div class="container-fluid">
			<div class="row">
				<div class="col-4">
		      <img src="http://lorempixel.com/850/700/" alt="">
		      <div class="overlay">
		        <a class="expand"  href="http://google.com" target="_blank">+</a>
		      </div>
		    </div>

		    <div class="col-4">
		      <img src="http://lorempixel.com/850/700/" alt="">
		      <div class="overlay">
		        <a class="expand" href="#">+</a>
		      </div>
		    </div>

		    <div class="col-4">

		      <img src="http://lorempixel.com/850/700/" alt="">
		      <div class="overlay">
		        <a href="#">+</a>
		      </div>
		    </div>

		    <div class="col-4">
		      <img src="http://lorempixel.com/850/700/" alt="">
		      <div class="overlay">
		        <a href="#">+</a>
		      </div>
		    </div>


				<div class="col-4">
		      <img src="http://lorempixel.com/850/700/" alt="">
		      <div class="overlay">
		        <a href="#">+</a>
		      </div>
		    </div>

				<div class="col-4">
		      <img src="http://lorempixel.com/850/700/" alt="">
		      <div class="overlay">
		        <a href="#">+</a>
		      </div>
		    </div>


				<div class="col-4">
		      <img src="http://lorempixel.com/850/700/" alt="">
		      <div class="overlay">
		        <a href="#">+</a>
		      </div>

		    </div><div class="col-4">
		      <img src="http://lorempixel.com/850/700/" alt="">
		      <div class="overlay">
		        <a href="#">+</a>
		      </div>
		    </div>

		  </div>
		  <div>