.topics-carousel-block {
  padding: 30px 0 60px;
}
.topics-carousel-block > .container > .title {
  font-size: 22px;
  line-height: 28px;
  margin: 0 0 20px;
  padding: 0 15px;
  color: #fff;
}
.topics-carousel-block .slick-slide:not(.slick-active) .topic {
  transform: scale(0.85);
}
.topics-carousel-block .topic {
  padding: 10px;
  box-sizing: border-box;
  transition: all 0.2s ease-out;
}
.topics-carousel-block .topic .card {
  background: #fff;
  box-shadow: 0 0 8px rgba(51, 51, 51, 0.16);
  border-radius: 6px;
  display: block;
  padding: 8px;
  position: relative;
  text-decoration: none;
  max-width: none;
}
.topics-carousel-block .topic .card:hover .description:after {
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' viewBox='0 0 21 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10.5' cy='10.5' r='10.25' fill='%23526366' stroke='%23526366' stroke-width='0.5'/%3E%3Cpath d='M8.83603 14.606C8.71505 14.4667 8.64708 14.2777 8.64708 14.0807C8.64708 13.8837 8.71505 13.6948 8.83603 13.5555L12.0305 9.87787L8.83603 6.20026C8.71847 6.06014 8.65343 5.87247 8.6549 5.67767C8.65637 5.48287 8.72424 5.29653 8.84389 5.15878C8.96354 5.02103 9.12541 4.9429 9.29462 4.9412C9.46383 4.93951 9.62684 5.0144 9.74856 5.14973L13.3993 9.3526C13.5203 9.49192 13.5883 9.68086 13.5883 9.87787C13.5883 10.0749 13.5203 10.2638 13.3993 10.4031L9.74856 14.606C9.62754 14.7453 9.46342 14.8235 9.29229 14.8235C9.12117 14.8235 8.95705 14.7453 8.83603 14.606Z' fill='white'/%3E%3C/svg%3E%0A");
  width: 21px;
  height: 21px;
}
.topics-carousel-block .topic .header {
  position: absolute;
  display: flex;
  margin-top: -8px;
}
.topics-carousel-block .topic .header .tag {
  background: #fff;
  color: #333;
  left: 0;
  top: 0;
  padding: 10px;
  min-width: 100px;
  text-align: center;
  border-radius: 0 0 6px 0;
  font-size: 13px;
  text-transform: capitalize;
  font-weight: 400;
  box-sizing: border-box;
  margin: 0;
}
.topics-carousel-block .topic .header .badge {
  background: #00A5C0;
  font-size: 13px;
  text-transform: capitalize;
  font-weight: 400;
  color: #fff;
  padding: 10px;
  min-width: 65px;
  box-sizing: border-box;
  text-align: center;
  border-radius: 0 0 6px 0;
  margin-left: -5px;
}
.topics-carousel-block .topic .image {
  border: 1px solid #e9e9e9;
  border-radius: 6px;
  overflow: hidden;
}
.topics-carousel-block .topic .image img {
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 740/370;
  -o-object-position: center;
     object-position: center;
  width: 100%;
}
.topics-carousel-block .topic .description {
  font-size: 13px;
  line-height: 17px;
  color: #333;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  margin: 10px;
  position: relative;
  padding: 0 30px 0 0;
}
.topics-carousel-block .topic .description:after {
  content: " ";
  position: absolute;
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.41548 13.9105C8.30025 13.7778 8.23552 13.5979 8.23552 13.4103C8.23552 13.2226 8.30025 13.0427 8.41548 12.91L11.4578 9.40752L8.41548 5.90504C8.30352 5.77159 8.24157 5.59286 8.24297 5.40733C8.24437 5.22181 8.30901 5.04434 8.42296 4.91315C8.53692 4.78196 8.69107 4.70755 8.85222 4.70594C9.01338 4.70433 9.16863 4.77565 9.28455 4.90454L12.7615 8.90727C12.8767 9.03996 12.9414 9.2199 12.9414 9.40752C12.9414 9.59514 12.8767 9.77509 12.7615 9.90777L9.28455 13.9105C9.16929 14.0432 9.01299 14.1177 8.85001 14.1177C8.68704 14.1177 8.53074 14.0432 8.41548 13.9105Z' fill='%23526366'/%3E%3Ccircle cx='10' cy='10' r='9.75' stroke='%23526366' stroke-width='0.5'/%3E%3C/svg%3E%0A");
  width: 20px;
  height: 20px;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
.topics-carousel-block > .slick-actions {
  padding: 20px 15px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.topics-carousel-block ul.slick-dots {
  display: flex;
  background: rgba(255, 255, 255, 0.8);
  padding: 10px 30px;
  box-sizing: border-box;
  border-radius: 25px;
  list-style: none;
  align-items: center;
  min-width: 170px;
  justify-content: center;
  max-width: -moz-fit-content;
  max-width: fit-content;
  margin: 0 15px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.15);
  order: 2;
}
.topics-carousel-block ul.slick-dots li {
  line-height: 1;
  margin: 0 6px;
  width: 7px;
  height: 7px;
  background: #526366;
  border-radius: 100%;
  display: flex;
  overflow: hidden;
  transition: all 0.2s;
  cursor: pointer;
}
.topics-carousel-block ul.slick-dots li.slick-active {
  width: 13px;
  height: 13px;
  background: #00A5C0;
}
.topics-carousel-block ul.slick-dots button {
  border: 0;
  text-indent: 999999px;
  background: transparent;
  cursor: pointer;
}
.topics-carousel-block .slick-arrow {
  border: 1px solid #526366;
  border-radius: 50%;
  cursor: pointer;
  text-indent: 99999px;
  overflow: hidden;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 30px;
  height: 30px;
  background: #fff;
  position: relative;
  margin-top: 3px;
  transition: all 0.2s;
  white-space: nowrap;
}
.topics-carousel-block .slick-arrow:before {
  left: 4px;
  width: 7px;
  height: 7px;
  transform: rotate(45deg);
  border-bottom: 2px solid #526366;
  border-left: 2px solid #526366;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  content: " ";
}
.topics-carousel-block .slick-arrow.slick-next {
  order: 3;
}
.topics-carousel-block .slick-arrow.slick-next:before {
  left: 0;
  right: 4px;
  border-left: none;
  border-bottom: none;
  border-right: 2px solid #526366;
  border-top: 2px solid #526366;
}
.topics-carousel-block .slick-arrow:hover {
  background: #526366;
}
.topics-carousel-block .slick-arrow:hover:before {
  border-color: #fff;
}

@media (min-width: 768px) {
  .topics-carousel-block {
    padding: 50px 0;
    position: relative;
  }
  .topics-carousel-block > .container > .title {
    font-size: 40px;
    line-height: 32px;
    margin: 0 0 50px;
    padding: 0 40px;
  }
  .topics-carousel-block .topic .header .tag,
  .topics-carousel-block .topic .header .badge {
    font-size: 14px;
    padding: 12px 28px;
  }
  .topics-carousel-block .topic .description {
    font-size: 16px;
    line-height: 20px;
    margin: 13px;
    padding: 0 45px 0 0;
  }
  .topics-carousel-block .slick-arrow {
    position: absolute;
    left: 110px;
    top: 0px;
    bottom: 0;
    margin: auto;
    width: 36px;
    height: 36px;
  }
  .topics-carousel-block .slick-arrow:before {
    width: 10px;
    height: 10px;
  }
  .topics-carousel-block .slick-arrow.slick-next {
    left: initial;
    right: 110px;
  }
  .topics-carousel-block ul.slick-dots {
    padding: 15px 30px;
  }
}
@media (min-width: 1280px) {
  .topics-carousel-block .slick-slide:not(.slick-active) .topic {
    transform: scale(0.8);
  }
  .topics-carousel-block .topic .header .tag,
  .topics-carousel-block .topic .header .badge {
    padding: 15px 43px;
  }
  .topics-carousel-block .topic .header .badge {
    margin-left: -7px;
  }
  .topics-carousel-block .slick-arrow {
    left: 23%;
    width: 45px;
    height: 45px;
  }
  .topics-carousel-block .slick-arrow.slick-next {
    right: 23%;
  }
  .topics-carousel-block .slick-arrow.slick-prev {
    background: transparent;
    border-color: #fff;
  }
  .topics-carousel-block .slick-arrow.slick-prev:before {
    border-color: #fff;
  }
}