/**
 * Video Highlight Block - UI giống web gốc borealisrecords.com
 */

/* Title box */
.videos_box .title_box {
  position: relative;
}
.videos_box .title_box h4 {
  font-weight: 700;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 36px;
  line-height: 2.25rem;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 0;
  font-family: "Oswald", sans-serif;
}
.videos_box .title_box h4 a {
  color: #fff;
  font-size: 24px;
  font-size: 1.5rem;
}
@media only screen and (max-width: 991px) {
  .videos_box .title_box h4 {
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 26px;
  }
  .videos_box .title_box h4 a {
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.videos_box .title_box strong {
  color: #009B3A;
}

/* Post thumbnail - click overlay */
.videos_box .post-item .post-thumbnail a::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 999;
}

/* Regular post item */
.videos_box .post-item .post-thumbnail {
  position: relative;
  overflow: hidden;
  border-radius: 2px 2px 0 0;
}
.videos_box .post-item .post-title {
  background: linear-gradient(90deg, #1A1D23 0%, #141417 100%);
  min-height: 110px;
  padding: 15px 20px;
  position: relative;
  border-radius: 0 0 2px 2px;
}
.videos_box .post-item img {
  width: 100%;
  height: 150px;
  max-width: 100%;
  object-fit: cover;
}
.videos_box .post-item .post-title h3 {
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.videos_box .post-item .post-title h3 a {
  font-family: "Oswald", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  line-height: 25px;
  color: #F2F3F3;
  display: block;
  text-decoration: none;
}
.videos_box .post-item .post-title h3 a:hover {
  color: #CB461B;
  text-decoration: underline;
}

/* Video play icon */
.videos_box .post-item .icon-video-play {
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAMAAADW3miqAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAARdQTFRFAAAAAAAA/////////f39////////////////////////////f39//////v7+/Pz8+/v7/v7+////8PDw/////f399/f39/f38PDw8fHx/f39+/v7AAAA/Pz8+vr6+vr6/v7+3/LmT7p3n9m18PDwf82cAJs6IKdS+vr6f82d/f39YMCDcMeQEKJHkNOpULt47/nz+vr6IKhTv+bO/v7+9vb2gM2d3d3dQLRrz+3bAAAA/Pz83/PnAAAA9fX1Kioq6enpAAAAAAAA+Pj4JCQkAAAAqqqq/f39ICAgMzMzAAAA0dHRVVVVzMzMtbW1o6OjAAAAGRkZ8PDw4uLiFxcX8vLyHBwcAAAA9PT0+/v79/f38vLyx8fHEwBO0AAAAF10Uk5TAAEhcKDg7//PsCABAmDAYEHg3xGQkCIhIhKRkQJhYmHQ////I////3H/cf///////6L//7Bz/yX//wbB/wdkBkYFCJMHBBjRCAUDJwMoGBkJCmZHC2UJCnWypHUpdngEAwAAAZZJREFUeJyF1GdTwkAQBuBdKQcmlogF9VRswYpYEDw9McEICajB3v7/7/BgYMzlEtxvm3nm3TcMADAcRBxLJFNpQtKZbGJcrBrIg5qOE5MkMJkpoTBAxILTBgnNzISkEHKzYdKbuZyGOMzB+UyUEWELAyRO55VTf0pHXRgdczNxRvRfxP57aUvxhpBlXXwUSFdGGUKmKQKlsYUGtagGdHW0IWRNB1oI7OsbmyqapLAV3LdNs7iuqDzshJBp7obRHmQVZBZDN5NQUJFp7ks3DUhHITksDSQSyc1i0UEQRZ87LEnnUlHoqBx8WoBjFZ2cSh3IGVQUdF6WDalANYRqFyQ8VWCXgfWqVlIIKXBg1+pjea7rUOf/fOkMzgS6+S+IgcXtxijT4LcWOIzfNUccu2u5Fngiqh1by2jbzOlAR0TZ9zGq2W7VLccDz3EZbz1E9mo8+jbrId1zLJHVfVLCjGff5sx1vA6g57kua9n+y6vU//K167/ZvO54lIqfOXX6Wb7/fv/x2ez9HRpf3z/dN/+WcZFDEX8Bc8JVgXnMnhcAAAAASUVORK5CYII=") no-repeat center;
  width: 36px;
  height: 36px;
  display: block;
}
.videos_box .post-item .post-thumbnail .icon-video-play {
  width: 24px;
  height: 24px;
  background-size: contain;
  position: absolute;
  bottom: 15px;
  left: 15px;
}

/* Featured post (first item) */
.videos_box .post-item.post-featured {
  background: none;
  position: relative;
  padding: 0;
  overflow: hidden;
  border-radius: 2px;
}
.videos_box .post-item.post-featured img {
  width: 100%;
  height: 520px;
  max-width: 100%;
  object-fit: cover;
}
.videos_box .post-item.post-featured .post-title {
  position: absolute;
  background: none;
  z-index: 9;
  bottom: 0;
  padding: 40px 20px;
  min-height: auto;
}
.videos_box .post-item.post-featured .post-title h3 a {
  font-family: "Oswald", sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  line-height: 30px;
  color: #F2F3F3;
}
.videos_box .post-item.post-featured .post-title:before {
  display: none;
}
.videos_box .post-item.post-featured .post-title .icon-video-play {
  display: block;
  margin-bottom: 10px;
}
.videos_box .post-item.post-featured:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
  background: linear-gradient(90deg, rgba(20, 20, 20, 0.5) 0%, rgba(20, 20, 20, 0) 100%);
  opacity: 0.5;
  border-radius: 2px;
}

/* Mobile */
@media screen and (max-width: 991px) {
  .videos_box .post-item {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 15px;
    background: linear-gradient(90deg, #1A1D23 0%, #141417 100%);
  }
  .videos_box .post-item img {
    height: 128px;
  }
  .videos_box .post-item .post-thumbnail {
    flex: 0 0 41.66667%;
    max-width: 41.66667%;
    position: relative;
  }
  .videos_box .post-item .post-thumbnail img {
    border-radius: 2px;
  }
  .videos_box .post-item:not(.post-featured) .post-title {
    flex: 0 0 58.33333%;
    max-width: 58.33333%;
    min-height: auto;
    padding: 15px;
  }
  .videos_box .post-item.post-featured {
    display: block;
    background: none;
  }
  .videos_box .post-item.post-featured img {
    height: 320px;
  }
  .videos_box .post-item.post-featured .post-thumbnail {
    flex: none;
    max-width: none;
  }
}