/* Main stylesheet for Argos.tv 
  
   Note: Using absolute font sizes for some elements, to avoid visual problems.

	Colours:
	Blue 1. cdeef7
	Blue 2. 32c1ce
	Blue 3. f2fcfe
	Blue 4. 7dd5e1
	
	Grey 1. 666
	Grey 2. eee
	Grey 3. ccc
	Grey 4. f0f0f0
	Grey 5. 999
	
	Red 1. ec2e2c
	Red 2. fad3d4
	Red 3. 9e4342
	Red 4. f2e8e9

*/

/* development only */
div.clock {
	background-color: #000;
	color: #fff;
	left: 0px;
	padding: 20px;
	position: fixed;
	top: 0px;
	z-index: 1000;
}

div.clock span { display: block; }



/* Hidden elements
 *******************/
.tvPage .carousel button span,
.tvPage .carousel .status,
.tvPage .carousel .sorting,
.tvPage .controller .label,
.tvPage .controller .next,
.tvPage .controller .previous,
.tvPage .data,
.tvPage .jsOnly,
.tvPage .programme .image,
.tvPage .programme .presenter,
.tvPage .schedule .controller .left,
.tvPage .schedule .controller .right,
.tvPage .schedule .future .seeProducts,
.tvPage .schedule .future .watchLive,
.tvPage .schedule .past .watchLive,
.tvPage .schedules .more span,
.tvPage .schedules .onAirNow,
.tvPage .schedules .separator,
.tvPage .schedules .schedule h3,
.tvPage .product .moreInfo span,
.tvPage .productSoldOut ul,
.tvPage #guideSchedulesTvSchedule .programme span,
.tvPage #homeSchedulesTvSchedule .actions,
.tvPage #homeSectionProducts .watchLive span,
.tvPlayer .product .actions,
.tvPlayer #skyChannel {
	display: none;
}

 
 /* General elements
  ********************/
.tvPage h2 { 
	color: #09B2D1; 
	font-size: 20px;
}

.tvPage .LightboxActivatee h3 { 
	font-size: 12px; 
	line-height: 50px;
	text-indent: 10px;
}

.tvPage .noscript {
	background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/icon_warning.jpg) center left no-repeat;
	border-color: #9e4342;
	border-style: solid;
	border-width: 1px 0px;
	margin-bottom: 50px;
	padding: 25px 50px;
}

.tvPage .noscript p { margin-bottom: 0px; }
.tvPage .TabbedArea { padding-bottom: 1px; }
.tvPage .tvStaticContent { clear: both;}
  
.tvPage #content { 
	clear: both;
	argin: 0px 30px 30px 30px; 
	overflow: hidden;
	padding-top: 30px;
}

.tvPage #targetProducts {
	margin-top:20px;	
}

/* Static Box Content
 **********************/
.tvPage .staticBoxes { padding-left: 30px; }

.tvPage div.staticBox .title {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px;
}

.tvPage dl.staticBox .title {
	font-size: 16px;
	font-weight: bold;
	position: absolute;
	top: 100px;
}

.tvPage .staticBox {
	float: left;
	margin: 0px 40px 20px 0px;
	position: relative;
	width: 200px;
}

.tvPage .staticBox img { margin-bottom: 10px; }
.tvPage .staticBox .image { padding-bottom: 1.6em; }
.tvPage .staticBox .message { font-size: 12px; }

.tvPage .staticBox .time {
	color: #666; 
	font-size: 1.2em; 
	font-weight: bold;
	margin-bottom: 10px;
}

.tvPage .staticBoxes .last { margin-right: 0px; }


/* Header
**********************/
#personal .channelInformation {
    float: left;
    margin-left: 200px;
}

#personal .goToArgos {
	color: #000000;
    float: right;
    position: relative;
    top: 5px;
}

#search input[type="text"] {
    margin: 0 5px 3px 200px;
}

.tvPage #mainnav {
	background-color: #f0f0f0;
	border-top: #ccc solid 1px;
}

/* On Air Now
 *********************/
.tvPage #onAirNow dl { 
	position: absolute;
	right: 0;
	top: -35px;
}

.tvPage #onAirNow .content { position: relative; }

.tvPage #onAirNow .title {
	color: #999;
	font-weight: bold;
	position: relative;
	z-index: 2;
}

.tvPage #onAirNow .status {
	background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/on_air.gif) 0px 0px no-repeat;
	color: #ec2e2c;
	font-weight: bold;
	height: 13px;
	margin-bottom: 12px;
	overflow: visible;
	padding-left: 40px;
	padding-top: 17px;
	white-space: nowrap;
	width: 30px;
}

.tvPage #onAirNow .image {
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: 1;
}

.tvPage #onAirNow .presenter {
	color: #666;
	font-size: 1.2em;
	font-weight: bold;
	left: 40px;
	position: relative;
	top: 15px;
	width: 100px;
	z-index: 2;
}

.tvPage #onAirNow .time { 
	color: #7dd5e1; 
	font-weight: bold;
}


/* Schedules
 *********************/
.tvPage .schedules { 
	float: left;
	position: relative; 
	width: 440px;
}

.tvPage .schedules h2 {
	border-bottom: #cdeef7 solid 2px;
	font-weight: normal;
	line-height: 1.2em;
	margin-bottom: 17px;
	padding-bottom: 12px;
}  

.tvPage .schedules .controller { 
	overflow: hidden; 
	position: relative;
}

.tvPage .schedules button { 
	background-color: transparent;
	background-image: none;
	border-radius: 0;
	border: none;
	color: #666;
	display: block;
	float: left;
	font-size: 14px;
	font-weight: bold;
	line-height: auto;
	padding: 0px;
	text-decoration: none;
}

.tvPage .schedules button:hover {
	text-decoration: underline;
}

.tvPage .schedules button.selected { 
	background-color: #f2fcfe;
	border: #cdeef7 solid 1px;
	border-bottom: none;
	border-right: none;
	cursor: auto;
	text-decoration: none;
}

.tvPage .schedules button.selected span { 
	background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/tab_bg.png) top right no-repeat; 
	border-bottom-width: 1px;
	padding-left: 14px;
}

.tvPage .schedules .controller span { 
	display: block;
	padding: 10px 26px 8px 15px;
	position: relative;
	right: -4px;
	top: -2px;
}

.tvPage .schedules .more {
	background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/tv_sprite.png) -1px 1px no-repeat;
	border: none;
	cursor: pointer;
	height: 28px;
	padding: 0px;
	position: absolute;
	right: 0px;
	top: 0px;
	width: 132px;
}

.tvPage .schedules .Schedule .controller span { padding-top: 3px; }
.tvPage .schedules .time { color: #32c1ce; }

.tvPage .tvSchedules { 
	float: right;
	margin-right: 2px; 
}

.tvPage .tvSchedules .more { 
	background-position: -1px -31px;
	width: 129px;
}


/* Schedule
 *****************/
.tvPage .Schedule {
	background-color: #f2fcfe;
	border: #cdeef7 solid 1px;
	clear: both;
	left: 0px;
	margin-bottom: 37px;
	overflow: hidden;
	padding: 0;
	top: 38px;
	width: 438px;
}

.tvPage .Schedule .carousel { 
	height: 100%; 
	position: relative;
}

.tvPage .Schedule .controller { 
	height: 0px;
	overflow: visible;
	position: static;
	width: 100%;
}

.tvPage .Schedule button {
	background: #f2fcfe url(/wcsstore/argos/en_GB/siteAssets/images/arrows_vertical_bg_sprite.gif) 50% -76px no-repeat;
	border: none;
	cursor: pointer;
	height: 27px;
	left: 0px;
	position: absolute;
	width: 100%;
}

.tvPage .Schedule button span {
	color: #999;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	line-height: 25px;
	display: block;
	height: 27px;
	margin: 0px auto;
	overflow: hidden;
	padding: 0px;
	position: relative;
	text-indent: -100px;
	top: 0px;
	width: 19px;
}

.tvPage .Schedule button:hover { background-color: #cdeef7; }
.tvPage .Schedule button:hover span { color: #32c1ce; }

.tvPage .Schedule button.disabled {
	background-color: transparent;
	cursor: auto; 
}

.tvPage .Schedule button.disabled span { color: #ccc; }
.tvPage .Schedule button.down_disabled { background-position: 50% -37px; }
.tvPage .Schedule button.up_disabled { background-position: 50% 5px; }

.tvPage .Schedule .down { 
	background-position: 50% -117px;
	bottom: 0px;
}

.tvPage .Schedule .up { top: 0px; }

.tvPage .Schedule .Scroller { 
	height: inherit; 
	margin-top: 27px;
	overflow: hidden;
}


/* Programmes
 *******************/
.tvPage .programme {
	font-size: 12px;
	height: 60px;
	margin-bottom: 30px; 
	padding: 0px;
	position: relative;
	width: 100%;
}

.tvPage .programme dt { font-weight: bold; }

.tvPage .programme .actions { 
	position: absolute;
	right: 0px;
	top: 10px;
	width: 90px;
}

.tvPage .programme button {
	background: none;
	border: none;
	clear: both;
	cursor: pointer;
	float: left;
	font-family: inherit;
	height: auto;
	margin: 0px 0px 2px 0px;
	padding: 0px;
	position: static;
	text-align: left;
	text-decoration: underline;
	width: auto;
}

.tvPage .programme button:hover { background-color: #ccc; }

.tvPage .programme button span {
	color: #333;
	font-size: 13px;
	font-weight: normal;
	height: auto;
	line-height: 1em;
	text-align: left;
	text-indent: 0;
	width: auto;
}

.tvPage .programme button:hover,
.tvPage .programme button span:hover { 
	color: #333; 
}

.tvPage .programme .description,
.tvPage .programme .title { 
	padding-left: 150px;
	width: 175px;
}

.tvPage .programme .time {
	float: left; 
	font-weight: bold;
	margin-left: 14px;
	width: 130px;
}

/* Product Carousels
 ***********************/
.tvPage .carousel { 
	background-image: none;
	overflow: hidden;
	padding-bottom: 35px; 
}

.tvPage .carousel .controller button { 
	background: #fff url(/wcsstore/argos/en_GB/siteAssets/images/arrows_horizontal_bg_sprite.gif) 3px 50% no-repeat;
	border: none;
	cursor: pointer;
	height: 100%;
	position: absolute;
	top: 0px;
	width: 25px;
}

.tvPage .carousel .controller button:hover { background-color: #eee; }

.tvPage .carousel .controller .forward { 
	background-position: -28px 50%;
	right: 0px 
}

.tvPage .carousel .controller .back { left: 0px; }

.tvPage .carousel .paging {
	left: 40%;
	position: absolute;
	top: 90%;
}

.tvPage .carousel .paging .button { 
	background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/tv_sprite.png) -282px -48px no-repeat;
	border: none;
	cursor: pointer; 
	float: left;
	height: 13px;
	margin-right: 10px;
	overflow: hidden;
	text-indent: -13px;
	width: 13px;
}

.tvPage .carousel .paging .selected { 
	background-position: -301px -48px;
	cursor: auto;
}

.tvPage .tvProgrammeProducts { width: 680px; }


/* ProductCategories
 **********************/
.tvPage #homeSectionProducts { 
	clear: both;
	margin-bottom: 20px;
	overflow: hidden; 
	padding-top: 5em;
}

.tvPage #homeSectionProducts .watchLive {
	background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/tv_sprite.png) -1px -131px no-repeat;
	border: none;
	cursor: pointer;
	display: block;
	height: 31px;
	margin-bottom: 10px;
	overflow: hidden;
	position: absolute;
	right: 0px;
	top: -3.5em;
	width: 129px;
}

.tvPage .productCategory {
	border: #fad3d4 solid 1px;
	float: left;
	margin: 0px 0px 20px 0px;
	position: relative;
	width: 220px;
}

.tvPage .productCategory h2 {
	font-weight: normal;
	line-height: 2em;
	position: absolute;
	top: -2em;
}

.tvPage #whatsBeenOnProductsCategory {
	border-color: #cdeef7;
	float: right;
	width: 690px;
}

.tvPage #whatsOnAirNowProductsCategory { padding-bottom: 50px; }
.tvPage #whatsOnAirNowProductsCategory h2 { color: #ec2e2c; }
.tvPage #whatsOnAirNowProductsCategory .carousel .image { left: 0px; }
.tvPage #whatsOnAirNowProductsCategory .carousel .product { padding: 130px 2px 0px 2px; }
.tvPage #whatsOnAirNowProductsCategory .image { left: 20px; }

.tvPage #whatsOnAirNowProductsCategory .product { 
	margin: 0 0 20px 0;
	padding: 130px 25px 0px 20px;
	position: relative;
}

.tvPage #whatsOnAirNowProductsCategory .image {
	text-align: center; 
	top: 15px;
	width: 170px; 
}

.tvPage #whatsOnAirNowProductsCategory .productWithRating { padding-top: 177px; }
.tvPage #whatsOnAirNowProductsCategory .productWithRating .customerrating  { top: 145px; }

.tvPage #whatsOnAirNowProductsCategory .watchLive {
	bottom: 10px; 
	left: 45px;
	top: auto;
}


/* Products
 **********************/
.tvPage .carousel .product:hover,
.tvPage #content .product:hover { 
	box-shadow: none; 
}

.tvPage .carousel .product,
.tvPage #content .product {
	margin: 0px 20px;
	padding-left: 0px;
	padding-right: 0px;
	width: 170px;
}


/* Home (activity)
 ***********************/
.tvPage #homeSchedules {
	clear: both;
	margin-bottom: 50px; 
	overflow: hidden; 
}

.tvPage #homeSchedulesTvSchedule { float: right; }
.tvPage #homeSchedulesTvSchedule .more { background-position: -1px -29px; }

.tvPage #homeSchedulesTvSchedule .description,
.tvPage #homeSchedulesTvSchedule .title { 
	width: 270px; 
}


/* Guide (activity) 
 ***********************/
.tvPage .staticBoxes h2,
.tvPage #guideSchedules h2 { 
	border-bottom: #ccc solid 2px;
	color: #333;
	font-size: 2em;
	font-weight: normal;
	line-height: 2em;
	margin-bottom: 17px;
	padding-bottom: 7px;
}

.tvPage #guideSchedules {
	clear: both;	
	margin-bottom: 20px;
}

.tvPage #guideSchedules .actions {
	bottom: auto;
	right: 50px; 
	top: 15px;
	width: 130px;
}

.tvPage #guideSchedules .description,
.tvPage #guideSchedules .title {
	padding-left: 180px;	
	width: 500px;
}

.tvPage #guideSchedules .image {
	display: block;
	float: left;
	margin-left: 20px;
}

.tvPage #guideSchedules .programme {
	height: 75px; 
	overflow: hidden; 
	padding: 10px 0px;
}

.tvPage #guideSchedules .schedule { width: 928px; }

.tvPage #guideSchedules .schedules {
	float: none;
	width: auto;
}

.tvPage #guideSchedules .Scroller .controller button span {
	text-indent: -11ex;
	width: auto;
}

.tvPage #guideSchedules .Scroller .present { background-color: #f2e8e9; }

.tvPage #guideSchedules .Scroller .present .time {
	background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/on_air.gif) 0px 30px no-repeat; 
	color: #ec2e2c; 
}

.tvPage #guideSchedules .Scroller .present .onAirNow {
	display: block;
	padding: 42px 0px 0px 35px; 
}

.tvPage #guideSchedules .seeProducts,
.tvPage #guideSchedules .watchLive {
	background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/tv_sprite.png) -1px -61px no-repeat;
	float: none;
	height: 31px;
	margin-bottom: 10px;
	overflow: hidden;
	position: static;
	text-indent: -250px;
	width: 129px;
}

.tvPage #guideSchedules .watchLive { background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/tv_sprite.png) -1px -131px no-repeat; }


/* Player (popup)
 *********************/
.tvPlayer { background-color: #fff !important; }

.tvPlayer object {
	float: left;
	margin: 0px 20px 0px 0px;
}

.tvPlayer .noscript {
	float: right;
	width: 210px;
}

.tvPlayer #content { margin: 0px 0px 30px 30px; }
.tvPlayer #livePlayer { position: relative; }
.tvPlayer #logo { margin-left: 30px; }

.tvPlayer #nowShowing {
	float: left;
	width: 230px;
}

.tvPlayer #nowShowing .product { margin: 20px 10px; }

.tvPlayer #nowShowing h2 {
	border-bottom: #fad3d4 solid 2px;
	color: #ec2e2c;
	font-size: 20px;
	font-weight: normal;
	line-height: 1.2em;
	margin-bottom: 5px;
	padding-bottom: 2px;
}

.tvPlayer #onAirNow {
	background: transparent url(/wcsstore/argos/en_GB/siteAssets/images/on_air.gif) 0px 1px no-repeat;
	left: 800px;
	position: absolute;
	width: 190px;
}

.tvPlayer #onAirNow .title { 
	font-size: 1em;
	height: auto; 
	margin: 0 0 0 50px;
	padding: 0 0 2px 0;
}

.tvPlayer #onAirNow .time { margin-left: 50px; }

.tvPlayer #outerwrap { 
	overflow: hidden;
	width: auto; 
}

.tvPlayer #sitefooter li { 
	display: inline;
	margin: 0px 15px 0px 15px; 
}