/* NFB.CA Special section
*   _____
*  / ___ \
* / / _ \ \
* \ \(_)/ /
*  \_   _/
*   |   |   équipe web ONF / 
*   |_|_|   NFB web team  / 2009
*   =====   
*
 * NFB in HD CSS styles
 * 12-2009
 */

/*
 * colors
 * 
 * hd blue : 66ccff
 * */

.hd_deco-top, .hd_deco-bot{background:url(../imgs/hd_channel-frame-bkg.jpg) center top no-repeat}
.hd_deco-top{background-position: center bottom}

.hd_deco-top{height:216px}
.hd_deco-bot{height:178px;clear:both}

.hd_deco-top h1{font:normal 3.6em/1em Arial, Helvetica, sans-serif;color:#66ccff;text-align:right;padding-top:64px;padding-bottom:30px}
.hd_deco-top h1 em{font-style:normal;color:#fff}

.video-tabs .title{font-size:2.4em;}
.video-tabs .tabbed-panel{border-top:1px solid #666;}
.video-extras {margin-top:32px;}
.hd-film-caroussel{margin-top:48px}
.hd-film-caroussel h2{text-transform:uppercase;font:normal 1.4em/1.2857em Arial, Helvetica, sans-serif;color:#66ccff;border-bottom:1px solid #66ccff}
.hd-film-list h2{font:normal 2.4em/1.5em Arial, Helvetica, sans-serif;color:#66ccff;}
.hd-warning{text-align:center;padding-top:64px;color:#999}
.hd-warning a:hover, .more-hd a:hover{color:#f90;text-decoration:underline;}

.hd-film-caroussel .carousel-viewport {margin:0 46px}
.chan-prev, .chan-next{width:50px;top:0px;background:#000 url(../imgs/hd-carousel-next.png) left top no-repeat}
.chan-prev{background-image:url(../imgs/hd-carousel-prev.png)}
.chan-prev:hover, .chan-next:hover{background-color:#000}
.hd-film-caroussel li, .hd-film-caroussel .vignette {height:207px;width:206px;}
.hd-film-caroussel .vignette {float:none;}
.hd-film-caroussel .vignette .inner {margin: 0 4px;}
.hd-film-caroussel .vignette .title {margin-bottom:0;}

.more-hd{text-align:center;}
	/*HD video + large monitor*/			
		.hd-video .video-screen-grid .norm-g-block{width:296px;float:right}
		.hd-video .video-screen-grid div.prim{width:644px;float:left}
		
		.frame-fix .hd-video .video-space{height:409px;width:644px;}
		.frame-fix .hd-video .video-tabs .tabbed-panel {height:162px}
	.more-hd span{color:#000;background-color:#fc6;font-weight:bold;padding:0 0.3em;}

.hd-wrap{width:996px;margin:0 auto}		
/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
	margin-top:18px;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0 50px;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list > li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 215px;
    height: 207px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */

.jcarousel-prev, .jcarousel-next{cursor:pointer;width:50px;height:117px;background:#000 url(../imgs/hd-carousel-bttn.png) right top no-repeat;position:absolute}
.jcarousel-prev{background-position:left 0}
.jcarousel-next{right:0}
.jcarousel-prev:hover{background-position:left -117px}
.jcarousel-prev:active{background-position:left -234px}
.jcarousel-next:hover{background-position:right -117px}
.jcarousel-next:active{background-position:right -234px}

.jcarousel-prev-disabled, .jcarousel-prev-disabled:hover{background-position:left -351px;cursor:default;}
.jcarousel-next-disabled, .jcarousel-next-disabled:hover{background-position:right -351px;cursor:default;}

.jcarousel-next {
    z-index: 3;
    display: none;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
}