/*  ----------------------------------------------------------- */
/*  ---- Feuilles de styles du site de Marie-Claire Mitout ---- */
/*  -------- Pierre Raine + Jean Galland = choc02.com --------- */
/*  ----------------------------------------------------------- */
/*  ------------------------------------------
/*  Correction des styles HTML par defaut
/*  ------------------------------------------ */
* { margin:0; padding:0; }
body {
	font-family: arial, sans-serif;
	font-size:1em;
	background:#F3F3F4;
}
img, table { margin: 0; padding: 0; border: none; }
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-size: 1em; font-weight: bold; }

li { list-style:none; }
a {
	color:black;
	text-decoration:none;
	font-weight:bold;
	outline:0;
}
a:hover, a.mcm:hover {
	color:white /*#2F2F2F*/;
	background:black;
}


.nettoyeur { clear: both; margin: 0; padding: 0; border: none; height: 0; line-height: 1px; font-size: 1px; }
.invisible { position: absolute; top: -3000em; height: 1%; }

/*  ------------------------------------------
/*  disposition des blocs principaux
/*  ------------------------------------------ */
#angle1h {
	width:27em;				/* pour safari qui change de typo sans savoir pourquoi */
	height:24px;
	background-color:black;
}

a.mcm {
	display:block;
	padding-left:.1em;
	text-transform:uppercase;
	font-size:1.8em;
	color:black;
	font-weight:bold;
	border-left:24px solid black;
	font-family:arial black, sans-serif;
}

#menu {
	position:relative;
	width:190px;
	float:left;
	border-left:24px solid black;
	padding-bottom:2px;
	font-family:arial black, sans-serif;
	font-size:.95em;
}

#contenu {
	position:relative;
	float:left;
	width:770px;
	margin-bottom:1em;
}


#angle2v {
	position:relative;
	clear:both;
	width:24px;
	height:60px;
	background-color:black;
	z-index:500;
}
#angle {
	float:left;
	width:180px;
	height:24px;
	background-color:black;
}




/* Pied de page qui se trouve en haut � gauche */
#pied {
	position::relative;
	float:right;
	text-align:right;
	margin-bottom:4px;
	margin-top:-24px;
	padding-right:.5em;
	color:#BFBFBF;
}
#pied small { font-size: 0.77em; }
#pied img { vertical-align: bottom; }
#pied a {
	color:#BFBFBF;
}
#pied a:hover {
	color:#8F8F8F;
	background:transparent;
}

/* connexion pr�s du pied */
#connexion {
	position:absolute;
	width:300px;
	right:0;
	top:0;
	margin-top:-20px;
	padding-top:20px;
	padding:.5em;
	font-size:0.8em;
	z-index:1000;
	background-color:red;
}
#connexion fieldset {
	border:none;
}
.login {
	margin-left:-.5em;
}
.spip_bouton input { cursor:pointer; }


/*  ------------------------------------------
/*  mise en forme du menu 
/*  ------------------------------------------ */
#menu li ul.sracine {
	line-height:1.3em;
}
a.racine {
	text-transform:uppercase;
	font-size:1.8em;
	color:black;
	font-weight:bold;
	padding-left:.1em;
}
a.racine:hover {
	color:white /*#2F2F2F*/;
	background-color:black;
	text-decoration:none;
}
#menu li ul.sracine li a:hover, a.on, #menu li ul.sracine li span {
	color:white /*#2F2F2F*/;
	background-color:black;
}


.sracine a {
	
}
.sracine a:hover {
	color:white;
}
ul.sracine ul {
	border-left:1em solid black;
	
}
li.soussous {
	line-height:1.2em;
}
li.soussous a {
	padding-bottom:0;
	font-size:.9em;
	font-weight:normal;
	
}



/*  ------------------------------------------
/*  disposition du contenu
/*  ------------------------------------------ */
#bordure {
	position:relative;
	clear:both;
	width:720px;
	margin-top:-60px;
	margin-left:20px;
	padding-top:.5em;
	font-family: arial, sans-serif;
	background:#fff;
	border-left:4px solid black;
	
}
#ascenseur {
	position:relative;
	height:485px;
	overflow:auto;
}
#hors_ascenseur {
	width:60%;
	margin-top:1.5em;
}
#contenu a:hover {
	background:none;
}


/*  Cartouche
---------------------------------------------- */
.cartouche {
	font-family: arial, sans-serif;
}

.cartouche h1.titre {
	text-transform:uppercase;
	font-size: .95em;
	font-weight: bold;
	font-family: arial black, sans-serif;
	color: #000;
}

#contenu .cartouche .titre a:hover {
	color:#2F2F2F;
}


#contenu .surtitre, #contenu .soustitre { font-size: 0.82em; }

.cartouche .urlrubrique {
	float:left;
	font-family:arial, sans-serif;
	font-size:2.4em;
	line-height:.65em;
}


.cartouche .spip_logos {
	float: right;
}

.cartouche p { margin: 0; padding: 0; clear: left; }
.cartouche small { font-size: 0.71em; }

.cartouche .traductions { font-size: 0.71em; }
.cartouche .traductions * { display: inline; }
.cartouche .traductions li { padding-left: 1em; }


/*  Mise en forme des textes du contenu
---------------------------------------------- */

.chapo {
	font-size:10pt;
	line-height: 1em;
	margin-bottom:1em;
}
p.spip {
	margin-bottom:.8em;
	font-size:.8em;
}
h3.spip {
	text-align:left;
	padding-top:.5em;
	margin-bottom:.3em;
	font-size:.8em;
}
.lien {
	background: #EEE;
	margin: 1em;
	margin-bottom:.5em;
	padding: .8em;
	border: 1px solid #CCC;
	font-size: .8em;
	font-weight: bold; }

.texte { color: #000; font-size: 0.96em; }

.ps, .notes {
	padding-top:1em;
	
}
.ps {
	clear:both;
	font-size: 0.82em;
}
.notes { clear: both; font-size: 0.77em; }
.notes h2 { font-size: 1.19em; font-weight: bold; }
span.info_ps {
	float:left;
	display:inline;
	font-weight:bold;
	padding-right:1em;
}

a.spip_out {
	color:black;
	background:#CFCFCF;
}
a.spip_out:hover {
	color:black;
	background:white;
}


/* ---------------------------------
/* particularit�s pour chaque mod�le
/* --------------------------------- */

/*************************** page article */
.page_article #hors_ascenseur {
	margin:0;
	padding:0;
}
.page_article #bordure {
	padding-top:0;
}

/*************************** mod�le images */
.page_rubrique_images #bordure {
	width:770px;
	margin-right:0;
	background:transparent;
}

#liste_images {
	margin-left:.5em;
}

#liste_images li {
	float:left;
	position:relative;
	width:235px;
	height:240px;
	margin-right:1.2em;
	margin-bottom:1em;
	font-size:.8em;
	background:#fff;
}
#liste_images li p {
	position:absolute;
	left:0;
	bottom:2px;
	height:80px;
	width:220px;
	padding:0 .5em;
	overflow:auto;
}

#liste_images li.titrearticle h4 {
	text-transform:uppercase;
	font-family: arial black, arial, sans-serif;
	font-weight:bold;
	font-size:1.1em;
	padding:0 .6em .3em;
}
.titrearticle h2 {
	text-transform:uppercase;
	font-family: arial, arial, sans-serif;
	font-weight:bold;
	font-size:0 .6em;
}
.logo {
	margin-left:.3em;
	padding:0 .6em;
}
li.titrearticle a:hover {
	color:gray;
}


/************************ modele lesplusbellesheures */
.page_rubrique_lesplusbellesheures #bordure {
	width:745px;
}
#liste_articles li {
	float:left;
	margin:0;
}
#liste_articles li h2 {
	font-size:.8em;
	padding:0 5px;
}
.titrearticle .logo {
	margin:0;
	margin-bottom:.3em;
	
}

.vignette {
	float:left;
	position:relative;
	margin:.4em;
}

.vignette a, .logo a {
	-moz-opacity:0.9;		
	-khtml-opacity:0.9;		
	opacity:0.9;			
	filter:alpha(opacity=90);	
}
.vignette a:focus, .vignette a:hover, .logo a:hover {
	-moz-opacity:1;		
	-khtml-opacity:1;		
	opacity:1;			
	filter:alpha(opacity=100);	
}

.popdesc {
	display:none;
	position:absolute;
	width:147px;
	height:50px;
	top:50%;
	left:0;
	font-size:.7em;
	font-weight:bold;
	margin-top:-32px;
	padding:.5em;
	color:black;
	background:white;
	overflow:auto;
	-moz-opacity:0.46;		/* transparence Moz */
	-khtml-opacity: 0.46;		/* transparence NS */
	opacity: 0.46;			/* transparence W3C */
	filter:alpha(opacity=46);	/* transparence IE */
}

/* Pagination image, page album/agrandissement */
#compteur {
	
}
#compteur, #suivant {
	font-weight:bold;
	font-size:.7em;
	float:left;
}
#compteur span {
	margin:0;
	background:black;
	color:white;
	padding:0 .3em;
}
#compteur a {
	margin:0;
	border-top:2px solid black;
	padding:.2em .3em;
}
#suivant a {
	margin:0;
	padding:0 .2em;
}
#compteur a:hover, #suivant a:hover {
	background:black;
	color:white;
}

.page_album .spip_document, .page_album #bordure {
	padding:0;
	
}
.page_album #bordure {
	width:auto;
	height:auto;
	background:transparent;
	overflow:hidden;
}
.page_album #contenu {
	margin-bottom:0;
}

#suivant {
	font-size:1em;
	margin-left:.3em;
	line-height:.7em;
}
.page_album .spip_doc_descriptif {
	margin-top:1.5em;
	font-size:.8em;
}


/************************ mod�le �chapp�e belle */
.page_article_echappeebelle #contenu { width:750px; }
.page_article_echappeebelle #bordure {
	width:auto;
	height:auto;
	padding:5px;
	background:transparent;
	overflow:hidden;
}
.page_article_echappeebelle #documents_portfolio span {
	position:relative;
	float:left;
	margin:0;
	padding:0;
	margin-top:-15px;
}

.page_article_echappeebelle #bordure object {
	margin:0;
}

.page_article_echappeebelle #bordure a {
	font-weight:bold;
	color:gray;
}
.page_article_echappeebelle #bordure a:hover {
	color:black;
}

/* mod�le panopeint */
.page_panopeint #bordure {
	width:800px;
	height:600px;
}


/************************* mod�le premiers savoirs chateaux et cahiers */
.page_rubrique_premierssavoirs #bordure {
	width:770px;
	margin-right:0;
	background:transparent;
}

.page_rubrique_premierssavoirs_chateaux #contenu {
	width:774px;
}
.page_rubrique_premierssavoirs_chateaux #bordure {
	width:750px;
	padding:0;
	background:transparent;
	overflow:hidden;
}


.page_rubrique_premierssavoirs_cahier #bordure {
	width:760px;
	padding:0;
	background:transparent;
	overflow:hidden;
}
.page_rubrique_premierssavoirs_cahier #hors_ascenseur {
	float:left;
}
.page_rubrique_premierssavoirs_cahier #documents_portfolio {
	float:left;
	width:156px;
	height:550px;
	background:white;
	overflow:auto;
}
.page_rubrique_premierssavoirs_cahier #document_actif {
	float:left;
	width:600px;
	height:550px;
	background:transparent;
}

/* pop up document_image page premierssavoirs_cahier */
#document_image {
	text-align:center;
}


/*************************** mod�le page_rubrique_emploidutemps */
.page_rubrique_emploidutemps #contenu {
	width:780px;
}
.page_rubrique_emploidutemps #bordure {
	width:auto;
	padding:0;
	overflow:hidden;
}
.page_rubrique_emploidutemps #ascenseur {
	position:relative;			/* faut penser � IE qui g�re mal l'overflow sans position:relative... */
	clear:both;
	width:755px;
	height:440px;
	overflow:auto;
}
#tete_colonne li {
	position:relative;
	float:left;
	width:100px;
	margin-right:5px;
	margin-bottom:5px;
	background:#b3b3b3;
	color:white;
}
#tete_colonne li .titre {
	padding:0 .2em;
	font-size:.75em;
	font-family: arial, sans-serif;
	font-weight:bold;
}
#tete_colonne li .soustitre {
	padding:0 .2em .2em .2em;
}
.tete {
	clear:both;
	float:none;
	margin:0 7px 5px 0;
	background:#b3b3b3;
	color:white;
	font-family: arial, sans-serif;
}
.tete h1 { padding:0 .2em; font-size:.85em; }
.tete_ligne li.vignette {
	float:left;
	width:100px;
	height:140px;
	margin:0;
	margin-right:5px;
	margin-bottom:5px;
	background:#b3b3b3;
}

a.fond {
	position:relative;
	display:block;
	width:100px;
	height:140px;
}
.page_rubrique_emploidutemps a.popdoc {
	position:absolute;
	top:0;
	left:0;
}

/* pop up document_image page page emploidutemps */

.document_image_emploidutemps {
	text-align:center;
}
.document_image_emploidutemps img {
	margin:15px;
}
.document_image_emploidutemps a.fermer, .document_image_emploidutemps p {
	position:fixed;
	text-align:left;
	color:#8f8f8f;
	font-size:.75em;
	margin-left:.5em;
}
.document_image_emploidutemps p {
	margin-top:1em;
}
.document_image_emploidutemps a {
	cursor:pointer;
	padding:0 .5em;
	background:#B3B3B3;
	margin-right:.3em;
	
}
.document_image_emploidutemps p.small {
	margin-top:1.5em;
}
.document_image_emploidutemps a.fermer {
	display:block;
	width:100%;
	margin:0;
	background:none;
}
.document_image_emploidutemps a.fermer:hover {
	background:black;
}
.document_image_emploidutemps a.fermer_img {
	background:none;
}
.document_image_emploidutemps .mcm {
	text-align:left;
	font-size:.7em;
	border:none;
}

/****************************** mod�le �crits */

#myAccordion {
	background:#AFAFAF;
	font-size:.9em;
}
.extrait a, #myAccordion a { color:white; }
.extrait a:hover, #myAccordion a:hover {
	color:black;
}
.extrait div, #myAccordion div { font-size:.9em; }
.extrait p.spip, #myAccordion p.spip {
	font-size:1em;
	margin-top:.5em;
	margin-bottom:.3em;
}
.extrait span.date, #myAccordion span.date {
	font-weight:bold;
	float:left;
	margin-right:.5em;
	font-family:arial, sans-serif;
	margin-top:0;
}
.extrait .crayon span.crayon-icones, #myAccordion .crayon span.crayon-icones {
	border:none;
	position:absolute;
	right:-18px;
}

.pascomplet a {
	font-weight:normal;
}
.complet {
	background-color:white;
	text-indent:4em;
}

.page_rubrique_ecrits #bordure, .page_rubrique_ecrits_sousrubrique #bordure {
	padding:0;
	background:#AFAFAF;
}
/*  + myAccordion
---------------------------------------------- */
#myAccordion{
	width: 100%;
}
#myAccordion dt{
	border-top:5px solid #AFAFAF;
	color:#fff;
	cursor:pointer;
}
#myAccordion dd{
	overflow: auto;
}
#myAccordion p{
	
}
#myAccordion dt.myAccordionHover
{
	color:#000;
}
#myAccordion dt.myAccordionActive
{
	color:#000;
}



/*  ------------------------------------------
/*  Typographie generale du site
/*  ------------------------------------------ */

/* Typo pour les menus et la navigation 
body, #navigation, .encart, .formulaire_spip {
	font-family: Verdana, Tahoma, Arial, sans-serif; }

/* Typo pour les citations et extraits introductifs */
q, blockquote {
	font-family: Georgia, Times, serif; }


/*  ------------------------------------------
/*  Habillage du contenu
/*  ------------------------------------------ */



/*  Portfolio
---------------------------------------------- */
#documents_portfolio {
	clear: both;
	
}
#documents_portfolio h2 {
	font-size: 0.88em;
	font-weight: bold;
}
#documents_portfolio a {
	
}
#document_actif {
	/*position:absolute;*/
	width:750px;
	height:580px;
	left:0;
	top:24px;
	background:white /*#F3F3F4*/;
}
#document_actif, #fragments {
	padding:0;
	margin:0;
}






/*  Listes de documents joints (a un article ou une rubrique)
---------------------------------------------- */
#documents_joints {
	
}
#documents_joints h2 { margin-bottom: 0.4em; font-size: 0.88em; font-weight: bold; }
#documents_joints ul { margin: 0; padding: 0; list-style: none; }
#documents_joints li { margin-bottom: 0.4em; }
#documents_joints li .spip_doc_titre {}
#documents_joints li .spip_doc_titre small { font-weight: normal; }
#documents_joints li .spip_doc_descriptif {}

/* Listes d'articles et extraits introductifs
----------------------------------------------- */
.liste-articles ul { margin: 0; padding: 0; list-style: none; }
.liste-articles li { margin-bottom: 1em; clear: both; }

.liste-articles li .titre {
	font-size: 1.03em;
	font-weight: bold; }

.liste-articles li .spip_logos {
	float: right;
	margin-left: 16px;
	margin-bottom: 16px;
	clear: right; }

.liste-articles li p { margin: 0; padding: 0; }

.liste-articles li .enclosures {
	float: right;
	text-align: right;
	max-width: 60%;
	margin: 0; }

.liste-articles li small {
	display: block;
	font-size: 0.71em; }

.liste-articles li .texte {
	margin-top: 5px;
	margin-bottom: 1em;
	border: 1px solid #CCC;
	padding: 0.9em;
	font-size: 0.82em;
	line-height: 1.4em; }

.pagination { font-size: 0.8em; }

/*  ------------------------------------------
/*  Habillage specifique du plan du site
/*  ------------------------------------------ */

.page_plan .cartouche {
	
}

.page_plan #contenu h2 {
	font-weight: bold;
}

.page_plan #contenu .contre-encart ul {
	display: block;
	clear: left;
	margin-top: 0;
	margin-bottom: .5em;
	padding-top: 0; }
.page_plan #contenu .contre-encart li {}

.page_plan #contenu a:hover {
	background:black;
}

/*  ------------------------------------------
/*  mise en forme de l'accueil
/*  ------------------------------------------ */
.page_sommaire {
	background:url('images/degradanim.gif') top left repeat;
	width:100%;
	height:100%;
}
.page_sommaire #pied, .page_sommaire #pied a { color:black; }
.page_sommaire #mcm {
	width:100%;
	height:100%;
}
.page_sommaire #bordure { background:transparent; height:100%; }
.page_sommaire #fin {
	position:absolute;
	width:425px;
	height:293px;
	top:50%;
	left:50%;
	margin-top:-147px;
	margin-left:-212px;
	background:url('images/fintrans.gif') transparent top left no-repeat;
}