.image-effect {
  opacity: .90;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  transition-timing-function: ease-in;
  transition: 1.5s;
}

.image-effect:hover {
  opacity: 1;
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%);
  transition-timing-function: ease-in;
  transition: 1.5s;
	-webkit-transform: scale(1.02);
  transform: scale(1.02);
}

a:hover{
	text-decoration: none;
}

a {
      text-decoration-line: underline;
      text-decoration-thickness: 0.08em !important;
	  text-decoration-color: #12e66b;
	  text-underline-offset: .30em;
}

.underline {
  position: relative;
  display: inline-block;
  text-decoration: none; /* we replace it with the animated one */
}

.underline:hover{
	color: black;
}

.underline::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;               /* underline thickness */
  background: currentColor;  /* matches text color */
  
  transform-origin: bottom;
  transform: scaleY(0);
  transition: transform 0.25s ease-out;
}

.underline:hover::after,
.underline:focus::after {
  transform: scaleY(1);
}

a.underline {
	text-decoration: none;
}

a.underline::after {
  content:"";
  height:2px;
  width:100%;
  background-color: #12e66b;
  text-decoration-thickness: 0.08em !important;
  position:absolute;
  bottom:-6px;
  left:0;
  opacity:0;
  transition:opacity 300ms ease, bottom 300ms ease;
}

a.underline:hover::after {
  opacity:1;
  bottom:0;
}

li.up::after {
  content:"";
  height:2px;
  width:100%;
  background-color: #12e66b;
  text-decoration-thickness: 0.08em !important;
  position:absolute;
  bottom:-6px;
  left:0;
  opacity:0;
  transition:opacity 300ms ease, bottom 300ms ease;
}

li.up:hover::after {
  opacity:1;
  bottom:0;
}

figcaption.blocks-gallery-caption{
	line-height: 10%;
}

.img-caption-project {
	font-size: 70%;
	line-height: 90%;
}

figcaption {
	color: #11d175;
	font-size: 88%;
}