#kiadvanyok {
  --gray-dark: #2D353F;
  --gray-light: #CED7DC;
  --gray-darker: color-mix(in srgb, var(--gray-dark), #001);
  --hover: #F26D00;
  --hover2: color-mix(in srgb, var(--gray-dark) 66%, var(--gray-light));
  --hover3: var(--gray-darker);
  --card-width: 15rem;
  --grid-gap: min(2vw, 1rem);
  --txt-width: 48rem;
}
#kiadvanyok .box-content {
  display: grid;
  position: relative;
  gap: 0 var(--grid-gap);
  grid-template-columns: repeat(4, 1fr);
}
@media screen and (max-width: 980px) {
  #kiadvanyok .box-content {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--grid-gap);
  }
}
@media screen and (max-width: 586px) {
  #kiadvanyok .box-content {
    grid-template-columns: 1fr;
  }
}
#kiadvanyok .box-content::before {
  position: absolute;
  content: "";
  left: calc(-50vw + 50%);
  right: calc(-50vw + 50%);
  background: var(--gray-light);
  z-index: -1;
  top: -1rem;
  bottom: 4rem;
}
#kiadvanyok .box-content + .button {
  float: right;
  font-family: "Titillium Web";
  font-size: 0.75rem;
  font-weight: 600;
  background: transparent;
  color: #1d62b3;
  text-transform: uppercase;
  border: 1px solid transparent;
  margin-right: -1.4rem;
  width: auto;
}
#kiadvanyok .box-content + .button::before {
  float: left;
  margin: 0 1ex 0 0;
}
#kiadvanyok .box-content + .button:is(:hover, :focus-visible) {
  border-color: #1d62b3;
}
#kiadvanyok .publcard {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  gap: 0;
  color: #fff;
}
#kiadvanyok .publcard .wrap {
  width: 100%;
  background: var(--gray-darker);
}
#kiadvanyok .publcard .title {
  background: var(--gray-dark);
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  transition: 0.3s;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.25px;
  padding: 1rem;
}
#kiadvanyok .publcard .image {
  display: flex;
  align-items: end;
}
#kiadvanyok .publcard img {
  display: block;
  width: 100%;
  filter: saturate(0.75);
  transition: 0.3s;
  margin: 0;
  -o-object-fit: contain;
     object-fit: contain;
}
#kiadvanyok .publcard:is(:hover, :focus-visible) {
  color: var(--hover);
}
#kiadvanyok .publcard:is(:hover, :focus-visible) .title {
  background: var(--gray-darker);
}
#kiadvanyok .publcard:is(:hover, :focus-visible) img {
  filter: saturate(1);
  transform: translateY(-6px);
  box-shadow: 0 16px 16px rgba(0, 0, 0, 0.5333333333);
}/*# sourceMappingURL=startpage-kiadvanyok.css.map */