/* ### www.CME-2010.fr ###*/
/* ### SCREEN stylesheet ###*/
/* ### Esprit Public - 2009 ### */
/* ### par Guillaume Daillier ### */


/* ###################### SOMMAIRE (mettre à jour) ###### */
/* $1. Balises de base */
/* $2. Styles de formulaires */
/* $3. Blocs de mise en page */
/* $4. Menu principal */
/* $5. Sous-menus : niveaux 2 et 3 */
/* $6. Menu pratique et menu bas de page */
/* $7. Contenu principal */
/* $8. Contenu contextuel */
/* $9. Contenu Accueil */
/* $10. Styles Tooltip Mootools (info bulle JS) */
/* ###################################################### */



/* ###################### $1. Balises de base ############################## */
@import url(reset.css);

body {
	font-family:Arial ,sans-serif;
	font-size:72.5%;
	line-height:1.5em;
	color:#FFF;
	background:#FFF url(../img/bgBody.jpg) repeat-y  -50px -20px;
}

/* BALISES BLOCK ******************* */

h1,h2,h3,h4,h5,h6 {
	font-family:"Arial",sans-serif;
	clear:both;
}

h1 {
	color:#ff0;
	font-size:1.9em;
}

h2 {
	color:#ff0;
	font-size:1.7em;
	font-weight:normal;
	line-height:1.2em;
	/* padding:0 0 4px 10px;*/
	margin:0 0 15px 0; 
	background:url(../img/puce_h1.gif) no-repeat 0% 50%;
}

h3 {
	color:#CCFF00;
	font-size:1.3em;
	margin:15px 0 12px 0;
	clear:none;
}

h4 {
	font-size:1.1em;
	margin:0 0 10px 0;
	color:#00A7CE;
}

ul, ol, table {
	margin-bottom:20px;
}

p {
	margin-bottom:7px;
}

ul {
	margin:10px 0px 10px 0px;
}

li {
	padding:0 0 0 10px;
	margin:2px 0 2px 0;
}

ul ul {
	margin:5px 15px 10px 5px;
}

ul ul li {
	background:url(../img/puce_sous_liste.gif) no-repeat 0% 0.5em;
}

table {
	border:1px solid #edd4d3;
	border-collapse:collapse;
}

table td, table th {
	padding:10px;
	vertical-align:baseline;
	border:1px solid #edd4d3;
}

table th {
	font-size:1em;
	color:#999;
	background-color:inherit;
}

caption {
	display:none;
}

form input {
	padding:2px 5px 1px 5px;
	background:#fff;
}

form input.submit {
	color:#fff;
	font-size:1.1em;
	font-weight:bold;
	padding:1px 5px 1px 5px;
	background:#999798;
	border:0;
}

form input.submit:hover {
	color:#999798;
	background:#ff0;
}


/* BALISES INLINE ****************** */
a {
	color:#f4f4f4;
	background-color:inherit;
	text-decoration:none;
}

a:hover, a.actif {
	color:#ff0;
} 

li.on a:hover , li.on a{
	color:#ff0;
}

strong {
	font-weight:bold;
}

em {
	font-style:italic;
}

sub {
	font-size:0.7em;
	position:relative;
	top:0.3em;
}

sup {
	font-size:0.7em;
	position:relative;
	top:-0.3em;
}

blockquote {
	float:right;
	text-align:right;
	font-size:1.2em;
	width:180px;
	padding:0 18px 0 18px;
	text-indent:-18px;
	background:url(../img/close-quote.gif) no-repeat right bottom;
}

blockquote:first-letter {
	font-size:1.4em;
	padding-left:18px;
	background:url(../img/open-quote.gif) no-repeat left top;
}

img {
	/* float:left; */
}

/* CLASSES GENERIQUES ************** */

.noDisplay {
	position:absolute;
	left:0;
	top:-500px;
	width:1px;
	height:1px;
	overflow:hidden;
}

.noFloat {
	clear:both;
}

/* ###################### $2. Styles de formulaires ######################## */
input, select, textarea {
	font-family:"Arial",sans-serif;
	font-size:1em;
	color:#444;
	background-color:#fff;
	padding:2px;
	margin:2px 0 2px 0;
	vertical-align:middle;
	border:1px solid #999;
}

input:hover, select:hover, textarea:hover {
	border:1px solid #ff0;
}

input:focus, select:focus, textarea:focus {
	border:1px solid #ff0;
}

textarea {
	width:300px;
	height:90px;
	margin:0 0 10px 0;
}

input.texte {
	width:85px;
}

#contact input.texte {
	width:200px;
	margin:0 0 10px 0;
}

#contact input.message {
	width:450px;
	height:300px;
}

legend {
	display:none;
	position:absolute;
	left:0;
	top:-500px;
	width:1px;
	height:1px;
	overflow:hidden;
}

label {
	display:block;
}

.requis {
	color:#f00;
}

/* style formulaire registration */ 

label:hover {
	cursor: pointer;	
}

label {	
	display:block;
	float: left;	
	width: 34%;	
	text-align: right;	
	margin: 0;
	padding: 0 .5em 0 0;
	line-height: 1.8;	
}
#activity , #interest { text-align:center;}
#activity input, #interest input  {
	float:left;
	border:none;
	background:none;
}

#activity label, #interest label{
	width:70%;
	text-align:left;
	margin-left:5px;
}

#activity p , #interest p{
	margin-top:0px;
	margin-bottom:5px;
	overflow:auto;
	width:50%;
}


#cme input.submit {
	color:#4899D1;
	font-size:1.1em;
	font-weight:bold;
	border:1px solid #4899D1;
	padding:1px 5px 1px 5px;
	background:#FFF;
	margin-left:180px;
}

#cme input.submit:hover{
	color:#FFFF00;
	background:#000;
	border:1px solid #FFFF00;
}


/* ###################### $3. Blocs de mise en page ######################## */

#cadre {
	width:877px;
	margin:auto;
	padding-top:2px;
	margin-bottom:50px;
}

#header {
	overflow:auto;
	width:100%;
}

#colGauche {
	float:left;
	width:198px;
	margin:25px 0px 0 0;
	padding:17px 0 0 0;
	background:#070607 url(../img/topSousmenu.gif) no-repeat top;
}

#cadreContenu {
	background:#000 url(../img/bgContenuTop.gif) no-repeat 0px -1px;
	overflow:auto;
	width:862px;
	padding:0 0 0 15px;
}

#colPrincipal {
	float:left;
	/* padding:0 20px 10px 0; */
	/* margin:0 20px 0 20px; */
	width:440px;
}

#accueil	 #colPrincipal {
	width:644px;
	overflow:auto;
	padding-top:17px;
	background:none;
	margin-top:0px;
	padding-left:0px;
}

#accueil #colGauche {
	display:none;
}

#colDroite {
	float:left;
	width:210px;
	padding-left:8px;
} 	

#footer {
	font-size:0.9em;
	color:#999;
	width:100%;
	height:86px;
	overflow:auto;
	background:url(../img/bgFooter.gif) no-repeat;
}


/* ###################### $4. Header ####################################### */
#header h1 {
	float:left;
	border:0;
	background:none;
}

#header h1 a {
	display:block;
	width:170px;
	height:168px;
	margin:2px 0 0 0;
	background:url(../img/logoCME.gif) no-repeat;
}

#menuPratique {
	float:right;
	width:430px;
	height:124px;
	color:#999;
	text-align:right;
	font-weight:bold;
}

#menuPratique form {
	float:right;
}

#menuPratique ul {
	float:right;
	margin:102px 20px 0 0;
}

#menuPratique li {
	display:block;
	float:left;
	padding:0;
	margin:3px 4px 0 4px;
	background:none;
}

#menuPratique li a {
	display:block;
	height:20px;
	color:#000;
	text-decoration:none;
	padding:0 0 0 20px;
	background-repeat:no-repeat;
}

#menuPratique form {
	float:right;
}

#menuPratique #mPratTup a, #menuPratique #mPratTdown a { font-size:1.1em;padding:0;width:15px;text-align:center;}
#menuPratique #mPratTup a:hover, #menuPratique #mPratTdown a:hover { font-size:1.5em;}
#mPratfr a {background-image:url(../img/pictoFR.gif);}
#mPraten a {background-image:url(../img/pictoEN.gif);}
#mPrates a {background-image:url(../img/pictoES.gif);}
#mPratPrint a {background-image:url(../img/pictoPrint.gif);}


#animFlash {
	float:right;
	width:644px;
	height:230px;
	
	/* background-color:#fff; */
	color:inherit;
}


/* ###################### $5. Menu principal ############################### */
#menuPrincipal {
	position:relative;
	float:right;
	width:682px;
	font-size:1.2em;
	padding:11px 0 0 15px;
	height:60px;
	background:url(../img/bgMenu.gif) no-repeat;
}

#menuPrincipal ul {
	margin:0;
}

#menuPrincipal li {
	color:#999;
	float:left;
	padding:0 25px 0 0;
}

#menuPrincipal li a {
	display:block;
	height:15px;
	padding:0 0px 0 10px;
	background:url(../img/puceJaune.gif) no-repeat 0 7px;
	background-repeat:no-repeat;
}



#menuPrincipal ul ul, #menuPrincipal ul ul ul {
	position:absolute;
	top:22px;
	left:0;
	width:760px;
	border-top:1px solid #999;
	padding-top:3px;
}

/* ###################### $5. Sous Menu ############################### */

#colGauche h2 {
	color:#606060;
	padding:0;
	margin:0 0 10px 17px;
}

#colGauche ul {
	margin:0;
	border-top:1px solid #121112;
	padding:0 11px 50px 11px;
	background:url(../img/botSousmenu.gif) no-repeat bottom;
}

*+html #colGauche ul {
	padding:0 5px 50px 5px;
}

#colGauche ul li {
	background:url(../img/puceSousmenu.gif) no-repeat 2px 7px;
	padding:0px 0px 2px 10px;
	border-bottom:1px solid #121112;
}

#colGauche ul li.open {
	padding:0px 0px 0px 10px;
	border-bottom:none;
	background:url(../img/liOpen.gif) no-repeat 0px 9px;
}

#colGauche ul ul {
	margin:0 0 0 -10px;
	padding:3px 0px 0px 0px;
	background:none;
	border-top:none;
}

#colGauche ul ul li {
	border-bottom:1px dotted #383738;
	padding:0px 0px 2px 10px;
	background:none;
}

#colGauche ul ul li a {
	padding:0 0 0 7px;
	background:url(../img/pucelili2.gif) no-repeat -0px 7px;
}

#colGauche ul ul li a:hover {
	background:url(../img/puceSousmenu.gif) no-repeat -0px 7px;
}


/* ###################### $6. Menu bas de page ############################# */
#logoGl {
	float:left;
	margin:22px 0px 0 40px;
	width:42px;
	height:41px;
	background:url(../img/imgLogoFooter1.gif) no-repeat;
}
#logoGl2 {
	float:left;
	margin:22px 18px 0 0px;
	width:119px;
	height:41px;
	background:url(../img/imgLogoFooter2.gif) no-repeat;
}

#footer a {
	color:#545454;
}

#footer a:hover {
	color:#fff;
}

#footer li {
	color:#545454;
	padding:0;
	background:none;
}

#footer p {
	color:#545454;
	float:left;
	margin:0 8px 0 0;
	width:165px;
	padding:0;
}

#footer p.petit {width:102px;}
#footer p.grand {width:200px;}

#menuBas {
	float:left;
	padding:0;
	margin:30px 0 0 0;
}

#menuBas li {
	display:inline;
}


/* ###################### $7. Contenu principal ############################ */

#colDroite a {
	color:#00A7CE;
}

#colDroite a:hover {
color:#FFFF00;
}

#newsletter {
	padding:3px 7px 1px 7px;
}
/* --------------------------- 	A ENLEVER SI NEWLSTETTER OK  ---------------------------------- */

/* #newsletter {
	margin-top:30px;
}
#newsletter h2 , #newsletter form  {
	display:none;
} */
/* ---------------------------  ---------------------------------- */
#newsletter h2 {
	padding:2px 0 2px 30px;
	font-size:1.1em;
	border:none;
	margin:0;
	color:#00A7CE;
	background:url(../img/pictoNewsletter.gif) no-repeat;
}
#newsletter input {
	background:#C9C9C9;
	border-bottom:1px solid #4C4C4C;border-right:1px solid #4C4C4C;
	cursor:pointer;
	padding:0px 5px 1px 5px;
	height:13px;
	font-size:0.9em;
	color:#000;
	margin:0;
	width:138px;
}
#newsletter form input.submit {
	background:url(../img/btOK.gif) no-repeat;
	border:none;
	cursor:pointer;
	color:#FFFFFF;
	font-weight:bold;
	width:29px;
	height:19px;
	font-size:1em;
}

#newsletter form input.submit:hover {
	color:#FFFF00;
}

/* --------------------------- 	CONFIRMATION ABONNEMENT NEWSLETTER  ---------------------------------- */

.formulaire_modif_abonnement2 label {
	text-align:left;
	width:85%;
	padding-left:5px;
}

.formulaire_modif_abonnement2 input {
	float:left;
}

#colPrincipal .formulaire_modif_abonnement2 li {
	overflow:auto;
	width:90%;
	background:none;
	padding:0;	
}

#spiplistes-formabo {
	margin-left:15px;
}

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

#menuPrat1 { width:175px; margin:0;background:url(../img/bgmenuPrat1.gif) no-repeat;padding:2px 7px 0px 7px;}
#menuPrat1 li { padding:1px 0 1px 30px; border-bottom:1px solid #303032;}
#menuPrat1 li.infoPrat { background:url(../img/pictoInfo.gif) no-repeat; }
#menuPrat1 li.telechargement { background:url(../img/pictoTelechargement.gif) no-repeat; }
#menuPrat1 li.phototeque { background:url(../img/pictoPhototeque.gif) no-repeat; }
#menuPrat1 li.contacts { background:url(../img/pictoContact.gif) no-repeat;border:none;}

#menuPrat2{ /* width:175px; */ margin:0;/* background:url(../img/bgmenuPrat1.gif) no-repeat; */padding:0;}
#menuPrat2 li { padding:0; }
#menuPrat2 a{ width:194px;height:35px;display:block;	}
#menuPrat2 a.participant_fr { background:url(../img/btParticipants.gif) no-repeat; }
#menuPrat2 a.exposant_fr { background:url(../img/btExposants.gif) no-repeat; }
#menuPrat2 a.sponsors_fr { background:url(../img/btSponsors.gif) no-repeat;border:none;}
#menuPrat2 a.participant_fr:hover { background:url(../img/btParticipantsHover.gif) no-repeat; }
#menuPrat2 a.exposant_fr:hover { background:url(../img/btExposantsHover.gif) no-repeat; }
#menuPrat2 a.sponsors_fr:hover { background:url(../img/btSponsorsHover.gif) no-repeat;border:none;}
#menuPrat2 a.participant_en { background:url(../img/btParticipants.gif) no-repeat; }
#menuPrat2 a.exposant_en { background:url(../img/btExposants_en.gif) no-repeat; }
#menuPrat2 a.sponsors_en { background:url(../img/btSponsors.gif) no-repeat;border:none;}
#menuPrat2 a.participant_en:hover { background:url(../img/btParticipantsHover.gif) no-repeat; }
#menuPrat2 a.exposant_en:hover { background:url(../img/btExposants_enHover.gif) no-repeat; }
#menuPrat2 a.sponsors_en:hover { background:url(../img/btSponsorsHover.gif) no-repeat;border:none;}
#menuPrat2 a.participant_es { background:url(../img/btParticipantsES.gif) no-repeat; }
#menuPrat2 a.exposant_es{ background:url(../img/btExposantsES.gif) no-repeat; }
#menuPrat2 a.sponsors_es { background:url(../img/btSponsorsES.gif) no-repeat;border:none;}
#menuPrat2 a.participant_es:hover { background:url(../img/btParticipantsHoverES.gif) no-repeat; }
#menuPrat2 a.exposant_es:hover { background:url(../img/btExposantsHoverES.gif) no-repeat; }
#menuPrat2 a.sponsors_es:hover { background:url(../img/btSponsorsHoverES.gif) no-repeat;border:none;}

#menuPrat3 li {padding:20px 0 0 0; background:url(../img/points.gif) no-repeat top left;}
#menuPrat3 li a{font-size:1.2em;}

dl.spip_documents {
	margin-top:20px;
	padding-top:20px;
	border-top:#fff dotted 1px;
	width:409px;
	overflow:auto;
}

dl.spip_documents dt {
	float:left;
	margin-right:5px;
}

.vert, .vert a {
	color:#CCFF00;
}
dl.spip_document_254
{
	overflow:visible;
}

dl.spip_document_254 img
{
	margin-right:7px;
}


#colPrincipal .sommaire li.puce_jaune {background:#000 url(../img/puceJaune.gif) no-repeat 0 7px;}
#colPrincipal .sommaire li.puce_orange {background:transparent url(../img/puceOrange.gif) no-repeat 0 7px;}
#colPrincipal .sommaire li.puce_orange a:hover {color:#ff9900;}

#colPrincipal .sommaire li.puce_bleue a:hover {color:#006a89;}

.jaune {color:#ffec00;}
.orange {color:#ff9900;}
.bleu {color:#006a89;}


/* ###################### $8. Contenu contextuel ########################### */

#colPrincipal {
	margin-top:25px;
	padding-left:7px;
	width:438px;
}

#colPrincipal h1 {
	margin:0 0 20px 15px;
}

#colPrincipal li, .bloc_Edito li, .blocEdito2 li{
	background:url(../img/puceBleu.gif) no-repeat 0px 7px;
	padding-left:7px;
}


#colPrincipal li li {
	background:none;
}

.topblocTxt {
	width:439px;
	height:16px;
	background:url(../img/topBloctxt.gif) no-repeat bottom;
}

.blocTxt {
	width:409px;
	padding:0 15px 30px 15px;    
	background:#070607 url(../img/botBloctxt.gif) no-repeat bottom;
}

#accueil .topblocTxt {
	width:630px;
	height:16px;
	margin-top:24px;
	background:url(../img/topBloctxt2.gif) no-repeat bottom;
}

#accueil .blocTxt {
	width:600px;
	padding:0 15px 30px 15px;    
	background:#070607 url(../img/botBloctxt2.gif) no-repeat bottom;
}

#accueil .blocTxt h1{
	padding-bottom:10px;
	margin:0 0 10px 0;
	border-bottom:1px solid #121112;
}

.image {
	position:relative;
	margin-bottom:2px;
}

.cornerLeft {
	background:url(../img/leftCorner.gif) no-repeat;
	position:absolute;
	top:0;
	left:0;
	width:21px;
	height:21px;
}

.cornerRight {
	background:url(../img/rightCorner.gif) no-repeat;
	position:absolute;
	top:0;
	right:0;
	width:21px;
	height:21px;
}

.info {
	overflow:auto;
	font-size:0.9em;
}

.info p {
	float:left;
	width:276px;
	padding-right:5px;
}

.info p.coordonnees {
	color:#00A7CE;
	width:107px; 
	padding-left:15px;
	border-left:1px dotted #383738;
}

.seance {
	width:100%;
	border-bottom:1px dotted #383738;
	overflow:auto;
}

.seance p {
	padding:5px 10px;
	margin:0;
	float:left;
}

.seance .lieu {
	border-right:1px dotted #383738;
	color:#CCFF00;
}

.seance .horaires {
	border-right:1px dotted #383738;
	color:#00A7CE;
}

.DetailSeance, .sponsor {
	width:100%;
	overflow:auto;
	margin-bottom:10px;
}

.DetailSeance div {
	float:left;
}

.infos {
	width:243px;
	padding:10px 15px 0 0;
	border-right:1px dotted #383738;
}

.personnes {
	width:135px;
	padding:10px 0 0 15px;
}

.sponsor h3 {
	color:#CCFF00;
}

.sponsor img , .sponDetail {
	float:left;	
}

.sponDetail {
	width:435px; 
	padding:0 0 0 30px;
}


#gallerie img {
	padding:1px;
	border:1px solid #FFF;
	margin:1px;
}

.underline {
	text-decoration:underline;
}

/* ###################### $9. Contenu accueil ############################## */
.bloc_Edito {
	float:left;width:263px;margin:0 5px 0 0;
}
.bloc_Pre {
	float:left;width:303px;
}
#blocEditoTop , #blocEditoTop2 {
	width:536px;
	width:263px;
	height:12px;
	float:left;
	background:url(../img/bgblocEditoTop.gif) no-repeat;
}

#blocEdito, #blocEdito2 {
	width:536px;
	width:233px;
	float:left;
	padding-left:30px;
	padding-bottom:10px;
	background:#070607 url(../img/bgblocEditoBot.gif) no-repeat bottom;
}

#blocPreTop {
	width:303px;
	height:43px;
	float:left;
	background:url(../img/bgblocPreTop.gif) no-repeat;
}

#blocPre {
	width:273px;
	padding-left:30px;
	padding-bottom:10px;
	float:left;
	background:#070607 url(../img/bgblocPreBot.gif) no-repeat bottom;
}

#blocPre h1, #blocEdito h1, #blocEdito2 h1, #blocEdito a{
	padding:20px 20px 20px 0px;
}
#blocPre h1 {
	display:none;
}

#blocPre h1, #blocPre h2, #blocPre a,  #blocPre p{
	color:#66CCFF;
}
#blocPre a {
	text-decoration:underline;
	font-weight:bold;
}

#blocPre a:hover {
	color:#FFFF00;
}
#blocPre a.btPre {
	padding-left:40px;
	background:url(../img/pictoPlus.gif) no-repeat 30px 25px;
}
/* ###################### $10. Styles Tooltip Mootools ############################## */