

.epg_body{
    display:flex;
    background-color: #000000;
    //border-collapse: collapse;
    // margin-left: 10vw;
    //width: calc(100vw - 3vw - 8px);
    //height: 20%;
}

.epg_left{
    display:flex;
    flex-direction: column;
    width: 50vh;
    height:100vh;

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


    /*  display: flex;
    flex-direction: column;
    flex-grow: 1;
    flex-shrink: 1;
    justify-content:space-between;
    flex-wrap:nowrap;
    width:0;
flex:0.5;*/
    //overflow-y:hidden;
}

#epg_events_list{
    height:auto ;
    width:auto;
    flex-grow: 1;
    flex-shrink: 1;
    flex-wrap:nowrap;

    overflow-x: hidden;
    overflow-y: scroll;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */

    padding:0.3vh;

}

#epg_events_list::-webkit-scrollbar {
    display: none;
}


.T_epgsimple_event {
    display:flex;
    flex-wrap: nowrap;
    height: calc(100%/15.6);
    height: fit-content;
    padding: 1.4vh;
    margin: 0.3vh;



}

.T_epgsimple_event #ev_start {
    color:white;
    font-size: 2.9vh;

    color: #AAAAAA;
    font-weight: bold;
    //padding-left: 0.5vw;
    // align-self:center;
}

.T_epgsimple_event #ev_desc_collum {
    // background-color: blue;
}

.T_epgsimple_event #ev_title {
    text-align: left;
    font-size: 2.9vh;

    font-weight: bold;
    padding-left: 1.2vw;
    width:90%;

    align-self:center;
    line-height:1.1em;
    min-height:1.3em;
    /*  white-space: nowrap;
      text-overflow: ellipsis;
      overflow:hidden; */
}

.T_epgsimple_event #ev_canplay {

    background-color: transparent;
    font-size: 2.2vh;
    align-self:center;
    object-fit: cover;
    height: 3vh;

    //width: auto;
    //height: auto;

}




.epg_right{
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    flex-shrink: 1;
    justify-content:space-between;
    flex-wrap:nowrap;
    width:0;
    //important to fill rest space
}

.epg_right_c1 {
    background-color: #252525;
    display: flex;
    flex-direction: row;
    width:100%;
    height: 8%;
  /*  flex-grow: 1;*/
    flex-shrink: 1;
   /* padding-left: 0.5vw;*/
    align-items: center;
  /*  margin-bottom: 1vh;*/
}



.epg_right_c1 #ev_channel_image{
    height: 90%;
    border-radius: 4px;
    // width:calc(4.5vw + 0px);
    //padding-left: 1vw;
    width:0;
}

.epg_right_c1 #ev_channel_name{
    color:var(--color_matelko-lcn);
    font-weight: bold;
    font-size: 4vh;
    font-size: calc((3vh + 3vw)/2);
    margin-left: 0.5vw;
    flex:0.33;

}

.epg_right_c1 #ev_date{
    //margin-left: 150px;
    text-align: center;
    flex:0.33;
    height: auto;
    
    // background-color: red;


    //background-color: red;
    //width:min-content;
}

.epg_right_c1 #ev_channel_lcn{
    color:var(--color_matelko-lcn);
    font-weight: bold;
    font-size: 5vh;
    font-size: calc((3vh + 3vw)/2);
    text-align: right;

    border-radius: 0.5vh;
    padding: 1vh;
    margin-right: 1vw;
    flex:0.33;
    // flex-wrap: wrap;
}

.epg_right_c2 {
    display: flex;
    width:100%;
    height: 92%;

    flex-direction: row;
    flex-grow: 1;
    flex-shrink: 1;

    justify-content:space-between;
    flex-wrap:nowrap;

    text-align: center;
    margin:auto;
    line-height: 100%;
    //margin:0.3vh;


    // flex-wrap: wrap;
}

.epg_right_div3 {
    display: flex;
    flex-direction: column;
    background-color: #252525;
    //height: 1%;
    //flex-grow: 0;
    //flex-shrink: 0;
    // flex-wrap:nowrap;
    background-color: red;
}


#epg_button_prev{
    height: auto;
    width:auto;
    flex-grow: 1;
    flex-shrink: 1;
    flex: 0;
    width:5%;
    display: none;
}

#epg_button_next{
    height: auto;
    width:auto;
    flex-grow: 1;
    flex-shrink: 1;
    flex: 0;
    width:5%;
    display: none;
}



.epg_right_details{
    /* background-color: #506050;*/
    display: flex;
    flex-direction: column;
    height: 100%;
    width:100%;

    flex-grow: 1;
    flex-shrink: 1;
}

.epg_right_details #ev_image_div{
    /*background-color: #905050;*/

    display:flex;
    flex-grow: 1;
    flex-shrink: 1;
    width: 100%;
    height:0;
    align-items: center;
    margin: auto;
    justify-self: center;
}
.epg_right_details #ev_image {
    width:100%;
    height: 100%;
    object-fit: contain;
    margin: auto;
}
.epg_right_details #ev_description{
    flex-grow: 0;
    flex-shrink: 1;
    background-color: #151515;
    color: #AAAAAA;


    margin: 1vh 0vh 1vh 0vh;
    white-space: normal;
    text-overflow: ellipsis;
    padding: 1vh;
    font-size: 2.5vh;
    font-size: calc((1.5vh + 1.5vw)/2);

    box-sizing:border-box;

    height: 15%;

}

.epg_right_details #epg_menu_buttons{
    display:flex;
    height: fit-content;
    border-collapse: separate;
    border-spacing: 12px;
    height: fit-content;
	padding: 3px 3px 3px 3px;
}


.epg_dateswitch_button_text{
    writing-mode: vertical-rl;
    transform: rotate(-0.25turn);

    height: 100%;
    /*  overflow: scroll; */
    padding: 0px;
    margin: 0px;
    /* margin-left: -6px;*/
    font-size: 4vh;
          font-size: calc((3vh + 3vw)/2);
    font-weight: bold;

    vertical-align: middle;
    line-height: 1.4;
    color: var(--color_matelko-lcn);
}
