/* Start:/bitrix/templates/lk_default_yo/components/bitrix/catalog.section.list/SectionCards/style.css?17804684631645*/
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
.card-content ul li a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}
.cards {
  font-size: .6vw;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.card {
  position: relative;
  width: 33%;
  height: 0;
  padding-bottom: 65%;
  margin-bottom: 4%;
  overflow: hidden;
}

.card-image-bg,
.card:hover .card-image-bg,
.card-overlay,
.card:hover .card-overlay,
.card-content ul,
.card:hover .card-content ul
 {
  transition: 400ms;

}
.card-image-bg {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
}
.card:hover .card-image-bg {
  scale: 110%;
  transition: 400ms;
}
.card-content {
  position: realtive;
  padding: 4%;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.card-content h2,
.card-content ul {
  position: absolute;
  color: #fff;
  left: 10%;
}
.card-content h2 {
  margin: 0;
  padding: 0;
  line-height: 100%;
  text-transform: uppercase;
  z-index: 3;
  font-size: 3em;
  bottom: 6%
}
.card-content ul {
  top: 4%;
  color: #ffffff00;
  font-size: 2em;
  line-height: 1.8em;
}
.card-content ul li a:hover {
    color: #000;
}
.card-overlay {
  position: absolute;
  z-index: 0;
  width: 100%;
  height: 100%;
}
.card:hover .card-overlay {
  background: rgba(137,137,137,0.90);
}
.card:hover .card-content ul {
    color: #fff;
}

@media (max-width: 768px) {
  .cards {
    font-size: 1vw;
  }
}
@media (max-width: 600px) {
  .cards {
    font-size: 2vw;
  }
.card {
  padding-bottom: 135%;
  width: 100%;
}
.card-overlay {
  background: rgba(137,137,137,0.50);
}
.card-content ul {
  color: #fff;
}
}
/* End */
/* /bitrix/templates/lk_default_yo/components/bitrix/catalog.section.list/SectionCards/style.css?17804684631645 */