#icons { float:left; clear:left; } 
	/*Style the DIV*/
	

.projectContainer .box {
	width: 12vh;
	height: 18vh;
	float: left;
	margin: 0.5vh;
	padding: 0.5vh;
	border: 0.1vh solid #ccc;
	text-align: center;
	
	justify-content: center;
	align-content: center;
}



.projectContainer {
	max-width: calc(60vh);
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	
}


.projectContainer p{
  margin-top: 3px;
  
}

.projectContainer .box2{
  width: 616px;
  height: 90px;
  float: left; 
  margin: 2px;
  padding: 5px;
  border: 1px solid #ccc;
  text-align: center;
}

/*
.projectContainer .box3 {
	width: 320px;
	height: 180px;
	float: left;
	margin: 2px;
	padding: 5px;
	border: 1px solid #ccc;
	text-align: center;
}

.box4 {
	width: 100px;
	height: 180px;
	margin: 2px;
	padding: 5px;
	border: 1px solid #ccc;
}

.projectContainer {
	height: 200px;
	width: 500px;
}*/

/*Fade all the DIV when user hovers on any div*/
.projectContainer:hover .box {
	zoom: 1;
	filter: alpha(opacity= 45);
	opacity: 0.45;
	-webkit-transition: opacity .5s ease-in-out;
	-moz-transition: opacity .5s ease-in-out;
	-ms-transition: opacity .5s ease-in-out;
	-o-transition: opacity .5s ease-in-out;
	transition: opacity .5s ease-in-out;
}

/*Fade out the particular DIV when user hover on that DIV*/
.projectContainer .box:hover{
  box-shadow: 3px 3px 15px #666;
  border-color:#C76C0C;
  background: #C76C0C;
  color: #fff;
  cursor: pointer;
  
  /*Opacity*/
  zoom: 1;
  filter: alpha(opacity=100);
  opacity: 1;
}