.lum-video-embed {
    max-width:100%;
    margin-bottom: 2rem;
}
.lum-video-embed.fullwidth {
    max-width:100%;
}
.lum-video-embed iframe {
    max-width:100%;
    width: 100%;
}
.lum-video-title {
    font-weight: bold; 
    float: right;
    font-size: 1rem;
    text-align: right;
    margin: .4rem;
    cursor: pointer;
    border: 1px solid #000;
    padding: 0.5rem 1.5rem 0.2rem;
    border-radius: 3rem;
    background-color: #fff;
}

/* CUSTOM CSS CLASSES */
.video-height-16-9 {
    height: calc(1290px / 16 * 7.85);
    margin-bottom: 4rem;
}
.video-height-16-9 > .cell {
    margin:0;
}
.video-height-16-9 > .cell > .lum-video-embed,
.video-height-16-9 > .cell > .lum-video-embed > .embed-player-wrap,
.video-height-16-9 > .cell > .lum-video-embed > .embed-player-wrap > .embed-player {
    height:100%;
}

.hide-transcript-btn .lum-video-title {
    display:none;
}

.lum-video-embed .lum-video-title i.accord-arrow-right {
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 7px solid #000;
    font-size: 0;
    top: -6px;
    position: relative;
    margin-right: 5px;
}
.lum-video-embed .lum-video-title i.accord-arrow-down {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 7px solid #000;
    font-size: 0;
    top: -0;
    position: relative;
    margin-right: 5px;
}
.lum-video-embed i.bi.ctrl {
    display:none;
}
.lum-video-embed i.bi, 
.fullscreen-transcript i.bi {
    cursor:pointer;
    margin-right:1rem;
    font-size:1rem;
    background-color: #fff;
    padding: 0.5rem 1.2rem .3rem;
    border-radius: 5rem;
    display: inline-block;
    margin-bottom: .4rem;
}
.lum-video-embed span.text,
.fullscreen-transcript span.text {
    font-size: .8rem;
    padding-left: .5rem;
    vertical-align: top;
}
.lum-video-embed i.bi:hover, .fullscreen-transcript i.bi:hover {
    background-color: #f2f2f2;
    opacity: 0.6;
}
.lum-video-embed i.bi.close-video-transcript {
     display:none;
}
.lum-video-embed .lum-video-transcript-wrap {
    background: lightblue;
    padding: .6rem 1rem;
    margin-top: -.4rem;
    z-index: 101;
  position: relative;
}
.lum-video-transcript-wrap.closed {
    padding: 0 1rem;
}
.lum-video-transcript-wrap.closed .lum-video-transcript {
    display:none;
}
.lum-video-transcript-wrap.open .lum-video-transcript {
    display:block;
    height:300px;
    overflow-y:scroll;
    width: 100%;
}

/** OVERLAY **/
.embed-player-wrap {
    position:relative;
}
.embed-player-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(5px);
}
.lum-video-embed .embed-player-overlay i.bi-play-circle {
    top: 50%;
    position: relative;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 3rem;
    border-radius: 50%;
}
.embed-player-overlay.playing {
    display:none;
}
.lum-video-transcript-controls {
    
}

.fullscreen-transcript {
    position:absolute;
    padding:3rem 6rem;
    top:0;
    left:0;
    width:auto; /* 100vw */
    height:auto; /* 100vh */
    z-index:1001;
    background: lightblue;
    overflow:auto;
    margin: 6rem 4rem;
    -webkit-box-shadow: 0px 0px 218px 58px rgba(48,48,48,1);
    -moz-box-shadow: 0px 0px 218px 58px rgba(48,48,48,1);
    box-shadow: 0px 0px 218px 58px rgba(48,48,48,1);
}
.fullscreen-transcript i.bi.close-video-transcript {
    display:inline-block;
    float:right;
    font-size:2rem;
    margin-top: -0.5rem;
}
.fullscreen-transcript .lum-video-transcript, 
.lum-video-transcript-wrap .lum-video-transcript {
    background: #fff;
    padding: 2rem;
    border-radius: 2rem;  
    text-align: left;
}
.fullscreen-transcript hr, .lum-video-transcript-wrap hr {
    margin-top: 0;
    border-top: 1px solid rgb(255 255 255);
}

@media only screen and (max-width: 280px) {
    .lum-video-embed i.bi, .fullscreen-transcript i.bi, 
    .fullscreen-transcript i.bi.close-video-transcript  {
        margin: 0 0 .5rem 0!important;
        font-size: 1rem;
        padding: .5rem!important;
    } 
}

@media only screen and (min-width: 280px) and (max-width: 767px) {
    .lum-video-embed i.bi, .fullscreen-transcript i.bi {
        width: fit-content;
        margin-right: 0;
    }
    .fullscreen-transcript i.bi.close-video-transcript {
        float: none;
        margin-right: 0;
    }
    .fullscreen-transcript, .lum-video-transcript-wrap {
        text-align: center;
    }
    .fullscreen-transcript .lum-video-transcript,
    .lum-video-transcript-wrap .lum-video-transcript {
        padding: 1rem;
    }
    .lum-video-embed .lum-video-transcript-wrap {
        height: auto;
    }
    .lum-video-title {
        text-align: center;
    }
}

@media only screen and (min-width: 280px) and (max-width: 1024px) {
    .fullscreen-transcript {
        margin: 6rem 0rem;
        padding: 1.5rem
    }
}

@media only screen and (min-width: 280px) {
    .fullscreen-transcript .full-screen-video-transcript {
        display: none!important;
    }
}

