.tv_body{
    display:flex;
    background-color: #000000;
    height:100%;
    width:100%;
    //border-collapse: collapse;
    // margin-left: 10vw;
    //width: calc(100vw - 3vw - 8px);
    //height: 20%;
}
/*@media only screen and (max-width: 640px){
    .tv_body {
        display: none;
    }
}
@media only screen and (max-height: 480px){
    .tv_body {
        display: none;

    }
}*/

.tv_body_lowRes_container{
    display: none;
    visibility:hidden;
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 100%;
}
@media only screen and (max-width: 640px){
    .tv_body_lowRes_container {
        display: table;
        visibility: visible;
    }
}
@media only screen and (max-height: 480px){
    .tv_body_lowRes_container {
        display: table;
        visibility: visible;
    }
}

.tv_body_lowRes{
    display: none;
    visibility:hidden;
    padding: 20px;
    font-size: 4vw;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    line-height: 1.5;
    color: rgba(190,120,0,1);
}
@media only screen and (max-width: 640px){
    .tv_body_lowRes {
        display: table-cell;
        visibility: visible;
    }
}
@media only screen and (max-height: 480px){
    .tv_body_lowRes {
        display: table-cell;
        visibility: visible;
    }
}



.tv_left{
    display:flex;
    width:calc( 39vh );
    //width:500px;
    /*width:calc((60 / 160)* 100vh );*/
    height:100%;

    flex-grow: 0;
    flex-shrink: 0;

    overflow-y:hidden;
    //width:23vw;

    // flex:50;
    //flex:5;
    //display: inline;
    //width: 30vw;
    // height:200px;
    //height: 100vh;

    /* border: solid 1px red; */
}

.tv_right{
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    flex-shrink: 1;
    justify-content:space-between;
    flex-wrap:nowrap;

    width:0;
    //    height:99.8vh;

    //max-height:100vh;
    // min-height:100vh;

    //width:0 !!!


    //column-width: 50px;
    // max-width: calc(100vw - 500px);

    //position:static;
    //right:0%;

    /*display: table;
    flex-direction: column;
    justify-content: flex-end;
    //float: left;
    flex-grow: 1;
    flex-shrink: 1;

    width:100%;
    height:auto;*/
    // height:99vh;
    //  height:20vh;
    //background-color: #FF2000FF;
    // gap: 200px; 
    //width:77vw;
    //flex:100;
    //display: table-cell;
    /*width: calc(80vw - 78px);
    height: 100%;*/
    //vertical-align: top;
    /* border: solid 1px blue; */
}

.tv_list{
    // width: calc(23vw + 20px);  
    //height:  calc(100vh);
    height: 100%;
    width:100%;
    padding: 0.4vh;
    padding-top: 0px;
    border-radius: 0.5vh;
    border: solid 1px rgba(40,40,40,1);
    background-color: rgba(16,16,16,1);
    overflow-x: hidden;
    overflow-y: scroll;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */

}

.tv_list::-webkit-scrollbar {
    display: none;

}

.tv_stream_container{
    justify-self: center;
    padding:10px;
    height:100%;
    background-color: #000000;
    //background-color: #8BC34A;
}

.tv_stream{
    display:flex;
    height:100%;
    width:100%;
    text-align: center;
    vertical-align: middle;
    // padding: 10px;
    //background-color: #000000;
}


.tv_right_menu_container{
    display: table;
    /*visibility: collapse;*/
    //justify-self: flex-end;
    // position:relative;
    //  bottom: 0%;
    // width: calc(100% - 2px); 
    width:100%;
    height:auto;
    // float:bottom;
    text-align: center;
    vertical-align: middle;
    overflow-x: hidden;
    // height: calc(10vh - 12px);
    /* padding: 12px; */
    /* padding-right: 0px; */

    /* border: solid 1px green; */
}

.tv_right_menu{
    height: 100%;
    vertical-align: middle;
}

.tv_right_menu_buttons{
    display:flex;
    height: fit-content;
    border-collapse: separate;
    border-spacing: 12px;
}



#tv_button_numkeyboard {
    // display: flex;
    width:2.3vw;
    height: auto;
    flex-grow: 0;
    // padding: 0px;


    //reset padding from tv_button class override
}

#tv_button_numkeyboard_img {
    width:inherit;
    height:  auto;
    flex-grow: 0;
    // margin: 0px;
    padding: 0px;
    //reset padding from tv_button class override
    // border: solid 0.3vh rgba(40,40,40,1);
}
/*.tv_right_menu_btn:hover{
    width: calc(25vw - 6px);
    height: calc(9vh - 30px);
    background-color: rgba(70,140,210,0.3);
    // background-color: rgba(80,140,140,0.3); 
    border: solid 4px rgba(80,140,140,1);
}*/

/*.tv_right_menu_btn_hover{
    width: calc(25vw - 6px);
    height: calc(9vh - 30px);
    background-color: rgba(70,140,210,0.3);
    // background-color: rgba(80,140,140,0.3); 
    border: solid 4px rgba(80,140,140,1);
}*/


.tv_loading{
    animation-name: pulsing;
    animation-duration: 0.4s;
    animation-timing-function: ease-out;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-play-state: running;
}

@keyframes pulsing {
    0% {
        transform: scale(.9);
    }
    100% {
        transform: scale(1.0);
    }
}

.fadeOut {
    opacity: 1;
    animation: fadeOutAnim 1s forwards;
}


@keyframes fadeOutAnim {
    0%, {
        opacity: 1
    }
    100% {
        opacity: 0;
        visibility: hidden;
    }
}


/* Could Use thise as well for Individual Controls */
video::-webkit-media-controls-play-button {
}
video::-webkit-media-controls-volume-slider {
}
video::-webkit-media-controls-mute-button {
}
video::-webkit-media-controls-timeline {
}
video::-webkit-media-controls-current-time-display {
}

.player_video_wrapper{
    z-index:5000;
}

.player_video{
    height:inherit;
    width:inherit;
    margin-bottom:-11px;
}

player_video::-webkit-media-controls {
    display: none;
}

.tv_remote_number{
    font-size: 15vh;
    font-weight: bold;

    right:5vw;
    top:15vh;
    z-index: 10001;
}













/*.tv_video_wrapper.fullscreen{
    background-color : #000000;
    position : fixed;
    left : 0px;
    top : 0px;
    width : 100%;
    height : 100%;
}*/