/* style sheet */
body, html {
  height:100%;
  width:100%;
  padding:0;
  margin:0;
  min-height:400px;
  min-width:200px;
  background-color:#fff;
}
#outer {
  min-height:100%;
  position:relative;
  height:auto;
  overflow:auto;
}
#wrapper {
  height:100%;
  max-width:100%;
  padding:0;
  font-family:Verdana, Arial, sans-serif;
  min-height:100%;
}
#header {
  position:absolute;
  top:0;
  width:100%;
  border-bottom:1px solid #000;
  background-color:rgba(0,0,0,0.9);
  color:#ccc;
  height:40px;
  box-shadow: 0px 0px 5px #222;
  z-index:2;
}
#left {
  float:left;
  width:59%;
  min-width:320px;
  overflow:hidden;
  display:table;
  margin:1% 1% 0 1%;
}
#content {
  padding:0;
  width:100%;
  height:100%;
  display:table-cell;
  vertical-align: middle;
}
.top {
  vertical-align: top !important;
}
#right {
  float:left;
  width:38%;
  min-width:320px;
  display:table;
  overflow:hidden;
}
.clear, .h-clear {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 50px;
}
.h-clear {
  height: 40px;
}
#footer {
  width:100%;
  position:absolute;
  bottom:0;
  background-color:rgba(0,0,0,0.9);
  color:#ccc;
  box-shadow: 0px 0px 5px #222;
}
#social {
  float:left;
  margin:0;
}
.block, .block-tall {
  padding:0 10px;
  float:left;
  color:#555;
  overflow:hidden;
  width:100%;
}
.block-tall {
  width:100%;
}
.hide {
  display:none;
}
.block .active {
  display:block;
}
#left .block-tall .active {
  display:block;
} 
.row-1 {
  display:table-row;
  width:100%;
  min-height:49%;
  background-color:green;
}
.row-2 {
  display:table-row;
  width:100%;
  background-color:red;
}
.col-1 {
  display:table-cell;
  width:47%;
  margin:0 1%;
  background-color:blue;
}
.col-2 {
  display:table-cell;
  vertical-align:middle;
  width:47%;
  margin:0 1% 0 0;
  background-color:yellow;
}
.col-3 {
  display:table-cell;
  width:33%;
}
.row-1 .col-2 {
 }
#quotes {
  position:relative;
  width:98%;
  height:250px;
}
span.quoteText {
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:100%;
  font-size:1.4em;
  text-align:center;
}
p.foot {
  text-align:right;
  margin-right:5px;
}

@media (min-width: 802px) and (max-width: 1550px) {
/*	#left {*/
/*		width:100%;*/
/*	}*/
/*  .col-1 {*/
/*    display:table-cell;*/
/*    width:47%;*/
/*  }*/
/*  .col-2 {*/
/*    display:table-cell;*/
/*    width:47%;*/
/*  }*/
/*  .col-3 {*/
/*    display:table-cell;*/
/*    width:100%;*/
/*  }*/
}
@media (min-width: 801px) and (max-width: 1550px) {
        span.quoteText {
                font-size:1.1em;
        }
}
@media (max-width: 801px) {
	body {
	  background-image:none;
	}
	#left {
		width:100%;
	}
	#header {
		position:fixed;
	}
	#left {
		margin-top:10px;
	}
	.block, .block-tall {
		margin:0px 0;
		padding:0;
	}
	span.quoteText {
		font-size:1.0em;
	}
  .row-1 {
    display:block;
    width:95%;
  }
  .row-2 {
    display:block;
    width:95%;
  }
  .col-1 {
    width:99.5%;
  }
  .col-2 {
    width:99.5%;
  }
  .col-3 {
    width:99.5%;
  }
}
.listen iframe {
  width:95%;
  height:400px;
}
p {
  margin:0;
  padding:0;
}
#footer p {
  padding:0;
  font-size:0.8em;
}
a, a.visited {
  color:#aaa;
}
a:hover {
  color:#333;
}
/* Monks styles */
@font-face {
  font-family: monks;
  src: url('../fonts/bonzai.ttf');
}
@font-face {
  font-family: text;
  src: url('../fonts/Sansation_Light.ttf');
}
@font-face {
  font-family: clock;
  src: url('../fonts/ni7seg.ttf');
}
h2.entityTitle {
  padding:0;
  margin:5px 0px;
}
h2:before { 
  display: block; 
  content: " "; 
  margin-top: -50px; 
  height: 50px; 
  visibility: hidden; 
}
.block .entityBody {
  padding:0 2%;
  overflow: hidden;
  width:94%;
  display:block;
}
.block-tall .entityBody {
  padding:0 2%;
}
.entityBody p {
  padding:5px 0px;
  font-family:text;
}
.title, .media_title {
  font-size:1.5em;
  text-align:left;
  font-family:text;
  clear:both;
  margin-bottom:5px;
  padding:0;
  margin:5px 0;
}
#social .entityBody {
  margin-top:2.5%;
}
/*#i-sessions, #highlights, #facebook, #twitter {*/
.listen {
	/*padding:10px;*/
	padding:0;
	text-align: center;
	color:#555;
	clear:both;
	margin:0;
}
#facebook div, #twitter div{
	background-color:#f1f1f1;
/*	border-bottom-left-radius:10px;*/
/*	border-bottom-right-radius:10px;*/
}
#broadcasts, #excerpts, #highlights, #preludes {
	margin:0;
}
#twitter {
	margin:0;
}
/*#i-sessions iframe, #highlights iframe {*/
.listen iframe {
	border: 0;
	/*width: 700px;*/
	/*height: 460px;*/
}

/*.entityBody > div.visible {
	background-color:#f7f7f7;
	border:2px solid #f7f7f7;
	border-bottom-left-radius:20px;
	border-bottom-right-radius:20px;
	border-top:none;
}*/
#live .entityBody > div.visible {
  background-color:transparent;
  border:none;
}
ul.block-menu {
	list-style:none;
	margin:0;
	padding:0;
}
.block-tabs {
	border:none;
}
ul.block-menu li {
	display:inline-block;
	width:25%;
	padding:0;
	float:left;
}
ul.block-menu li + li{
	padding:0;
	/*float:right;*/
}
ul.block-menu li a {
	text-decoration:none;
	background-color:#fff;
	border:2px solid #fff;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	border-bottom:none;
	color:#888;
	padding:5px 10px;	
	outline: none;
	display:block;
	text-align:center;
}
ul.block-menu li a:hover {
	border:2px solid #f7f7f7;
	border-bottom:none;
}
ul.block-menu li a.active {
	background-color:#f7f7f7;
	border:2px solid #f7f7f7;
	color:#555;
	border-bottom:none;
}
#logo span.logo-img {
  float:left;
  margin:0;
  padding:0;
  display:block;
}
h1.page-title {
  font-family:text;
  font-size:1.4em;
	font-weight:normal;
  text-align:left;
	float:left;
	border-left: 1px solid #444;
	width:210px;
  display:block;
	padding:0 0 0 10px;
	margin:7px auto 0 auto;
}
#jq_debug {
  float:left;
}

/* main menu */
#menu {
  position:fixed;
  top:0;
  left:250px;
  margin:5px 0 0 15px;
  padding:0;
  font-size:1.4em;
}
#menu ul {
  margin:0;
  padding:0;
}
#menu ul li {
  list-style-type:none;
  list-style-image:none;
  display:inline;
  padding:0 0 0 5px;
  border-left:1px solid #444;
  margin:0;
}
#menu li a {
  color:#bbb;
  outline: none;
  font-size:0.9em;
  font-family:text;
}
#menu li a:hover {
  color:#fff;
}
#menu ul li.first {
  border-left:none;
}
#menu .hide {
  display:none;
}
/* js scroll pane */

.jspContainer {
  overflow: hidden;
  position: relative;
}
.jspPane {
  position: absolute;
}
.jspVerticalBar {
  position: absolute;
  top: 0;
  right: 0;
  width: 8px;
  height: 100%;
  background: red;
}
.jspHorizontalBar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 16px;
  background: red;
}
.jspVerticalBar *, .jspHorizontalBar * {
  margin: 0;
  padding: 0;
}
.jspCap {
  display: none;
}
.jspHorizontalBar .jspCap {
  float: left;
}
.jspTrack {
  background: #121212;
  position: relative;
}
.jspDrag {
  background: #333;
  position: relative;
  top: 0;
  left: 0;
  cursor: pointer;
}
.jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag {
  float: left;
  height: 100%;
}
.jspArrow {
  background: #50506d;
  text-indent: -20000px;
  display: block;
  cursor: pointer;
}
.jspArrow.jspDisabled {
  cursor: default;
  background: #80808d;
}
.jspVerticalBar .jspArrow {
  height: 16px;
}
.jspHorizontalBar .jspArrow {
  width: 16px;
  float: left;
  height: 100%;
}
.jspVerticalBar .jspArrow:focus {
  outline: none;
}
.jspCorner {
  background: #eeeef4;
  float: left;
  height: 100%;
}

/* countdown */
#timeWrapper {
	display:block;
  margin:0 auto;
	padding:5px;
  width:320px;
}
#timeWrapper p {
  text-align:center;
	padding:10px;
  width:330px;
  margin:0px 0;
  font-family: text;
}
#timeToLive {
  font-family:clock;
  font-size:3.0em;
  color:#000;
}
#timeToLive td.label {
  font-size:0.6em;
  font-family: clock;
}
table.counter {
  width:100%;
  text-align:center;
}
@media (max-width: 400px) {
}
#infoText {
  font-size:1.2em;
  text-align:center;
  padding:0;
  font-family:text;
	position:absolute;
	bottom:40px;
	margin:0;
}
#infoText p.fade {
  float:left;
  overflow:hidden;
	margin:10px 0 0 15px;
	padding:0;

}
#infoText span {
  float:left;
  overflow:hidden;
}
/* live player */
#live_player {
	margin:0 auto;
	padding:5px;
	width:270px;
	min-left:400px;
}
.media_wrapper {
  width:100%;
  display:table;
}
.media_element {
  display:table-row;
  width:100%;
}
span.sc_media {
  display:table-cell;
  width:80%;
}
span.bc_buy {
  width:16%;
  display:table-cell;
  vertical-align:middle;
  padding:0 2%;
}
span.bc_buy a {
  text-decoration:none;
  display:block;
  font-size:1.1em;
  background-color:#efefef;
  margin-top:-4px;
  border:1px solid #eee;
  padding:19px 5px;
  text-align:center;
}
span.media_header a {
  text-decoration:none;
  color:#000;
  outline:none;
}
p.description {
  clear:both;
  padding:10px 0;
  font-family:text;
  line-height:1.2em;
  letter-spacing:1px;
}

/* navbar */
.menu-button {
  float:right;
  display:none;
}
a.menu-toggle {
  display:block;
  width:40px;
  height:40px;
  background: transparent url("../images/menu-icon.png") no-repeat;
}
.menu-collapse ul {
  position:absolute;
  display:block;
  width:100%;
  margin:40px 0 0 0;
  background-color:rgba(0,0,0,0.9);
  padding:0px;
  z-index:100;
}
.menu-collapse ul li {
  list-style:none;
  margin:0;
  padding:0;
}
.menu-collapse ul li a { 
  text-decoration:none;
  display:block;
  width:90%;
  height:90%;
  padding:10px 5%;
}
.menu-collapse ul li a:hover { 
  background-color:#888;
}
/* header menu*/
.header-menu {
  display:block;
  margin:0;
  padding:0;
}
span.header-menu {
  float:left;
  display:block;
  margin-left:10px;
}
ul.header-menu {
  list-style:none;
  display:table;
}
li.header-menu-item {
  height:40px;
  display:table-cell;
  vertical-align: middle;
}
li.header-menu-item a{
  display:block;
  text-decoration:none;
  padding:5px 10px;
  border:1px solid transparent;
  border-left:1px solid #444;
}
li.header-menu-item a:hover{
  background-color:#aaa;
  border:1px solid #aaa;
}
/*li.header-menu-item a.active {
  border:1px solid #aaa;
}*/
a.tab, a.b-tab {
  outline:none;
}
@media (max-width: 801px) {
  .menu-button { 
    float:right;
    display:block;
  }
	#live .entityBody {
		position:relative;
	}
  #timeToLive {
    font-size:2em;
		margin-top:20px;
  }
  #timeWrapper, #timeWrapper p {
    width:245px;
		padding:0;
		height:100%;
  }
  h1.page-title {
		font-size:1em;
		text-align:left;
		padding:0;
		margin:10px auto 0;
		width:150px;
		border:none;
  }
  #logo span.logo-title-mobile {
    display:block;
    margin:0 auto;
    font-size:2em;
  }
  span.header-menu {
    display:none;
  }
	#infoText {
		font-size:1em;
		text-align:center;
		padding:0 1%;
		font-family:text;
		position:absolute;
		bottom:30px;
		margin:0;
	}
	#infoText p.fade {
		margin:30px 0 0 0px;
	}
	/*#i-sessions iframe, #highlights iframe {*/
	.listen iframe {
		/*width:400px;*/
	}
	#content {
		vertical-align: top;
	}
}
@media (min-width: 801px) {
  .header-menu {
    display:block;
  }
}
@media (min-width: 801px) and (max-width:950px) {
	/*#i-sessions iframe, #highlights iframe {*/
	.listen iframe {
		/*width:420px;*/
	}
}
@media (min-width: 951px) and (max-width:1550px) {
/*	#i-sessions iframe, #highlights iframe {*/
	.listen iframe {
		/*width:500px;*/
	}
}
@media (min-width:400px) and (max-width: 480px) {
/*	#i-sessions iframe, #highlights iframe {*/
	.listen iframe {
		/*width:340px;*/
	}
}
@media (max-width: 400px) {
	/*#i-sessions iframe, #highlights iframe {*/
	.listen iframe {
		/*width:260px;*/
	}
}

/* effects */

.entity {
  display:block;
}
.fade.in {
  opacity: 1;
  display:block;
}
.hide {
  opacity: 0;
  -webkit-transition: opacity 10.15s linear;
  	 -moz-transition: opacity 10.15s linear;
          transition: opacity 10.15s linear;
}
.show {
  opacity: 1;
}
.collapse {
  display: none;
}

.collapse.in {
  display: block;
}

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition: height 10.35s ease;
	-moz-transition: height 10.35s ease;
	transition: height 10.35s ease;

}
.visible,
.hidden {
  overflow: hidden;
}
.visible-block {
  display:block;
}
.visible {
  visibility: visible;
  opacity: 1;
  -moz-transition: opacity 1s linear;
	-webkit-transition: opacity 1s linear;
	transition: opacity 1s linear;
}
.hidden {
  visibility: hidden;
  opacity: 0;
  -moz-transition: visibility 0s 0.5s, opacity 0.5s linear;
	-webkit-transition: visibility 0s 0.5s, opacity 0.5s linear;
	transition: visibility 0s 0.5s, opacity 0.5s linear;
}
.hidden-none {
	display:none;
}
.visible > div,
.hidden > div {
	height:100%;
}
.hidden > div {
  margin-top: -10000px;
  -moz-transition: margin-top 0s 0s;
	-webkit-transition: visibility 0s 0.5s, opacity 0.5s linear;
	transition: visibility 0s 0.5s, opacity 0.5s linear;
	height:0px;
}
.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget span iframe[style] {
	padding-right:1%;
  width: 99% !important;
  min-width: 200px;
}
#twitter iframe[style] {
	padding:0 1%;
  width: 98% !important;
  min-width: 200px;
}

