@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/Ubuntu/Ubuntu-Regular.woff)


}
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: bold;
  src: url(../fonts/Ubuntu/Ubuntu-Bold.woff)


}
@font-face {
  font-family: 'Ubuntu';
  font-style: italic;
  font-weight: normal;
  src: url(../fonts/Ubuntu/Ubuntu-Italic.woff)


}

/* EBGARAMOND */
@font-face {
  font-family: 'ebgaramond';
  font-style: normal;
  font-weight: 500;
  src: url(../fonts/ebgaramond/ebgaramond-regular.woff);
}
@font-face {
  font-family: 'ebgaramond';
  font-style: normal;
  font-weight: 700;
  src: url(../fonts/ebgaramond/ebgaramond-bold.woff);
}
@font-face {
  font-family: 'ebgaramond';
  font-style: normal;
  font-weight: 600;
  src: url(../fonts/ebgaramond/ebgaramond-semibold.woff);
}
:root {
  --black: #060808;
  --dark-green: #0A1314;
  --bold--white: #EDFAF2;
  --white: #DAE6DE;
  --accent-green: #42A866;
  --purple: #E00D62;
  --grey: #949C97;
}
nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  gap: 1rem;
  padding: 5% 10% 0;
}
.link-container {
  position: relative;
  min-width: 300px;
  width: 23vw;
  align-items: center;
  text-align: center;
}
.link-container img {
  width: 100%;
  transition: transform 0.4s;
}
.link-container:has(a:hover) img {
/*   transform: scale(1.2); */
}

.link-container figcaption {
  transition: all 0.4s;
  font-size: clamp(1.7rem, 2vw, 90%);
  font-family: ebgaramond;
  font-weight: 600;
}
.link-container:hover figcaption {
  transform: scale(1.05);
}
nav .link-container .animated {
  display: none;
}
nav .link-container:has(a:hover) img:nth-child(1) {
  display: none;
}
nav .link-container:has(a:hover) img.animated {
  display: block;
}
.link-container a {
  position: absolute;
  left: 50%;
  padding: 15%;
  top: 50%;
  transform: translate(-50%, -60%);
}
.link-container:last-child a {
  transform: translate(-50%, -56%);
}
.link-container:nth-child(3) a {
}
.link-container:nth-child(2) a {
  transform: translate(-50%, -55%);
}
.link-container:nth-child(1) a {
}
@media screen and (max-width:790px) {
  nav {
    padding: 5% 0;
  }
/*   .link-container img.animated{
    display: block;
  }
  .link-container img:first-child{
    display: none;
  } */
}
@media screen and (max-width:1170px) {
  .link-container a {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -59%);
  }
  .link-container:nth-child(2) a {
    transform: translate(-50%, -50%);
  }
  .link-container:nth-child(1) a {
    transform: translate(-50%, -55%);
  }
}