.content {
  padding: 350px 0;
  position: relative;
}

.gallery {
  width: 900px;
  margin: auto;
  border-radius: 3px;
  overflow: hidden;
  //position: relative;
	margin-left: 50%;
	transform: translateX(-50%);
}
.img-c {
  width: 300px;
  height: 300px;
  float: left;
  position: relative;
  overflow: hidden;
}

.img-w {
  position: absolute;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  cursor: pointer;
  transition: transform ease-in-out 300ms;
}

.img-w img {
  display: none;
}

.img-c {
    transition: width ease 400ms, height ease 350ms, left cubic-bezier(0.4, 0, 0.2, 1) 420ms, top cubic-bezier(0.4, 0, 0.2, 1) 420ms;
}

.img-c:hover .img-w {
  transform: scale(1.08);
  transition: transform cubic-bezier(0.4, 0, 0.2, 1) 450ms;
}

.img-c.active {
  width: 100% !important;
  height: 100% !important;
  position: absolute;
  z-index: 2;
  //transform: translateX(-50%);
}

.img-c.postactive {
  position: absolute;
  z-index: 2;
  pointer-events: none;
}

.img-c.active.positioned {
  left: 0 !important;
  top: 0 !important;
  transition-delay: 50ms;
}

.overlay {
  position: absolute;
  bottom: 0;
  background: rgb(0, 0, 0);
  background: rgba(0, 0, 0, 0.5); /* Black see-through */
  color: #f1f1f1;
  width: 100%;
  transition: .5s ease;
  opacity:0;
  color: white;
  font-size: 20px;
  padding: 20px;
  text-align: center;
}
	
/*	background-color: rgba(0,147,196,0.80);
	border-radius: 20px;
	border: 2px solid   rgba(222,234,245,0.90);	*/
	
}


	
@media(min-width:1281px){	
}

@media(max-width:1280px){	
	
}

@media(max-width:1024px){			
}

@media(max-width:960px){
}
	
@media(max-width:640px){
	
.content {
  padding: 400px 0;
}	
.gallery {
  width: 600px;
}
.img-c {
  width: 200px;
  height: 200px;
}
	
}
	
@media(max-width:480px){


.content {
  padding: 375px 0;
}	
	
.gallery {
  width: 360px;
}
.img-c {
  width: 120px;
  height: 120px;
}
	
}