


#cover, #jitsicover, #supercover {
    position: fixed;
    background-color: rgba(0,0,0,0.5);
    z-index: 900;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;  
}

#chatmenu .close, 
.dialog .close, 
.ucho_zive_vysilani .close {
    position: absolute;
    top: 10px;
    right: 10px;
    background-image: url('/img/close_small.png');
    width: 20px;
    height: 20px;
    cursor: pointer;
}

#chatmenu .close:hover, 
.dialog .close:hover {
    background-image: url('/img/close_small_on.png');
}



a.bublina {
	text-decoration: underline; 
	font-weight: 300;
	cursor: pointer;
	font-size: 14px;
}
	
.dialog {
    color: black; 
    background-color: rgba(255,255,255,1);    
    padding: 40px; 
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;  
 
    -webkit-box-shadow: 0px 0px 69px -34px rgba(255,255,255,1);
    -moz-box-shadow: 0px 0px 69px -34px rgba(255,255,255,1);
    box-shadow: 0px 0px 69px -34px rgba(255,255,255,1);
    overflow: auto;
    max-width: 800px;
	width: 95%; 
    max-height: 95%;
    position: fixed;
    top: 50%;  /* position the top  edge of the element at the middle of the parent */
    left: 50%; /* position the left edge of the element at the middle of the parent */
    transform: translate(-50%, -50%); /* This is a shorthand of
                                         translateX(-50%) and translateY(-50%) */
    z-index: 1000;                                         
}



.button {
  display: inline-flex; align-items: center; justify-content: center;
  padding: .7rem 1.1rem; border-radius: 999px; text-decoration: none;
  font-weight: 600; font-size: .95rem; line-height: 1; border: 2px solid transparent;
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.button:active { transform: translateY(1px) scale(.99); }

.button {
  display: inline-flex; align-items: center; gap: 10px;
  padding: .9rem 1.3rem; border-radius: 999px; 
  background: var(--blue); color: #fff; text-decoration: none; font-weight: 700; 
  border: 2px solid transparent; transition: transform .15s ease, box-shadow .2s ease, background .2s ease;
  cursor: pointer;
}
.button:hover { box-shadow: 0 10px 22px rgba(0,0,0,.18); }
.button:active { transform: translateY(1px) scale(.99); }

.zobrazit_muj_program {
	display: none; 
}

.box_prednasky {
	margin-bottom: 30px; 
}

.stream_but {
	padding: 7px;
	padding-left: 20px;
	background-color: white;
	display: inline-block;
	height: 56px;

	-webkit-border-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-moz-border-radius: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomright: 10px;
	border-radius: 10px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	color: rgba(15,76,129,1);
	border: 2px solid rgba(15,76,129, 1);
	font-size: 15px;
	vertical-align: bottom; 
	margin: 5px;
	text-align: right;
	width: 135px;
	cursor: pointer;
	position: relative;
	line-height: 20px;
	font-weight: 500;
	box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.27);
	
}

#streaming_status_1 div {
	font-weight: 600;
}

.stream_but_live {
	color: rgba(0,128,0,1);
	border: 2px solid rgba(0,128,0, 1);
}

.stream_but_live.active {
	color: rgba(0,128,0,1);
	border: 2px solid rgba(0,128,0,1);
}


.stream_but div {
	font-size: 60px;
	line-height: 15px;
	position: absolute;
	left: 10px;
	top: 19px;
	color: #0F4C81;
	display: none; 
}

.stream_but img {
	height: 30px; 
	position: absolute; 
	left: 9px; 
	top: 11px; 
	display: none;
}

.streaming_status {
	-webkit-border-top-left-radius: 30px;
	-webkit-border-top-right-radius: 30px;
	-moz-border-radius-topleft: 30px;
	-moz-border-radius-topright: 30px;
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
	background-color: #F0F2F5;
	width: 100%;
	max-width: 1000px;
	border: 1px solid silver; 
	border-bottom: none; 
	padding: 10px; 
	text-align: left; 
}

#stream_but_1 {
	color: red; 
	border: 2px solid red;
}

.stream_but_1_active {
	color: white !important; 
	background-color: red;
	bottom: -3px;
	right: -3px; 
	box-shadow: inset 5px 5px 5px 0px rgba(0,0,0,0.27); 
}

#stream_but_2 {
	color: #6C3483; 
	border: 2px solid #6C3483;
}

.stream_but_2_active {
	color: white !important; 
	background-color: #6C3483;
	bottom: -3px;
	right: -3px; 
	box-shadow: inset 5px 5px 5px 0px rgba(0,0,0,0.27); 
}

#stream_but_3 { 
	color: rgba(15,76,129, 1);
	border: 2px solid rgba(15,76,129, 1);
}

.stream_but_3_active {
	color: white !important; 
	background-color: rgba(15,76,129, 1);
	bottom: -3px;
	right: -3px; 
	box-shadow: inset 5px 5px 5px 0px rgba(0,0,0,0.27);
}

#stream_but_4 { 
	color: green;
	border: 2px solid green;
}

.stream_but_4_active {
	color: white !important; 
	background-color: green;
	bottom: -3px;
	right: -3px; 
	box-shadow: inset 5px 5px 5px 0px rgba(0,0,0,0.27);
}


.streaming_status span {
	font-weight: 500;
}

.streaming_info_probiha {
	color: white;  
	padding: 5px 10px; 
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	display: inline-block; 
	font-size: 14px;
	font-weight: 500;
	margin-left: 10px; 
}

.bill1 {
    font-weight: 500;
    font-size: 40px;
    line-height: 95px; 
}

      @media only screen and (max-width: 400px) {      
        .bill1 {
            font-weight: 500;
            font-size: 40px;
            line-height: 45px;
            margin-bottom: 35px;  
        }      
      }

.bill2 {
    font-size: 25px;
    line-height: 35px; 
}



.bill3 {
    font-size: 18px;
    line-height: 35px; 
}

.bill2 strong, .bill3 strong {
    font-size: inherit;
    line-height: inherit;
    font-weight: 500;
}

.program_nazev, .program_popis {
	line-height: 25px; 
	margin-bottom: 10px;
	margin-top: 6px; 
}

@media only screen and (max-width: 600px) {
  .program_nazev {
	margin-top: -1px;
  }
}


.bookmark {
    cursor: pointer; 
    display: block;      
    width: 47px; 
    height: 40px; 
    background-image: url('/img/bookmark_off.png');
}

.bookmark_on {
    background-image: url('/img/bookmark_on.png');
}

.bookmark:hover,
.bookmark_on:hover
{
    filter: brightness(150%);  
}

.sbookmark {
    cursor: pointer; 
    display: block;      
    width: 29px; 
    height: 25px; 
    background-image: url('/img/ikony/small/bookmark_off.png');
}

.sbookmark_on {
    background-image: url('/img/ikony/small/bookmark_on.png');
}

.sbookmark:hover,
.sbookmark_on:hover
{
    filter: brightness(150%);  
}


@media only screen and (max-width: 700px) {
  .lista .button {   
      width: 114px !important; 
      padding: 7px 5px;
      font-size: 15px;
      font-family: 'Roboto Condensed', Arial Narrow Arial;
      text-align: center; 
  }
  
  .lista .inside {  padding: 5px; }
  .bookmark { width: 29px; height: 25px; margin-top: 2px; background-image: url('/img/ikony/small/bookmark_off.png?v=1');}  
  .bookmark_on { background-image: url('/img/ikony/small/bookmark_on.png?v=1');}    
}


.proggrid {
    display: grid;
    grid-template-columns: 150px 1fr;
    grid-gap: 0.3rem;
}


@media (max-width: 700px) {
	.proggrid {
		display: block;
		
	}
}