.welcome-video {
     background-color: #000;
     color: #fff;
     /* padding: 7rem 0 4rem; */
     position: relative;
     padding-top: 7rem;
}
 .welcome-video .container {
     position: relative;
     z-index: 10;
}
 .welcome-video .confetti-bg {
     width: 50%;
     /* height: 500px; */
     position: absolute;
     top: 0px;
     left: 0px;
     z-index: 0;
     aspect-ratio: 16 / 9;
}
 .welcome-video #canvas2.confetti-bg {
     left: initial;
     right: 0px;
}
 .welcome-video .page-title {
     text-align: center;
}
 .welcome-video .page-title em {
     display: block;
     font-size: 4rem;
     font-family: "Patua One";
     font-weight: normal;
}
 .welcome-video .subtitle {
     text-align: center;
     font-family: Patua One, sans-serif;
     margin-bottom: 2.5rem;
     text-transform: capitalize;
}
/* .welcome-video #video-player {
     max-width: 100%;
     height: auto;
     margin: 5rem 0;
}
 */
 .welcome-video .hero {
     position: relative;
     margin: 4rem 0;
}
 .welcome-video .hero .media {
     position: relative;
     overflow: hidden;
     /* min-height: 839px; */
}
 .welcome-video .hero .media .embed-container {
     position: relative;
     padding-bottom: 56.25%;
     height: 0;
     overflow: hidden;
     max-width: 100%;
     background-color: #000;
}
 .welcome-video .hero .media .overlay {
     height: 100%;
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     margin: 0 auto;
     background: linear-gradient(transparent 0, #000 95%);
}
 .welcome-video .hero .message-wrap {
     position: absolute;
     top: 0;
     bottom: 20px;
     right: 0;
     left: 0;
     border: solid 10px #4c4a4f;
}
 /* .welcome-video .hero .message-wrap img, .welcome-video .hero .message-wrap .overlay {
     display: none;
} */
 .welcome-video .hero .message-wrap .inner {
     max-width: 90rem;
     margin-left: auto;
     margin-right: auto;
     padding: 0;
     display: flex;
     flex-direction: column;
     justify-content: flex-end;
     height: 100%;
}
 .welcome-video .hero .message-wrap .play-controls {
     position: relative;
     display: flex;
     gap: 10px;
     justify-content: flex-end;
     right: 20px;
     bottom: 20px;
     padding-top: 8vh;
}
 .welcome-video .hero .scroll-down {
     color: #fff;
     width: 115px;
     left: 0;
     right: 0;
     margin-left: auto;
     margin-right: auto;
     background: transparent;
     position: absolute;
     bottom: 30px;
}
@media only screen and (max-width: 530px) {
     .welcome-video .hero .message-wrap .inner,
     .welcome-video .hero .scroll-down {
          display: none;
     }
     .welcome-video .hero .message-wrap .overlay {
          display: none;
     }
}