/* --------------------------------------------------------
    Home stylesheet
    Site: Québec Scope Magazine
    Created by: Stephanie Leveille- stef@nofolo.com
    Filename: home.css
   -------------------------------------------------------- */


body.pageAccueil .content {
	background: url(../images/acc/contentAccBottomBack.png) left bottom no-repeat;
	padding-bottom: 3px;
	width: 1005px;
}
body.pageAccueil .content .contentTop { background: url(../images/acc/contentAccTopBack.png) no-repeat; height: 7px; }
body.pageAccueil .content .contentCenter { 
	background: url(../images/acc/contentAccBack.png) repeat-y; 
	padding-left: 5px;
	width: 1000px;
}
   
ul.col {  
	display: inline;
	float: left;
	margin: -7px 0 0;
	padding:7px 0 0;
	width: 250px;
}
ul.col li.video { height: 141px; position: relative; width: 250px; }
ul.col li { 
	display: inline;
	float: left;
	height: 125px;
	width: 125px;
	position: relative;
}
ul.col a.maskImg {
	background: url(../images/maskImg.png) top left no-repeat;
	display: block;
	height: 125px;
	position: absolute;
	width: 125px;
}
ul.col a.maskImg:hover { background: url(../images/maskImg.png) bottom left no-repeat; }

ul.col li.video a {
	background: url(../images/videos/maskVideo.png) no-repeat;
	display: block;
	height: 141px;
	position: absolute;
	text-decoration: none;
	width: 250px;
	z-index: 10;
}
span.tagScopeTV {
	background: url(../images/videos/tagScopeTV.png) no-repeat;
	display: block;
	height: 11px;
	position: absolute;
	right: 9px;
	text-indent:  -9999em;
	top:6px;
	width: 50px;
}

span.btnPlay {
	background: url(../images/videos/btnPlayVideo.png) center no-repeat;
	display: block;
	height: 141px;
	text-indent:  -9999em;
	width: 250px;
}

a span.videoDesc {
	background: url(../images/videos/TrameVideo.png) repeat-x;
	bottom: 5px;
	color: #fff;
	display: block;
	font-size: 90%;
	height: 26px;
	line-height: 26px;
	position: absolute;
	overflow: hidden;
	width: 244px;
	z-index: 5;
}
span.videoDesc span {
	background: url(../images/videos/puceVideo.png) center left no-repeat;
	display: block;
	float: left;
	height: 26px;
	margin: 0 6px 0 3px;
	width: 20px; 
}

#tooltip { 
    background:transparent url(../images/tooltip/toolTipBackBottom.png) left bottom no-repeat; 
    color:#1b273a;
    display:none;
    font-weight: bold;
    min-height:51px; 
    width:171px; 
	position: absolute;  
    z-index: 3000;
}

#tooltip span {
	background: transparent url(../images/tooltip/toolTipBackTop.png) no-repeat;
	display: block;
	margin-top: -11px;
	padding: 10px 13px 25px;
	width: 145px;
}

#tooltip h3 {
	color: #fff;
	font-weight: bold;
	line-height: 1.2em;
	margin: 0;
	text-transform: uppercase;
}
#tooltip div.body { font-size:80%; line-height: 1.2em; }

/* --------------------------------------------------------
    MENU
   -------------------------------------------------------- */
#mainNav { height: 80px; width: 1005px; margin: 0; overflow: hidden;}

#mainNav li { display: inline; float: left; height: 113px; }
#mainNav li a {
	background-image: url(../images/acc/menuAcc.png);
	background-repeat: no-repeat;
	display: block;
	float: left;
	height: 80px;
	text-indent: -9999em;
}


#mainNav li.mQuoiFaire a { background-position: 0 0; width: 225px; }
#mainNav li.mQuoiFaire a:hover, #mainNav li.mQuoiFaire a.active { background-position: 0 -80px;}
#mainNav li.mManger a { background-position: -225px 0; width: 313px;}
#mainNav li.mManger a:hover, #mainNav li.mManger a.active { background-position: -225px -80px; }
#mainNav li.mShopping a { background-position: -538px 0; width: 231px;}
#mainNav li.mShopping a:hover, #mainNav li.mShopping a.active { background-position: -538px -80px; }
#mainNav li.mPhotos a { background-position: -769px 0; width: 236px;}
#mainNav li.mPhotos a:hover, #mainNav li.mPhotos a.active { background-position: -769px -80px; }
#mainNav li.mAccueil { display: none; }