/* =EPG specific styles
----------------------------------------------------------------------------------------------------*/

#epgwrapper {width: 964px;margin: 0 auto; margin-top:12px !important;}

#epgwrapper #slider {width: 964px;margin: 0 auto;position:relative;
	background: url(../images/epgWrapperBg.png) bottom left repeat-x;
	}

/* =Channel navigation
----------------------------------------------------------------------------------------------------*/

#epgwrapper #channels {width:964px; margin:0 !important;}

#epgwrapper ul#channels,
#epgwrapper ul#channels li,
#epgwrapper ul#catchItHere,
#epgwrapper ul#catchItHere li {
	float:left;
	display: inline;
	}

#epgwrapper ul#catchItHere {
	margin: -45px 10px 0 0;
	float:right;
	}
#epgwrapper ul#catchItHere li {
	margin: 0 0 0 26px;
	color: #FFF;
	}
#epgwrapper ul#catchItHere li.first {color: #A7a7a7;text-transform:uppercase;}

#epgwrapper ul#channels li a {
	text-decoration: none;
	float: left;
	text-align: center;
	padding: 6px 10px 6px 10px;
	text-transform: uppercase;
	font-size:12px;
	color:#FFF;
	}

#epgwrapper ul#channels li a:hover {background-color: #cc0000;}
#epgwrapper ul#channels li a.selected {background-color: #cc0000;}
#epgwrapper ul#channels li a:focus {outline: none;}

/* =Top navigation
----------------------------------------------------------------------------------------------------*/

#epgwrapper ul#navigation,
#epgwrapper ul#timeofday  {
	width:542px;
	background:#1a1a1a;
	float:left;
	display: inline;
	padding:10px 0 18px 0;

	}

#epgwrapper ul#navigation li,
#epgwrapper ul#timeofday li {
	float:left;
	display: inline;
	margin: 0 5px 0 5px;
	padding: 0;
	}

#epgwrapper ul#navigation li a,
#epgwrapper ul#timeofday li a {
	text-decoration: none;
	float: left;
	text-align: center;
	text-transform: uppercase;
	font-size:12px;
	color:#ababab;
	height:30px;
	cursor:pointer;
	font-weight:bold;
	}

#epgwrapper ul#navigation li a span,
#epgwrapper ul#timeofday li a span  {
	height:20px;
	padding:5px 5px 5px 8px;
	display:block;
	float:left;
	margin-right:3px;
	}

#epgwrapper ul#navigation li a.selected,
#epgwrapper ul#timeofday li a.selected {color:#FFF;}

#epgwrapper ul#navigation li a.selected span,
#epgwrapper ul#navigation li a:hover span,
#epgwrapper ul#timeofday li a.selected span,
#epgwrapper ul#timeofday li a:hover span {background:url(../images/epgNavBgLeft.png) top left no-repeat;}

#epgwrapper ul#navigation li a:hover,
#epgwrapper ul#navigation li a.selected,
#epgwrapper ul#timeofday li a:hover,
#epgwrapper ul#timeofday li a.selected {background:url(../images/epgNavBgRight.png) top right no-repeat; color:#FFF;}

#epgwrapper ul#navigation li a:focus,
#epgwrapper ul#timeofday li a:focus {outline: none;}

/* =Time of day select navigation
----------------------------------------------------------------------------------------------------*/

#epgwrapper ul#timeofday {
	width:422px !important;
	padding:10px 0 0 0 !important;
	}

#epgwrapper ul#timeofday li {
	margin: 0 10px 0 0 !important;
	}

/* =Scrolling navigation (next/previous)
----------------------------------------------------------------------------------------------------*/
#epgwrapper #nav a.next,
#epgwrapper #nav a.prev {
 	background: url(../images/scroll_right.gif) no-repeat;
	display:block;
	width:17px;
	height:35px;
	position:absolute;
	right:2px;
	top:90px;
	}

#epgwrapper #nav a.prev {
	background: url(../images/scroll_left.gif) no-repeat;
	left:2px;
	}

/* =Scroll panel
----------------------------------------------------------------------------------------------------*/

#epgwrapper .scroll {height: 250px;width:924px;overflow:hidden;position:relative;clear:left;padding:0;margin:0 20px;}

/* =Programmes (unordered list)
----------------------------------------------------------------------------------------------------*/

#epgwrapper ul#programmes li {height:250px;float:left;display:inline;}

#epgwrapper ul#programmes li a {
	text-decoration: none;
	float: left;
	font-size:12px;
	color:#FFF;
	background:url(../images/prog_bg.gif) top right no-repeat;
	}

#epgwrapper ul#programmes li a {color:#ababab; cursor:pointer;outline:none;}

#epgwrapper ul#programmes li.offair {background:url(../images/progoffair_bg.png);margin:0 1px 0 0;}
#epgwrapper ul#programmes li.offair .text {color:#999;padding: 0 10px;font-size:11px;display:block;}

#epgwrapper ul#programmes li.prog30.selected a {background:url(../images/prog30_bg.png); color:#FFF;}
#epgwrapper ul#programmes li.prog60.selected a {background:url(../images/prog60_bg.png); color:#FFF;}
#epgwrapper ul#programmes li.prog75.selected a {background:url(../images/prog75_bg.png); color:#FFF;}
#epgwrapper ul#programmes li.prog90.selected a {background:url(../images/prog90_bg.png); color:#FFF;}
#epgwrapper ul#programmes li.prog120.selected a {background:url(../images/prog120_bg.png); color:#FFF;}
#epgwrapper ul#programmes li.prog135.selected a {background:url(../images/prog135_bg.png); color:#FFF;}
#epgwrapper ul#programmes li .progImage {position:relative;margin:33px 0 6px 0;display:block;}
#epgwrapper ul#programmes li .imgBorderActive {border-bottom: 5px solid #CC0000;height:0px;width:100%;display:block;position:absolute;bottom:0; left:0;}

#epgwrapper ul#programmes li img {border:0;padding:0;margin:0;}

#epgwrapper ul#programmes li .title {padding:10px 0 0 10px;font-size:11px;display:block;font-weight:bold;}
#epgwrapper ul#programmes li .hr {font-size:32px;line-height:1em;margin-left:5px;}
#epgwrapper ul#programmes li sup {vertical-align:top;font-size:12px;}

#epgwrapper ul#programmes li.prog30 a,
#epgwrapper ul#programmes li.prog60 a,
#epgwrapper ul#programmes li.prog75 a,
#epgwrapper ul#programmes li.prog90 a,
#epgwrapper ul#programmes li.prog120 a,
#epgwrapper ul#programmes li.prog135 a {font-size:9px;padding:0;margin:0;height:250px;float:left;overflow:hidden;}
#epgwrapper ul#programmes li.prog30 a, #epgwrapper ul#programmes li.prog30 .progImage {width:77px;}
#epgwrapper ul#programmes li.prog60 a, #epgwrapper ul#programmes li.prog60 .progImage {width:154px;}
#epgwrapper ul#programmes li.prog75 a, #epgwrapper ul#programmes li.prog75 .progImage {width:192px;}
#epgwrapper ul#programmes li.prog90 a, #epgwrapper ul#programmes li.prog90 .progImage {width:231px;}
#epgwrapper ul#programmes li.prog120 a, #epgwrapper ul#programmes li.prog120 .progImage{width:308px;}
#epgwrapper ul#programmes li.prog135 a, #epgwrapper ul#programmes li.prog135 .progImage{width:346px;}

#epgwrapper #programmes li.prog30 a:hover {background:url(../images/prog30_bg.png);color:#FFF;}
#epgwrapper #programmes li.prog60 a:hover {background:url(../images/prog60_bg.png);color:#FFF;}
#epgwrapper #programmes li.prog75 a:hover {background:url(../images/prog75_bg.png);color:#FFF;}
#epgwrapper #programmes li.prog90 a:hover {background:url(../images/prog90_bg.png);color:#FFF;}
#epgwrapper #programmes li.prog120 a:hover {background:url(../images/prog120_bg.png);color:#FFF;}
#epgwrapper #programmes li.prog135 a:hover {background:url(../images/prog135_bg.png);color:#FFF;}

/* =Programmes detail panel (white panel at the bottom of the listing)
----------------------------------------------------------------------------------------------------*/
#epgwrapper #detail #media {display:block;float:left;background:#222;width:480px;height:270px;margin:0 10px 0 0;}
#epgwrapper #detail {height: 290px;background:#fff;padding:10px;}
/*#epgwrapper #detail img {padding:0 10px 0 0;}*/
#epgwrapper #detail #actionBtns img {padding: 0; width: auto; height: auto;}

#epgwrapper #detail #schedule {float:left; width:300px;margin-right:10px;}
#epgwrapper #detail h3 {font-size:18px;color:#1a1a1a; font-weight:bold;}
#epgwrapper #detail h4 {color:#cc0000;text-transform:uppercase;font-weight:bold;}
#epgwrapper #detail p {font-size:12px;color:#1a1a1a;margin:15px 0 15px 0;}
#epgwrapper #detail p a {color:#CC0000;font-weight:bold;}

#epgwrapper #detail a.btnWide {margin: 0 0 7px 0;font-weight:bold;}
#epgwrapper #detail #actionBtns {float:left; width:140px;}

/* =Misc
----------------------------------------------------------------------------------------------------*/

#epgwrapper .highlight {background:#fff;}
#epgwrapper .hide {display: none;}
#epgwrapper .loading {color:#999;}