@charset "UTF-8";
/* CSS Document */
.video-container {
    position: relative;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 2fr 1fr;
    overflow: hidden;
    /* border: 2px solid red; */
} 
    
    @media (max-width: 992px) {
.video-container {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(1,1fr);
    overflow: hidden;
}  
    }  
#vidplaylist {
    display:table;
}
ul#vidplaylist {
    padding-left: 0;
}    
#vidplaylist li{
    cursor:pointer;
    padding:8px;
    list-style: none;
}
    
#vidplaylist li::before {
    content: '\f01d';
    font-family: FontAwesome;
    color: #dcdee1;
    margin-right: 15px;
    font-size: 20px;
}    

#vidplaylist li:hover{
background-color: rgba(255,204,63,0.3);
    }
#videoarea {
    width: 100%;
    height: auto;
    border: 1px solid silver;
    position: relative;
    overflow: hidden;
} 
    .playlist-wrapper {
    position: relative;
    height: 100%;
    margin: 0 0 0 0px;
    }

 @media (min-width: 992px) {  
         .playlist-wrapper {
    position: relative;
    height: 100%;
    margin: 0 0 0 20px;
    }
        }