@font-face{font-family: 'cpufont'; src: url('fonts/cpufixed.ttf'); }
@font-face {
    font-family: 'lcdfont';
    src: url('fonts/lcd.eot');
    src: url('fonts/lcd.eot?#iefix') format('embedded-opentype'),
         url('fonts/lcd.woff') format('woff'),
         url('fonts/lcd.ttf') format('truetype'),
         url('fonts/lcd.svg#lcdmono2light') format('svg');
    font-weight: normal;
    font-style: normal;
}

.wrapper { background-color:black; -ms-transform-origin:0 0; -webkit-transform-origin:0 0; -moz-transform-origin:0 0; -o-transform-origin:0 0; transform-origin:0 0; }
#blackness { position: absolute; z-index:11; left:0; top:0; width:100%; height:100%; opacity:1 }
#clearness { position: absolute; z-index:0; left:0; top:0; width:100%; height:100%; opacity:1 }
#loadingbar  { font-family: 'cpufont', monospace; position:absolute; font-size:40px; z-index:12; left:250px; top:250px; height:30px; line-height:30px; text-align: center; color:#00ff00;}
#tvbackground { position:absolute; z-index:1; left:0; top:20px; border: 0 solid black; visibility:hidden}
#hand { position:absolute; z-index:1; left:420px; top:490px; visibility:hidden}
#tvpanel_menu { position:absolute; z-index:4; left:259px; top:480px; cursor: pointer; opacity: 0}
#tvpanel_voldn { position:absolute; z-index:4; left:280px; top:480px; cursor: pointer; opacity: 0}
#tvpanel_volup { position:absolute; z-index:4; left:300px; top:480px; cursor: pointer; opacity: 0}
#tvpanel_chdn { position:absolute; z-index:4; left:321px; top:480px; cursor: pointer; opacity: 0}
#tvpanel_chup { position:absolute; z-index:4; left:341px; top:480px; cursor: pointer; opacity: 0}
#tvled { position:absolute; z-index:4; left:366px; top:464px; visibility:hidden }
#tvledmini { position:absolute; z-index:4; left:393px; top:468px; visibility:hidden }
.led-red { margin: 20px auto; width: 3px; height: 3px; background-color: #f00; border-radius: 50%; }
.led-green { margin: 20px auto; width: 12px; height: 12px; background-color: #0f0; border-radius: 50%; box-shadow: #000 0 -1px 7px 1px, inset #460 0 -1px 9px, #7D0 0 2px 12px; }
#tvknob { position:absolute; z-index:4; left:414px; top:480px; cursor: pointer; opacity:0 }
#tvbuttons { position:absolute; z-index:1; left:690px; top:350px; visibility: hidden; line-height:20px; /*padding:25px 0;*/ margin-bottom:0;}
#tvfilters { position:absolute; z-index:1; left:694px; top:20px; visibility: hidden; background-color: black;} 
#yearfilters  { font-family: 'cpufont', monospace; position:absolute; z-index:1; left:103px; top:534px; height:30px; line-height:30px; text-align: center; visibility:hidden}
span.year  { position:absolute; vertical-align:middle; text-align:center; cursor:default }
#guide  { position: absolute; z-index:10; left:652px; top:528px; visibility:hidden }
#tvstencil { position:absolute; z-index:3; left:0px; top:20px; visibility:hidden }
#myytplayer { position:absolute; z-index:0; width:640px; height:360px; left:30px; top:65px; }
#tvstatic { opacity:0; }
#logo { position:absolute; z-index:4; left:490px; top:424px; visibility: hidden; }
#iconshare { position:absolute; z-index:1; left:696px; top:528px; cursor:pointer; visibility: hidden;}
#iconcomments { position:absolute; z-index:1; left:736px; top:528px; cursor:pointer; visibility: hidden; }
#iconsuggest { position:absolute; z-index:1; left:776px; top:528px; cursor:pointer; visibility: hidden; }
#imgrow { position:absolute; left:0; top:20px; width: 600px; height: auto; overflow: hidden; }
#imgrow img { display: inline; margin: 0 10px; height:90px;}
#prevbtn { position:absolute; left:562px; top:80px; cursor:pointer; z-index:50;}
#prevbtn img { -moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; }
#nextbtn { position:absolute; left:600px; top:80px; cursor:pointer; z-index:50; }
#chanheader { position:absolute; font-size: normal; font-weight: bold; color: green; left:0; top:0; width:640px; text-align: center; white-space: nowrap; }
#tagline { position:absolute; font-size: small; color: white; left:30px; top:114px; width:610px; text-align: center; }
#refreshbtn { position:absolute; left:560px; top:40px; }
#debug  { font-family: monospace; position:absolute; font-size: small; z-index:50; color:white; left:1400px; top:20px; height:10px; width:750px; line-height:10px; text-align: left; }
#helpback { position: absolute; z-index:4; left:150px; top:90px; visibility: hidden; }
#help  { font-family: 'cpufont', monospace; position:absolute; z-index:4; color:#00ff00; left:180px; top:100px; height:300px; width:480; line-height:20px; text-align: left; }
#status  { font-family: 'cpufont', monospace; position:absolute; z-index:4; color:#00bb00; left:20px; top:40px; height:30px; width:658px; line-height:30px; text-align: center; }
#remotestatus  { font-family: 'cpufont', monospace; position:absolute; z-index:4; color:#00ff00; left:690px; top:566px; height:30px; width:130px; line-height:30px; text-align: center; }
#welcome { position:absolute; z-index:4; left:8px; font-size: 13px; color: white; top:563px; width:674px; text-align: center; visibility:hidden}
#credit { position:absolute; z-index:4; left:8px; font-size: small; color: #323232; top:602px; width:674px; text-align: right; visibility:hidden; }

#credit a:link { text-decoration: none; color: #bbbbbb; } 
#credit a:visited { text-decoration: none; color: #bbbbbb; } 
#credit a:hover { text-decoration: none; color: #bbbbbb; } 
#credit a:active { text-decoration: none; color: #bbbbbb; } 

#lcdbar { font-family: 'lcdfont'; line-height:20px; font-size: normal; text-shadow: 0 0 10px green; font-weight:bold; position: absolute; z-index:4; color: green; left:8px; top:563px; width:674px; text-align: center; white-space: nowrap; overflow: hidden; visibility:hidden; }
#channellabel { position:absolute; width:200px; }
h2 { position: absolute; color:#00ff00; z-index:10; left: 316px; top: 56px; width: 250px; opacity:0.7; text-shadow: 0 0 10px green; font-family: "Arial", Courier, monospace; font-size: large; user-select: none; -webkit-user-select: none; -moz-user-select: none; text-align:right justify; direction:rtl; }

html { background-color: black; }
body { background-color: black; overflow: hidden; }

button.tvremote {
	font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #000000; width: 100px; padding: 4px 20px; background-color: #707070; 
	outline: none; /* remove chrome's orange border on active button */
	-moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; border: 1px solid #000000; 
	-moz-box-shadow: 0 1px 3px rgba(000,000,000,0.5), 
	inset 0 0 1px rgba(255,255,255,0.7); 
	-webkit-box-shadow: 0 1px 3px rgba(000,000,000,0.5), 
	inset 0 0 1px rgba(255,255,255,0.7); box-shadow: 0 1px 3px rgba(000,000,000,0.5), 
	inset 0 0 1px rgba(255,255,255,0.7); text-shadow: 0 -1px 0 rgba(000,000,000,0.4), 0 1px 0 rgba(255,255,255,0.3);
	position:inherit;
	cursor:pointer;
    overflow: visible;
    padding: 0 0;
}

input[type=checkbox].css-checkbox { font-family: Arial, sans-serif; position: absolute; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0; color:grey; font-size: small; }

input[type=checkbox].css-checkbox + label.css-label { font-family: Arial, sans-serif; padding-left:20px; height:15px; display:inline-block; line-height:15px; background-repeat:no-repeat; background-position: 0 0; font-size:15px; vertical-align:middle; cursor:pointer; color:grey; font-size: small; }

input[type=checkbox].css-checkbox:checked + label.css-label { font-family: Arial, sans-serif; background-position: 0 -15px; color:green; font-size: small; }

.css-label{ background-image:url(img/dark-check-cyan.png); }

a { color: cyan; }

#tubeglow { position:absolute; left:116px; top:68px; width: 464px; height: 350px; z-index:50; text-align: center; text-indent: .1em; }

.tvremotebackground {
	border-style: solid;
	border-width: 3px;
	border-color: rgb( 200, 200, 200 );
	border-radius: 10px;
	background-image: -moz-linear-gradient( 90deg, rgb(125,125,125) 0, rgb(206,206,206) 49%, rgb(175,175,175) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(125,125,125) 0, rgb(206,206,206) 49%, rgb(175,175,175) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(125,125,125) 0, rgb(206,206,206) 49%, rgb(175,175,175) 100%);
	position: absolute;
	box-shadow: 10px 10px 5px rgba(0,0,0,.5);
	width: 120px;
	height: 210px;
}

ul { list-style-type: none; padding: 0; padding-left: 6px; margin: 0; }
ul li { padding: 3px; }

/*feature*/

.tvchanbtn { width: 40px; height: 18px; position: relative; left: 10px; z-index: 1; background-color: black; -webkit-border-radius: 50% / 10%; border-radius: 50% / 10%; padding: 3px; vertical-align: middle; float: left; }
.tvchanbtn:before { content: ''; position: absolute; top: 10%; z-index: 1; bottom: 10%; right: -5%; left: -5%; background: inherit; -webkit-border-radius: 5% / 50%; border-radius: 5% / 50%; }
.tvchanbtn a:link { text-decoration: none; color: white; } 
.tvchanbtn a:visited { text-decoration: none; color: white; } 
.tvchanbtn a:hover { text-decoration: none; color: #00dd00; } 
.tvchanbtn a:active { text-decoration: none; color: white; } 
.tvchanlabel { position: relative; z-index: 3; text-align: center; vertical-align: middle; font-family: "Lucida Console", Monaco, monospace; font-size: 14px; font-weight: bold; }
.tvchandesc { float: left; margin-top: 4px; margin-left: 18px; font-size: 14px; }

@font-face {
    font-family: 'bb';
    src: url('fonts/bb.eot');
    src: local('☺'), url('fonts/bb.woff') format('woff'), url('fonts/bb.ttf') format('truetype'), url('fonts/bb.svg') format('svg');
    font-weight: normal;
}

#featurehdr { font-family:'bb',Sans-Serif; font-size: 16px; text-align:left; margin-left: 8px; }
#featurebox { position: absolute; left: 860px; top: 22px; background-color: white; padding: 5px; width: 220px; visibility: hidden }
#featureimg { width: 200px; height: auto; padding: 10px; }