/**********************************************
version:	0.3 'Lambians', Octobre 2008
author:	  	Shariffa Madavjee aka Farishta
contact:	smadavjee@jir.fr
***********************************************/

/*reset module
@import url(modules/reset.css);*/

/*typography module*/
@import url(modules/typography.css);

/*look-and-feel modules*/
@import url(modules/links.css);
@import url(modules/tabs.css);


@import url(modules/tag.css);

html
{
	background-color:#242424;
}

/*body and page styles to centre the page. remove if you don't want it centred*/

.clear
{
clear:both;
}

/***************************************

   LAYOUT

****************************************/

/*****************

	GENERAL
*******************/

.invisible {
visibility:hidden;
}


/**********************************
/* 1024
ens_col
...................................
/* primary  | secondary | colonne |
/* -------- | secondary | colonne |
/* tertiary | secondary | colonne |
/**********************************



/*body and page styles to centre the page. remove if you don't want it centred*/
body
{

	background-image:url(images/background.png);
	-background-image:url(images/backgroud1.png);
	background-repeat:no-repeat;
	background-attachment:scroll;
	background-position:center;
	background-position:top;
	margin-top:0;		
}

#page
{
/*centres the page in most browsers*/
 margin: 0 auto;
/*put the text back to normal alignment*/
	text-align: left;
/*stops the page getting too big, is a multiple of 2,3,4,5,6 and 8 making it easier to divide into grids
NOTE - there is a propriety method in the IE_only.css module that gets this working in IE6 and below, this will need changing too if you want a differnt max-width (or no max-width)*/
	max-width: 1024px;	

	margin-bottom : 10px;

}

#ens_col{
background-color:#5f5f5d;
height:1206px;
margin:0;
padding:0;
position:relative;
width:1024px;


}

#ColonneGauche {
background-color:#FFFFFF;
float:left;
margin:0px;
width:707px;
padding:0;

}

#content
{
margin:0;
padding-top:0;
width:100%;
position:relative;
}

#secondaryContent, #colonne
{


}

#secondaryContent
{
background-color:#5F5F5D;
float:left;
margin-left:0;
margin-top:0;
padding:0;
//top:471px;
position: relative;
width:317px;


}

/*#colonne
{
  width: 150px;
  background-color: #fff;
  margin-left: 10px;
  height: 100%;
  float: left;
  //margin-left: 336px
  
}*/


#primaryContent, #tertiaryContent
{
margin:0;
padding:0;

width:707px;
}

#tertiaryContent
{
padding-top:10px;
height:510px;
}

#primaryContent
{
background-color:#000000;
/*background-image:url(images/sous_video.png);
background-position:center bottom;
background-repeat:no-repeat;*/
height:646px;
padding-bottom:15px;
padding-top:25px;
background-image:url(images/piou.png);
-background-image:url(images/piou2.png);
background-repeat:no-repeat;
background-position: 0px bottom; 
}

.liste li
{
display:block;
clear:both;
width:600px;

}

.sstitre
{
clear:both;
}

.Suiv {
bottom:55px;
position:absolute;
float:right;
right:-35px;
}

.Suiv a{
background-image:url(images/suivant.png);
background-repeat:no-repeat;
display:block;
height:22px;
}

.Suiv a:hover{
background-image:url(images/suivant_hover.png);
background-repeat:no-repeat;
text-decoration:none;
}
.Suiv a:active{
text-decoration:none;
}

.Prec {
bottom:55px;
position:absolute;
left:-35px;
}

.Prec a {
background-image:url(images/precedent.png);
background-repeat:no-repeat;
display:block;
height:22px;
}
.Prec a:hover{
background-image:url(images/precedent_hover.png);
background-repeat:no-repeat;
text-decoration:none;
}

.Prec a:active{
text-decoration:none;
}


#zone_recherche
{

}

.submit{
height:20px;

}

#pied
{
background-image:url(images/pied-page.png);
background-repeat:no-repeat;
height:45px;
padding-left:715px;
padding-top:25px;
width:309px;
color:#FFFFFF;

}

/*****************************

 header
 ............................
 logoM | logo 		| dixit
 	   | headline

******************************/
#header
{

padding-bottom:5px;
padding-top:8px;
width:1024px;
position:relative;
height:110px;

}

#logoM  /* logo jir*/
{
float:left;

}

#logoM a 
{
}


#logoL /* logo lambians*/
{
float:left;
float:left;
padding-left:10px;
}

#logoL a
{
display:block;
background-image:url(images/logo_lambians.png);
-background-image:url(images/logo_lamb.png);
background-repeat:no-repeat;
height:108px;
width:404px;
}


#descL  /* phrase ou citation dans entete près du logo*/
{
float:right;
text-align:right;
width:28em;
font-size:1.3em;
color:#FFFFFF;
}


#descL a
{
color:#FF0000;
text-decoration:underline;
}
#descL a:hover
{
color:#ffffff;
text-decoration:underline;

}

#zone_contact
{
margin-top:32px;

}

#zone_contact a
{
color:#FFFFFF;
text-decoration:none;
margin-left:10px;

}

#zone_contact a:hover
{
color: #FF0000;
text-decoration:none;

}



#tab
{
	width: 1024px;
	background-image:url(images/menu.png);
	margin:0px;
	padding:0px;
	background-repeat: no-repeat;
	width:1024px;
	height:40px;
}

/*#tab #contact 
{
color:#000000;
float:right;
font-size:1.2em;
font-weight:bold;
margin-right:20px;
padding-top:6px;
right:5px;
text-decoration:underline;
}

#tab #contact:hover
{
color:#FF0000;
}*/



.actif
{
	}

/*************
 secondary
..............
 recherche
 menu
 pub
 tag
 partenaires
 footer
/*************/

#menu, #pub, #recherche_entete, #footer, #tag 
{
	margin-bottom : 10px;
	
	width:307px;
	height: auto;
	text-align:left;
	/*color:white;*/
	overflow:hidden;
	font-size: 1.2em;
}
#menu{
padding-top:0px;
width:317px;

}

#recherche_entete
{
  float: left;
  color: #fff;
  margin-top : 6px;
  margin-bottom: 0px;
  /*background-color:#FF66CC;*/
}


#pub
{
color:#FFFFFF;
font-size:1em;
height:auto;
margin:0 auto;
padding:0;
width:300px
}

#tag {
	color: #FFFFFF;
	margin: 0 auto;
}

#tag h5 {
	height:19px;
	width:114px;
	background-image:url(images/mots_cles.png);
	background-repeat:no-repeat;
	padding-bottom:2px;
}

#tag a 
{
color:#000000;
display:inline-block;
}
	

#footer {
	margin-top : 20px;
	clear: both;
  	position: relative;
	color: #FFFFFF;
	margin: 0 auto;
}


#partenaire
{
margin-top : 20px;
width: 100%;
}

#partenaire h5
{
height:19px;
width:135px;
background-image:url(images/partenaires.png);
background-repeat:no-repeat;
padding-bottom:2px;
}

#partenaire #colright
{
width: 50%;
float: right;

}

#partenaire #colleft
{
width: 50%;
float: left;

}

#espace_150 {
height: 128px;
margin:0px;
padding:0px;
}

#fin_footer {
background: url(images/images/footer.png) no-repeat;

}

#copyright{
margin:0px;
padding:0px;
padding-top: 150px;

}

#mention {
	font-size: 12px;
	margin-left: 20px;

}

/***************************************

 headings

****************************************/


#barre_menu
{
margin-top: 0;
margin-left: 0;
}

#barre_titre
{
margin-top: 0;
margin-left: 0;
}


/*******************************************************

  lists
 /* background: transparent url(images/bullet.png) 0 50% no-repeat; */
/*******************************************************/

ul
{ 
 /*this gets rid of any bullet points*/
	list-style-type:square;
	/*list-style: none;*/
	margin: 0;
/*use this to control the gap to the first tab*/
	padding-left: 0px;
/*used to contain the floated tabs*/
  overflow: hidden;
  float:left;
 
}


li
{
	/*stops the double margin bug in IE*/
  display: inline;
	float: left;
	font-size: 1.2em;
	font-weight: normal;
	/* espace haut-bas line-height: 2.4; */
/*use this to put spaces inbetween the tabs*/
  margin-left: 10px;
	/*This should be the same as the margin for the a below*/
	padding: 0 10px;
/*	background-color: transparent;
	background-image: url(images/puce.png);
	background-repeat: no-repeat;
	background-position: 0 5px;*/
}

/***************************************

  ACCUEIL - UNE

****************************************/
#ariane {

	padding: 0px;
	margin: 0px;
	height: 15px;
	background-color:#000000;
	/*background-image:url(images/ariane2.png);
	background-repeat: no-repeat;
	font-size: 1em;
	color:#FFFFFF;*/
}



#photo					
{
border:1px solid #413F40;
height:331px;
margin-left:53px;
margin-top:40px;
width:600px;
position:relative;

/*
text-align:center; 
min-height: 313px;
*/
}

#photo	img				
{
padding:0px;

}

#photo-meta-data							
{
background:transparent url(images/transpBlack.png) repeat scroll 0 0;
bottom:0;
left:0;
color:#FF0000;
height:80px;
padding: 0 6px 0 10px;
position:absolute;
text-align:left;
width:584px;
margin: 0px;

}


#photo-meta-data .meta							
{ 
color: white; 
text-align: left;
font-size: 1em;
/*padding-top: 6px;*/
padding:0px;
margin:0px;

}

#photo-meta-data .meta h2						
{ 
	font-size: 3em;
	margin: 13px 0 0 0;
	padding: 0;
	color:#FFFFFF;
	line-height:2em;
}




#photo-meta-data .play	a			
{ 
position: absolute;
/*width: 42px;
height: 42px;*/
top: 40px;
left: 500px;
/*margin-left:460px;
margin-top:-50px;*/
z-index:1000;
/*background: transparent url(images/play.png) 0 0 no-repeat;*/
text-decoration:underline;
font-size:1.2em;
}

#photo-meta-data .play	a:hover	
{ 
/*background: transparent url(images/play_hover.png) 0 0 no-repeat;*/
color:#FF0000;
}



#miniature						
{ 
color:#FFFFFF;
height:100%;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
margin-left:53px;
padding:20px 0 20px 0;
width:650px;

}

#miniature	ul 				
{ 
margin: 0;
padding:0;

}
#troismini
{
/*width:400px;
margin:10px;
padding:10px;*/
}

#miniature	ul li
{
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:5px 0 10px 64px;
padding:0;

}

#miniature	ul li.first
{
padding:0;
margin-left: 0;
margin-right: 0;
}

#miniature	ul li a img
{
	margin:0;
	padding:0;
	border:1px solid #413F40;
}

#video					
{ 
margin-left: 0;
border: 1px solid #666666;
height: 331px;

}




#ss-titre
{
	position: absolute;
	color:#FFFFFF;
	margin-top: -40px;
}

/***************************************

	AFFICHER VIDEO

****************************************/

#aff_video{
margin:0 auto 0;
position:relative;
width:602px;
}

#aff_video h3{
font-size:1.5em;
margin-bottom:0;
margin-top:10px;
}

#aff_video #titre_police{
font-size:1em;
margin-top:0;
padding-left:2px;

} 


#aff_video h4
{
margin-top:10px;


}

#desc_artiste
{
color:#FFFFFF;
width:510px;
padding-bottom:0px;
margin-top:-10px;
}

h2 #titre_police
{
font-size: 1em;
margin:0px;
padding:0px;
}
#titre_police{
margin:0px;
font-size:3em;

}
#espace_com						
{ 
color:#999999;
margin-left:0;
margin-top:0;
padding-top:3px;
text-align:right;
}


#espace_com a		
{ 
color : #ffffff;
text-decoration:underline;
}

#espace_com a	
{ 
color : #ffffff;
text-decoration:underline;
}
#espace_com a:hover
{
	color : #FF0000;
	text-decoration:underline;
}
#aff_video #col33 img
{
	border:1px solid #666666;
}

#aff_video #col33 ul li.first_col
{
	
	margin-left:0;
}

#aff_video #col33 ul li
{
	height:110px;
	margin:2px 0 0 70px;
}

#aff_video #col33 a
{
	color:#FFFFFF;
	font-size: 0.9em;
	text-align: center;
	font-weight:bold;
}
#aff_video #col33 a:hover
{
	color:#FF0000;
}

/***************************************

	AFFICHER AJOUT COMMENTAIRE

****************************************/

#aff_com
{
width:418px;
margin:0px auto 10px;
color:#ffffff;
padding-bottom:0px;
position:relative;
}

#aff_com h2
{
font-size:1.9em;
margin:0;
}

#aff_com h3
{
font-size:1.3em;
margin:0;
margin-bottom:5px;

}

#aff_com h4
{
color:#FFFFFF;
font-size:1.2em;
margin-top:0;
}

#aff_com h6
{
color:#ffffff;
font-size:1.1em;
margin:0px;
}

#aff_com p
{
margin-bottom:10px;
margin-top:0;
}

.comm
{
position:relative;

}

.heure
{
font-size:0.9em;
margin-top:-15px;
position:absolute;
right:1px;
}

.comment
{
background-color:#000000;
padding:5px;
}

#envoyer
{
background-color:transparent;
background-image:url(images/envoyer.png);
background-repeat:no-repeat;
border:medium none;
height:19px;
width:99px;
}
.liste_com
{
background-color:#333333;
border:1px solid #999999;
height:290px;
margin-bottom:10px;
overflow:auto;
padding:10px;
width:400px;
position:relative;
}


/***************************************

	AFFICHER liste artistes et chansons

****************************************/
#aff_liste{
color:#FFFFFF;
width:600px;
margin:0 auto;
}

#aff_liste h2{
font-size:2.6em;
}

#aff_liste h3{
color:#FFFFFF;
font-size:2em;
}

#aff_liste #hyperlien a
{
color:#FFFFFF;
margin:0 2px;
font-weight:bold;
}

#aff_liste #hyperlien a:hover
{
color: #FF0000;
}

#aff_liste .liste
{
background-color:#333333;
border:1px solid #999999;
height:300px;
margin-bottom:39px;
overflow:auto;
padding:10px;
width:578px;
}


#aff_liste .liste li
{
	color:#999999;
	background-image:url(menu/images/puce.png);
	background-repeat: no-repeat;
	background-position: left 0.6em;
	width:500px;
	margin-bottom:10px;
}

#aff_liste .liste li a
{
	color:#ffffff;
	text-decoration:underline;
	font-weight:bold;
	
}

#aff_liste .liste li a:hover
{
	color : #FF0000;
	text-decoration:underline;
	
}

/********************************************

MENTION LEGALE

*********************************************/

#article_in p
{
width:600px;

}




/********************************************

FORMULAIRES

*********************************************/

.submit input				
{
	/*background:url(images/search_b.png);*/
/*background: #FF0000;
	color:#ffffff;
	font-weight:bold;
	border:1px ridge #888888;

	width: 100px;*//*background-repeat:no-repeat;*/
	background:transparent url(../images/rechercher.png) no-repeat scroll center bottom;
border:medium none;
color:#FFFFFF;
font-weight:bold;
height:22px;
width:105px;
}

/********************************************

PRIMARY :
style des miniatures random 3 colonnes

*********************************************/


/********************************************

TERTIARY :
style des miniatures random 3 colonnes

*********************************************/
#decouvrir
{
background-image:url(images/adecouvrir.png);
background-repeat:no-repeat;
height:38px;
width:223px;
}



#col33
{
/*float: left;*/
font-size: 9px;
font-style:normal;
width:680px;
margin:0 auto;
}

#col33 ul 
{
margin: 0;
padding: 0;
padding-top: 0px;
width: 100%;
}

#col33 ul li
{
width: 154px;
height: 130px;
/*background-color:#333333;*/
margin-left: 21px;
margin-right:0;
margin-bottom: 10px;
margin-top:10px;
padding: 0;
}

#col33 ul li.first_col
{
margin-left: 0;
}

#col33 ul li a
{
color: #000;

}

#col33 ul li a:hover
{
	color: #FF0000;
}

#col33 ul li a img
{
	border: 2px solid #666666;
}



#ratingfiche {
float: right;
}


.nommini {
font-size: 0.8em;
text-align: center;
font-weight:bold;
}

.haut_vignette
{
	display:block;
	position:relative;


	height:30px;
}

/***************************************

   COLONNE DROITE RUBRIQUES

****************************************/

#login{
height: auto;
background:#FFFFFF;
width: 148px;
margin-top: 10px;
margin-bottom: 10px;
border-bottom: #333333 solid 1px;
border-left: #333333 solid 1px;
border-right: #333333 solid 1px;
}

#box {
background:#FFFFFF;

width: 136px;
padding: 6px;
height: 126px;;
font-size: 1.2em;
}

#titre_box {
background-color:#333333;
width: 150px;
height: 30px;
line-height: 25px;
}

.titre_rubrique {
font-size: 1.4em;
padding-left: 2px;
color:#FFFFFF;

}

.submit_login input				
{
/*background:url(images/search_b.png);*/
background: #FF0000;
color:#000000;
border:none;
height:24px;
width: 94px;
/*background-repeat:no-repeat;*/
float: right;
}

#mention 
{
height:400px;
padding-bottom:20px;
padding-top:20px;
}

.fenetre_grise
{
	background-color:#999999;
	border-top:1px solid #FFFFFF;
	color:#000000;
	padding:2px;
	overflow:hidden;
	text-align: center;

}

/***************************************

   ADMIN

****************************************/



#secondaryContentAdmin
{
	float: right;
	display: inline;
	overflow: hidden;
	position: absolute;
	width: 303px;
	background-color: #413f40;
	margin-top: 0;
	/*border-top: #f61700 solid 6px;*/
  height: auto;
}




#primaryContentAdmin
{
  width: 700px;
  background-color:#fff;
  padding-left: 6px;
  padding-top: 6px;
  padding-bottom: 6px;
  float : left;
  height: 100%;
  
}


#primaryContentAdmin #hyperlien a
{
color:#000000;
}


/*#primaryContentAdmin a 
{
  color:#000000;
}

#primaryContentAdmin a:hover
{
  color:#ffffff;
  background-color:#000000;
}*/

#contentAdmin
{
  overflow: hidden;
  width: auto;
  font-size: 14px;
}

#contentAdmin #recherche_entete
{
  font-size: 14px;
}

#contentAdmin h2, h3
{
  color: #666666;
  font-size: 18px;
  margin-bottom: 10px;
}

#contentAdmin h3
{
   padding-top: 10px;
}

#contentAdmin ul
{ 
 /*this gets rid of any bullet points*/
	list-style: none;
	margin: 0;
/*use this to control the gap to the first tab*/
	padding-left: 0px;
/*used to contain the floated tabs*/
  overflow: hidden;
  width: 100%;
}

/*#contentAdmin ul a
{ 
 color:#000000;
}
#contentAdmin ul a:hover
{ 
 color:#FFFFFF;
 background-color:#000000;
}*/

#contentAdmin li
{
/*stops the double margin bug in IE*/
 
  display:block;
  clear:left;
  font-size: 14px;
  font-weight: normal;
 /* espace haut-bas line-height: 2.4; */
/*use this to put spaces inbetween the tabs*/
  margin-left: 10px;
/*This should be the same as the margin for the a below*/
	padding: 0 15px;
	width: 480px;

	/*background: transparent url(images/bullet.png) 0 50% no-repeat;*/
}

.bordCom{
	width: 450px;
	padding: 5px;
	background-color: #EFEFEF;
}

.sup{
	background: #FF0000;
	color:#000000;
	border:none;
	height:24px;
	width: 94px;
}