/*----------------------------------------------------------------------------- 
ECOTRIP.QC.CA Screen Stylesheet 

version:   1.0 
date:      15/01/2010 
author:    Carl Servant / SÉQUENCE DIGITALE SENC 
email:     info@sequencedigitale.com 
website:   www.sequencedigitale.com/web/ 
version history: /templates/ecotrip/css/
-----------------------------------------------------------------------------*/




/*****************************************  
	GLOBALS RESET - NE RIEN CHANGER 
*****************************************/

	html, body, div, span, applet, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	a, b, abbr, acronym, address, big, cite, code,
	del, dfn, em, font, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-size: 100%;
		font-weight: normal;
		font-family: inherit;
		vertical-align: baseline;
	}

	:focus {
		outline: 0;
	}
	body {
		line-height: 1;
		color: black;
		background: white;
	}
	
	b, strong{
		font-weight: bold;
	}
	
	i{
		font-style: italic;
	}
	
	ol, ul {
		list-style: none;
	}
	
	small{
		font-size: 0.9em;
	}

	table {
		border-collapse: separate;
		border-spacing: 0;
	}
	caption, th, td {
		text-align: left;
		font-weight: normal;
	}
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: "";
	}
	blockquote, q {
		quotes: "" "";
	}
	
	.clearfix{
		clear: both !important;
	}
	
/************************************
	LIBRAIRIE
************************************/

	.align_center{
		margin: 0 auto;
	}

/************************************
	HTML TAGS GLOBALE
************************************/	
	
	a{
		-moz-outline-style: none;
	}
	
		a:hover{
			color: #000;
			text-decoration: underline !important;
		}
		
		a:visited{
			color: purple;
		}

	
	h1, h2, h3, h4, h5{
		clear: both;
		display: block;
		font-weight: bold;
	}
	
		h2{	
			color: #000;
			font-size: 1.6em;		
			margin: 1em 0;
			padding: 0.75em 0;
		}
		
		h3{		
			font-size: 1.1em;		
			margin-bottom: 0.75em;
		}
	
	hr, .hr{
		border: 0;
		clear: both;
		display: block;
		height: 25px;
		margin-bottom: 25px;		
	}
	
	hr{
		border-top: 1px solid #CCC;
		height: 1px;
		margin-bottom: 25px;
	}
	
	p{
		clear: left;
		margin-bottom: 1.5em !important;
	}
	
	blockquote{
		margin: 1em 0em 2em 0em;
	}
	
		blockquote img{
			float: left;
			margin-right: 20px;
			margin-bottom: 20px;
			width: 160px;
		}
	
	ol, ul{		
		margin: 0 0 1em 3em;
	}
	
		ol{
			list-style: decimal;
		}
		
		ul{
			list-style: disc;
		}
		
		li{
			margin: 0.75em 0;
		}
		
	label{ cursor: pointer; }
	dl{}
	dl dt{}
	dl dd{ margin: 0 0 1em 0; }


/************************************
	STRUCTURE GLOBALE
************************************/

	body{
		border-top: 6px solid #000;
		color: #333;
		font: 13px/1.35em arial, verdana, helvetica;
		margin: 0;
		padding: 0;
	}
	
	#PageContainer, #PageFooter{
		margin: 0 auto;
		position: relative;
		width: 984px;
	}
	
	#PageHeader{
		height: 121px;
	}
	
		#PageContenuHeader{
			height: 39px;
		}
		
		#PageContenu{
			padding: 0 42px;
		}
		
		#PageContenuFooter{
			height: 68px;
		}	

	#PageFooter{
		height: 100px;
	}
	
/************************************  
	ENTETE 
************************************/
	
	#HeaderPage_logo{
		position: absolute;
		top: 31px;
		left: 9px;
	}
	
	#HeaderPage_link{
		overflow: hidden;
		position: absolute;
		top: 0px;
		right: 10px;
		width: 127px;
	}
	
		#HeaderPage_link a{
			display: block;
			height: 38px;			
			text-indent: -900%;
		}
	
	
/************************************  
	NAVIGATION 
************************************/	

	ul.Navigation{
		height: 34px;
		position: absolute;
		right: 7px;
		top: 60px;
	}
	
	ul.Navigation li{
		float: left;
		list-style: none;	
	}
	
			ul.Navigation li a{
				display: block;
				height: 34px;
				margin-left: 1px;				
				overflow: hidden;
				text-indent: -900%;
			}


/************************************  
	PAGINATION 
************************************/

	ul.pagination{
		float: left;
		height: 2em;
		margin: 0px !important;
		padding: 0;			
		width: 36%;		
	}
	
		ul.pagination li{
			float: left;
			font-size: 0.9em;
			font-weight: bold;
			list-style: none !important;
			margin: 0 1px !important;
		}
		
		ul.pagination li a{
			color: #0699C9;
			display: block;
			padding: 2px;
			text-decoration: none;
		}
		
			ul.pagination li.page_inactive a{
				background: #0699C9;
				color: #FFF;
			}

		ul .page_precedent_inactive a,
		ul .page_suivante_inactive a{
			color: #888 !important;
		}
	
/************************************  
	CONTENU
************************************/

	#contenuHeader{ background: #000; height: 67px; position: relative; }
	#contenuHeader h1{ color: #0699c9; font: 35px arial; line-height: 35px; position: absolute; left: 35px; top: 16px; }
	#contenu{ padding: 30px; }
	
	#contenuHeader .retour{  margin: 0 !important; padding: 0; position: absolute; bottom: 0px; right: 32px; }
	#contenuHeader .retour a{ background: url(../images/retour.gif) no-repeat; display: block; height: 23px; overflow: hidden; text-indent: -900%; width: 66px;}	
	
	
/************************************  
	PAGE D'ACCUEIL ET LOGIN
************************************/

	#frontpage{
		background: #000;
		color: #FFF;
		height: 204px;
		padding: 100px 0 74px 0;
		position: relative;
	}
	
	#frontpage .frontpage_news{		
		font-size: 12px;
		font-weight: bold;
		line-height: 18px;
		margin-left: 480px;
		width: 410px;
	}
	
		#frontpage .date{
		}
		
		#frontpage h2, #frontpage h2 a{
			background: none !important;
			font-size: 14px;
			font-weight: bold;
			margin: 0;
			text-decoration: none;			
			padding: 0;
		}		
	
	.plus_articles{		
		overflow: hidden;
		width: 50px;	
		position: absolute;
		bottom: 72px;
		right: 370px;		
	}
	
		.plus_articles a{
			display: block;
			height: 23px;
			text-indent: -900%;
		}
	
	
/************************************  
	LISTE DES ACTEURS
************************************/
	
	img.categories_titre {
		position: absolute;
		top: 19px;
		left: 34px;
	}
	
	
	/* ENTETE */
	ul.Filtre{
		clear: both;
		height: 1.95em;
		padding: 20px 20px 0px 0px;		
	}
	
		ul.Filtre li{
			border-right: 1px solid #777;
			display: block;
			float: left;
			list-style: none;
			margin-right: 15px;
			padding-right: 15px;
		}
		
		ul.Filtre li.M{
			border: 0;
		}
	
		ul.Filtre a{
			/*color: #FDAD18;*/
			color: #0699c9;
			font-weight: bold;
			font-size: 1.1em;
			text-decoration: none;
		}
		
		ul.Filtre li.actif a{
			text-decoration: underline;
		}
		
		ul.Filtre a:hover, ul.Filtre li.actif a{
			/*color: #FFF;*/
			color: #000;
		}
		
	
	ul.Membres{
		margin: 0;
		padding: 0;
		position: absolute;
		bottom: 0px;
		right: 32px;
		width: 410px;
	}
	
		ul.Membres li{	
			float: right;
			margin: 0 0 0 11px;
			list-style: none;
			padding: 0;
		}
		
		ul.Membres li a{	
			background: transparent url(../images/listeActeursMembres.gif) no-repeat 0 -23px;			
			display: block;
			height: 23px;
			overflow: hidden;
			text-indent: -900%;
		}
	
		.MembresUDA a{			
			width: 179px;			
		}
		
		.MembresUDA a.actif, .MembresUDA a:hover{			
			background-position: 0 0;			
		}
		
		.NonMembresUDA a{
			background-position: -190px -23px !important;
			width: 207px;
		}
		
		.NonMembresUDA a.actif, .NonMembresUDA a:hover{
			background-position: -190px 0px !important;
		}
	
	.listeActeurs ol, .listeActeurs h2{	
		clear: both;
		display: block;
		list-style: none !important;
		margin: 30px 14px !important;
	}
	
		.listeActeurs h2{
			margin-left: 35px !important;
		}
	
	
	.listeActeurs ol li.fiche{
		background: #FFF url(../images/listeActeurs.jpg) no-repeat top center;
		display: block;
		float: left;
		height: 283px;
		list-style: none !important;	
		margin: 0 0 11px 0;
		position: relative;
		width: 25%;	
	}

		.listeActeurs ol li a{
			text-decoration: none !important;
		}
	
		.listeActeurs ol li a.acteursUrl{
			color: #333;
			font-weight: bold;
			line-height: 14px;
			display: block;
			top: 29px;			
			width: 150px;
			position: absolute;
			left: 50%;
			margin-left: -75px;			
		}

		.listeActeurs ol li a.acteursUrl img{
			margin: 0 0 9px 0 !important;
			padding: 0 !important;
		}
	
	.listeActeurs ul{
		position: absolute;
		bottom: 0px;
		right: 34px;
		width: 60px;
	}
	
		.listeActeurs ul li{		
			float: right;			
			list-style: none;
			line-height: 1em;
			overflow: hidden;
			margin-left: 5px;
			width: 25px;		
		}
	
		.extrait a{
			background: transparent url(../images/listeActeursBoutons.png) no-repeat;
			display: block;			
			height: 25px;
			text-indent: -9000%;
		}
		
		.audios a:hover{
			background-position: 0 -40px !important;
		}
		
		.video a{
			background-position: -5px -80px !important;
		}
		
			.video a:hover{
				background-position: -5px -120px !important;
			}
	
		
/************************************  
	FICHE DES ACTEURS
************************************/

	#acteurs{ height: 550xp !important; height: auto; min-height: 550px; padding: 35px 25px 25px 25px; position: relative; }
	
	#acteurs div.photo{background: url(../images/ficheActeursImg.png) no-repeat; float: left; height: 439px; margin: 0 0 3em 4px; overflow: hidden; padding: 30px; position: relative; width: 299px; }
	#acteurs div.photo label{ display: block; position: relative; }
	#acteurs div.photo label span{ display: none;}
	#acteurs div.photo label:hover span{ background: #ccc; display: block; font-size: 1.2em;font-weight: bold; line-height: 400px; height: 400px; left: 0; opacity: 0.5; overflow: hidden; position: absolute; text-align: center; top: 0; width: 300px; z-index: 778997; }
	#acteurs div.photo p.credit-photo{ background: #333; bottom: 56px; color: #EEE; display: none; font-size: 0.7em; position: absolute; left: 30px; line-height: 25px;	padding-right: 10px; width: 290px; z-index: 33; text-align: right; }
	#acteurs div.photo ul.big-icons{ margin: 0; position: absolute; padding: 0 0 0 25px; left: 0; bottom: 10px; width: 300px; }
	#acteurs div.photo ul.big-icons li{ float: left; list-style: none; }
	#acteurs div.photo ul.big-icons li a{ background: url(../images/ficheActeursBoutons.png) no-repeat; display: inline-block; height: 45px; overflow: hidden; text-indent: -99999%; width: 50px; }
	#acteurs div.photo ul.big-icons li.audio a:hover{ background-position: 0px -47px !important; }			
	#acteurs div.photo ul.big-icons li.audio a:hover{ background-position: 0px -47px !important; }
	#acteurs div.photo ul.big-icons li.video a{ background-position: -50px 0px !important; }
	#acteurs div.photo ul.big-icons li.video a:hover{ background-position: -50px -47px !important; }
	#acteurs div.photo ul.big-icons li.imprimer{ float: right; }
	#acteurs div.photo ul.big-icons li.imprimer a{ background-position: -100px 0px !important; width: 60px; }
	#acteurs div.photo ul.big-icons li.imprimer a:hover{ background-position: -100px -47px !important; }				
	#acteurs div.photo dl{}				
	#acteurs div.photo dl dd.filename{ height: 5px; margin: 0; overflow: hidden; text-indent: -99999px; }				
	#acteurs div.medias{ clear: left; float: left; padding: 0 10px 30px 10px; width: 349px;}
	#acteurs div.medias ul{ border-top: 1px solid #ccc; margin: 0 0 3em 0; padding: 0; }
	#acteurs div.medias ul li{ border-bottom: 1px dashed #ccc; list-style: none; margin: 0; padding: 0; }
	#acteurs div.medias ul li.last{ border-bottom: 1px solid #ccc; }
	#acteurs div.medias ul li.odd{ background-color: #f2f7f9; }
	body#adultes #acteurs div.medias ul li.odd{ background-color: #fef9f0; }
	body#adolescents #acteurs div.medias ul li.odd{ background-color: #fef9f0; }
	body#enfants #acteurs div.medias ul li.odd{ background-color: #fef9f0; }
	
	#acteurs div.medias ul li a.file{ background: transparent url(../images/listeActeursBoutons.png) no-repeat; color: #666; display: inline-block; padding: 5px 8px 5px 35px; text-decoration: none; }
	#acteurs div.medias ul li a.file:hover{ color: #333; }
	#acteurs div.medias ul li.file-audio a.file{ background-position: 0 0 !important; }
	#acteurs div.medias ul li.file-audio a.file:hover{ background-position: 0 -41px !important; }
	#acteurs div.medias ul li.file-video a.file{ background-position: -5px -80px !important; }
	#acteurs div.medias ul li.file-video a.file:hover{ background-position: -5px -120px !important; }
	#acteurs div.medias ul li span.action{ float: right; position: relative; top: 5px; }
	#acteurs div.medias ul li a.rename{ background: url(../images/page_edit.png) no-repeat; display: inline-block; height: 16px; overflow: hidden; text-indent: -999px; width: 16px; }
	#acteurs div.medias ul li a.delete{ background: url(../images/cross.png) no-repeat; display: inline-block; height: 16px; overflow: hidden; text-indent: -999px; width: 16px; }
	#acteurs div.medias dl.ajouter{ background: #f2f9fb; border: 1px solid #c6e1ea; margin: 0 0 1em 0; padding: 5px 8px; }
	#acteurs div.medias dl.ajouter dt{ margin: 0 0 0.5em 0; }
	#acteurs div.medias dl.ajouter dd small{ color: #999; font-size: 0.8em; }
		
	#acteurs div.details{ float: right; width: 463px; }
		
		/*
		.ficheActeursDetails h2{
			background: none !important;
			margin: 0 0 0.5em 0;
			padding: 0;
		}
		*/
	#acteurs p.actions{ background: #c5e6f1; border: 1px solid #0699C9; margin: 0 !important; padding: 3px 5px; }
		
/************************************  
	ARTICLES
************************************/
	
	.modifydate, .createdate{
		color: #555;
		display: block;
		margin-bottom: 15px;
	}
	
	.modifydate{
		font-size: 0.8em;
	}
	
/************************************  
	ARTICLES
************************************/
	
	#login h2{
		margin-bottom: 5px;
	}
	
	#login a{
		color: #FDAD18;
	}
	
	#login input{
		background: #EEEEEE;
		border: 1px solid #0699c9;
		color: #0699c9;
		margin-bottom: 0;
		padding: 3px;
		width: 175px;
	}
	
		#login input:focus{
			background: #FFEEBB;
		}
	
	
	#login input.button{
		width: 100px;
	}
	
	#login fieldset{
		margin-bottom: 7px;
	}
	
	
/************************************  
	AUDIO PLAYER
************************************/

	#FlashAudio{
		position: absolute;
		z-index: 999;
		top: 0; 
		left: 0;
	}
		
/************************************  
	LIGHTBOX
************************************/
	
	#FlashOverlay{
		background: #000;
		display: none;
		position: absolute;		
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}	
	
	#FlashBox{
		background: transparent url(../images/FlashBox.png) no-repeat;
		display: none;
		width: 722px;
		height: 494px;
		overflow: hidden;
		padding: 25px 25px 0 25px;
		position: absolute;
		top: 100px;
		left: 50%;
		margin-left: -386px;
	}
	
	#FlashContent{
		background: #DDD;
		width: 722px;
		height: 444px;
	}
	
	.FlashBoxFermer{
		background: transparent url(../images/lightbox_fermer.jpg) no-repeat;
		position: absolute;
		bottom: 4px;
		left: 50%;
		margin-left: -33px;		
		width: 66px;
		height: 23px;	
		text-indent: -900%;		
	}
	
/************************************  
	sIFR - NE PAS MODIFIER 
************************************/

.sIFR-flash {
	visibility: visible !important;
	margin: 3px 0 0 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/****/
.sIFR-hasFlash h1 {
	visibility: hidden;	
}

/************************************  
	PIED DE PAGE 
************************************/
	
	#FooterFacebook{
		background: transparent url(../images/FooterFacebook.png) no-repeat;
		overflow: hidden;
		position: absolute;
		top: -1px;
		left: 16px;
		width: 209px;
	}
		
		#FooterFacebook a{
			display: block;
			height: 34px;
			text-indent: -900%;
		}
	
	#FooterCredits{	
		color: #777;
		font: bold 11px arial;		
		position: absolute;
		top: 11px;
		right: 16px;
	}
