@import url('https://fonts.googleapis.com/css?family=Droid+Sans|Droid+Serif');
html { margin:0px; padding:0px; font-family:Droid Sans,Arial,sans-serif; font-size:0.8em; color:#333; background-color:#fff }
body { margin:0px; padding:0px; background:url(graphics/background-site.jpg) repeat-x }
#all { padding:0px; color:#333; max-width:1280px; margin:0px auto 0px auto; background-color:#fff }
.clear { clear:both }
.mcrypt { background:url(graphics/leure.gif) no-repeat center; padding:0px 6px !important }

/* titres psn: Droid Serif','Times New Roman', Georgia, serif */

/* large display greather than 1200 pixel */
.topBannerBig { margin:0px 0px 10px 0px; padding:0px }
	.topBannerBig img { max-width:100%; height:auto }
.topBannerMedium { margin:0px; padding:0px; display:none; overflow:hidden }
.topBannerSmall { margin:5px 0px 0px 0px; padding:0px; display:none; text-align:center }		

.menu { clear:both; width:17%; float:left;  margin:0px 0px 0px 1%; padding:0px }
	.menuLine1 { }
	.menuLine2 { font-style:italic }
	.menu ul { list-style:none; margin:0px; padding:0px }
		.menu li.menu_1 { border:1px dotted #c63; background:#ffd; margin:0px 0px 5px 0px; font-weight:bold; border-radius:8px; white-space:nowrap; overflow:hidden }
		.menu li.menu_2 { font-weight:normal; padding-left:10%; white-space:nowrap; overflow:hidden }
			.menu a { text-decoration:none; color:#933; display:block; padding:2px 0px 2px 3px }
			.menu a:hover { background-color:#fddf6d }
			.menu img.at_sign { height:0.8em; margin:0px 1px 0px 2px }
	.menu .worldlinks { text-align:center }
		.menu .worldlinks img { max-width:100%; height:auto }
	

.mainArticle { border:none; width:46%; float:left }
	.mainArticle .fullname { text-align:center }
		.mainArticle img { max-width:100%; height:auto }

.secondaryArticle { width:16%; float:left; border: 1px dotted #c63; padding:3px; border-radius:8px; margin:0px 1% 10px 0px }
	.secondaryArticle { display:block; color:#933; text-decoration:none; margin-bottom:10px; height:120px; overflow:hidden }
	.secondaryArticle:hover { background-color:#fddf6d }
		.secondaryArticle .date { font-size:10px }
		.secondaryArticle .titre { font-weight:bold; color:#933; background-color:#fddf6d; padding-left:2px; text-align:center }
		.secondaryArticle .soustitre { text-align:center; margin-bottom:5px; font-size:10px }
		.secondaryArticle .texte {}
		
.mainContent { border:none; width:80%; float:left; padding:0px 1% 0px 1% }
.footer { clear:both; text-align:center; background-color:#ffbf00; color:#933; margin:10px 0px 0px 0px }
.youtube { width:640px; height:360px }

/* desktop lower than 1280 pixel or tablet in landscape */
@media screen and (max-width:1280px) {
	.menu { width:20% }
	.mainArticle { width:56% }
	.secondaryArticle { margin:0px 0px 1% 1%; width:20%; font-size:0.9em }
	.mainContent { width:76%; padding:0px 1% 0px 1% }
}

/* smartphones or tablet in portrait */
@media screen and (orientation:portrait) {
	
	.topBannerBig { display:block }
	.topBannerMedium { display:none }
	.menu { width:auto; margin:5px 0px 0px 6%; text-align:center }
		.menu li.menu_1 { float:left; margin-right:5px; font-weight:normal; width:30%; font-size:1.4em }
			.menu_1 a { padding:3px }
		.menu li.menu_2 { display:none }
		.menu .worldlinks { display:none }
	.mainArticle { width:99% }
	.secondaryArticle { width:46%; font-size:1.4em; margin:2% 0px 0px 2% }
	.mainContent { width:99%; padding:0px 1% 0px 1% }
	.youtube { width:100% !important; height:320px !important }	
	
}

/* smartphones lower than 480px */
@media screen and (max-width:480px) {
	
	body { width:480px }
	.topBannerBig { display:none }
	.topBannerMedium { display:none }
	.topBannerSmall { display:block }
	.menu { width:100%; max-width:470px; font-size:1.0em }
		.menu li.menu_1 { float:none; width:90%; white-space:nowrap; overflow:hidden;  }
		.menuLine1 { display:inline }
		.menuLine2 { display:inline; margin-left:10px }
		.menu li.menu_2 { display:none }
		.menu .worldlinks { display:none }
	.mainArticle { width:470px; font-size:1.2em }
	.secondaryArticle { width:46%; height:20px }
	.secondaryArticle .date { display:none }
	.secondaryArticle .titre { font-weight:normal; background:none; white-space:nowrap; overflow:hidden }
	.secondaryArticle .soustitre { display:none }
	.secondaryArticle .texte { display:none }
	.mainContent { width:470px; font-size:1.2em; padding:0px 1% 0px 1% }
	.youtube { width:100% !important; height:320px !important }
}

/* styles communs */

#ariane_traductions { text-align:left; border-bottom:1px dotted #c0c0c0; padding-bottom:2px }
#ariane_traductions #traductions { float:right }
#ariane_traductions a { padding:0px 2px 0px 2px; color:#333; text-decoration:none }
#ariane_traductions a:hover { background-color:#fddf6d }

#underTheBottomLine { clear:both; width:100%; border-top:1px dashed #c0c0c0; text-align:left; margin:25px 0px 0px 0px; padding:10px 0px 0px 0px }
#underTheBottomLine td { vertical-align:top }
#underTheBottomLine a { padding:0px 2px 0px 2px; color:#333 }
#underTheBottomLine a:hover { background-color:#fddf6d }
#underTheBottomLine ul { list-style:url(graphics/puce.gif); margin:0px 0px 0px 0px; padding:0px, text-align:left }
#underTheBottomLine li { margin:0px 0px 0px 0px; padding:0px, text-align:left }
.permalink { font-size:11px }

/* sommaire */

.mainArticle .texte { text-align:center }
	.mainArticle .texte img { max-width:100%; height:auto }
	
/* rubrique */

#rubrique .logo { float:left; margin:5px 0px 5px 0px }
#rubrique .titre { margin:15px 0px 15px 0px; font-size:150%; color:#933 }
#rubrique .texte { color: #003f87; margin:10px 0px 20px 0px }

#articles { width:100%; margin-bottom:20px }
	#articles a.article { clear:both; text-decoration:none; color:#333; display:block; margin-bottom:5px }
	#articles a.article:hover { background-color:#fddf6d }
	#articles .article_langue { float:left; margin:0px 10px 10px 0px }
	#articles .article_date { float:right; font-size:90%; white-space:nowrap }
	#articles .article_titre {  }
	#articles .article_soustitre { font-size:90% }
	#articles .article_auteur { font-size:90% }
	
#sousrubriques { clear:both; margin-top:20px; }
	#sousrubriques a { display:block; width:40%; float:left; margin:8px; background-color:#ffd; border:1px dotted #c63; padding:10px; text-decoration:none; color:#933; font-size:14px; border-radius:8px }
	#sousrubriques a:hover { background-color:#fddf6d }
	#sousrubriques a .logo { float:left }

#docs { text-align:left; clear:both; margin-top:20px } 
	#docs .document { margin: 10px 0px 0px 0px }
		#docs .document-type { font-style:italic; margin-left:10px; font-size:80% }
		#docs .document-titre { margin-left:10px  }
		#docs .document-descriptif { margin-left:10px; font-size:90%; font-style:italic }

#sites { margin:30px 20px }
	#sites .entete { text-align:left; margin:40px 0px 0px 0px; font-size:14px; color:#933 }
	#sites .lien { list-style:url(graphics/puce.gif); margin-top:5px; text-align:left; }
	#sites .lien a { padding:0px 2px 0px 2px; color:#333; text-decoration:none; }
	#sites .lien a:hover { background-color:#fddf6d }
	
/* article */

#article .logo { float:left; margin:5px 5px 0px 0px }
#article .titre { margin:15px 0px 15px 0px; font-size:150%; color:#933 }
#article .soustitre { margin:-5px 0px 15px 0px; font-weight:bold }
#article .chapo { margin:10px 0px 0px 30px; font-style:italic }
#article .texte { margin:10px 10px 0px 10px; text-align:justify }
	#article .texte a { text-decoration:underline; }
	#article img { max-width:100%; height:auto }
	#article .texte table { border-collapse:collapse; }
	#article .texte td { padding:3px 5px 3px 5px; }
	#article .texte table caption { color:#ff7900; font-weight:bold }
	#article .texte th { background-color:#ffbf00; color:#333 }
	#article .texte ul { list-style:url(graphics/puce.gif); margin:0px 0px 0px 10px; padding:0px, text-align:left }
	#article .texte li { margin:0px 0px 0px 10px; padding:0px, text-align:left }
	#article .texte ol { margin:0px 0px 0px 10px; padding:0px, text-align:left }
	#article .texte sc { font-variant:small-caps; font-size:14px}
	#article .texte hr { height:1px; color:#ffbf00; background-color:#ffbf00 }
	#article .texte a { padding:0px 2px 0px 2px; color:#333 }
	#article .texte a:hover { background-color:#fddf6d }
	#article .texte .texteencadre-spip { width:30%; float:right; border:1px solid #ffbf00; margin:10px 10px 10px 10px; padding:8px; box-shadow:0 0 5px #ffbf00; background-color:#fff; }

	#article .texte .spip_documents_left { margin:5px 10px 5px 0px; background-color:#fff; overflow:hidden; }
	#article .texte .spip_documents_center { display:block; text-align:center; background-color:#fff; }
	#article .texte .spip_documents_right { margin:5px 0px 5px 10px; background-color:#fff; overflow:hidden; }
	#article .texte .spip_doc_titre { display:block; text-align:center; margin:0px auto 0px auto; }
	#article .texte .spip_doc_descriptif { display:block; text-align:center; margin:0px auto 0px auto; font-style:italic; font-size:10px}
	
	#article .texte table.spip { border: 1px solid #888; border-collapse:collapse }
	#article .texte table.spip tr.row_first {background-color:#c0c0c0; color:#fff; font-weight:bold; text-align:center }
	#article .texte table.spip tr.row_odd {background-color:#fff }
	#article .texte table.spip tr.row_even {background-color:#e0e0e0 }
	#article .texte table.spip td {padding:2px; text-align:left; vertical-align:top; border: 1px solid #888 }
		
	#article .notes { text-align:left; margin:10px 0px 0px 0px; border-top:1px dashed #c0c0c0 }

	#article .texte h3, #article .texte h3.spip { font-size:130%; color:#933; font-weight:normal; border-bottom:1px dotted #933  }
	#article .texte h4, #article .texte h3.intertitre2{ font-size:120%; color:#933 }
	#article .texte h5, #article .texte h3.intertitre3{ color:#933; font-weight:bold }
	#article .texte h6, #article .texte h3.intertitre4{ font-weight:bold }
	#article .texte p.spip_note { text-align:left; padding:0px; margin:0px; line-height:1.2em }
	#article .texte a.spip_note { text-decoration:none }

#portfolio { background-color:#333; margin:20px 0px 0px 0px; padding:10px; }
	#portfolio a img { margin:5px; }
#docs { text-align:left } 
	.document { margin: 10px 0px 0px 0px }
		.document-type { font-style:italic; margin-left:10px }
		.document-titre { font-weight:bold; margin-left:10px  }
		.document-descriptif { margin-left:10px }
.picasaweb { display:block; margin:0px auto 0px auto; width:560px; height:480px; padding:10px }	
embed { display:block; margin:0px auto 0px auto}	

/* social stuff */
.socialnetworks-recommend { margin:10px 0px 10px 0px }

/* forum interne */

.formulaire_forum { margin-top:20px }
.formulaire_forum fieldset.qui, .formulaire_forum .saisie_texte .explication { display:none }
.formulaire_forum .saisie_texte label { display:block }
.formulaire_forum .saisie_texte, .formulaire_forum .saisie_titre { list-style:none }
.formulaire_forum .saisie_texte textarea { width:90%; height:70px }
.comments h3 { font-size:130%; color:#933; font-weight:normal; border-bottom:1px dotted #933  }
	
	
/* printing */

@media print {

	body { background-color:#fff }
	#all, .mainArticle { width:17cm }

	.menu, #ariane_traductions, .facebook, .secondaryArticle { display:none }
	.mainContent { width:100% }

	.topBannerBig, .topBannerMedium { display:none }
	.topBannerSmall { display:block }

}