/* 
	CSS
	------------------------------------------------------------------------------------------
	@site				sho.com (beta)
	@file				global.css
	@author				dpaul
	@desc				microdesign, elements, modules, column rules
	@note				moved pagination from ondemand.css
	@note				added disclaimer class to ads, invoke if needed.
	
	/*
	=:util
	----------------------------------------------------------------------------------------*/	
	.inline li { display:inline; } 	
	.inline li a { float:left; width:auto; }
	.clear { clear:both; }
	.clearfix:after, #content:after, dl:after, .mod.subcontent li:after, .group:after /* Easy Clearing Method - more rules in ie7.css, ie6.css */ 
	{ float:none; clear:both; content: "."; display:block; height:0px; width:0px; visibility:hidden; overflow:hidden;} 
	.etpt { font-size:.75em; }
	/* .left, .right { width:48%; float:left; } .right { float:right; } */
	
	/*
	=:accessibility, =:mobile
	----------------------------------------------------------------------------------------*/
	a.jump { display:block; width:0px; height:0px; overflow:hidden; text-indent:-6000px; }
	hr { display:none; visibility:hidden; width:0px; height:0px; }
	span.hidden { display:block; text-indent:-6000px; }	

	/*
	=:elements
	----------------------------------------------------------------------------------------*/	
	html, body { }
		
	body {
		background:#999;
		width:100%; 
		height:100%;
		font-family:Arial, Helvetica, sans-serif; 
		font-size:11px;
		line-height:15px; }
	
	body#popup {
		background:#000;
		width:800px;
		height:600px; 
		overflow:hidden;}

	h1 {}

	h2 {
		font-size:28px; 
		line-height:36px;
		font-family:Georgia, "Times New Roman", Times, serif; 
		color:#FFF;
		text-shadow:0 0 0 #000; }
	
	h2 strong {
		font-size:32px;
		text-transform:uppercase; }
	
	h3 {
		margin-bottom:8px;
		font-size:18px;
		font-family:Georgia, "Times New Roman", Times, serif; 
		text-transform:uppercase; 
		letter-spacing:-1px;
		color:#000; }
		
	h4 {
		font-size:12px;
		line-height:12px;
		font-weight:bold; }
		
	dd, dt { float:left;  }
	dt { clear:both; }
	
	a:link, a:visited,
	a:hover, a:active { 
		color:#920000;
		font-weight:bold;
		text-decoration:none; }
	
	a:hover, a:active {  
		text-decoration:underline; }
		
	/*
	=:column layout
	----------------------------------------------------------------------------------------*/
	/* all */
	#c1, #c2, #c3 { 
		position:relative; 
		float:left; 
		margin-right:10px; 
		overflow:hidden;  }
	
	#c2 {
		background: transparent repeat-y url( /site/beta/image-panel/global/c2-sand.png ); }
	
	#c2 .top {
		height:10px; }
		
	#c2 .bottom {
		position:absolute;
		bottom:0px;
		height:10px; }
	
	/* x2 */
	.x2 #c1 { 
		width:610px;  }
	
	.x2 #c2 { 
		margin-right:0px; 
		width:320px; }
			
	.x2 #c2 .top {
		width:320px;
		background:transparent no-repeat url( /site/beta/image-panel/global/c2-top_320x10.png ); }
	
	.x2 #c2 .bottom {
		width:320px;
		background:transparent no-repeat url( /site/beta/image-panel/global/c2-bot_320x10.png ); }
	
	/* x2 wide  */
	.x2 .wide #c1 {
		width:770px; }
		
	.x2 .wide #c2 {
		width:160px;
		margin-right:0;
		background:none; }
		
	/* x3 */
	.x3 #c1 {
		width:506px; }
	
	.x3 #c2 {
		width:254px;  }
		
	.x3 #c3 {
		width:160px;
		margin-right:0; }
	
	.x3 #c2 .top { 
		width:254px;
		background:transparent no-repeat url( /site/beta/image-panel/global/c2-top_254x10.png ); }
	
	.x3 #c2 .bottom {
		width:254px;
		background:transparent no-repeat url( /site/beta/image-panel/global/c2-bot_254x10.png ); }
	
	/*
	=:headers
	----------------------------------------------------------------------------------------*/
	.x1 h2, .x2 h2, .x3 h2 {
		margin-bottom:10px;
		padding-bottom:5px;
		background:#000 repeat-x url( /site/beta/image-panel/global/h2-stroke_610x1.png) bottom left; }
	
	
	/*.x2 h2 {
		margin:0;
		background-repeat:no-repeat; } 
	
	This should have been the exception, rather than the rule. It only applies to schedule, while
	series, movies, downloads etc use full-width border with margins. 
	
	see schedules.css*/
				
	/*
	=:modules
	----------------------------------------------------------------------------------------*/
	.mod {
		position:relative;
		padding:10px;
		margin-bottom:10px; 
		font-size:12px;
		line-height:16px; 
		background:#FFF; }
	
	.mod.inner h3 {
		padding: 5px 0px 10px 0px;
		text-transform:none;
		background: transparent repeat-x url( /site/beta/image-panel/global/h3-stroke_100x4.png ) bottom left; }
	
	.mod:last-child {
		margin-bottom:0; }
		
	.mod.inner {
		padding:10px 20px 10px 20px;
		background: #FFF repeat-y url( /site/beta/image-panel/global/mod-inner-bg_10x200.png ) top left; }
	
	.mod.inner h3 {
		padding: 5px 0px 10px 0px;
		text-transform:none;
		background: transparent repeat-x url( /site/beta/image-panel/global/h3-stroke_100x4.png ) bottom left; }
	
	.mod.outer {
		margin:0px 9px 10px 9px;
		width:280px;
		border:#d6d6d6 solid 1px; }
		
	/* set a minimum height for  modules with sparse content, ie util screens */
	.mod.min {
		min-height:600px; }
				
	/*
	=:sidebar, =:subcontent
	----------------------------------------------------------------------------------------*/
	.mod.subcontent h3,
	.mod.movies h3 {
		padding-bottom:8px;
		border-bottom:#d7e0e6 double 4px; } 
		
	.mod.subcontent,
	.mod.movies {
		font-size:11px; 
		line-height:14px;    }
	
	.mod.subcontent li {
		position:relative;
		margin-bottom:10px;
		padding-bottom:9px; 
		border-bottom:#d7e0e6 solid 1px; 
		min-height:60px; }
	
	.mod.subcontent li img {
		position:absolute;
		left:0;
		border:#000 solid 1px; }
	
	.mod.subcontent h4,
	#movie-module h4 {
		margin-bottom:3px; }	
		
	.mod.subcontent h4,
	.mod.subcontent p {
		margin-left:92px; }
	
	.mod.subcontent li:last-child,
	.mod.subcontent li.LAST {
		border:0; padding:0; }
		
	.mod.movies .movie-key,
	.mod.movies .movie-info {
		float:left;
		width:110px;  }
	
	.mod.movies .movie-key img {
		border:#000 solid 1px; }
		
	.mod.movies .movie-info {
		width:160px; }
		
	.mod.movies p.browse-movies {
		padding-top:10px;
		clear:both; }
	
	.mod.movies p.browse-movies a {
		display:block;
		text-align:right;
		clear:both; }

	/*
	=:hd, =:providers */	
	.mod.hd h4, .mod.hd p {
		clear:both;
		margin-left:90px; }
		
	.mod.hd p.left {
		margin-left:0px; }
	
	.mod.hd #all-providers-dd {
		margin:10px 0px; }
		
	.mod.hd li {
		min-height:0px; }
		
	.mod.hd li img {
		border:0px; }
		
	.mod.hd select {
		font-size:12px; }
		
	.mod.hd .loading {
		background: transparent no-repeat url(/site/beta/image-panel/movies/ajax-loader.gif);
		padding-bottom:18px; }	
		
	.mod.hd .loading form {
		display:none; }
	
	/*
	=:column specific
	----------------------------------------------------------------------------------------*/			
	.x1 .mod {
		padding:9px 9px 9px 9px; }
	
	.x3 #c2 .mod.outer {
		width:212px; }	
	
			
	/*
	=:ads =:advertisments
	----------------------------------------------------------------------------------------*/
	.advertisement {
		background:#333; } /* seen when dart chokes, preserves layout in product page */
	/* 
	disclaimers are not needed at the moment as we are only serving house ads. if that changes,
	it would make sense to add this to the base class:
	.advertisement {
		padding-bottom:15px;
		background:transparent no-repeat url( /site/beta/image-panel/global/ad-disclaimer.png ) bottom center; } */
			
	.ad-160x600 {
		padding-bottom:15px;
		width:160px;
		height:585px; }
	
	.ad-120x600 {
		padding:0px 20px 15px 20px; 
		width:120px;
		height:585px;  }
	
	.ad-468x60 {
		padding-bottom:15px;
		width:468px;
		height:45px;}
	
	.ad-728x90 {
		margin:0 auto;
		width:728px;
		height:90px; }
	
	#grid .ad-728x90 {  /* repeated in schedules.css, this div is longer than browser window. */ 
		padding:12px 105px 12px 0px;
		width:5760px;
		background:transparent; }
	
	/*
	=:rounded corners
	- rules for javascript sprites, used to create rounded corner & drop shadow effect.
	----------------------------------------------------------------------------------------*/
	.TL, .TR, .BR, .BL{
		position:absolute; display:block; width:60%; height:10px; overflow:hidden; }
		
	.TL {
		top:0px; left:0px; 
		background: transparent repeat-x url( /site/beta/image-panel/global/mod-inner-TL.png ) top left; }
	
	.TR{
		top:0px; right:0px;  
		background: transparent repeat-x url( /site/beta/image-panel/global/mod-inner-TR.png ) top right; }
	
	.BR {
		bottom:0px; right:0px; 
		background: #FFF no-repeat url( /site/beta/image-panel/global/mod-inner-BR.png ) top right; }
	
	 .BL {
		bottom:0px; left:0px; 
		background: #FFF no-repeat url( /site/beta/image-panel/global/mod-inner-BL.png ) top left; }
	
	/*
	=:tabs
	- rules for pagination in series, movies
	----------------------------------------------------------------------------------------*/
	ul.tabs {
		position:absolute;
		right:0px;
		top:5px; }
		
	ul.tabs li {
		display:inline; 
		padding:0px 9px 0px 4px;
		background:transparent no-repeat url( /site/beta/image-panel/global/tab-divider.png ) right;
		letter-spacing:0px;
		font-family:Arial, Helvetica, sans-serif; 
		font-size:12px; }
	
	ul.tabs li.last,
	ul.tabs li:last-child {
		padding:0px 0px 0px 3px;
		background:none; }
		
	ul.tabs li a.highlight {
		color:#658699; }
	
	/*
	=:pagination
	- rules for pagination in search, ondemand
	----------------------------------------------------------------------------------------*/
	ul.pagination {
		position:absolute;
		top:11px;
		right:11px;
		font-size:11px;
		line-height:11px;  
		background:#FFF; }
	
	ul.pagination li{
		float:left;}

	ul.pagination li a,
	ul.pagination li b{
		float:left; 
		width:auto;
		padding:7px 9px 1px 8px; 
		background:transparent no-repeat url( /site/beta/image-panel/schedules/pagination-stroke-padded.png) top right;  }
	
	ul.pagination li:last-child a,
	ul.pagination li:last-child b,
	ul.pagination li.LAST a,
	ul.pagination li.LAST b{
		background:none; }
		
	ul.pagination li b {
		color:#658699;  }

	/*
	=:arrows
	- right double arrows for links &raquo
	----------------------------------------------------------------------------------------*/
	a.arrows {
		padding-right:9px; 
		background:transparent url(/site/beta/image-panel/global/link-arrows.png) no-repeat scroll right 5px; }
		
		
	/* No surrender, No delete! */