.colpad{padding:1%!important;}
@media (max-width: 576px) {
	.taillephone{width:100%!important;}
}
@media (min-width: 1200px) {
	.aside .colpad {padding:0!important;}
}
.unecol      {flex-direction:column;flex-wrap:wrap;text-align:justify;padding:0;height:100%;margin:auto}
.debcols     {padding:0;align-items:stretch;flex-wrap:wrap;height:100%;margin:auto}


	/* style du raccourcis [*texte*] */
.caractencadre-spip {
	background: #D2E0FF;
	font-weight: bold;
	color: #000000;
	position: relative;
	padding:3px;
	margin:10px;
	overflow: hidden;
	border-top: 2px none #B2B2FF;
	border-right: 2px outset #B2B2FF;
	border-bottom: 2px outset #B2B2FF;
	border-left: 2px outset #B2B2FF;
	text-indent: 0px;
 }


/* style du raccourcis [**texte*] */
.caractencadre2-spip {
	color: #FF0000;
	font-weight: bold;
	background-color: #FDD0C6;
	border-top: thin none #FFCCFF;
	border-right: thin none #FFCCFF;
	border-bottom: thin none;
	border-left: thin none;
	padding:3px;	text-indent: 0px;

}

/* style du raccourcis [**texte*] */
.caractencadre3-spip {
	color: #FF0000;
	font-weight: bold;
	background-color: #FDD0C6;
	border-top: thin none #FFCCFF;
	border-right: thin none #FFCCFF;
	border-bottom: thin none;
	border-left: thin none;
	padding:3px;	text-indent: 0px;

}
.caractencadre4-spip {
	color: #00F;
	font-weight: bold;
	background-color: #CCF;
	border-top: thin none #FFCCFF;
	border-right: thin none #FFCCFF;
	border-bottom: thin none;
	border-left: thin none;
	padding:3px;
	text-indent: 0px;
}

acronym.spip_acronym {
	cursor: help;
	border-bottom: 1px dotted;
}

/* ne marche pas sur MSIE, a refaire en jQuery */
a[hreflang]:after {
content: "\0000a0[" attr(hreflang) "]";
color: #999;
background: transparent;
font-size:x-small;
}




sup {	vertical-align:20%;	font-variant: small-caps;	font-size: .5em;}



sup, sup.typo_exposants {
	font-size: 78%;
	font-variant: normal;
	vertical-align: 24%;
}

sub {
	font-size: 60%;
	font-variant: normal;
	vertical-align: -20%;
}

.caps {
	font-variant: small-caps;
}
/* decalage */
.decal,.decal1{margin-left:10%;}
.decal2{margin-left:20%;}
.decal3{margin-left:30%;}
.decal4{margin-left:40%;}

                              /* poesie */
.interieur{margin:auto!important}
.spip_poesie    {
	margin: 2em 0;
	margin-left: 1em;
	font-size:20px;
	text-align:left;
	line-height: normal;
	border:none;
	overflow: hidden;
	}
.spip_poesie div { text-indent: -3em; margin-left: 3em; }

.spip_poesie :first-letter , .spip_poesie h2:first-letter{
	color:#791E22;
	font-family: times;	
	text-transform:uppercase;
}

.spip_poesie h2{color:#791E22;}
.spip_poesie .interieur{
	padding-left: 1em;
	border-left-width: 6px;
	border-left-style: solid;
	border-left-color: #791E22;
	 text-indent: 0;
	 display:flex;flex-wrap:wrap;
   }


.spip_poesie .spip_documents_left  {
	float: left;
	margin-right:  1em;
	margin-bottom: 5px;
	padding-right:1em;
	
}

.spip_poesie .spip_documents_left img  { float: left; margin-right: 15px; margin-bottom: 5px;padding-right:10px; }
.spip_poesie  .spip_documents_right { float: right; margin-left: 15px; margin-bottom: 5px; }
.spip_poesie.spip_documents_left img  { float: right; margin-right: 15px; margin-bottom: 5px;padding-right:10px; }




.ledescriptif .poesie .interieur {display:block;}
.poesie
{   font-family: Garamond, Georgia, Times, serif;
	padding: 10px;
	text-align:center;margin-left:auto;	margin-right:auto;
	margin-top:20px;margin-bottom:20px;
	width:100%;min-width:200px;
	 }
	 
@media (max-width: 340px) {	
.poesie{width:100%!important;}
.spip_poesie    {
	margin: 10px;width:100%!important;font-size:100%!important;
	 }
.poesie3 .interieur:first-child ,.poesie4 .interieur:first-child ,.poesie5 .interieur:first-child ,.poesie1 .interieur:first-child {font-size:100%!important;text-align:left;}
.spip_poesie div {
    text-indent: -1em;
    margin-left: 0em;
	padding: 0!important;
}

.spip_poesie  {
    margin-left: 10px;
    text-indent: -10px ;font-size:100%;
}
}

@media (min-width: 341px) AND (max-width :640px) {	
.spip_poesie  {
    margin-left: 10px;
    text-indent: -10px ;font-size:100%;
}
.spip_poesie div {
    text-indent: -1em;
    margin-left: 0em;
	padding: 0!important;
}

}


.poesie .interieur{	height: auto; font-size:110%;	}

.poesie , .poesie  p {
  font-size:110%; width:auto;text-align:justify;line-height:1;
 }
.poesie .interieur p::first-letter {font-weight: bold;text-transform : uppercase ;}

.poesie .interieur::first-letter{
font-style: italic;font-weight: bold;text-transform : uppercase ;
font-size: 70px;margin-right:  5px;margin-top:0px;
float: left;text-shadow:1px 1px 0px #757575;
}

.poesie .interieur::first-line {
line-height:70px;font-size:110%
}
.poesie h2{
font-size:140%;line-height:70px;font-weight: bold;
text-align:center;margin-left:auto;margin-right:auto;
}
.poesie h2::first-letter { color:inherit;float:none;text-shadow:none; font-size:140%;}

 
.poesie0
{
	border:4px solid #B2B2FF;
	background-color: #FFFF99;
	
}
.poesie0 .interieur::first-letter {
	color:#CC3300;font-size:24px;font-weight: bold;
	font-family: times;
	}


.poesie1
{
	border:4px solid #791E22;
	font-size:120%;
	background-color: #FBECEC;
	margin-bottom:10px;
	color: #791E22;
	
}
.poesie1 .interieur::first-letter{
	color:#791E22;font-weight: bold;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	}
.poesie1 .interieur::first-line {
font-size:140%;line-height:70px;color:#791E22;
}
.poesie2
{	border:4px solid #00C;
	font-size:120%;
	background-color: #E6E6FF;
	color: #333;
}

.poesie2 .interieur::first-letter, .poesie2 .interieur p::first-letter{
	font-weight: bold;
	font-family: times;
	color :#00C;font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	}

.poesie2 .interieur::first-line {
font-size:140%;line-height:70px;color :#00C;
}
.poesie3
{	background-color: #FBEEC8;color:black; }
.poesie3  .interieur p::first-letter {font-weight: bold;color: #F55E07;}
.poesie3  .interieur::first-letter  {
font-style: italic;font-weight: bold;text-transform : uppercase ;
font-size: 70px;line-height:70px;
margin-right:  5px;margin-top:0px;
float: left;color: #F55E07;text-shadow:1px 1px 0px #757575;
}
.poesie3 .interieur::first-line {
font-size:140%;line-height:70px;color: #F55E07;
}
.poesie3 .interieur, .poesie3 .interieur  p {
  font-size:115%; width:auto;text-align:justify;line-height:1.3;
 }
	

.poesie4{
	font-size:115%;
	background-color: #E9E9E9;
	color: ##0b0b0b;

  }
.poesie4 .interieur::first-line    {line-height:70px;font-size:115%;color: #648090;}
.poesie4 .interieur::first-letter
{

text-transform :uppercase ;
font-size: 70px;line-height:70px;
margin-right:  5px;margin-top:0px;
float: left;color: #648090;
text-shadow:1px 1px 0px #757575;
}

.poesie4 .interieur p::first-letter{font-weight:bold;}
.poesie5{
	font-size:115%;
	background-color: transparent;
	border:none;

  }
.poesie5 .interieur::first-line  {line-height:70px;font-size:115%;}  
.poesie5 .interieur::first-letter
{

text-transform :uppercase ;
font-size: 70px;line-height:70px;
margin-right:  5px;margin-top:0px;
float: left;
text-shadow:1px 1px 0px #757575;
}
.poesie5.interieur p::first-letter{font-weight:bold;}


/* citations */

/* les citation [cbn( blabla )cnb] nb =1 à 5 */
blockquote.spip, [class*="citation"]  {
	display:block;
	position: relative;font-family: 'Abril Fatface', sans-serif;
	text-align: justify;
	color: #333;
	-moz-box-shadow: 2px 2px 15px #ccc;
	-webkit-box-shadow: 2px 2px 15px #ccc;
	box-shadow: 2px 2px 15px #ccc;
	background-color: #FFF;
	font-style: normal;
	padding-top: 15px;
	padding-right:20px;
	padding-bottom:15px;
	margin-top: 1em;
	margin-bottom: 1em;
	overflow: hidden;
	min-width:200px;
}

/*blockquote { quotes: '\201C' '\201D'; }*/

/* les citations quote  avec barre*/
.citation1,.citation3, .citation6,.citation8{
	color: #666;margin-left:auto;margin-right:auto;
	border-right-width: 2px;
	border-left-width: 15px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #00F;
	border-left-color: #00F;
	padding-top: 20px;
	padding-right: 40px;
	padding-bottom: 20px;
	padding-left: 20px;
}
 .citation2,.citation5{padding-left:20px}
.citation:before,  .citation1:before,.citation2:before,.citation3:before,.citation4:before{
  content: "\201C"; /*Unicode pour Double Quote*/
  font-family: Georgia, serif;
  font-size: 320%; 
  font-weight: bold;
  color: #999;color: #333;
  float:left;
  vertical-align:top;
  margin-right:20px;
}
.citation2:before {margin-left:0;padding-left:0; }
.citation:after,blockquote.citation1:after,.citation2:after,.citation3:after, .citation6:after,.citation4:after{
	font-family: Georgia, serif;
	font-size: 320%;
	font-weight: bold;
	color: #333;
	float:right;
	position: absolute;
	right: 10px;
	vertical-align:bottom;
	bottom: -5px;	
}

.citation4,.citation7,.citation8{
	font-size:100%;
	padding-left:20px;
	border-right-width: 2px;
	border-left-width: 15px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #666;
	border-left-color: #666;
}

.citation7{
   padding-right:5px;padding-left:5px;
  }
.citation1:after,.citation2:after,.citation3:after{
  content: "\201D";
}
.citation6:before{
	content: "\2661";color: #00F;font-size: 320%;
}
.citation3:before{
	content: "\201C"; color: #00F;
}
.citation4:before,.citation5:before{
	content: "\271D";color: #666;
}
.citation1 a ,.citation2 a{
	text-decoration: none;
	background: #eee;
	cursor: pointer;
	padding: 0 3px;
	color: #00F;
}
 .citation1 a:hover,.citation2 a:hover{
 color: #666;
}

.citation3 a,.citation7 a{
	text-decoration: none;
	background: #eee;
	cursor: pointer;
	padding: 0 3px;
	color: #333;
}

.citation3 a:hover,.citation6 a:hover{color: #00F;}
.citation3 em{  font-style: italic;}
  
  
  /* style titre d'article journal */
.citation8 ,.citation9{
	display: inline-block;
	font-size: 120%;
	margin-top: 1em;
	padding-left:10px;
	margin-bottom: 1em;
	
}
.citation8:first-letter,.citation9:first-letter {
	float: left;
	font-family: "Monotype Corsiva", "Apple Chancery", fantasy;
	font-size: 320%;
	font-weight: bold;
	margin-top: 0.1em;
	margin-right: 0.3em;
	margin-bottom: 0.1em;
	margin-left: 0;	/*filter:progid:DXImageTransform.Microsoft.Shadow(color=#ffffff, Direction=NaN, Strength=0);*/
}
.citation9:first-letter{color:#a52a2a;}
.citation8:first-line ,.citation9:first-line {
	font-variant: small-caps;
	font-weight: bold;
	padding-top:30%;
	line-height: 160%;

}
.citation9:first-line {color:#a52a2a;}




.citation5:before{
/*	content: "\263B";*/
	font-family: Georgia, serif;
	font-size: 320%;
	font-weight: bold;
	color: #00F;
	float:left;
	vertical-align:top;
	margin-right:20px;
}
.citation5:after{
	
	font-family: Georgia, serif;
	font-size: 320%;
	font-weight: bold;
	color: #333;
	float:right;
    padding-top:20px;
	position: absolute;
    vertical-align:bottom;
	
}


.apostrophe{
	background:#0066FF;
	padding:10px;
	margin:10px;
	color: #FFFFFF;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;  
	border-radius:15px;
	border: 2px outset #B2B2FF;
	position:relative;
	font-size:18px;
	font-weight:bold;
	overflow:hidden;
	float: none!important;
	float:left;
	}
	


	/* encadrement du texte graphe [(texte)]    */
 .texteencadre-spip,.texte_encadre{
	padding:1em;
	margin:5%;
	border: 3px outset #B2B2FF;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;  /* principaux nvigateurs */ 
	border-radius:15px;
	position:relative;
	font-weight:bold;
	overflow:hidden;
	float: none!important;
	color: #0000FF;
	min-width:200px;
	overflow:hidden;
	float: none!important;
	background:#D2E0FF;
	}
	
 .texteencadre-spip{color: #FFFFFF; }
@media (max-width:340px) {	.texteencadre-spip,.texte_encadre{margin:10px!important;padding:10px!important}}
@media (max-width:576px) {
	.texte_encadre,.texteencadre-spip{margin:10px!important;padding:1em!important}
    .texteencadre-spip ul li,.texte_encadre ul li { margin-left: 5px; padding-left: 2px;font-size:90%;}
}


.coul_encadre1{background:#0066FF;}
.coul_encadre2{background:#FF66FF;	}
.coul_encadre3{background:#66FF33;	}
.coul_encadre4{background:#FFCC33;	}
.coul_encadre5{background: #C30	}
.coul_encadre6{	color: #005FD2;	background-color: #B7D8FF;}
.coul_encadre7{	background: #999;	color: #333;}


/* mise en lettrine d'un caractère  */
.lettrine1,.lettrine,.lettrine4 {float:left;font-size:100px;line-height:80px;
padding-top:1px;padding-right:5px;font-family: times;color:#D4D4C7;text-indent:0px;}
.lettrine2 {float:left;font-size:48px;line-height:50px;
padding-top:1px;padding-right:5px;font-family: times;color:#D4D4C7;text-indent:0px;}
.lettrine3 {font-size:24px;line-height:30px;
padding-right:5px;font-family: times;color:#999999;text-indent:0px;}
.lettrine4 {
	color:#ABB6FC;
}



/* taille des caractéres */

 .taillecar0, .taillecar{ font-size:24px!important;font-weight: bold;}
 .taillecar1,.taillecar1	{ font-size:22px;font-weight: bold;}
 .taillecar2,.taillecar2	 { font-size:20px;font-weight: bold;}
 .taillecar3,.taillecar3	 { font-size:18px}
.taillecar4 { font-size:16px}
.taillecar5 { font-size:14px;}
.taillecar6 { font-size:12px;}

@media (min-width:480px) { 
 .taillecar0, .taillecar, .taillecar1 { font-size:28px!important;}
 .taillecar2{ font-size:24px}
 .taillecar4   {font-size:18px;}
}
@media (min-width:768px) { 
 .taillecar0, .taillecar, .taillecar1   { font-size:30px!important}
 .taillecar3   {font-size:24px;}
}
@media (min-width:1024px) {  
 .taillecar0, .taillecar  {font-size:48px;	font-weight: bold;}
 .taillecar1   {font-size:36px;	font-weight: bold;}
 .taillecar2   {font-size:28px;	font-weight: bold;}
}



/* style couleurs_spip compatible */




.c_noir	  	    {color: black;}
.c_rouge		{color: red;}
.c_blanc		{color: white;}
.c_beige		{color: bisque;}
.c_bleu			{	color: #00F;}
.c_bleu_azur	{color: azure;}
.c_bleu_aqua	{color: aqua;}
.c_bleu_clair	{color: #CADAFF;}
.c_bleu_ciel	{color: #00BFFF;}
.c_bleufumee    {color:#BBD2E1;}
.c_bleu_marine	{color: #007EDF;}
.c_bleu_violet	{color: #8A2BE2} 
.c_bordeaux     {color:#C93213;}
.c_brun			{color: #A52A2A;}
.c_brun_clair	{color: #D2691E;}
.c_champagne    {color:#FBF2B7;}
.c_fuchia	    {color: fuchsia;}
.c_gris			{color: gray;}

.c_gris_clair   {color:#F4F4F4;	}
.c_ivoire		{color: #FFFFD4}


.c_jaune		{color:yellow;}
.c_jaune_paille {color:#F5DEB3;}
.c_jaune_clair	{color:#FFFF9D;}
.c_glycine      {color:#C9A0DC;}
.c_papaye       {color:#FFEFD5;}
.c_pervenche    {color:#CCCCFF;}
.c_topaze       {color:#FAEA7373;}

.c_vert		    {color: green;}
.c_vert_clair	{color: #7FFF00;	}
.c_vert_eau	    {color: #B0F2B6;}
.c_vert_pale   {color: #DBF9DE;}
.c_vert_olive	{color: #708D23;}
.c_vert_opaline	{color: #97DFC6;}
.c_vert_fonce	{color: #006400;}
.c_violet		{
	color: #800080;
}
.c_rose		    {color: #FFC0CB;}
.c_rose_clair	{color: #FFF8DC;}
.c_rose_fonce	{color:#ff5ccb;}

.c_mauve        {color: #E3D8ED;}
.c_mauve_fonce	{color:#9932CC;}
.c_marron		{color: maroon;}

.c_or			{color:gold;}
.c_orange		{color:#FFA500;}
.c_orange_clair{color: #ffff99;}
.c_orange_fonce {color: darkorange;}
.c_oranger     {color: #F90;color:#FFF;}
.c_lavande		{color:#9683EC;}
.c_prune		{color:plum;}
.c_saumon		{color:salmon;}
.c_neige		{color:#FEFEFE}
.c_turquoise	{color:turquoise;}
.c_oranger     {color:#e5af42;}

/* couleur du fond */
.f_argent		{background-color: silver;}
.f_noir	  	    {background-color: black;}
.f_rouge		{background-color: red;}
.f_blanc		{background-color: white;}
.f_beige		{background-color: bisque;}

.f_bleu			{background-color: #00F;}
.f_bleu_azur	{background-color: azure;}
.f_bleu_aqua	{background-color: aqua;}
.f_bleu_clair	{background-color: #CADAFF;}
.f_bleu_pclair      {background-color: #80B3FF;}
.f_bleu_ciel	{background-color: #00BFFF;}
.f_bleu_moyen	{background-color: #454CFF;}
.f_bleufumee    {background-color:#BBD2E1;}
.f_bleu_marine	{background-color: #007EDF;}
.f_bleu_violet	{background-color: #8A2BE2} 


.f_bordeaux     {background-color:#C93213;}
.f_brun			{background-color: #A52A2A;}
.f_brun_clair	{background-color: #D2691E;}
.f_champagne    {background-color:#FBF2B7;}
.f_fuchia	    {background-color: fuchsia;}
.f_gris_clair {background-color:#F4F4F4;	}
.f_gray			{background-color: gray;}
.f_gris			{background-color: #525252;}

.f_ivoire		{background-color: #FFFFD4}


.f_jaune		{background-color:yellow;}
.f_jaune_clair	{background-color:#FFFF9D;}
.f_jaune_paille {background-color:#F5DEB3;}

.f_glycine      {background-color:#C9A0DC;}

.f_papaye       {background-color:#FFEFD5;}
.f_pervenche    {background-color:#CCCCFF;}
.f_topaze       {background-color:#FAEA7373;}

.f_vert		    {background-color: green;}
.f_vert_clair	{background-color: #7FFF00;}
.f_vert_moyen	{background-color: #009F60	}
.f_vert_eau	    {background-color: #B0F2B6;}
.f_vert_pale   {background-color: #DBF9DE;}
.f_vert_olive	{background-color: #708D23;}
.f_vert_opaline	{background-color: #97DFC6;}
.f_vert_fonce	{background-color: #006400;}
.f_violet		{	background-color: #800080;}
.f_rose		    {background-color: #FFC0CB;}
.f_rose_clair	{background-color: #FFF8DC;}
.f_rose_fonce	{background-color:#ff5ccb;}

.f_neige		{background-color:#FEFEFE}
.f_noir			{background-color: black;color:#FFF;}

.f_mauve_fonce	{background-color:#9932CC;}
.f_mauve        {background-color: #E3D8ED;}

.f_marron		{background-color: maroon;color:#FFF;}
.f_or			{background-color:gold;}
.f_orange		{background-color:#FFA500;}
.f_orange_clair{background-color: #ffff99;}
.f_orange_fonce {background-color: darkorange;}
.f_oranger     {background-color: #F90;color:#FFF;}
.f_lavande		{background-color:#9683EC;}


.f_prune		{background-color:plum;}
.f_saumon		{background-color:salmon;}
.f_neige		{background-color:#FEFEFE}
.f_turquoise	{background-color:turquoise;}
.f_oranger     {background-color:#e5af42;}

.fond_bleu      {background-color: #7980FF;}
.fond_bleuclair {background-color: #D9ECFF;}
.fond_rouge     {background-color: #e34342;color:#FFF;	}
.fond_vertclair {background-color: #0F9;}
.fond_mauve     {background-color: #E6DCEF;}
.fond_jaune     {background-color: #FF0;}
.f_sans_fond{}

.f_rouge a ,.f_bleu a,.f_mauve a ,.f_vert a,.f_oranger a,.f_orangeclair a, .f_jaune a, .f_cafe a,.f_bordeaux a
{color:#FFFFFF;}
.f_rouge a:hover,.f_bleu a:hover,.f_mauve a:hover,.f_vert a:hover,.f_oranger a:hover,.f_orangeclair a:hover,.f_jaune a:hover,.f_cafe a:hover, .f_bordeaux a hover{	color: #cccccc;}
.f_rouge h2 ,.f_bleu h2,.f_mauve h2 ,.f_vert h2,.f_oranger h2,.f_orangeclair h2, .f_jaune h2, .f_cafe h2,.f_bordeaux h2
{color:#FFFFFF;}

/* couleur du fond */
.argent		{background-color: silver;}
.noir	  	    {background-color: black;}
.rouge		{background-color: red;}
.blanc		{background-color: white;}
.beige		{background-color: bisque;}

.bleu			{background-color: #00F;}
.bleu_azur	{background-color: azure;}
.bleu_aqua	{background-color: aqua;}
.bleu_clair	{background-color: #CADAFF;}
.bleu_pclair      {background-color: #80B3FF;}
.bleu_ciel	{background-color: #00BFFF;}
.bleu_moyen	{background-color: #454CFF;}
.bleufumee    {background-color:#BBD2E1;}
.bleu_marine	{background-color: #007EDF;}
.bleu_violet	{background-color: #8A2BE2} 


.bordeaux     {background-color:#C93213;}
.brun			{background-color: #A52A2A;}
.brun_clair	{background-color: #D2691E;}
.champagne    {background-color:#FBF2B7;}
.fuchia	    {background-color: fuchsia;}
.gris_clair {background-color:#F4F4F4;	}
.gray			{background-color: gray;}
.gris			{background-color: #525252;}

.ivoire		{background-color: #FFFFD4}


.jaune		{background-color:yellow;}
.jaune_clair	{background-color:#FFFF9D;}
.jaune_paille {background-color:#F5DEB3;}

.glycine      {background-color:#C9A0DC;}

.papaye       {background-color:#FFEFD5;}
.pervenche    {background-color:#CCCCFF;}
.topaze       {background-color:#FAEA7373;}

.vert		    {background-color: green;}
.vert_clair	{background-color: #7FFF00;}
.vert_moyen	{background-color: #009F60	}
.vert_eau	    {background-color: #B0F2B6;}
.vert_pale   {background-color: #DBF9DE;}
.vert_olive	{background-color: #708D23;}
.vert_opaline	{background-color: #97DFC6;}
.vert_fonce	{background-color: #006400;}
.violet		{	background-color: #800080;}
.rose		    {background-color: #FFC0CB;}
.rose_clair	{background-color: #FFF8DC;}
.rose_fonce	{background-color:#ff5ccb;}

.neige		{background-color:#FEFEFE}
.noir			{background-color: black;color:#FFF;}

.mauve_fonce	{background-color:#9932CC;}
.mauve        {background-color: #E3D8ED;}

.marron		{background-color: maroon;color:#FFF;}
.or			{background-color:gold;}
.orange		{background-color:#FFA500;}
.orange_clair{background-color: #ffff99;}
.orange_fonce {background-color: darkorange;}
.oranger     {background-color: #F90;color:#FFF;}
.lavande		{background-color:#9683EC;}


.prune		{background-color:plum;}
.saumon		{background-color:salmon;}
.neige		{background-color:#FEFEFE}
.turquoise	{background-color:turquoise;}
.oranger     {background-color:#e5af42;}
.fond_bleu      {background-color: #7980FF;}
.fond_bleuclair {background-color: #D9ECFF;}
.fond_rouge     {background-color: #e34342;color:#FFF;	}
.fond_vertclair {background-color: #0F9;}

.fond_mauve     {background-color: #E6DCEF;}
.fond_jaune     {background-color: #FF0;}
.sans_fond{}

.fond_bleu      {background-color: #7980FF;}
.fond_bleuclair {background-color: #D9ECFF;}
.fond_rouge     {background-color: #e34342;color:#FFF;	}
.fond_mauve     {background-color: #E6DCEF;}
.fond_jaune     {background-color: #FF0;}
.sans_fond{}

.rouge a ,.bleu a,.mauve a ,.vert a,.oranger a,.orangeclair a, .jaune a, .cafe a,.bordeaux a

{color:#FFFFFF;}
.rouge a:hover,.bleu a:hover,.mauve a:hover,.vert a:hover,.oranger a:hover,.orangeclair a:hover,.jaune a:hover,.cafe a:hover, .bordeaux a hover{	color: #cccccc;}
.rouge h2 ,.bleu h2,.mauve h2 ,.vert h2,.oranger h2,.orangeclair h2, .jaune h2, .cafe h2,.bordeaux h2
{color:#FFFFFF;}

/* VOIR CE QU'ON EN FAIT */
.caractere1   {font-size:36px;font-family: times;color:#999999;}
.caractere2   {font-size:24px;font-family: times;color:#999999;text-indent:0px;}
.caractere3   {font-size:18px;font-family: times;color:#999999;text-indent:0px;}
.caractere4    {font-size:12px;font-family: times;color:#999999;text-indent:0px;}

.c        {font-size:36px;font-family: times;color:#999999;text-indent:0px;text-align:center;}
.c2       {font-size:24px;font-family: times;color:#999999;text-indent:0px;text-align:center}


/* en test !*/
/* modele */
/*
 
/* le modele pushdown*/
div.pushdown { /* Main wrapper for push down panel */
		position: relative;
		margin: 0;
		margin: 7em 0 7em 0;
		max-width:100%;
		clear: both;
		}


div.pushdown > div { /* Content DIV DIV inside wrapper */
	height: 10px; /* initial height of content when hidden. Should be same height as bottom bar (see div.pushdown:after) */
	padding: 5px;
	-moz-box-sizing: border-box; /* ensure any padding and border declared inside content DIV doesn't increase DIV's declared dimensions */
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden; /* background of content DIV */
	position: relative;
	opacity: 0;
	-moz-transition: all 0.2s ease-in-out 0.1s;  /* CSS3 transition of UL state. Last 0.1s specifies delay before animation */
	-o-transition: all 0.2s ease-in-out 0.1s; /* instead of ease-in-out, also try cubic-bezier(0.25, 0.1, 0.25, 1.4) instead */
	-webkit-transition: all 0.2s ease-in-out 0.1s;
	transition: all 0.2s ease-in-out 0.1s;
	background-color: #FFE8E8;
		}

div.pushdown:after { /* Add bottom bar beneath wrapper */
	content: '';
	display: block;
	bottom: 0;
	position: absolute;
	width: 100%;
	height: 10px;
	box-shadow: 0 3px 8px gray, 3px 3px 4px brown inset;
	background: #5a1619; /* dark redish background and its gradient versions */
	background: -moz-linear-gradient(top,  rgba(118,36,41,1) 0%, rgba(117,5,11,1) 50%, rgba(56,38,39,0.72) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(118,36,41,1)), color-stop(50%,rgba(117,5,11,1)), color-stop(100%,rgba(56,38,39,0.72)));
	background: -webkit-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(56,38,39,0.72) 100%);
	background: -o-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(56,38,39,0.72) 100%);
	background: -ms-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(56,38,39,0.72) 100%);
	background: linear-gradient(to bottom,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(56,38,39,0.72) 100%);
	color: #FFECEC;
		}


div.pushdown input[type="checkbox"] { /* style invisible checkbox element used to toggle state of push down panel */
		position: absolute;
		right: 50px; /* right position of checkbox */
		width: 60px; /* width of checkbox */
		height: 42px; /* height of checkbox */
		bottom: -34px; /* bottom offset of checkbox */
		z-index: 10;
		cursor: pointer;
		opacity: 0;
		}

div.pushdown input[type="checkbox"]:checked ~ div { /* when checkbox is checked, expand content within wrapper */
		height: auto; /* height of content to expand to. Scrollbar will be shown if content overflows this height */
		opacity: 1;
		overflow: auto;
		}

div.pushdown label { /* style label that's positioned below wrapper's bottom bar, and will toggle checkbox when interacted with */ 
		position: absolute;
		right: 50px; /* right position of label */
		width: 60px; /* width of label */
		height: 42px; /* height of label */
		bottom: -34px; /* bottom offset of label */
		border-bottom-left-radius: 30px;
		border-bottom-right-radius: 30px;
		cursor: pointer;
		z-index: 5;
		background: #5a1619; /* dark redish background and its gradient versions */
		background: -moz-linear-gradient(top,  rgba(118,36,41,1) 0%, rgba(117,5,11,1) 50%, rgba(124,31,32,0.72) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(118,36,41,1)), color-stop(50%,rgba(117,5,11,1)), color-stop(100%,rgba(124,31,32,0.72)));
		background: -webkit-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(124,31,32,0.72) 100%);
		background: -o-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(124,31,32,0.72) 100%);
		background: -ms-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(124,31,32,0.72) 100%);
		background: linear-gradient(to bottom,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(124,31,32,0.72) 100%);
		box-shadow: 0 3px 8px black, 5px 5px 6px brown inset, 0 -3px 3px rgba(152,41,47,0.7) inset, 0 5px 0 rgba(255,255,255,0.7) inset;
		}

div.pushdown label:hover { /* style of label when mouse rolls over it */
		box-shadow: 0 3px 8px black, 5px 5px 6px brown inset, 0 -3px 3px rgba(152,41,47,0.7) inset, 0 5px 0 rgba(255,255,255,0.7) inset, 0 0 15px rgba(255,255,255,0.8) inset;
		}

div.pushdown label:after { /* ouverture sur clic  */
		content: '';
		position: absolute;
		display: block;
		width: 0;
		height: 0;
		border: 12px solid transparent;
		border-color: white transparent transparent transparent;
		top: 18px;
		left: 18px;
		box-shadow: 0 0 7px gray inset;
		}
		
/*  épingle sur  post it */   
.pin {
  background-color: #aaa;
  display: block;
  height: 32px;
  width: 2px;
  position: absolute;
  left: 50%;
  top: -16px;
  z-index: 1;
}
.pin:after {
  background-color: #A31;
  background-image:  background-image:radial-gradient(circle  , hsla(0,0%,100%,.3) 25%, hsla(0,0%,0%,.3) 25%);
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px hsla(0,0%,0%,.1),
              inset 3px 3px 3px hsla(0,0%,100%,.2),
              inset -3px -3px 3px hsla(0,0%,0%,.2),
              23px 20px 3px hsla(0,0%,0%,.15);
  content: '';
  height: 12px;
  left: -5px;
  position: absolute;
  top: -10px;
  width: 12px;
}
.pin:before {
  background-color: hsla(0,0%,0%,0.1);
  box-shadow: 0 0 .25em hsla(0,0%,0%,.1);
  content: '';

  height: 24px;
  width: 2px;
  left: 0;
  position: absolute;
  top: 8px;

  transform: rotate(57.5deg);
  -moz-transform: rotate(57.5deg);
  -webkit-transform: rotate(57.5deg);
  -o-transform: rotate(57.5deg);
  -ms-transform: rotate(57.5deg);

  transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  -webkit-transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -o-transform-origin: 50% 100%;
}

/* post it penché */
.quote-container {
	margin-top: 50px;
	position: relative;
	margin-bottom: 50px;
	z-index:2;
	max-width:100%;
}
.pnote {
  color: #333;
  position: relative;
  width: 300px;
  margin: 0 auto;
  padding: 20px;
  font-family: Garamond, Georgia, Times, serif;
  font-size:20px;
  background:#FFFFFF;
  box-shadow: 0 10px 10px 2px rgba(0,0,0,0.3);
  display:flex;  flex-wrap:wrap;justify-content:center;align-items: center;
  max-width:100%;
}
.pnote .author {
  display: block;
  margin: 40px 0 0 0;
  text-align: right;
}
.tournepnote{
  background: #eae672;
  -webkit-transform: rotate(2deg);
  -moz-transform: rotate(2deg);
  -o-transform: rotate(2deg);
  -ms-transform: rotate(2deg);
  transform: rotate(2deg);
  max-width:100%;  
}
.post-it {
background-color:#fefabc; 
padding:15px; margin-bottom:80px;
font-family: 'Gloria Hallelujah', cursive; 
font-size:15px; 
color: #000; 
display:flex;  flex-wrap:wrap;justify-content:center;align-items: center;
max-width:100%;
width:300px;
-moz-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
-o-transform: rotate(7deg);
-ms-transform: rotate(7deg);
transform: rotate(7deg);
box-shadow: 0px 4px 6px #333;
-moz-box-shadow: 0px 4px 6px #333;
-webkit-box-shadow: 0px 4px 6px #333;

}
 /* taille en largeur */
.t1{width:100px } .t2 {width:200px} .t3{width:300px} .t4{width:400px} .t5{width:500px} .t6{width:600px} .t7{width:700px} .t8{width:800px} .t9{width:900px}
.t1,.t2,.t3,.t4,.t5,.t6,.t7,.t8,.t9 {max-width:100%}

.memo {	
background-color:#fefabc; 
padding:15px; 
font-family: 'Gloria Hallelujah', cursive; 
font-size:15px; 
color: #000; 
max-width:100%;
width:200px;

max-width:100%;
box-shadow: 0px 4px 6px #333;
-moz-box-shadow: 0px 4px 6px #333;
-webkit-box-shadow: 0px 4px 6px #333;

}

/* @end */