/*The following stylesheet styles the =Genre, =NewsAndRatings, =ThemedPromotions and Microsites_Default promotion screens

/*---- =ThemedPromotions ----
The following is uses a class, rather than an id because a repeater control is used on the
ThemedPromotions/Default.aspx page*/

.themedPromoDetail {margin: 5px 5px 0 5px; padding: 5px;}
    
.themedPromoDetail h2 {
    margin: 0 4px 0 0;
    float: left;
    /*font-style: italic;*/
    text-transform: none;
    line-height: 1.4em;
    }

.themedPromoDetail h2 a:link,
.themedPromoDetail h2 a:visited,
.themedPromoDetail h2 a:hover,
.themedPromoDetail h2 a:active {margin-bottom: 6px; color: #BD282E; border-bottom: dotted 1px #BD282E;}   
     
.themedPromoDetail h2 a:hover {color: #000; border-bottom: dotted 1px #000;}
    
.themedPromoDetail p {margin-bottom: 6px; line-height: 1.6em;}

h2.ThemedPromotions
{
	padding-bottom:20px;
}
    
/*----------------------------=Genre, News and Ratings Screens----------------------------

The following css is needed to activate the url click on the banner without embedding the 
link within Flash*/

#bannerColour {
    height: 60px;
    z-index: -3;
    background-image: url(../images/BackgroundTile_Content.png);
    background-repeat: repeat;
    }

#bannerWrapper {position: relative; z-index: 0;}
	
#overlapClick,
#flashContent {
	position: absolute;
	top: 0;
	left: 0;
 	z-index: -1; 
	width: 100%;
	height: 60px;
	}
	
#overlapClick a:link,
#overlapClick a:visited,
#overlapClick a:hover,
#overlapClick a:active {display: block; height: 60px; background-image: url(../images/Clear_800x600.gif);}
	
#flashContent {z-index: -2;}

/*--------------------------=NewsItemProgramme----------------------------
The following style the news items, found in the Genre and News and Ratings pages - A lot
of these styles are similar to those found on the Search Results and programme pages.
I've separated them though because there may be instances where they differ, it's also easier
to separate the code into 2 distinct areas. There are also 2 kinds of news items, a programme
related and a non-programme related news item, the styling for these will vary too.*/

.newsItemWrapper {
    margin: 0 10px;
    padding: 10px 0;
    border-bottom: 1px dotted #666;
    }
 
/*Applying .clearfix to this style because it's a repeater and so can't use a div with class*/
.newsItemWrapper:after{
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
        
.newsItemWrapper {display: inline-block;}
/*Hides from IE-mac*/

.newsItemWrapper {display: block;}
/*end hide from IE-mac*/
    
.newsItemImage_Wrapper {
    margin-right: 10px;
    padding: 5px;
    float: left;
    text-align: center;
    width: 180px;
    display: block;
    border: solid 1px #CCC;
    background-color: #EEE;
    }

/*.newsNarrow is for the first news item on the page so that the favourites and preview graphic don't
interfer with layout*/
.newsItem,
.newsItemNarrow {/*float: left; width: 30.5em;*/ margin: 0 auto;}
	
.newsItemNarrow {/*width: 27.5em;*/ margin: 0; margin-right: 35px;}

/*Applying .clearfix to this style because it's a repeater and so can't use a div with class*/
.newsItem:after,
.newsItemNarrow:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
        
.newsItem, .newsItemNarrow {display: inline-block;}
/*Hides from IE-mac*/
.newsItem, newsItemNarrow {display: block;}
/*end hide from IE-mac*/
	
.newsItem h2,
.newsItemNarrow h2 {
    text-transform: uppercase;
    font-size: 1.1em;
    color: #333;
    }
	
.newsItem h2 a,
.newsItemNarrow h2 a {border-bottom: dotted 1px #000;}
   
.newsItem h2 a:link,
.newsItem h2 a:visited,
.newsItem h2 a:hover,
.newsItem h2 a:active,
.newsItemNarrow h2 a:link,
.newsItemNarrow h2 a:visited,
.newsItemNarrow h2 a:hover,
.newsItemNarrow h2 a:active {color: #333; border-bottom-color: #333;}
	
.newsItem h2 a:hover,
.newsItemNarrow h2 a:hover {color: #000;}

/*=GenreColours into programme title's rollover*/
    
/*Children's*/
.childrens .newsItem h2 a:hover,
.childrens .newsItemNarrow h2 a:hover {color: #FE9D1A; border-bottom-color: #FE9D1A;}
/*Comedy*/
.comedy .newsItem h2 a:hover,
.comedy .newsItemNarrow h2 a:hover {color: #DF5623; border-bottom-color: #DF5623;}
/*Current Affairs & Documentaries*/
.currentAffairs .newsItem h2 a:hover,
.currentAffairs .newsItemNarrow h2 a:hover {color: #830A2B; border-bottom-color: #830A2B;}
/*Drama*/
.drama .newsItem h2 a:hover,
.drama .newsItemNarrow h2 a:hover {color: #BD282E; border-bottom-color: #BD282E;}
/*Factual Entertainment & Leisure*/
.leisure .newsItem h2 a:hover,
.leisure .newsItemNarrow h2 a:hover {color: #C74D9E; border-bottom-color: #C74D9E;}
/*History*/
.history .newsItem h2 a:hover,
.history .newsItemNarrow h2 a:hover {color: #308D82; border-bottom-color: #308D82;}
/*Music*/
.music .newsItem h2 a:hover,
.music .newsItemNarrow h2 a:hover {color: #712B7E; border-bottom-color: #712BD8;}
/*Natural History*/
.naturalHistory .newsItem h2 a:hover,
.naturalHistory .newsItemNarrow h2 a:hover {color: #A1B13A; border-bottom-color: #A1B13A;}
/*Science*/
.science .newsItem h2 a:hover,
.science .newsItemNarrow h2 a:hover {color: #333489; border-bottom-color: #333489;}
/*Formats*/
.formats .newsItem h2 a:hover,
.formats .newsItemNarrow h2 a:hover {color: #1A959F; border-bottom-color: #1A959F;}
/*Others applied to unassigned genres etc*/
.unassignedGenre .newsItem h2 a:hover,
.unassignedGenre .newsItemNarrow h2 a:hover,
.generic .newsItem h2 a:hover,
.generic .newsItemNarrow h2 a:hover {color: #666; border-bottom-color: #666;}	
    
.newsItem h3,
.newsItemNarrow h3 {
	margin: 5px 10px 8px 0;
	color: #333;
	font-size: 1.1em;
	font-family: Arial, Helvetica, sans-serif;
	}
    
.newsItem ul,
.newsItemNarrow ul,
.newsItemLinks ul {padding: 5px 0; /*border: solid 1px orange;*/}

.newsItem ul li,
.newsItemNarrow ul li,
.newsItemLinks ul li {padding-right: 22px;}

.newsItemLinks li {
    margin-left: 16px;
    margin-bottom: 5px;
    /*margin-left: 33px;*/
    list-style-type: square;
    line-height: 1.4em;
    }

.newsItem p,
.newsItemNarrow p {color: #333; line-height: 1.6em;}
	
.newsItemLinks ul li a {
    padding: 1px 2px;
    color: #000;
    border-bottom: 1px dotted #000;
    }
 
div.findOthers {margin: 5px; padding: 5px 0; clear: both;}

div.findOthers p {margin: 0 5px; color: #333;}

div.findOthers a {
    padding: 1px 2px;
    line-height: 1.6em;
    color: #000;
    border-bottom: dotted 1px #333;
    }
    
/*--------------------------=GenreColours into News Items----------------------------*/

/*Children's*/
.childrens .newsItemWrapper ul li a:hover,
.childrens div.findOthers a:hover {background-color: #FE9D1A; border-bottom-color: #FE9D1A;}
/*Comedy*/
.comedy .newsItemWrapper ul li a:hover,
.comedy div.findOthers a:hover {background-color: #DF5623; border-bottom-color: #DF5623;}
/*Current Affairs & Documentaries*/
.currentAffairs .newsItemWrapper ul li a:hover,
.currentAffairs div.findOthers a:hover {background-color: #830A2B; border-bottom-color: #830A2B;}
/*Drama*/
.drama .newsItemWrapper ul li a:hover,
.drama div.findOthers a:hover {background-color: #BD282E; border-bottom-color: #BD282E;}
/*Factual Entertainment & Leisure*/
.leisure .newsItemWrapper ul li a:hover,
.leisure div.findOthers a:hover {background-color: #C74D9E; border-bottom-color: #C74D9E;}
/*History*/
.history .newsItemWrapper ul li a:hover,
.history div.findOthers a:hover {background-color: #308D82; border-bottom-color: #308D82;}
/*Music*/
.music .newsItemWrapper ul li a:hover,
.music div.findOthers a:hover {background-color: #712B7E; border-bottom-color: #712BD8;}
/*Natural History*/
.naturalHistory .newsItemWrapper ul li a:hover,
.naturalHistory div.findOthers a:hover {background-color: #A1B13A; border-bottom-color: #A1B13A;}
/*Science*/
.science .newsItemWrapper ul li a:hover,
.science div.findOthers a:hover {background-color: #333489; border-bottom-color: #333489;}
/*Formats*/
.formats .newsItemWrapper ul li a:hover,
.formats div.findOthers a:hover {background-color: #1A959F; border-bottom-color: #1A959F;}  
/*Others applied to unassigned genres etc*/
.unassignedGenre .newsItemWrapper ul li a:hover,
.unassignedGenre div.findOthers a:hover,
.generic .newsItemWrapper ul li a:hover,
.generic div.findOthers a:hover {background-color: #666; border-bottom-color: #666;}

.newsItemLinks ul li a:hover,
div.findOthers a:hover {color: #FFF;}

/*--------------------------=Microsites_Default : BEGIN ----------------------------*/

.MicrositePage {margin: 5px 5px 0 5px; padding: 5px;}
    
.MicrositePage h2 {
    margin: 0 4px 0 0;
    /*float: left;*/
    /*font-style: italic;*/
    text-transform: none;
    line-height: 1.4em;
    }

.MicrositePage h2 a:link,
.MicrositePage h2 a:visited,
.MicrositePage h2 a:hover,
.MicrositePage h2 a:active {margin-bottom: 6px; color: #BD282E; border-bottom: dotted 1px #BD282E;}   
     
.MicrositePage h2 a:hover {color: #000; border-bottom: dotted 1px #000;}
    
.MicrositePage p {margin-bottom: 6px; line-height: 1.6em;}

.MicrositeScreenWrapper
{
	background-color:#EEEEEE;
	border:1px solid #CCCCCC;
	display:block;
	float:left;
	margin-right:10px;
	padding:5px;
	margin:15px 0px 0px 0px;
}

.MicrositePage .clear
{
	clear:both;
	height:0px;
	/*height:1px;*/
	overflow:hidden;
	width:100%;
}

.MicrositeLinkWrapper
{
	width:100%;
}

.WhiteBorder
{
	height:1px;
	border-top:1px solid #ffffff;
	margin:18px 0px 10px 0px;
}
/*--------------------------=Microsites_Default : END ----------------------------*/
/*-------------------------- SHOWCASE 2009 FEATURED: BEGIN ----------------------------*/

.FeaturedBrochure
{
	width:100%;
}

.FeaturedBrochure h2
{
	float:none;
	padding-bottom:10px;
	
}

.FeaturedBrochure p
{
	
}

.PDFthumbnail 
{
	background-color:#EEEEEE;
	border:1px solid #CCCCCC;
	float:right;
	margin:0px 30px 30px 40px;
	padding:5px;
	text-align:center;
}


/*-------------------------- SHOWCASE 2009 FEATURED: END ----------------------------*/