/**********************************************
   *  Unstyle
   
	*  - set of rules to clean/standardise the default styles in some browsers  
   */

		body,ul,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,dl,dt,dd,div
			{ margin:0px; padding:0px; font-weight: normal; }	
		
		body
			{ 
			background-color: #ffffff;
			color: #000000;
			margin: 0px 0px 30px 0px;	
			}
		
		ul,li,ol
			{ list-style: none; }
		
		a img,:link img,:visited img
			{ border: none; }
		
		a,a:link,a:hover,a:visited
			{ text-decoration: none; }
		
		label
			{ cursor: hand; }
		
		h1,h2,h3,p
			{ font-size: 1.0em; }	

	/* ---- bbc specific issues ---- */			
		.bbcpageCrumb a
			{ /* */ }
		
		.bbcpageServices hr /* hr picks up default hr styling of page, so remove */
			{ visibility: hidden; }
		
		.bbcpageServices font
			{ /* */ }

		a.bbcpageServices, .bbcpageToplefttd, .bbcpageToplefttd a, .bbcpageToplefttd font
			{ /* */ }
			
		a.bbcpageFooter
			{ /* */ }

			
/**********************************************
	* Boxes
	* - genric set of box styles
	* - typically can be applied to any block element
	*/			
	
	/* --- */
		.box-barker /* 3d, drop shadow */
			{
			border-width: 1px 5px 5px 1px;
			border-color: #000;
			border-style: solid;
			margin: 5px;
			padding: 10px;
			}	
			
	/* --- */
		.box-coogan h2
			{ /* essentially a vertical implementation of sliding doors - http://www.alistapart.com/articles/slidingdoors/ */
			background-image: url(/staticarchive/d50d3c48420a14b00fe21a4853e127943b3a2a20.gif);
			background-position: top center;		
			background-repeat: no-repeat;
			}
				
		div.box-coogan
			{
			background-image: url(/staticarchive/8fb537e40e71607bf7b59e0f6eb95b62202c88b5.gif);
			background-position: bottom center;
			background-repeat: no-repeat;		
			}	

		div.box-coogan p, div.box-coogan h2
			{ margin: 5px; padding: 10px }
		
		/* override to margins of your box top & base */
		div.box-coogan p
			{ padding-top: 0px; padding-bottom: 29px; }
		
		div.box-coogan h2
			{ padding-top: 28px; padding-bottom: 0px; }		
		
	/* --- */
		div.box-rossiter
		 	{
			margin: 5px;
			padding: 5px;
			background-image: url(/staticarchive/533999959fabc19b990f2e3feab270f1affb5c10.gif);			
			}
		
		div.box-rossiter h2, div.box-rossiter p
			{
			padding: 5px;
			background: white;	
			}
			
		div.box-rossiter h2 {	
			margin-bottom: 5px;	
			}

	/* --- */
		.box-cleese, .box-cleese-base
			{
			width: 340px; /* hard-wired width required by IE, otherwise png render fails. so value needs to be overridden if box is used elsewhere */
			background-color: white;  /* opera5, ie4, macie5 etc. */
			}

		.box-cleese
			{
			bac\kground-image: url('/staticarchive/0c2aad818247c40ff79dca9c4d9db08f4839f3f3.png'); /* PNG24 support. ie4/5 op5 css backslash filter - http://centricle.com/ref/css/filters/tests/sbmh/ */
			_bac\kground-image: none;  /* negate bg-image on ie6 . http://www.daltonlp.com/daltonlp.cgi?item_id=217 */
			_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/staticarchive/0c2aad818247c40ff79dca9c4d9db08f4839f3f3.png');
			}		

		.box-cleese-base
			{
			bac\kground-image: url('/staticarchive/0c2aad818247c40ff79dca9c4d9db08f4839f3f3.png');
			_bac\kground-image: none;
			_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/comedy/css/1/screen/vanilla/assets/cleese-70pc-base.png');
			background-position: bottom center;
			height: 43px; /* doesn't need to stretch, as this is just a slap-on box base */
			}
			
		/* \*/
		.box-cleese, .box-cleese-base
			{ bac\kground-color: transparent; }
			/* TODO = document this */

		#grid-column-0 .box-cleese
			{ width: 132px; _width: 140px;}	/* left-nav width */

	/* --- */
		.box-atkinson
			{
			margin: 5px;
			padding: 10px;
			background-color: #DAE8E7;
			}		
		
		
		
/**********************************************
	* Horizontal/Vertical Dividers
	* - TODO - rename to seperator (xhtml2 lingo)
	*/			

	
	/* --- standard, default --- */
			hr
				{  /* plain version using inbuilt css styling */
				border-width: 0px 0 0 0;
				border-top: 2px dotted #369; /* override width */
				}
			
			hr, div.hr
				{
				clear: both;
				display: block;
				margin-right: 5px;
				}

	/* --- --- */		
			div.divider-pattern-a 
				{ 
				height: 10px; /* cases where horizontal rule needs more custom look & feel */
				background-image: url(/staticarchive/13ced2db8dce9cc5d32d05ff2180b658e55ae2ae.gif);
				background-repeat: repeat-x;
				background-position-x: center;
				}
			
			div.divider-pattern-a hr
				{ 	
				display: none;
				}


/**********************************************
* Lists
* - genric set of list styles
*/


	/* ---- left-hand navigation ---- */
		#grid-column-0 dl, #grid-column-0 ul
			{ margin: 10 0 10 0; padding-left: 8px; }
		
		#grid-column-0 .menu-brand
			{ padding-bottom: 3px; padding-top: 3px;  }
		
		#grid-column-0 li, #grid-column-0 dt, #grid-column-0 dd
			{ margin-bottom: 3px; }
		
		#grid-column-0 dt
			{ margin-top: 8px; }
		
		#grid-column-0 dt.nth-child-1
			{ margin-top: 0px; }


	/* ---- left-aligned indecies ---- */
		#grid-column-1 .lists-milligan, #grid-column-1-narrow .lists-milligan
			{ margin: 10 0 10 0; }
		
		.lists-milligan li
			{
			padding-bottom: 10px;
			/* \*/
			position: relative;
			/* */
			}
		
		.lists-milligan li img
			{
			display: block;
			left: 0px;
			margin: 0;
			/* \*/
			position: absolute;
			/* */
			top: 4px; /* small offset. visually pleasing */
			}
	
		.lists-milligan li h3 img /* override above for the title images */
			{
			/* \*/
			position: relative;
			display: inline;
			/* */
			}

		/* \*/
		.lists-milligan li /* image spacing for all list items */
			{ padding-left: 67px; }
		/* */
				
		.lists-milligan li img
			{ OFF_left: -67px; } /* IE box model hack, puts above left padding outside */
				/* though fixing a height on the li fixes this problem */

		/* \*/		
		.lists-milligan li.dawson /* to dawson. larger image spacing for first list item */
			{ padding-left: 130px; }
		/* */
		
		.lists-milligan li.dawson img
			{ OFF_left: -130px; }
		
		.lists-milligan a
			{ /* */ } /* TODO */

		#page-brand-home .lists-milligan
			{ margin-left: 10px; }

		.lists-milligan li
			{			
			min-height: 69px;			
			height: auto;
			_height: 69px;
			}
			
	/* ---- cast/crew credits ---- */
		.contents
			{ margin: 1em 0 1em 0; }
		
		.contents dt
			{ float: left; }
		
		.contents dt, .contents dd
			{ 
			background-image: url(/staticarchive/c3e95fbc0867cb2bc178a10d84e0f241b87a7e1d.gif);
			background-position: left bottom;
			background-repeat: repeat-x;
			}
		
		.contents dd
			{
			margin-bottom: 0.2em;
			text-align: right; /* align dd's to the right */
			}
		
		.contents span, .contents a
			{ background-color: white;  } /* overrides the background image in the textual items */


		/* flush */
		ul.flush-left, h2.flush-left
			{ margin-left: 10px; font-size: 0.76em; }			
		.flush-left a
			{ _position: relative; }
			
	/* ---- related links ---- */		
				
/**********************************************
	* Widgets
	* - ...
	*/			

   /* ---- pagination bar ---- */
		
		/* hide from mac ie 5 \*/
		.widget-page, .widget-page-info
			{ position: relative; }

		.widget-page
			{
			margin: 10 0 10 0;
			border-top: 2px solid #000;
			border-bottom: 2px solid #000;
			_height: 17px;
			min-height: 17px;
			}
		
		.widget-page-info
			{
			text-align: center;
			padding: 0 80 0 80; /* stop absolute positioning overlaying next/back on top of page number info 80px = enough space for 'next' (i.e 4 characters) */ 		/* hide from mac ie 5 \*/
			_margin-top: -3px;
			z-index: 0;  /* safari */
			}
		
		.widget-page-back, .widget-page-next
			{ 
			position: absolute;
			top: 0;
			z-index: 1;
			}
		
		.widget-page-back
			{ 
			left: 0; 
			text-align: left;
			padding-left: 1px;
			}
		
		.widget-page-next
			{
			text-align: right;
			right: 0;
			padding-right: 1px;
			}
		/* */

   /* ---- crumb trail ---- */
		ul.widget-crumb
			{ 
			height: 1em; /* neatens crumb bottom margins across browsers */
			margin: 5 0 0 0;
			}
		
		ul.widget-crumb li
			{
			background-image: url(/staticarchive/9650317f0d006718b2a2d9085078ea6133c0e66d.gif);
			background-position: left center;
			background-repeat: no-repeat;
			float: left;  /* vetical crumb */
			padding-right: 6;
			padding-left: 13px; /* TODO - fix image sizes with Tom */
			margin: 0px;
			}
			
		/* disables first node for crumb */
		ul.widget-crumb li.nth-child-1
			{
			padding-left: 0px;
			background-image: none;
			}


	
/**********************************************
   *  Screen
   *  - wrapper for screen/vanilla imports
   */



/**********************************************
	* Grid 
	* - defines all structural elements of site.
	*/

		div#grid-av
			{
			position: absolute;		
			top: 0px;
			padding: 5px;
			width: 200px;
			left: 420px;
			_height: 50px;
			min-height: 50px;	
			}
			
		div#grid-banner
			{ position: relative; }	
	
		div#grid-crumb	/* crumb */	
			{ clear: both;  }

		div#grid-foot	/* footer */
			{ clear: both; margin-bottom: 3em; }  /* clear floated columns */			
			
		h1#grid-head	/* header */	
			{ position: relative; } /* fix peekaboo IE */ 
		
		#page-brand-home .bbcpageGutter
			{ display: none; }			
			
	/* ---- grid-columns ---- */
				
		div#grid-columns /* wrapper around columns 1 & 2 in main body */
			{ padding: 5px 0 0 0; }
		
		div#grid-column-0 /* left-hand navigation column */
		 	{ } 
		
		div#grid-column-1	 /* main article */
			{
			float: left;
			width: 403px;
			}
			
		div#grid-column-1-full /* main article, where right-hand yields for wider pages */
			{ width: 100%;	}
		
		div#grid-column-1-narrow /* main article, where brand homepage */
			{
			float: left;
			width: 320px;	
			}
			
		div#grid-column-2	/* right-hand navigation */
			{
			float: left;
			margin-left: 8px;
			width: 204px;
			}
			
/**********************************************
   *  Typography
   *  - default font-style, typefaces,  
   */	

		*
			{ font-family: verdana, sans-serif; }
		
		h1 
			{ clear: both; font-size: 1.3em; }
		h2 
			{ position: relative; font-size: 0.9em; }
		h3 
			{ font-size: 0.8em; }
			
		p, #grid-column-0, .widget-page li, .widget-crumb li, div#grid-column-1 dl
			{ font-size: 0.78em; }	/* */
		
		h1, h2, h3
			{ font-weight: bold; }	
			
		#page-brand-article #grid-column-1 p, #page-brand-article #grid-column-1-full p
			{ line-height: 1.5em; }	
		
		span.first-letter
			{ /* reserved */ }
		
		span.first-word
			{ /* reserved */ }
				
		p.nth-child-1, p.nth-child-2, p.nth-child-3, p.nth-child-last
			{ /* reserved */ }
			
		a, a:link, a:visited, a:hover
			{ font-weight: bold; }
		
		#grid-column-1 p, #grid-column-1-full p
			{ margin: 0.8em 0 0.8em 0; }
		
/**********************************************
   *  Icon
   *  - icons adjacent to text
   */

		.icon
			{
			display: block;
			/*padding-left: 30px;*/
			/*background-repeat: no-repeat;*/
			background-position: left center;
			}
			
		.icon-video
			{
				background-repeat: no-repeat; /* reassert. for safari */
				background-image: url("/staticarchive/935f8fc9da8e858e0c6d8762922242514bcfa446.gif");
				padding-left: 30px;
				}

		.icon-audio
			{ background-image: url(); }


/**********************************************
   *  Images
   *  - icons adjacent to text
   */

		#grid-column-1 img.main
			{
			border: 1px solid #000000;
			display: block;
			margin-top: 5px;
			}