body, html {
	width: 100%;
	max-width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	font-family: system-ui, sans-serif;
}

img {
	border: none;
}

#container {
	width: 100%;
	min-height: 100%;
	margin: 0px;
	padding: 0px;
	background-color: #FFFFFF;
	float: left;
	/*min-width: 1050px;*/
}

/* html5 elements */
article, aside, figure, footer, header, hgroup, menu, nav, section { display: block; }

.cannel-row {
	width: 100%;
}

.channel {
	display: inline-block; 
	float: left;
	position: relative;
	background: linear-gradient(to right, #E0F3FF 39px, transparent 39px, transparent 100%);
}

.channel section, .channel article {
	display: inline-block;
}

header.channel-name {
	background-color: #fff;
}

header.channel-name .h2 {
	text-indent: -1000px;
	overflow: hidden;
	display: inline-block;
	width: 100%;
	height: 40px;
	background-position: center center;
	background-repeat: no-repeat;
	margin: 0px;
}
.program {
	width: 100%;
	white-space: nowrap;
	float: left;
	font-size: 12px;
	display: table !important;
	text-align: left;
}

.program .show-trailer  img{
	vertical-align: middle;
}

.program  .show-trailer {
	margin-left: 5px;
}

.daypart-block {
	border-style: solid;
	border-color: #cccccc;
	border-width: 0px 0px 1px 0px;
	width: 100%;
	float: left;
}

.program .program-title {
	white-space: normal;
	display: table-cell;
	padding: 2px 0px 2px 8px;
	width: 100%;
}

.program .program-title , .program .start-time {
	text-align: left;
	vertical-align: top;
}

a.program-name {
	white-space: normal;
	text-decoration: none;
	color: #000000;
}

a.program-name:hover {
	text-decoration: underline
}

.program .start-time {
	/*padding-right: 10px; */
	/*margin-right: 10px; */
	/*background-color: #E2E2E2;*/
	/*font-weight: bold;*/
	display: table-cell;
	float: left;
	padding: 2px 0px 2px 4px;
	width: 34px;
}
.program.running .start-time {
	background-color: #aadfff;
}

.program.running {
	background-color: #bfe8ff;
	font-weight: bold;
}

.program .movie {
	font-weight: bold;
	background-color: #FDD1EC !important;
}

a.pt-imdb:hover{
	-moz-opacity: 1.0 !important; 
	opacity: 1.0 !important;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important;
	filter: alpha(opacity=100) !important;
}

#program-table {
	margin-top: 10px;
}

nav#mobile-navi {
	display: inline-block;
	float: left;
	/*margin-bottom: 10px;*/
	background: linear-gradient(to top, #414141 0%, #292929 100%);
	width: 100%;
	height: 45px;
	position: relative;
}

h1#mobile-logo {
	width: 156px;
	height: 35px;
	display: inline-block;
	background-image: url('../images/iltapulu_logo_white.png');
	text-indent: -1000px;
	overflow: hidden;
	position: absolute;
	top: 5px;
	left: 50%;
	margin: 0px 0px 0px -77px;
	background-size: contain;
	background-repeat: no-repeat;
}

.css-arrow-right {
	width: 0;
	height: 0;
	border-top: 13px solid transparent;
	border-bottom: 13px solid transparent;
	border-left: 17px solid #fff;
}

.css-arrow-left {
	width: 0;
	height: 0;
	border-top: 13px solid transparent;
	border-bottom: 13px solid transparent;
	border-right: 17px solid #fff;
}

:focus{
   outline:0;
}

[data-channelid="1"] .h2 {background-image: url('../images/yle_tv1.webp');}
[data-channelid="2"] .h2 {background-image: url('../images/yle_tv2_1.webp');}
[data-channelid="3"] .h2 {background-image: url('../images/mtv3_1.webp');}
[data-channelid="4"] .h2 {background-image: url('../images/nelonen.webp');}
[data-channelid="6"] .h2 {background-image: url('../images/sub.webp');}
[data-channelid="7"] .h2 {background-image: url('../images/jim.webp');}
[data-channelid="11"] .h2 {background-image: url('../images/yle_teema_fem_1.webp');}
[data-channelid="8"] .h2 {background-image: url('../images/fox.webp');}
[data-channelid="5"] .h2 {background-image: url('../images/tv5.webp');}
[data-channelid="13"] .h2 {background-image: url('../images/liv.webp');}
[data-channelid="10"] .h2 {background-image: url('../images/ava.webp');}
[data-channelid="73"] .h2 {background-image: url('../images/hero.webp');}

.dark [data-channelid="1"] .h2 {background-image: url('../images/yle_tv1_1.webp');}
.dark [data-channelid="2"] .h2 {background-image: url('../images/yle_tv2.webp');}
.dark [data-channelid="3"] .h2 {background-image: url('../images/mtv3.webp');}
.dark [data-channelid="4"] .h2 {background-image: url('../images/nelonen_1.webp');}
.dark [data-channelid="6"] .h2 {background-image: url('../images/sub_1.webp');}
.dark [data-channelid="7"] .h2 {background-image: url('../images/jim_1.webp');}
.dark [data-channelid="11"] .h2 {background-image: url('../images/yle_teema_fem.webp');}
.dark [data-channelid="8"] .h2 {background-image: url('../images/fox_1.webp');}
.dark [data-channelid="5"] .h2 {background-image: url('../images/tv5_1.webp');}
.dark [data-channelid="13"] .h2 {background-image: url('../images/liv_1.webp');}
.dark [data-channelid="10"] .h2 {background-image: url('../images/ava_1.webp');}
.dark [data-channelid="73"] .h2 {background-image: url('../images/hero_1.webp');}

.channel .h2 {background-size:auto 29px}

.imdb {font-size:10px}

.imdb .imdb-t,
.imdb .imdb-r {
  padding: 0 2px;
  display: inline-block;
  font-weight: bold;
}

.imdb .imdb-t {
  background-color: #f5c518;
  color: #000;
}

.imdb .imdb-r {
  color: #000;
  background: #fff;
}

.imdb:hover {
  opacity: 1;
}


.dark	#container {
		background-color: #1E1C1F;
		color: #DCDCDD;
	}

	.dark	.channel {
		background: linear-gradient(to right, #282828 39px, transparent 39px, transparent 100%);
	}

	.dark	header.channel-name {
		background-color: #1E1C1F!important;
	}

	.dark	nav#mobile-navi {
		background: linear-gradient(to bottom, #464646 0%, #343434 100%);
	}

	.dark	.daypart-block {
		border-color: #4B4B4B;
	}

	.dark	a.program-name {

		color: #DCDCDD!important;
	}
	.dark	a.program-name:hover {
	
		color: #fff!important;
	}

	.dark	.program .movie  {
		background-color: #931c65 !important;
		color:#fff!important;
	}
	
	.dark	.program .movie a.program-name {
		color:#fff!important;
	}

	.dark	.program.running .start-time {
		background-color: #1c648a;
		color:#fff;
	}

	.dark	.program.running {
		background-color: #1c648a;
	}



	.dark	.program.running a.program-name {
		color:#fff!important
	}