.column {
min-width: 20%;
width:300px;
padding: 20px;
padding-bottom: 50px;
margin-left: auto;
margin-right: auto;
} 

.fa {color:#800000;
font-size:15px;} 

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;}

.container {
  position: relative;
  width:100%;
}

.image {
  opacity: 1.0;
  display: block;
  
  width: 300px;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;}



.container:hover .image {
  opacity: 0.2;}

.container:hover .middle {
  opacity: 1;}


.text {
color: black;
font-size: 30px;
font-weight: italic;
font-family: "Cormorant SC";}

a:hover{
     text-decoration: none;}



@media only screen and (max-width: 600px) {

  .maxi{max-width: 90%;
  
  }
  

.image {
  opacity: 1.0;
  display: block;
  
  width: 90%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;}

.column {
min-width: 20%;
width:90%;
padding: none;
padding-bottom: 50px;
margin-left: auto;
margin-right: auto;
} 

  }