/*******************************
 *                             *
 *      Made by Kadgar34       *
 *                             *
 *                             *
 *******************************/

body {background: #000; margin:0px;padding:0px;height:100%; overflow-x: hidden} 
html {height:100%}
img { border: 0px none; vertical-align: top; }

.stream { position: absolute }

.menubox {font-family: Arial, sans-serif; color: #fff; font-size: 11px; white-space: nowrap; background: #000; clear: both; position: absolute; font-family: Arial, sans-serif; background: #000; clear: both; z-index: 100; }
.menuitem { display: block; height: 20px; }
.menutext { display: inline-block; padding-left: 3px; cursor: pointer; }

/*.title { position: absolute; top: 0px; left: 0px; padding:10px; background: rgba(0,0,0,.6); color: #fff; font-family: 'Passion One', serif; text-shadow: rgba(0,0,0,.4) 0 1px 0; font-size: 10pt; }*/
.title { position: absolute; z-index: 100; padding: 10px; color: #fff; font-family: 'Open Sans Condensed', sans-serif; text-shadow: rgba(0,0,0,.4) 0 1px 0; background: rgba(0,0,0,.7); font-size: 16pt; font-weight: bold }
.viewers { background-color: #282828; position: absolute; z-index: 0; color: #fff; font-family: Arial, sans-serif; font-size: 10pt; text-align: right; }
path { fill: red; }
.onlineicon { float: left; position: absolute; margin-left: -18px; }

.hovertext { font-family: Arial, sans-serif; color: #fff; font-size: 11px; white-space: nowrap; background: #000; clear: both; position: absolute; font-family: Arial, sans-serif; background: #000; clear: both; z-index: 100; padding: 5px; top: -25px; left: -20px }

.chatoverlay { text-shadow: rgba(0,0,0,.4) 0 1px 0; background: rgba(185,163,227,.2); min-width: 5px; min-height: 5px; z-index: 100; padding: 1px; clear: both}
.chatoverlay:hover { background: rgba(0,0,0,.6); }

.video { z-index: 100 }
.videooverlay { position: absolute }
.videoref { position: absolute }
.videoref:hover { fill: #B9A3E3 }
.removebutton { position: absolute }
.infobutton { position: absolute; }
.chatswap { position: absolute; }
.addbutton { position: absolute; cursor: pointer }

svg:hover { fill: #B9A3E3; }

.menu { position: absolute; color: #fff; width: 50px; height: 50px; }
.menubtn { position: absolute; color: #fff; width: 50px; height: 50px; z-index: 9999;}

.refreshvid, #refreshvid a { width: 18px; height: 18px; display: block; }
/*.refreshvid { background: url('spritesheet.png') -3px -21px; }
.refreshvid:hover { background: url('spritesheet.png') -3px -3px; }
.refreshvid:active { background: url('spritesheet.png') -3px -40px; }*/

/*.chathide { padding: 0px; width: 18px; height: 18px; display: block; background: url('spritesheet.png') -40px -21px; clear: both}
.chathide:hover { background: url('spritesheet.png') -40px -3px }
.chathide:active { background: url('spritesheet.png') -40px -40px }*/


/*.addbutton:hover { position: absolute; background: url('spritesheet.png') -59px -2px }
.addbutton:active { position: absolute; background: url('spritesheet.png') -59px -41px }*/

/*.remove { padding: 0px; width: 18px; height: 18px; display: block; background: url('spritesheet.png') -40px -21px; clear: both}
.remove:hover { background: url('spritesheet.png') -40px -3px }
.remove:active { background: url('spritesheet.png') -40px -40px }*/

/*.info { padding: 0px; width: 18px; height: 18px; display: block; background: url('spritesheet.png') -76px -22px; clear: both}
.info:hover { background: url('spritesheet.png') -76px -2px }
.info:active { background: url('spritesheet.png') -76px -41px }*/

/*.chatswap { padding: 0px; width: 18px; height: 18px; display: block; background: url('swap2.png') 0px -24px;}
.chatswap:hover { background: url('swap2.png') 0px 0px; }
.chatswap:active { background: url('swap2.png') 0px -48px; }*/

#addstream { padding: 10px; background: #fff; font-family: 'Georgia', sans-serif; }
#error { position: absolute; top: 0px; left: 0px; z-index: 9999; padding: 10px; background: #fff; font-family: 'Georgia', sans-serif; }

.chathide { padding: 0px; width: 18px; height: 18px; display: block; background: url('spritesheet.png') -40px -21px; z-index: 100; clear: both}
.chathide:hover { background: url('spritesheet.png') -40px -3px }
.chathide:active { background: url('spritesheet.png') -40px -40px }

.chatrefresh { padding: 0px; width: 18px; height: 18px; display: block; background: url('spritesheet.png') -3px -21px; clear: both }
.chatrefresh:hover { background: url('spritesheet.png') -3px -3px }
.chatrefresh:active { background: url('spritesheet.png') -3px -40px }

/*.chatshow { padding: 0px; width: 18px; height: 18px; display: block; background: url('spritesheet.png') -23px -21px; }
.chatshow:hover { background: url('spritesheet.png') -23px -3px }
.chatshow:active { background: url('spritesheet.png') -23px -40px }*/

.videoref { bottom: 24; left: 160; }
.videooverlay { bottom: 23; left: 180; }
.addbutton { bottom: 24; left: 205; }
.removebutton { bottom: 24; left: 225; }
.infobutton { bottom: 24; left: 245; }

@media all and (min-width: 1460px) {
	.aboutPopup {
		width: 1400px;
	}
}

@media all and (min-width: 1120px) and (max-width: 1460px) {
	.aboutPopup {
		width: 1060px;
	}
}

@media all and (min-width: 780px) and (max-width: 1119px) {
	.aboutPopup {
		width: 735px;
	}
}

@media all and (max-width: 779px) {
	.aboutPopup {
		width: 380px;
	}
}
.aboutPopup { 
	max-height: 430px;
	padding: 30px;
	background-color: #fff;
	border-radius: 15px;
	overflow: auto;
	position: relative;
	font: 12px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif;
	text-rendering: optimizelegibility;
}

.infoclose {
	position: absolute;
	background-color: #fff;
	top: 5px;
	right: 35px;
	border: 3px;
	z-index: 200;
}

.bClose {
	cursor: pointer;
	position: absolute;
	margin-top: -5px;
	font-family: "Open Sans Condensed", sans-serif;
	font-weight: bold;
	font-size: 24px;
	color: #000;
}

.infoFrame {
	width: 100%;
	height: 400px;
	border: 0px;
}

.subscribe {
	position: absolute;
	top: 8px;
	left: 30px;
	font-family: "Open Sans Condensed",sans-serif;
	font-size: 16px;
}

.subscribe a {
	text-decoration: none;
	font-weight: bold;
}

.subscribe a:hover {
	text-decoration: underline;
}

iframe { width: 100%; height: 100%; }