#formconfirm {position: absolute; top:500; left:200;}

#homelink {position: absolute;right: 100;  font: grey 14;}

table.historique {border: 1px solid orange; padding:10px; vertical-align:top; text-align:left; border-collapse:collapse;}
table.historique th {vertical-align:top; text-align:left;  background-color:brown; color:white; border:1px solid orange; padding:6px;}
table.historique tr {border:1px solid orange;  vertical-align:top; padding:10px;}
table.historique td {border:1px solid orange;  vertical-align:top; text-align:left; padding:15px;}

.clear {clear:both;}

.smaller {font-size:x-small;}

.emphasis { color: brown ; font-variant: small-caps;}

html, body {color: #230d11; font:10pt Tahoma;  position:relative; left:0; height:100%; margin:0;}

a[href$=".pdf"]:before {content: url(images/pdficon.jpg) "  " attr(title);}

a[href^="mailto"] { color: brown; }
a[href^="mailto"]:before {content: url(images/contact2.gif) "  " attr(title);}
a[href^="mailto"]:hover:after, a[href$=".pdf"]:hover:after{ content: " >>> "; } 

a.fb {background: url(images/facebooksmall.png) 0px 0px no-repeat;
		padding-left: 20px;  font-size: 14;}


a.link {
		background:url(images/link_icon.gif) 0px 5px no-repeat;
		padding-left: 13px;}
		
a.email {
		background:url(images/contact2.gif) 0px 5px no-repeat;
		padding-left: 18px;}


.formationpro {font-family: Tahoma; font-size: 28; color: orange; text-transform: uppercase;}

#imagemap {position:center; top:0; height:100%; margin-left:100; margin-right:100;}

#countries {position:absolute; top: 0;left:0; margin:0; }
#countries img {text-decoration:none; border:0;}
#countries #fvocal 	{position:absolute; width:142;top: 124;left:356;}
#countries #spec 	{position:absolute; width:170;top: 175;left:170;}
#countries #mcoord 	{position:absolute; width:214;top: 48;left:567;}
#countries #angleterre {position:absolute; width:70; top: 7;left:396;}
#countries #chine 	{position:absolute; width:235;top: 157;left:135;}
#countries #israel 	{position:absolute; width:110;top: 33;left:460;}



#stripe {position: absolute; height:105%; width: 79; top:0; left:0;}


#sidecolor {position:absolute; top:0; left:0; width:120; margin-left:0; margin-right:10; border:0;z-index:3;}

#nousaider {position:absolute; top:14; left:20; font: 26 Arial ; color:white;z-index: 4;}
#nousaider a {font: 16 Arial ; color:white;font-style: italic;font-weight: bold;color:white;}
#nousaider a:hover {font-weight: bold; color:gold;}


#banner {position:absolute; top:30; padding-left:220; width:40%; font: italic 16 Times; font-family: Arial;}


img.bordure {border:0; width:180; }

img.rubrique {border:0; width:100%; top:0; left:0;}


#basemenu {	position:absolute;
			bottom:3%;
			padding-bottom:3;
			margin-left:310;
			text-align:left; 
			
			font-size:10px; 
			font:"Verdana"; 
			text-decoration:none; 
			color:gray;
			background-color:white;
}

#basemenu2 {position:relative;
			padding-top:3;
			margin-left:20;
			text-align:left; 
			font-size:10px; 
			font:"Verdana"; 
			text-decoration:none; 
			color:gray;
			background-color:white;
}

#basemenu2 a {color:gray;}
#basemenu2 a:hover {background:white;color:black;}


#content #basemenu a, #basemenu a 
	{text-decoration:none;color:gray;}
#content #basemenu a:hover, #basemenu a:hover 
	{background-color:white;text-decoration:none;color:black;}

#content #basemenu #legal, #basemenu #legal {font:"Verdana"; 
			text-decoration:none; 
			color:gray;
			background-color:white;left:20; font-size: 0.9em;}

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


#content .region{font-family:Helvetica,Arial,Sans-serif; font-size:  22pt ;margin-top: 14;}
#content .tempsscolaire{text-transform: lowercase;font-family:Helvetica,Arial,Sans-serif; font-size:  20pt ;margin-top: 14;}
#content .classemuse, #content .annonce {font-family:Helvetica,Arial,Sans-serif; margin-top: 14;padding-bottom: 4;}
#content .classemuse .artiste, #content .annonce .textannonce, annonces annonce titre, annonces annonce contenu, p.annonce, .artiste {text-transform: lowercase;font-size:  16pt ; border-bottom:1px dashed red;}	 
#content .classemuse .photo{border:0}
#content .classemuse img.photo{float: left; margin: 0.7em; height: 100px; border: 0 }
#content .classemuse .compagnie, .cie {text-transform: lowercase;font-size:  18pt ; color:brown;margin-top: 3;margin-bottom: -2;}
#content .classemuse .discipline, .discipline  {text-transform: lowercase;font-size:  16pt ; color:gray;margin-top: 4;}	
#content .classemuse .ecole, .enseignant {font-size:  10pt ;font-family:Arial;  margin-top: 5;}
#content .classemuse .classe  , #content .annonce .contactannonce, annonces annonce contact , .age {font-size:  11pt ;font-family:Arial; }
#content .classemuse .projet, #content .annonce .textannonce, annonces annonce contenu, p.contenu, .projet {color:#d7242b;border:1;font-size:  12pt ;font-family:Arial;  margin-top: 5;}

annee, mois {display:none}
annonces annonce {padding-bottom: 20;}

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


#content .collectif .region{font-family:Helvetica,Arial,Sans-serif; font-size:  22pt ;margin-top: 14;padding-bottom: 4;}
#content .collectif .tempsscolaire{display:none; text-transform: lowercase;font-family:Helvetica,Arial,Sans-serif; font-size:  20pt ;margin-top: 14;}
#content .collectif {font-family:Helvetica,Arial,Sans-serif; margin-top: 14;}
#content .collectif .artiste{text-transform: lowercase;font-size:  14pt ; border-bottom:1px dashed red;}	 
#content .collectif .photo{border:0}
#content .collectif img.photo{display:none;float: left; margin: 0.7em; height: 100px; border: 0 }
#content .collectif .compagnie {text-transform: lowercase;font-size:  16pt ; color:brown;}

.cie {text-transform: lowercase;font-size:  8pt ; color:black;}

.boxed {border-width:1; border-color: orange;}

.ville {text-transform: lowercase;font-size:  14pt ; color:brown;margin-bottom: -2;margin-top: -1;}



#content .classemuse .artiste span.cie{text-transform: lowercase;font-size:  18pt ; color:brown;margin-top: 4;margin-bottom: 10;}
#content .collectif .discipline{text-transform: lowercase;font-size:  16pt ; color:gray;}	
#content .collectif .ecole{display:none;font-size:  10pt ;font-family:Arial;  margin-top: 5;}
#content .collectif .classe{display:none;font-size:  10pt ;font-family:Arial; }
#content .collectif .projet{display:none;color:#d7242b;border:1;font-size:  12pt ;font-family:Arial;  margin-top: 5;}




/*---------page d accueil side menu---------*/
marquee img {padding: 15; }

#menu {top:20; padding-top:5;padding-right:8;padding-left:800;padding-bottom:10%; width:150; position:absolute;}




#menu ul {
		margin:0; 
		padding:0; 
		list-style:none; 
		white-space:nowrap; 
		text-align:left; 
		padding:1px 1px 0 1px; 
		background:#fff;}


#menu ul { 	
		background-color: rgba(255, 255, 255, 0.6);
		}

#menu li {
		margin:0; 
		padding:0; 
		list-style:none;   
		}
	
#menu li {
		display:inline-block; 
		display:inline;
		}

#menu ul#toplevel 
		{position:absolute; 
		left:0; 
		top:0; 
		}

#menu a 
	{display:block; 
	font:normal 14px MGilSanLig, Verdana, Arial Narrow, sans-serif;
	color:#989898; 
	line-height:19px; 
	text-decoration:none;
	border-bottom: black 1px;
	padding:0 20px 0 10px; } 

#menu a:hover ul,
#menu a:hover a:hover ul, 
#menu a:hover a:hover a:hover ul {left:100%;}




#menu li a:hover {background: url(images/arrow.gif) no-repeat right top; background-color:yellow; color:red;} 
#menu li:hover > a {background-color:white; color:red;}
#menu ul li:hover > ul {left:100%; margin-top:-23px; margin-left:-1px;}

	
#menu li a:hover 
	{background:white; color:red; 
	/* for IE */
  	filter:alpha(opacity=100);
  	/* CSS3 standard */
  	opacity:1;} 
#menu li:hover > a 
	{background:#white; color:#red;
	/* for IE */
  	filter:alpha(opacity=100);
  	/* CSS3 standard */
  	opacity:1;}
#menu ul li:hover > ul 
	{left:100%; 
	margin-top:-23px; 
	margin-left:-1px;
	filter:alpha(opacity=10);
  	/* CSS3 standard */
  	opacity:0;}

#menu li a.fly:hover 
	{background:#white  no-repeat right top;	/* for IE */
  	filter:alpha(opacity=100);
  	/* CSS3 standard */
  	opacity:1;} 
#menu li:hover > a.fly 
	{background:#white  no-repeat right top;
	/* for IE */
  	filter:alpha(opacity=100);
  	/* CSS3 standard */
  	opacity:1;}


#menu table {position:absolute; left:99%; height:0; width:0; border-collapse:collapse; margin-top:-7px; margin-left:-1px; }


/*--------end of page d'accueil side menu---------*/

/*--------level 2 left side menu------*/


#leftmenu {padding-top:5%; padding-right:8;padding-left:760; width:200; position:fixed;padding-bottom:10%;}

#leftmenu {padding-bottom:12%;}



#leftmenu ul {
		margin:0; 
		padding:0; 
		list-style:none; 
		white-space:nowrap; 
		text-align:left; 
		padding:1px 0px 0 0px; 
		background:#fff;}


#leftmenu ul { 	
		background-color: rgba(255, 255, 255, 0.8);
		}

#leftmenu li {
		margin:0; 
		padding:0; 
		list-style:none;   
		}
	
#leftmenu li {
		display:inline-block; 
		display:inline;
		}

#leftmenu ul#toplevel 
		{position:absolute; 
		left:0; 
		top:0; 
		}

#leftmenu a 
	{display:block; 
	font:normal 14 MGilSanLig, Verdana, Arial Narrow, sans-serif;
	color:gray; 
	line-height:20px; 
	text-decoration:none;
	padding:0 10px 0 10px; } 

#leftmenu a:hover ul,
#leftmenu a:hover a:hover ul, 
#leftmenu a:hover a:hover a:hover ul {left:100%;}
#leftmenu a:hover ul ul, 




#leftmenu li a:hover { no-repeat right top; background-color:yellow; color:red;} 
#leftmenu li:hover > a {background-color:white; color:red;}
#leftmenu ul li:hover > ul {left:100%; margin-top:-23px; margin-left:-1px;}


/*-------end of left side menu--------*/



#content {position:absolute; top:0; left:0; width:575; padding:20; }

#middlecontent {position:relative; top:100; left:180; width:475; padding:20; }

#middlecontentpdf {position:relative; top:10; left:180; width:800; padding:20; }

#middlecontentpdf {font-family: Helvetica Neue; }

#red {color:red; font-weight: 700; font-family: Arial; font-size: 14pt; }


#middlemenu {position:relative; top:0; left:0; z-index:3;  padding:0;}



.signature 
{position:relative; 
	float:right; 
	padding-right: 15;
	top: 8;
	font-weight: 700; font-family: Arial; font-size: 10pt;}
	
.copyright 
{position:relative; 
	float:left; 
	padding-right: 12;
	top: 0;
	font-weight: 700; font-family: Arial; font-size: 0.5em;}

.quote 
{position:relative; 
	MARGIN: 15 5% 20;  
 	font-style:oblique; font-family: times, Arial; font-size: 12pt;}
 	
 .born 
{position:relative; 
	MARGIN: 5 5% 5;  
 	 font-weight: bold; color:grey; font-family: Arial; font-size: 10pt;}


#submenu {position:absolute; top:135; left:0;  padding:0;}


#submenu menuold li { list-style: none; background: url("images/separator.jpg") no-repeat ; padding:8;}


<!-------- slogan and logo ---->

#slogan a img {position:absolute; top:5; left:400; width:200; padding:5; float:left; }
 
#slogan span {position:absolute; top:85; left:20; font:lighter 10pt Arial;
 font-style:italic;  color: #d7242b; text-decoration:none; font-weight:normal;}
 
#contact, {position:absolute; top:15; right:10%; font: 12pt Arial; color:grey; text-decoration:none; font-weight:normal;}


.trnklogo:before {
		content: url('images/trunkminilogo.png');
		display: inline;
		}
/*------------*/




a, a:link, a:visited, a:hover {border: 0; border-bottom: 1; }

a {font: Arial; text-decoration:none; font-weight:normal; color:orange;}

a:hover {font: Arial;   color:red; text-decoration:none; font-weight:normal; }


	

h1,h2,h3,h4,h5,h6 {text-transform: lowercase; font-family:Helvetica,Arial,Sans-serif; }

	 
h1 { font-size:  26pt ; }	 
h2 { font-size:  16pt ; border-bottom:1px solid black;}	  
h3 { font-size:  13pt ; padding-left: 20px; margin-bottom: -3px; border-color: yellow;border-left-style: groove; }
h4 { font: lighter 11pt Tahoma; margin-bottom: -3px;}	
h5 { font: lighter 16pt Tahoma;color: #22723d; margin-bottom: -1px; border-bottom:1px solid yellow;}		 	  

hr { border-style:none none dotted; width: 40%; height:2px;}


table.tarif , table.tarif td {border: 2px solid orange; }
table.tarif td {padding: 8px; vertical-align:text-top;}
table.tarif {border-collapse: collapse;}

p, table, ul, li  { font: 11pt Tahoma; text-align:justify; text-transform: none;}

#content ul { padding-bottom: 6;}
#content li { padding-bottom: 3; }

ol.numb li.numb {list-style-type:decimal;}

img.left-floating {float: left; margin: 1em }
img.right-floating {float: right; margin: 1em }


img.left-float-menu {float: left; margin: 0.4em }

img.left-float-list {float: right; margin: 1em; border:0; height:60px;}


img.vignette {float: left; margin: 0em; width: 50px; border: 0; }

/*COLOURS*/

#vocal h1 { border-bottom:2px solid orange;}
#vocal h2 { border-bottom:1px dashed orange;}
#vocal hr, #vocal #content a { color:orange;}
#vocal #content a {color:red;} 
#vocal #content a:hover {color:brown;} 
#vocal #content h3 { border-color: orange;}

#vocal li {list-style: circle url('/images/rondorange.jpg');}
#vocal ul ul  {list-style-type: none;}

#spec h1 { border-bottom:2px solid gold;}
#spec h2 { border-bottom:1px dashed gold;}
#spec hr, #spec #content a { color:gold;}
#spec #content a {color:orange;} 
#spec #content a:hover{color:red;}
#spec #content h3 { border-color: gold; border-left-style: solid;}
#spec ul  {
list-style-image: url('/images/rondjaune.jpg');
list-style-type:disc; 
} 



#muse h1 { border-bottom:2px solid #d7242b;}
#muse h2 { border-bottom:1px dashed #d7242b;} 
#muse hr, #muse #content a { color:#d7242b;}
#muse #content a {color:red;} 
#muse #content a:hover {color:orange;}
#muse #content h3 { border-color: #d7242b;}
#muse ul  {
list-style-image: url('/images/rondrouge.jpg');
list-style-type:disc; 
} 


#cdart h1 { border-bottom:2px solid brown;}
#cdart h2 { border-bottom:1px dashed brown;} 
#cdart hr, #cdart #content a { color:brown;}
#cdart #content a {color:brown;} 
#cdart #content a:hover {color:rgb(251,38,113);} 
#cdart #content h3 { border-color: rgb(251,38,113);}
#cdart ul  {
list-style-image: url('/images/rondrose.jpg');
list-style-type:disc; 
}


#content #basemenu2 a {color:gray;}

#leftmenu .muse li a:hover , #content  #basemenu2  a:hover.muse
	{border-bottom: dashed 1px red;  color:#d7242b;} 
#leftmenu .vocal li a:hover ,#content   #basemenu2  a:hover.vocal
	{border-bottom: dashed 1px orange; color:#ea8b2e;} 
#leftmenu .spec li a:hover , #content  #basemenu2  a:hover.spec
	{border-bottom: dashed 1px gold; color: orange;}
#leftmenu .cdart li a:hover , #content  #basemenu2  a:hover.cdart
	{border-bottom: dashed 1px brown;  color:rgb(251,38,113);} 
	
#muse {background: url(images/zigzag rose.jpg) repeat-y  38% 15px; z-index: 3;}
#spec {background: url(images/zigzag jaune.jpg) repeat-y   35% 5px; z-index: 3;}
#vocal {background: url(images/zigzag orange.jpg) repeat-y   35% -30px; z-index: 3;}
#cdart {background: url(images/zigzag rose.jpg) repeat-y   48% -60px; z-index: 3;}

#muse #stripe {background: url(images/redstrip.jpg) repeat left top;}
#spec #stripe {background: url(images/yellowstrip.jpg); background-repeat: repeat-y; background-position:  left top;}
#vocal #stripe {background: url(images/orangestrip.jpg) repeat left top;}
#cdart #stripe {background: url(images/pinkstrip.jpg) repeat left top;}

/*
#muse #stripe {background-color: red;}
#spec #stripe {background-color: rgb(239,191,61);}
#vocal #stripe {background-color: rgb(244,143,56);}
#cdart #stripe {background-color: rgb(251,38,113);}
/*end of color styling*/


ul.horizontal li  { display: inline;list-style-type: none; padding-right: 10px; margin-left:40;
}
ul.horizontal li a { font-size: 28; font-style:bold;list-style-type: none; 
}

a.english {
padding-left: 45;
background-image: url(images/flag-uk.gif);
background-repeat: no-repeat;
background-position: 0em;
}

a.french {padding-left: 45;
background-image: url(images/flag-fr.gif);
background-repeat: no-repeat;
background-position: 0em;
}




 .annonce {color:red;}
 
 
 
 
 
 /*----------------------*/
 
 /*---FORM LAYOUT------*/
 
 
 

	
	form#payment {
		background: #ffdca7;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
		counter-reset: fieldsets;
		padding: 20px;
		width: 450px;
		}
		
		form#payment fieldset {
			border: none;
			margin-bottom: 10px;
			}
		
		form#payment fieldset:last-of-type {
			margin-bottom: 0;
			}
			
			form#payment legend {
				color:#black;
				font-size: 18px;
				font-weight: bold;
				padding-bottom: 10px;
				text-shadow: 0 1px 1px #c0d576;
				}
				
				form#payment > fieldset > legend:before {
					middlecontent: "Etape " counter(fieldsets) ": ";
					counter-increment: fieldsets;
					}
				
				form#payment fieldset fieldset legend {
					color: #ff3865 ;
					font-size: 18px;
					font-weight: normal;
					padding-bottom: 0;
					}
			
			form#payment ol li {
				background:#ffd44c ;
				background: rgba(255,255,255,.3);
				border-color: #e3ebc3;
				border-color: rgba(255,255,255,.6);
				border-style: solid;
				border-width: 2px;
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
				-khtml-border-radius: 5px;
				border-radius: 5px;
				line-height: 30px;
				list-style: none;
				padding: 5px 10px;
				margin-bottom: 2px;
				}
							
				form#payment ol ol li {
					background: none;
					border: none;
					float: left;
					}
			
			form#payment label {
				float: left;
				font-size: 18px;
				width: 130px;
				}
				
			form#payment fieldset fieldset label {
				background:none no-repeat left 50%;
				line-height: 20px;
				padding: 0 0 0 30px;
				width: auto;
				}
					
									
				form#payment fieldset fieldset label:hover {
					cursor: pointer;
					}
				
			form#payment input:not([type=radio]),
			form#payment textarea {
				background: #ffffff;
				border: none;
				-moz-border-radius: 3px;
				-webkit-border-radius: 3px;
				-khtml-border-radius: 3px;
				border-radius: 3px;
				font-family: Arial;
				font-size: 20px;
				outline: none;
				padding: 5px;
				width: 220px;
				}
					
				form#payment input:not([type=submit]):focus,
				form#payment textarea:focus {
					background: #eaeaea;
					}
					
				form#payment input[type=radio] {
					float: left;
					margin-right: 5px;
					}
						
			form#payment button {
				background: #ff3836 ;
				border: none;
				-moz-border-radius: 20px;
				-webkit-border-radius: 20px;
				-khtml-border-radius: 20px;
				border-radius: 20px;
				color: #white;
				display: block;
				font-size:  25px;
				letter-spacing: 2px;
				margin: auto;
				padding: 12px 18px;
				text-shadow: 0 1px 1px #000000;
				
				}
					
				form#payment button:hover {
					background: #b29435;
					cursor: pointer;
					}