.wrap {

       overflow: hidden;

       margin: 10px;

    }

    .box {

       float: left;

       font-family: raleway;

       position: relative;

       width: 20%;

       padding-bottom: 20%;
	 
	   

    }

    .boxInner {

       position: absolute;

       left: 10px;

       right: 10px;

       top: 10px;

       bottom: 10px;

       overflow: hidden;
		
	   

    }

    .boxInner img {

       width: 100%;
		
	  }

    .boxInner .titleBox {

       position: absolute;

       bottom: 0;

       left: 0;

       right: 0;

       font-family: raleway;

       margin-bottom: -50px;

       background: #000;

       background: rgba(0, 0, 0, 0.5);

       color: #00A1D6;

       padding: 10px;

       text-align: center;

       -webkit-transition: all 0.3s ease-out;

       -moz-transition: all 0.3s ease-out;

       -o-transition: all 0.3s ease-out;

       transition: all 0.3s ease-out;

    }

    body.no-touch .boxInner:hover .titleBox, body.touch .boxInner.touchFocus .titleBox {

       margin-bottom: 0;

    }