.li-widgets--projects {
  border-bottom: 3px solid #fff;
}
.li-widgets--projects__filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  --filters-select-icon-size: 1.2em;
}
.li-widgets--projects__filters--filter {
  width: auto;
  appearance: none;
  color: inherit;
  border-style: solid;
  padding: 0;
  padding-right: calc(var(--filters-select-icon-size) + var(--filters-padding-right) * 1.5) !important;
  background: transparent url(./assets/img/arrow_down.svg) no-repeat calc(100% - var(--filters-padding-right) / 2) center;
  background-size: var(--filters-select-icon-size) var(--filters-select-icon-size);
}
@media (max-width: 767px) {
  .li-widgets--projects__filters--filter {
    width: 100% !important;
  }
}
.li-widgets--projects__filters--filter:focus {
  outline: none;
}
.li-widgets--projects__project {
  border-top: 3px solid #fff;
}
.li-widgets--projects__project--toggle-bar {
  display: flex;
}
.li-widgets--projects__project--toggle-bar .title {
  flex-grow: 3;
  width: 50%;
  padding: 20px 0;
}
.li-widgets--projects__project--toggle-bar .type,
.li-widgets--projects__project--toggle-bar .year {
  flex-grow: 1;
  width: calc((50% - 60px) / 2);
  padding: 20px 10px;
}
.li-widgets--projects__project--toggle-bar .toggle {
  flex-grow: 2;
  width: 60px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: end;
  flex-direction: column;
}
.li-widgets--projects__project--toggle-bar .toggle .on-icon {
  display: block;
}
.li-widgets--projects__project--toggle-bar .toggle .off-icon {
  display: none;
}
.li-widgets--projects__project--toggle-bar .toggle .on-icon,
.li-widgets--projects__project--toggle-bar .toggle .off-icon {
  max-width: 30px;
  max-height: 30px;
  width: 100%;
}
.li-widgets--projects__project--toggle-bar .toggle svg > * {
  fill: #fff;
  stroke: #fff;
}
.li-widgets--projects__project--toggle-bar.active .toggle .on-icon {
  display: none;
}
.li-widgets--projects__project--toggle-bar.active .toggle .off-icon {
  display: block;
}
.li-widgets--projects__project--content {
  padding: 80px 0 15px;
  display: none;
  color: #fff;
  font-family: "Cera PRO", sans-serif;
}
.li-widgets--projects__project--content .text-content {
  display: flex;
}
.li-widgets--projects__project--content .text-content .key-facts {
  width: 30%;
}
.li-widgets--projects__project--content .text-content .key-facts .title {
  font-size: 40px;
  font-weight: 700;
  line-height: 1.1;
}
.li-widgets--projects__project--content .text-content .key-facts .customer {
  font-family: "NibPro", sans-serif;
}
.li-widgets--projects__project--content .text-content .key-facts .types {
  margin-top: 60px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 8px;
}
.li-widgets--projects__project--content .text-content .key-facts .types .type {
  display: inline-block;
  padding: 4px 10px;
  border: 2px solid #fff;
  border-radius: 20px;
  line-height: 1;
}
.li-widgets--projects__project--content .text-content .key-facts .url {
  margin-top: 10px;
  font-size: 1.4em;
  font-weight: 700;
  text-decoration: underline;
}
.li-widgets--projects__project--content .text-content .key-facts .url a {
  color: #fff !important;
}
.li-widgets--projects__project--content .text-content .description {
  width: 70%;
  padding-left: 8%;
  font-size: 1.4em;
  line-height: 1.2;
}
.li-widgets--projects__project--content .text-content .description .read-more {
  text-align: right;
  margin-top: 40px;
}
.li-widgets--projects__project--content .text-content .description .read-more a {
  color: #fff !important;
  font-family: "NibPro", sans-serif;
}
.li-widgets--projects__project--content .project-gallery {
  margin-top: 50px;
  position: relative;
}
.li-widgets--projects__project--content .project-gallery .swiper-wrapper {
  position: static !important;
}
.li-widgets--projects__project--content .project-gallery .image,
.li-widgets--projects__project--content .project-gallery .video {
  display: inline-block;
  width: auto;
}
.li-widgets--projects__project--content .project-gallery .image img {
  height: 500px;
  width: auto;
  display: block;
}
.li-widgets--projects__project--content .project-gallery .video .wp-video {
  height: 850px;
}

.li-widgets--projects__project--content .project-gallery .video .plyr__control {
  background-color: transparent !important;
  border: none !important;
}

.li-widgets--projects__project--content .project-gallery .video .plyr__progress__buffer {
  height: 4px !important;
}

.li-widgets--projects__project--content .project-gallery .video .wp-video .li-video-shortcode {
  height: 100%;
}
.li-widgets--projects__project--content .project-gallery .gallery-next,
.li-widgets--projects__project--content .project-gallery .gallery-prev {
  display: block;
  width: 30px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 99;
  cursor: pointer;
  filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.8));
}
.li-widgets--projects__project--content .project-gallery .gallery-next svg > *,
.li-widgets--projects__project--content .project-gallery .gallery-prev svg > * {
  fill: #fff;
  stroke: #fff;
}
.li-widgets--projects__project--content .project-gallery .gallery-next {
  right: 40px;
}
.li-widgets--projects__project--content .project-gallery .gallery-prev {
  left: 40px;
}
.li-widgets--projects__project--content .project-gallery .image img.li_video_customplay
{
  position:absolute;
  left:50%;
  top:50%;
  transform:translateX(-50%) translateY(-50%);
  height:auto;
  width:auto;
  min-height:unset;
  min-width:unset;
  z-index:1;
  cursor:pointer;
}
.plyr__controls .plyr__control
{
  padding:10px;
  border:none;
  border-width:0px!important;
}
@media (max-width: 767px) {
  .li-widgets--projects__project--toggle-bar {
    flex-wrap: wrap;
  }
  .li-widgets--projects__project--toggle-bar .title {
    width: 100%;
  }
  .li-widgets--projects__project--toggle-bar .type,
  .li-widgets--projects__project--toggle-bar .year {
    width: calc((100% - 60px) / 2);
  }
  .li-widgets--projects__project--content .text-content {
    flex-direction: column;
  }
  .li-widgets--projects__project--content .text-content .key-facts,
  .li-widgets--projects__project--content .text-content .description {
    width: 100%;
  }
  .li-widgets--projects__project--content .text-content .description {
    padding-left: 0;
    padding-top: 30px;
  }
  .li-widgets--projects__project--content .project-gallery .image img {
    height: 300px;
  }
}
@media (max-width: 500px) {
  .li-widgets--projects__project--content .project-gallery .image img {
    height: 180px;
  }
}