* {
  transition: all 0.1s ease-in-out;
}

a {
  text-decoration: none;
}

h1,
h2,
h3,
h4 {
  text-transform: uppercase;
  font-family: "Plat Nomor";
}

.title-with-star {
  position: relative;
  margin-top: 1%;
  font-size: 36px;
  width: fit-content;
  margin: 0 auto;
  color: #000;
  text-transform: uppercase;
  font-family: "Plat Nomor";
}

.title-with-star::before,
.title-with-star::after {
  content: "";
  position: absolute;
  left: -1em;
  top: -5px;
  height: 100%;
  width: 1em;
  background: url(../images/name-star-black.png) no-repeat center center
    transparent;
}

.title-with-star::after {
  left: auto;
  right: -1em;
}

.btn-primary {
  font-family: "Plat Nomor";
}

/* Events page carousel element */
.events-page .swiper-slide {
  padding: 0 100px !important;
}

@media screen and (max-width: 767px) {
  .events-page .swiper-slide {
    padding: 0 20px !important;
  }
}

/* Music Video Page style */
.music-video-page .card-sec .swiper-slide {
  padding: 0 80px;
}

.music-video-page .swiper-slide.swiper-slide-active {
  padding-right: 0;
}

.music-video-page .swiper-slide.swiper-slide-next {
  padding-left: 0;
}
.music-video-page .card-sec img {
  transition: all 0.4s ease-in-out;
  filter: grayscale(1);
}

.music-video-page .card-sec img:hover {
  filter: grayscale(0);
}

.title {
  font-size: 2rem;
  font-family: "Plat Nomor";
  text-transform: uppercase;
  color: #000;
}

.text-regular {
  font-size: 1.4rem;
  font-family: "Plat Nomor";
  text-transform: uppercase;
  font-weight: 600;
}

/* Music video inner page */

.music-video-list li {
  color: #000;
  position: relative;
  margin-bottom: 25px;
}

.music-video-list li .star-icon {
  position: absolute;
  left: -30px;
  top: -3px;
  font-size: 26px;
  color: #000;
}

.music-video-list li h4 {
  font-size: 1.6rem;
  margin-bottom: 0;
}

.music-video-list li .h6 {
  font-size: 1rem;
  margin-bottom: 0;
  font-weight: 600;
}

.music-video-list li p {
  color: #000 !important;
  font-size: 1rem;
}

.music-video-list li .hash-icon {
  position: absolute;
  left: -30px;
  top: 3px;
  font-size: 2rem;
  font-weight: 600;
}

.music-video-list .sec-title .title {
  font-size: 3rem !important;
  margin-bottom: 0;
}

.music-details li {
  margin-bottom: 30px;
}

.music-video-list li:hover h4,
.music-video-inside h1 a:hover {
  text-decoration: underline;
  color: #000;
  text-decoration-thickness: 2px;
}

.music-details li h5 {
  font-family: "Plat Nomor";
  text-transform: uppercase;
  color: #000;
  font-weight: 600;
  margin-bottom: 0;
}

.music-details li p {
  color: #000;
  letter-spacing: -0.5px;
  font-size: 22px;
}

.collage-container {
  background-image: url("../images/music-video/player-bg.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  padding: 20px 120px 120px;
}
.collage-container a {
  margin: 0 -2px;
}

@media (max-width: 1440px) {
  .collage-container {
    padding: 20px 120px 120px;
  }
}

@media (max-width: 1366px) {
  .collage-container {
    padding: 20px 110px 120px;
  }
}

@media (max-width: 1024px) {
  .collage-container {
    padding: 20px 50px 120px;
  }
}

@media (max-width: 1024px) {
  .collage-container {
    padding: 20px 10px 120px;
  }
}

/* Events page slider styles */
.events-slider .swiper-slide {
  padding: 0 140px;
}

.events-slider .swiper-slide.swiper-slide-active {
  padding-right: 0;
}

.events-slider .swiper-slide.swiper-slide-next {
  padding-left: 0;
}

/* Feedback popup form style */

#feedback_form .title {
  font-size: 3.68rem;
}

#feedback_form .modal-content {
  background-color: #f6f6f654;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(21px) !important;
}

#feedback_form input[type="text"],
#feedback_form input[type="email"],
#feedback_form input[type="number"] {
  transform: none !important;
  opacity: 1 !important;
  border: 0;
  border-radius: 0;
  border-bottom: 2px solid #000;
  font-family: "Be Vietnam";
}
#feedback_form textarea {
  transform: none !important;
  opacity: 1 !important;
  border: 0;
  border-radius: 15px;
  background-color: #ffffff26 !important;
  padding: 20px !important;
}

label,
::placeholder {
  color: #000;
  font-size: 21px;
}
.custom-checkbox {
  position: relative;
}
.custom-control-label {
  padding-left: 4.5rem;
  padding-bottom: 1.5rem;
  cursor: pointer;
  font-size: 1.3rem;
  letter-spacing: -1px;
  color: #000;
  font-family: "Be Vietnam";
}
.custom-checkbox input {
  position: absolute;
  opacity: 0;
}

.custom-icon {
  position: absolute;
  top: 5px;
  left: 0;
  display: inline-block;
  width: 60px;
  height: 60px;
  background-image: url("../images/round-star-border.svg");
  background-size: cover;
  cursor: pointer;
}
.custom-icon.icon-1 {
  top: -11px;
}

.custom-icon.icon-2 {
  top: 3px;
}

.custom-control-input:checked ~ .custom-control-label .custom-icon {
  background-image: url("../images/round-star.svg");
}

.form-label {
  min-inline-size: max-content;
}
#feedback_form .d-flex {
  column-gap: 12px;
}
#feedback_form input {
  background-color: transparent;
  margin-bottom: 15px;
}
#feedback_form input,
#feedback_form textarea {
  visibility: visible !important;
}

.btn-close {
  background: url("../images/cancel-button.svg");
  width: 40px;
  height: 40px;
  background-size: contain;
  background-repeat: no-repeat;
}
.btn-close:hover {
  opacity: 1;
}

.nav-white .logo-image img {
  filter: invert(1);
}

.nav-white .nav-link {
  color: #fff;
}

@media screen and (max-width: 992px) {
  #feedback_form .title {
    font-size: 2.68rem;
  }
  #feedback_form .modal-dialog {
    max-width: 820px;
  }
}

@media screen and (max-width: 820px) {
  #feedback_form .modal-dialog {
    max-width: 90%;
  }
}

@media screen and (max-width: 767px) {
  .music-video-page .swiper-slide {
    padding: 0 20px !important;
  }
  #feedback_form .modal-dialog {
    max-width: 100%;
  }
  #feedback_form .title {
    font-size: 2.2rem;
  }
  label,
  ::placeholder {
    font-size: 18px;
  }
  .custom-control-label {
    font-size: 1.2rem;
  }
  #feedback_form input[type="text"],
  input:focus {
    margin-top: 0;
  }
  .music-details li p {
    font-size: 17px !important;
  }
}