/*-------------------------=Home Page Layout-------------------------*/

#mainContentHome {
    margin-top: 5px;
    padding-bottom: 5px;
    width: 35.9em;
    float: left;
    clear: left;
    /*border: 1px solid #FF00FF;*/
    }
    
#mainContentHome h2 {line-height: normal; color: #BD282E;}
	
#mainContentHome h2 a {display: inline; color: #BD282E;}
	
#mainContentHome h2 a:hover {color: #000;}
    
/*-------------------------=Featured Programme-------------------------

The following css is needed to activate the url click on the banner without embedding the 
link within Flash. This is a similar setup to what has been created for the banner ads on the Genre
and News & Ratings Pages*/

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

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

/*The following styles the area for the non-Flash Featured Programme*/

#plainFeatureBackground {
    padding: 5px;
    background-image: url(../images/BackgroundTile_Content.png);
    background-repeat: repeat;
    border: solid 1px #EEE;
    }

#plainFeatureBackground a {display: block;}

#plainFeatureBackground a img {
    margin-right: 8px;
    width: 20.5em /*22.3em 24.1em 266px*/;
    height: 16em /*14.9em 177px*/;
    float: left;}

#plainFeatureBackground div.details {float: left; text-align: left; width: 12.5em /*11em*/;}

#plainFeatureBackground div.details p {margin-bottom: 5px; line-height: 1.4em;}

#plainFeatureBackground h3 {
    margin-bottom: 5px;
    font-size: 1.1em;
    font-family: Arial, Helvetica, sans-serif;
    }
    
/*Temporary style below for the player container found of the home page - only applicable for show case release*/

.showCasePlayerBackground:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
        
.showCasePlayerBackground {display: inline-block;}
/*Hides from IE-mac*/
.showCasePlayerBackground {display: block;} 
/*end hide from IE-mac*/

.showCasePlayerBackground {
    background-image: url(../images/BackgroundTile_Content.png);
    background-repeat: repeat;
    border: solid 1px #EEE;   
    }

/*---------=featuredItem (6 items that appear underneath the featured programme area, New to Preview etc)---------*/

.featuredItem_Wrapper,
.featuredItemMid_Wrapper,
.featuredItemEnd_Wrapper {
	margin-right: -1px;
	width: 12em;
	float: left;
	}
	
.featuredItem_Wrapper:after,
.featuredItemMid_Wrapper:after,
.featuredItemEnd_Wrapper:after {/*Added in .clearfix*/
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
        
.featuredItem_Wrapper,
.featuredItemMid_Wrapper,
.featuredItemEnd_Wrapper {display: inline-block;}
/*Hides from IE-mac*/
.featuredItem_Wrapper,
.featuredItemMid_Wrapper,
.featuredItemEnd_Wrapper {display: block;}
/*end hide from IE-mac*/
 
.featuredItemEnd_Wrapper {margin-left: 1px;}
	
.featuredItem {
	background-image: url(../Images/BackgroundTile_Content.png);
    background-repeat: repeat;
	border: solid 1px #EEE;
	min-height: 11em;
	}
	
.featuredItem img {width: 100%;}
	
#mainContentHome .featuredItem h2 {
	margin: 6px;
	line-height: 1.1em;
	}
	
#mainContentHome .featuredItem h2 a {display: block; border: none;}

    
#plainFeatureBackground h2 a:link.disabledLink,
#plainFeatureBackground h2 a:visited.disabledLink,
#plainFeatureBackground h2 a:hover.disabledLink, 
#plainFeatureBackground h2 a:active.disabledLink {color: #BD282E; cursor: text;}
   
/*---------=RightColumn (Home page right column, recent favourites, previews, welcome message etc.)---------*/  

#rightColumnHome {
    margin: 10px auto;
	float: left;
	width: 16em;
	text-align: left;
	/*border: 1px solid #FFCC33;*/
    }
    
#rightColumnHome h2 {padding-left: 5px; color: #BD282E;}
  
#rightColumnHome a:link,
#rightColumnHome a:visited,
#rightColumnHome a:hover,
#rightColumnHome a:active {
    line-height: 1.4em;
    padding: 1px;
    color: #333;
    border-bottom: 1px dotted Transparent;
    }

#rightColumnHome a:hover {
    color: #BD282E;
    border-bottom: 1px dotted #BD282E;
    }

#rightColumnHome .favouriteIcon {
    margin-right: 5px;
    float: left;
    /*border: 1px solid #FF0033;*/
    }
    
#latestFavourites,
#latestPreviews,
#welcomeMessage, 
#newPrintCatalogue {margin: 0 6px; min-height: 9em;}
    
#welcomeMessage {
    margin: 0;
    padding-top: 4px;
    /*This padding needs to be removed after showcase release, when #newPrintCatalogue is used again
    it's currently hidden on the .aspx page*/
    margin-left: 5px;
    }

#welcomeMessage, 
#newPrintCatalogue {min-height: 8em;}

#latestFavourites p,
#latestPreviews p,
#newPrintCatalogue p {margin: 0 6px; line-height: 1.4em;}

#rightColumnHome div.messageWrapper {
    width: 70%;
    float: right;
    /*border: 1px solid red;*/
    }
    
#rightColumnHome div.messageWrapper:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
        
#rightColumnHome div.messageWrapper {display: inline-block;}
 /*Hides from IE-mac*/
#rightColumnHome div.messageWrapper {display: block;}
 /*end hide from IE-mac*/   

#rightColumnHome div.speechBubble {
	padding: 3px;
	width: inherit;
	background-color: #FFF;
    min-height: 3.5em;	
    }
    
#rightColumnHome div.speechBubble h2 {
    margin-bottom: 0;
    padding: 3px;
    text-transform: none;
    /*color: #333;*/
    }

#rightColumnHome div.speechBubble p {
    padding: 0 3px 5px 3px;
    line-height: 1.4em;
    background: none;
    }
    
#rightColumnHome div.speechBubble a {border-bottom: dotted 1px #333;}
#rightColumnHome div.speechBubble a:hover {border-bottom-color: #BD282E;}
    
div.messageMan {
    margin: -6px -6px 0 0;
    width: 4.5em;
    height: 6em;
    float: right;
    background-image: url(../images/WelcomeMessageMan.png);
    background-repeat: no-repeat;
    background-position: bottom right;
    }

/*--------- =newsTicker ---------*/

#newsTicker {
    margin: 6px 5px;
    padding: 2px 6px;
    background-image: url(../images/BackgroundTile_Content.png);
    background-repeat: repeat;
    }
    
#newsTicker h2 {
    margin-bottom: 0;
    width: 7.5em;
    float: left;
    line-height: 1.6em;
    color: #BD282E;
    }    

#newsTicker p {
    padding: 3px 0;
    width: 25em;
    float: left;
    color: #000;
    line-height: normal;
    }
    
#newsTicker a {display: block;}

#newsTicker a:link,
#newsTicker a:visited,
#newsTicker a:hover,
#newsTicker a:active {
    color: #555;
    padding-left: 0;
    }

#newsTicker a:hover {
    color: #000;
    }