.video-content-container {
width: 100%;
outline:1px solid black;
outline-offset:6px;
max-width: 734px; 
}

.video-player {
position: relative;
width: 100%;
background-color: white;
overflow:hidden;
}

.video-player img{
width: 100%;
}

.video-playlist {
background-color: white;
width: 100%;
display: flex;
padding-top: 56.25%;
position: relative;
overflow: hidden;
}

.video-playlist-item {
position: relative;
width: 100%;
margin: 2px;
min-width:120px; 
}

.video-playlist-link {
display: flex;
position: relative;
width: 120px; 
}

.video-playlist-thumbnail {
height: 100px;
margin:0 4px;
}

.video-playlist-title {
color: #000;
background-color: #dbdbdb;
background-blend-mode: darken;
opacity: .85;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
margin: 0;
height:30px;
overflow:hidden;
max-width:120px;
}

.overflow {
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
display: -webkit-box;
}

.video-play-button {
z-index: 3;
position: absolute;
top: 50%;
left: 50%;
margin-left: -1em;
margin-top: -1em;
width: 2em;
height: 2em;
line-height: 2em;
border: none;
border-radius: 50%;
font-size: 3.5em;
background-color: rgb(0 0 0 / 45%);
color: #fff;
transition: border-color .4s,outline .4s,background-color .4s;
}

.modal {
z-index: 4;
padding-top: 100px;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
}

.modal-content {
margin-top: 30px;
margin-left: auto;
margin-right: auto;
background-color: #fff;
position: relative;
padding: 10px;
outline: 0;
width: fit-content;
}

.modal-header {
border-bottom: 1px solid #111;
margin-bottom: 10px;
}

.box-name {
font-size: 37px;
font-weight: bold;
color: #111;
}

.topright {
float: right;
}

.button {
border-radius: 4px;
display: inline-block;
padding: 8px 16px;
margin: 0;
vertical-align: middle;
overflow: hidden;
text-decoration: none;
color: #003049;
background-color: inherit;
text-align: center;
cursor: pointer;
white-space: nowrap;
}

.modal-background {
background-color: rgb(0 0 0);
background-color: rgb(0 0 0 / 40%);
}

.display-off {
display: none;
}

.fa-play {
margin-left: 38%;
font-size: 48px;
color: #eee;
}

.video-player iframe {
border: 0;
}
