/**

* Clickable Box
*/
.container-link {
 width: 80%;
 padding: 10px;
 position: relative;
 margin: auto;

}

.img-link {

-webkit-filter: brightness(25%);
border: 3px solid grey;
margin: auto;

}

.text-link {

transition: 1s ease;
opacity: 1;
position: absolute;
top: 45%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-size: 30px;
font-weight: bold;

}

.container-hover .img-link{

-webkit-filter: brightness(100%);
-webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;

}

.container-hover .text-link {

opacity: 0;

}

.gradient-wrapper {

width: 80%;

}

.gradient-box {

height: 100px;
background-color: grey;
border: 4px black;
color: white;
font-size: 25px;
font-weight: bold;
text-align: center;
transition: all 1s ease;
border-radius: 10px;

}

.gradient-box:hover {

background-color: #F2EECB;
transition: all .5s ease;
color: black;

}

.arrow {

vertical-align: text-top;
font-size: 20px;

}