@charset "UTF-8";
/*- - - - - - - - - -
Feuille de style "layout"
- - - - - - - - - -
Les Moquettes Coquettes - Télé Québec
Par Alexis Melançon
Août 2009
*/

/* 
- - - - - - - - - - - - - - -
        GENERAL LAYOUT
- - - - - - - - - - - - - - -
*/

* { margin: 0; padding: 0; }
img{border:none;}
html{height:100%; width:100%; margin:0; padding:0;}
body{height:100%; width:100%; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FFF; background-color:#293441; background:url(../images/bg_centre.gif) no-repeat #293441; background-position:center 348px }

.clear{ clear:both;}

.floatContainer { width:100%; overflow:hidden }

:focus
{
    outline: none;
}

.hide
{
    display:none !important;
}
/****** commun *******/

.commentairesIco{
	background:url(../images/ico_comments_small.png) no-repeat;
	padding-left:23px;
	margin-top:2px;
}


/* ---------------------------- */

#container{
	margin:0 auto;
	text-align:left;
	width:940px;
	position:relative;
	height:100%;
}

/*----- HEADERS --------*/

#headerTQ{/*height:194px;*/ height:50px; background-color:#0033CC;}

#headerMC{ height:298px;background-color:#000; position:relative; background-image:url(../images/photo_header_MC.jpg); background-repeat:no-repeat}

	#diffusion{ width:284px; position:absolute; right:0px; padding:12px}

	#menu {height:50px; width:100%; background: url(../images/menu/chunk_droite.jpg) right repeat-x; position:absolute; bottom:0px;}
	#menu li{
		list-style-image:none;
		float:left;
		display:inline;
	}
	
	#paranav{
		position:absolute; top:225px; left:631px;
		font-size:9px; text-align:center;
		padding:0 19px;
	}
	#paranav IMG{ padding-bottom:3px}
	
	#paranav DIV{float:left; display:inline;}

/*----- SOUS MENUS -----------*/


DIV.sousMenu{
	position:absolute; top:-200px;z-index:10000;
}
#sousMenuMoquettes{
	left:381px; width:124px;
}
	
/*----- MAIN CONTENT AREA -----*/


#content{ position:relative; padding:25px 0px; overflow: hidden; width: 100%; background: url(../images/bg_content.gif) no-repeat;}

	#col1{
		float:left;
		width:515px;
		margin-left:55px;
		display:inline;
	}
	
	#col2{
		float:left;
		width:305px;
		margin-left:55px;
		display:inline;
	}
	


#media #tabs { margin:20px 0 0 10px}
#media #tabs DIV{ float:left }

#media #photoViewer{
	width:515px; height:318px;
	border: 1px solid #3b3b3b;
	position:relative;
}
#media .photoFleche{
	position:absolute;
	top:130px;
}
#media .back{
	left:24px;
}
#media .next{
	right:24px;
}
#media .count{
	position:absolute;
	bottom:5px;
	text-align:center;
	width:515px;
	font-size:14px;
}

#blogPostComplete{
	position:relative;
	background-color:#248393;
	padding:20px;
	margin:20px 0;
}

.encadreGauche{
	position:relative;
	width:100%;
	background:#393939;
}

.shareIcon{
	padding:5px 10px 0px 0px;
	float:right;
}

#vidIcones DIV{float:left; display:inline; margin-bottom:10px;}

#ajoutCommentaire TEXTAREA{
	width:493px; height:99px;
	border:none;
	background: url(../images/commentsTextarea_bg.gif) no-repeat #FFF;
	padding:10px;
}

#commentaireFeedback{
	width:515px; height:100px;
	background:url(../images/1px_black_60.png) repeat;
	position:absolute; top: 0xp; left: 0px;
	text-align:center; padding-top:20px;
}
	

* html #listSegments, #listCommentaires{ 
   height: expression( this.scrollHeight > 347 ? "348px" : "auto" ); /* sets max-width for IE */
}


#listSegments, #listCommentaires{
	overflow:auto;
	max-height:348px;
	position:relative;
}

#listCommentaires .commentaire{
	width:482px;
	position:relative;
	margin-bottom:10px;
}



#listCommentaires .pink{ background:url(../images/commentairePinkBg.gif) no-repeat #71153e center top }
#listCommentaires .blue{ background:url(../images/commentaireBlueBg.gif) no-repeat #1b5f67 center top }

#listSegments .segment, .blogPost{
	width:482px;
	position:relative;
	margin-bottom:10px;
	cursor: pointer;
}
#listSegments .lightgray{
	background-color:#242424;
}
#listSegments .darkgray{
	background-color:#181818;
}

#listSegments .lookDisable{
	color:#777777 !important;
}

h4.lookDisable{
	color:#777777 !important;
}

#listSegments .pink{
	color:#FC308B !important;
}

#listCommentaires .commentaireContent{
	padding:20px;
}

#listSegments .segmentContent{
	padding:8px;
}
#listSegments DIV.image{
	float:left;
	position:relative;
}
#listSegments DIV.infos{
	float:left;
	margin-left:15px;
	width:285px;
}

#listSegments DIV.icones{
 	margin-top:8px;
}
#listSegments DIV.icones DIV{
	float:left;
}
	
.smallLink
{
    font-size:0.75em;
    
}

.smallLink:hover
{
    text-decoration:underline;
    color:#FC308B;
}
/******** COLONNE DROITE (2) ******/
#twitterHead{
}

#twitterBox{
	width:269px; height:144px;
	background-color:#FFF;
	position:relative;
	padding:20px 13px 13px 13px;
	margin-top:13px;
}
#twitterBox #twitterContent{
	overflow:auto;
	height:138px;
}

#twitterBox #twitterContent #post{
	padding-bottom:20px;
	background:url(../images/twitter_separator.gif) repeat-x bottom;
}

.TwitterFeed
{
    overflow:hidden;
}

#post
{
    overflow:hidden;
    max-width:245px;
}

.avenirBox{
	width:279px;
	background:url(../images/bg_boite_avenir.gif) repeat-x #2a2a2a;
	position:relative;
	padding:13px;
	cursor:pointer;
	margin-top:-2px;
	/*margin-top:13px;*/
}

.avenirBox DIV.image{float:left; position:relative}
.avenirBox DIV.infos{float:left; width:165px; padding-left:10px}


#encadreDroit{
	position:relative;
	width:100%;
	background:#4d4d4d;
}
#encadreDroit DIV.infos{ padding:15px;}


#separateur{
	width:100%;
	height:6px;
	background:url(../images/separateur_dot.gif) repeat-x center;
	margin:15px 0;
}

.videoplayer
{
    height:318px;
    z-index:500;
}

/*------ FOOTERS ------*/
#footer{ clear:both; height:50px; background:#000000; color:#000; text-align:center;}
.logo { padding-left:15px; padding-right:15px;}

/*------ POUR LES CORNER BOX **********/
.cornerWhite6 { position: absolute; width: 6px; height: 6px; background: url(../images/karate_round_white_small.gif) no-repeat; font-size: 0%; }
.cornerLightGray6 { position: absolute; width: 6px; height: 6px; background: url(../images/karate_round_lightgray_6.gif) no-repeat; font-size: 0%; }
.cornerDarkGray6 { position: absolute; width: 6px; height: 6px; background: url(../images/karate_round_darkgray_6.gif) no-repeat; font-size: 0%; }
.innerLightGray4{position: absolute; width: 4px; height: 4px; background: url(../images/karate_inner_lightgray_4.png) no-repeat; font-size: 0%}
.innerDarkGray4{position: absolute; width: 4px; height: 4px; background: url(../images/karate_inner_darkgray_4.png) no-repeat; font-size: 0%}
.inner5a5a5a4{position: absolute; width: 4px; height: 4px; background: url(../images/karate_inner_5a5a5a_4.png) no-repeat; font-size: 0%}
.innerBlack6{position: absolute; width: 6px; height: 6px; background: url(../images/karate_inner_black_6.png) no-repeat; font-size: 0%}



.TL6 { top: 0; left: 0; background-position: 0 0; }
.TR6 { top: 0; right: 0; background-position: -6px 0; }
.BL6 { bottom: 0; left: 0; background-position: 0 -6px; }
.BR6 { bottom: 0; right: 0; background-position: -6px -6px; }

.TL4 { top: 0; left: 0; background-position: 0 0; }
.TR4 { top: 0; right: 0; background-position: -4px 0; }
.BL4 { bottom: 0; left: 0; background-position: 0 -4px; }
.BR4 { bottom: 0; right: 0; background-position: -4px -4px; }


/**** Twitter Box *****/
a.twitterlinks
{
    color:#FC308B !important;
    text-decoration:none;
    overflow:hidden;
}

a.twitterlinks:hover
{
    color:#9D017E !important;
    text-decoration:underline;
}


/**** Pub ***/

.pub
{
    width:300px;
    height:10px;
    
    background:url(../images/txt_pub_hor.gif) no-repeat center;
    padding-bottom:5px;
    
}

.pub_vert
{
    width:8px;
    height:90px;
    
    background:url(../images/txt_pub_ver.gif) no-repeat center ;
    padding-bottom:5px;
    text-align:center;
    
}

div.pubSuperContainer {
padding:3px 0;
}

div.pubSuperParentLeft {
background:transparent url(../images/txt_pub_ver.gif) no-repeat scroll 5px 50%;
margin:0 auto;
padding:0 5px 0 18px;
width:741px;
}

div.pubSuperParentRight {
background:transparent url(../images/txt_pub_ver.gif) no-repeat scroll 100% 50%;
height:90px;
padding-right:13px;
width:728px;
}

div.pubSuperContainer div.pub {
height:90px;
width:728px;
}

div.pub {
overflow:hidden;
text-align:center;
}

/** override tq bar **/
.mcTQBAR
{
    width:940px !important;
}


p#tagFiche {
background-color:#FC308B;
background-position:100% 50%;
background-repeat:no-repeat;
color:#FFFFFF;
float:left;
font-size:9px;
font-weight:bolder;
margin-top:-10px;
padding:4px !important;
text-transform:uppercase;
}