/*

    *RDF TV site
    *Traffic Digital

    *Red: #e11212
    
*/


/*   ------  ELEMENTS   ------   */

html{
  background: #262626 url('/img/_body-bg.jpg') repeat 0 0;
}

body{
	font-family:Helvetica, Helvetica Neue, Arial, sans-serif;
	font-size: 12px;
	background: transparent url('/img/_content-bg.jpg') no-repeat 50% 0;
	color: #ccc;
}

h1, h2, h3, h4, h5{
  font-weight: bold !important;
  color: #e11212;
  line-height: 1em !important;
}

h1, h2{
  margin: 0 0 30px 0;
}
h3, h4, h5{ 
  margin: 0 0 20px 0;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, a h1, a h2, a h3, a h4, a h5, a h6{
  text-decoration: none !important;
}

h1{  font-size: 3em;  }
h2{  font-size: 2em !important;  }
h3{  font-size: 1.6em;  }
h4{  font-size: 1.1em;  }
h5{  font-size: .9em;  }

p{
  font-size: 1.1em;
  margin: 0 0 15px 0;
  line-height: 1.4em;
}

a{
  color: #ccc;
}

a:hover, p a, table a, span a, ul a{
  text-decoration: underline;
}

p a:hover, table a:hover, span a:hover, ul a:hover{
  color: #fff;
}


/* buttons and anchors that are styled to look like buttons */

button, a.button{
  background: #e42b36 url('/img/_button-bg.gif') repeat-x;
  color: #fff;
  padding: 6px 10px;
  border-radius: 3px;
  -moz-border-radius: 3px;
  font-weight: bold;
  border: none;
  text-decoration: none;
  display: inline-block;
}

button:hover, a.button:hover{
  margin: -1px 0 1px 0;
  box-shadow: 0 2px 2px #000;
  -moz-box-shadow: 0 2px 2px #000;
  -webkit-box-shadow: 0 2px 2px #000;
  text-decoration: none !important;
}


ul, ol{
  margin: 0 0 0 14px;
}

ul{    list-style-image: url('/img/_li-bg.png'); }

ul li, ol li{
  margin: 0 0 10px 0;
  padding: 0 0 0 14px;
}

table{
  margin: 10px 0;
}

table td{
  padding: 0 10px 10px 0;
}

/*  ------   LAYOUT  ------     */



#body-wrapper{
  width: 960px;
  margin: 0 auto;
}

/* header */

header{
  float: left;
  width: 100%;
}

header #header-logo{
  background: url('/img/_header-logo.png') no-repeat 0 0;
  width: 227px;
  height: 94px;
  float: left;
  margin: 11px 0 !important;
}

/* header nav */

header nav{
  float: right;
  width: auto;
  height: 39px;
  margin: 78px 0 0 0 !important; /* header logo height +5px */
}

header nav li { float:left; margin:0; padding:0; }

header nav a{
  width: 110px;
  height: 39px;
  float: left;
  text-align: center;
  font-size: 1.33333em;
  text-decoration: none;
  color: #fff;
  margin: 2px 0 0 10px;
  padding: 10px 0 0 0;
  background: url('/img/_nav-tab.png') no-repeat;
  font-weight: bold;
}

header nav a:hover{
  margin-top: 0;
}

header nav li.current a{
  color: #e11212;
}

/* main content area */

#subnav ul { 
  line-height: 1;
  list-style: none outside none;
  margin: 0;
}
#subnav ul li { margin: 0; padding: 0; 
  


}
#subnav ul li a { 
  background-color: #333333;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#333333), to(#222222)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #333333, #222222); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #333333, #222222); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #333333, #222222); /* IE10 */
  background-image:      -o-linear-gradient(top, #333333, #222222); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #333333, #222222);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#333333', EndColorStr='#222222'); /* IE6-IE9 */  border-color: #464646;
  display: block;
  font-weight: bold;
  margin: 0;
  padding: 12px 16px;
  text-decoration: none;
  text-shadow: 0 0 5px #666666;
  font-size: 12px;
    
}

#subnav ul li li a { 
  background: #1C1C1C;
  border-top: 1px solid #111111;
  padding: 10px 30px;
}

#content{
  width: 920px;
  padding: 20px;
  background: #000;
  float: left;
}

#content, #slideshow-wrapper{
  border-top: 1px solid #464646;
  border-left: 1px solid #363636;
  border-right: 1px solid #363636;
  border-bottom: 1px solid #464646;
}

#main{
  width: 600px;
  float: right;
}

aside{
  width: 300px;
  float: left;
  margin-right: 20px;
}

/* footer */

footer{
  width: 100%;
  float: left;
  color: #777;
  font-size: 0.8em;
  margin: 20px 0 40px 0;
}

footer div.logo{
  float: right;
}

/* slideshow */

#slides { float:left; height: 291px; width: 710px; margin-right:10px; overflow: hidden; }
.thumbnail { position: relative; float: left; margin: 0 0 10px; width: 220px; }
.thumbnail img { margin: -1px; border:1px solid #000; display:block; width:100% }
.thumbnail .thumb-hover { display: none; font-weight: bold; background: url('/img/_slideshow-info-bg.png'); bottom: 0; color: #e11212; padding: 10px; position: absolute; text-align: center; width: 200px; }
.thumbnail a:hover .thumb-hover { display:block; }
.thumbnail a.current  img { border-color:#e11212 }
.slidesPagination { display: none; }
#slideshow-wrapper{
  width: 100%;
  margin: 0 0 20px 0;
  background: #000 url('/img/_slideshow-bg.png') repeat-x;
  float: left;
}

#slideshow{
  margin: 10px;
  position: relative;
  width: 940px;
  height: 291px;
}

#slideshow img{ 
  display:block;
}
  
#slideshow #slideshow-info{
  position: absolute;
  z-index: 255;
  bottom: 0;
  width: 95%;
  padding: 2.5%;
  text-align: right;
  color: #e11212;
  font-size: 1.6em;
  background: url('/img/_slideshow-info-bg.png') repeat 0 0; 
}

/* homepage columns */
#home-intro { width:570px }
#home-onair { float: right; width:300px; position: relative; }
#home-onair .slide img { margin:0 0 20px; display: block; width: 300px; }
#home-onair .info { padding: 0 40px; }
#home-onair .info strong { color:#fff; margin:0 0 10px; font-size: 14px; font-weight:bold; }
#home-onair .info p { margin:0 0 2px; }
.slidesPrevious, .slidesNext { text-indent: -9999px; width:19px; height: 19px; left: 0; background: url(/img/_arrow-prev-btn.png) 0 0 no-repeat; position: absolute; top: 192px; z-index: 1000; }
.slidesNext { left: auto; right: 0; background: url(/img/_arrow-next-btn.png) 0 0 no-repeat; }


#home-about{
  width: 600px;
  float: left;
}

#home-shows{
  width: 220px;
  float: right;
}

/* Team members */

#team-members { margin:30px 0; padding:0; list-style: none}
#team-members li { margin:0 0 20px; padding:0; float:left; width:45%; padding-right:5% }
#team-members li h4 { font-size:16px }

/* Shows index page */


nav#genre-nav{
  margin: 20px auto 30px auto;
  background: #232323 url('/img/_genre-nav-bg.png') repeat-x 0 0;
  color: #fff;
  border-radius: 5px;
  -moz-border-radius: 5px;
  padding: 10px;
  font-size: 1.2em;
  text-align: center;
  display: table;
  width: 80%;
  padding: 0 10px;
  border: 1px solid #464646;
  border-top: 1px solid #383838;
}

nav#genre-nav a{
  color: #fff;
  text-decoration: none;
  display: table-cell;
  padding: 8px 10px 10px 10px;
  margin: 0;
}

nav#genre-nav a:hover{
  color: #e11212;
}

ul.shows-index{
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
  float: left;
}

ul.shows-index li{
  margin: 0 10px 30px 0;
  padding: 0;
  float: left;
  width: 300px;
  height: 170px;
  display: inline;
  position: relative;
}

ul.shows-index li a{
  float: left;
}

ul.shows-index li:hover{
  box-shadow: 0 0 60px #666;
  -moz-box-shadow: 0 0 60px #666;
}

ul.shows-index li img{
  width: 100%;
}

ul.shows-index li:nth-child(3n+3){
  margin-right: 0 !important;
}

ul.shows-index li h4{
  width: 90%;
  padding: 5%;
  margin: 0 !important;
  position: absolute;
  bottom: 0;
  background: url('/img/_slideshow-info-bg.png') repeat 0 0;
}

ul.shows-index li a:hover{
  text-decoration: none !important;
}

/* the input field */
.range {	
	display: none;
}

.scrollbar{
  display: none;
}



/* Shows single page */


ul.single-show-list{
  list-style: none;
  margin: 20px 0;
  padding: 0;
}

ul.single-show-list li{
  margin: 0 0 15px 0;
  padding: 0;
}

ul.single-show-list li a{
  text-decoration: none;
  padding: 2px 0 2px 24px;
  text-transform: uppercase;
}

ul.single-show-list li a#view-video{
  background: url('/img/_view-video.png') no-repeat 0 0;
}

ul#gallery-images {     list-style: none outside none;     margin: 0pt;    padding: 0pt;}
ul#gallery-images li {     border: 1px solid #AAAAAA;     float: left;     height: 66px;     margin: 0pt 28px 28px 0pt;     overflow: hidden;     padding: 0pt;     width: 100px;}
ul#gallery-images li:nth-child(4n+4) {     margin-right: 0pt;}
ul#gallery-images li img {     max-width: 100px;}
ul#gallery-images li.selected {     opacity: 0.5;}
ul#gallery-images li.selected a {     cursor: default;}
#gallery #gallery-viewer {     cursor: pointer;     margin: 0pt auto;     position: relative;     text-align: center;}
#gallery #gallery-viewer img {     width: 100%;}
#gallery a#next-image, #gallery a#prev-image {    position: absolute;}
#gallery a#next-image {     margin-top: -15px;     position: absolute;     right: 12px;     top: 50%;}
#gallery a#prev-image {     left: 12px;     margin-top: -15px;     position: absolute;     top: 50%;}
/* News index page */

article.news{
  border-top: 1px solid #444;
  margin: 0 0 20px 0;
  padding: 20px 0 0 0;
}

article.news:first-child{
  border: none !important;
  padding: 0 !important;
}

article.news h3, article.news p.meta{
  margin: 0;
}

article.news p.meta{
  color: #fff;
  margin: 0 0 10px 0;
  font-style: italic;
}

/* News single page */

.article-image{
  background: #fff;
  padding: 5px;
  /*
border-top: 1px solid #ccc;
  border-right: 1px solid #999;
  border-bottom: 1px solid #999;
  border-left: 1px solid #ccc;
*/
  width: auto;
  display: inline-block;
  text-align: center;
  margin: 0 0 20px 0;
}

.article-image img{
  display: block;
}

.article-image p.caption{
  margin: 10px 0 5px 0;
  color: #444;
}

.article-image.left{    margin-right: 20px;   }
.article-image.right{   margin-left: 20px;    }

/* Contact page */

.office{
  margin: 0 0 30px 0;
}



/*  ------   CLASSES   ------    */


.left{   float: left;     }
.right{  float: right;    }
.clear{  clear: both;     }

.onethird{    width: 33.3333%; }
.twothirds{   width: 66.6666%; }

/* type classes */

.caption{
  font-style: italic;  
  color: #888;
}

.label{
  color: #fff;
  font-weight: bold;
}

.page-header{
  margin-top: 30px;
}

/* JQUERY TOOLS OVERLAY CSS */

/* the overlayed element */
.overlay{
	display:none;
	z-index:10000;
	background-color: #262626;
	width:640px;	
  min-height: 368px;
	border:1px solid #666;
	
	/* CSS3 styling for latest browsers */
	-moz-box-shadow:0 0 90px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;	
}

/* close button positioned on upper right corner */
.overlay .close {
	background-image:url(/img/_overlay-close.png);
	position:absolute;
	right:-15px;
	top:-15px;
	cursor:pointer;
	height: 30px;
	width: 30px;
	z-index: 255;
}


/* bottom navigation */

.bottom-navigation{
  width: 100%;
  float: left;
  margin: 20px 0;
  border-top: 1px solid #444;
  padding: 10px 0;
  font-size: .9em;
}

.bottom-navigation a{
  text-transform: uppercase;
  border-bottom: 1px solid transparent;
  text-decoration: none;
}

.bottom-navigation a:hover{
  color:#efefef;
}

.bottom-navigation a img{
  margin: 1px 6px -1px 6px; 
}