/*==========[ Normalize / Resets ]==========*/
html,body,div,span,h1,h2,h3,h4,h5,h6,p,em,img,small,strong,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,tbody,tfoot,thead,tr,th,td,figure,footer,header,nav,section{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}footer,header,nav,section{display:block;}[hidden]{display:none;}
html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}html,button,input,select,textarea{color:#222;font-family:sans-serif;}body{margin:0;font-size:1em;line-height:1.4;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}
h1 { font-size: 2em; margin: 0.67em 0; }
h2 { font-size: 1.5em; margin: 0.83em 0; }
h3 { font-size: 1.17em; margin: 1em 0; }
h4 { font-size: 1em; margin: 1.33em 0; }
h5 { font-size: 0.83em; margin: 1.67em 0; }
h6 { font-size: 0.67em; margin: 2.33em 0; }
nav ul, nav ol { list-style: none; list-style-image: none; ;margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
form { margin: 0; }
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }
label { cursor: pointer; }
legend { border: 0; padding: 0; white-space: normal; *margin-left: -7px; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, html input[type="button"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }
html, button, input, select, textarea { color: #222; }
body { font-size: 1em; line-height: 1.4; }
::-moz-selection { background: #b3d4fc; color: #fff; text-shadow: none; }
::selection { background: #b3d4fc; color: #fff; text-shadow: none; }
.chromeframe { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }
/*------------------------[CORE SITE ELEMENTS]------------------------------*/
html { height: 100%; }
body { color: #999; height: 100%; font: 13px Helmet, Freesans, Arial, Helvetica, sans-serif; }
body, select, input, textarea { color: #333; }
a { color: #03f; text-decoration: none; }
a:hover { color: #69f; text-decoration: underline; }
a:visited{ color: #551a8b; }
p { padding-bottom: 0px; margin: 1em 0; }
ul { list-style: disc; margin: 0; }
li { padding-bottom: 0px; margin-left: 0px; }
b, strong, .bold { font-weight: bold; }
em, .italic { font-style: italic; }
.center { text-align: center; }
.inline { display: inline-block!important; }
.underline { text-decoration: underline; }
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/*==========[ Main Layout ]==========*/
body {}

#container { 
	width: 90%; 
	padding: 0; 
	margin: 20px auto; 
	border: 1px solid #B5B5B5;
	-webkit-border-radius: 5px; 
		 -moz-border-radius: 5px; 
					border-radius: 5px; 
}

#main {}

#content { padding: 15px; }

#header { 
	height: 50px; 
	margin: 0px; 
	padding: 20px; 
	background: #e1e1e1; 
}

#content > .body { padding: 15px; }

/*==========[ Header ]==========*/
#header > section { text-align: center; }
#header button { margin-top: -4px; }
#header label { font-size: 1.4em; }
/*==========[ Content Header ]==========*/
#content > header {}

#content > header > .left { float: left; }
#content > header > .right { float: right; }

#content .left p { font-size: 1.5em; }

/*==========[ Stream List ]==========*/
#stream-list {
	list-style: none;
}

#stream-list li {
	border: 1px solid #ccc;
	padding: 15px;
	margin-bottom: 10px;
}

#stream-list li img {
	/*max-width: 400px;*/
	width: 30%;
	display: inline-block;
}

#stream-list li .details {
	display: inline-block;
	width: 68%;
	margin-left: 15px;
	vertical-align: top;
}

#stream-list h1 {
	text-transform: uppercase;
}

#stream-list .lead {
	font-size: 1.8em;
}

#stream-list .description {
	font-size: 1.4em;
}

/*==========[ Pagination ]==========*/
.pagination {}

.pagination .disabled {
	cursor: not-allowed;
}

#previous:after {
	font-size: 2em;
	content: '\25b2';
	display: inline-block;
	opacity: 0.7;
	-webkit-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
	-o-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	transform: rotate(270deg);
}

#next:after {
	font-size: 2em;
	content: '\25b2';
	display: inline-block;
	opacity: 0.7;
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
}

#next, #previous {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-webkit-transition: opacity .2s ease-in-out;
     -moz-transition: opacity .2s ease-in-out;
      -ms-transition: opacity .2s ease-in-out;
       -o-transition: opacity .2s ease-in-out;
          transition: opacity .2s ease-in-out;
}

#next:hover, #previous:hover {
	opacity: 1;
	filter: alpha(opacity=100);
}
/*==========[ Forms ]==========*/
input[type=search] {
	display: block;
	width: 180px;
	height: 21px;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
	-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
input:focus {
	border-color: #ccc;
	border-color: rgba(82,168,236,.8);
	outline: 0;
	outline: thin dotted \9;
	-webkit-box-shadow: 0 0 8px rgba(82,168,236,.6);
	box-shadow: 0 0 8px rgba(82,168,236,.6);
	}

/*==========[ Other Styles ]==========*/
.btn {
	color: #fff;
	background-color: #428bca;
	border-color: #357ebd;
	display: inline-block;
	padding: 6px 12px;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: none;
	border: 1px solid transparent;
	-webkit-border-radius: 4px;
		 -moz-border-radius: 4px;
					border-radius: 4px;
}

.btn:hover {
	background-color: #3071a9;
	border-color: #285e8e;
}

.alert {
	color: #8a6d3b;
	text-align: center;
	background-color: #fcf8e3;
	border: 1px solid #faebcc;
	padding: 15px;
	-webkit-border-radius: 4px;
		 -moz-border-radius: 4px;
					border-radius: 4px;
}

.alert .retry {
	color: #fff;
	background-color: #f0ad4e;
	border-color: #eea236;
	display: inline-block;
	padding: 6px 12px;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: none;
	border: 1px solid transparent;
	-webkit-border-radius: 4px;
		 -moz-border-radius: 4px;
					border-radius: 4px;
}

.alert .retry:hover {
	background-color: #ec971f;
	border-color: #d58512;
}

.alert p {
	font-size: 1.4em;
}
