/*Gallery*/
 /* The grid: Four equal columns that floats next to each other */
.column {
  float: left;
}

/* Style the images inside the grid */
.column img {
  opacity: 0.8;
  cursor: pointer;
  height: 150px;
  overflow: hidden;
  margin: 10px 10px;
  transition: transform 1s;
}

.column img:hover {
  opacity: 1;
  transform: scale(0.9);
}

/* Clear floats after the columns */
.galery-images-small:after {
  content: "";
  display: table;
  clear: both;
}

/* The expanding image container (positioning is needed to position the close button and the text) */
.container {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Expanding image text */
#imgtext {
  position: absolute;
  bottom: 15px;
  left: 15px;
  color: white;
  font-size: 20px;
}

/* Closable button inside the image */
.closebtn {
  position: absolute;
  top: 10px;
  right: 15px;
  color: white;
  font-size: 35px;
  cursor: pointer;
} 

/* Add Animation - Zoom in the Modal */
.container {
  animation-name: zoom;
  animation-duration: 0.6s;
}

@keyframes zoom {
  from {transform:scale(0)}
  to {transform:scale(1)}
}