BODY	{
	top: 0px;
	color:  ; 
}

IMG {
  vertical-align:middle;
}

TBODY {  
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 12pt;  
	color:  ; 
}

.normal {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight: normal; 
	color:  ; 
}

.ptit {  
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 10pt;  
	color:  ; 
}

.toutptit {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;	
	color:  ; 
}

.bleu {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14pt;

	color: #0000CC;
?> ; 
}

.ptitbleu {  
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 10pt; 
	color:  ;  
}

.toutptitbleu {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;	
	color:  ; 
}

.ptit1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1px;	
	color:  ; 
}

.ptit05 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.5px;	
	color:  ; 
}

a { color:  ; text-decoration:none ; }
a:visited { color: text-decoration:none ; }
a:hover { color: #CCCCCC ; text-decoration:none ; }

.titre {
	font-size: 14pt;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:  ; 
}

.titre11 {
	font-size: 11pt;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:  ; 
}

.titre12 {
	font-size: 12pt;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:  ; 
}

.titre14 {
	font-size: 14pt;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:  ; 
}

.toutouptit {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 6pt;
}

.toutouptit05 {

	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 5pt;
}

.toutptitrouge {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 7pt;
	color: #FF0000;
	text-decoration: underline;
}

.bleugras {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14pt;
	font-weight: bold;
	color: #0033CC;
	text-align: justify;

?> 
}

.boite {
	padding: 10px;
	border: 1px solid  ;
 }

.boitearrondi {
	padding: 10px;
	border: 1px solid  ;
	border-radius:  10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	behavior: url(border-radius.htc);
 }

.boitesalle {
	background-color:   ;
	border: 1px solid  ;
 }

.boiteblanc {
	background-color: #FFFFFF;
	color:  ; 
	/margin: 8px;
	padding: 10px;
	border: 1px solid #FFFFFF;
	border-radius:  10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	behavior: url(border-radius.htc);
}

.boiteatel {
	background-color: ;
	color:  ; 
	/margin: 8px;
	padding: 0px;
	padding-top:1px;
	height: 36px;
	border: 1px solid #FFFFFF;
	border-radius:  10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	behavior: url(border-radius.htc);
}

.boitepied {
	background-color: ;
	color:  ; 
	/margin: 8px;
	padding: 0px;
	padding-top:1px;
	height: 36px;
	border: 7px solid #FFFFFF;
	border-radius: 30px;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	behavior: url(border-radius.htc);
}

.boitegen {
	background-color: ;
	color:  ; 
	/margin: 8px;
	padding: 0px;
	padding-top:1px;
	height: 36px;
	border: 1px solid #FFFFFF;
	border-radius:  10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	behavior: url(border-radius.htc);
}

.boitier {
	line-height: normal;
	border: 10x #808ED1 solid; }

.boitetexte {
	border-width: 3px ; 
	border-color: ;
	border-style: solid ;
	padding: 10px;
	border-radius:  10px 10px 10px 10px;
}

.majuscule {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12pt;
	text-transform: uppercase;
}

.capitale {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12pt;
	text-transform: capitalize;
}

.Ligne { }
	
.LigneOver {
	background-color: #FFCCFF; 
}

.bloc_recadre {
	width: 100px;
	height: 100px;
	position: absolute;
	background: url(transparent.png);
	border: 1px solid #000;
}

.caseq {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9pt;
	vertical-align : middle ;
	padding : 3px;
	text-align : center ;
	background-color : #EEEEEE
}

/**** styles de calendar ****/

.column_header {
	font-size:12px;
	font-family: verdana, arial, helvetica;
	border: 1px solid  ;  
	height: 30px;
	background-color:  ;	
	text-align: center;
	vertical-align: middle;
	color:  ;
}

.date_header { 	
	color:  ; 
	font-size:14px; 
	font-family: verdana, helvetica; font-weight:bold 
}

/**** color and size of calendar cells.  ****/
.day_cell		{ background-color:#EDECD8; height:80; width: 95; }
.empty_day_cell		{ background-color:#EEEEEE; height:80; width: 95; }
.today_cell		{ background-color:#F5F4ED; height:80; width: 95; }

/**** day number in upper left corner of each cell ****/
.day_number				{ font-size:10px; font-family:verdana, arial, helvetica; color:#000 }

/**** title_txt is the text for each post on main page ****/
.title_txt		{ font-size:10px; font-family: verdana, arial, helvetica; color:#000 }

/**** time line under title text when event time given ****/
.time_str		{ font-size:9px; font-family: verdana, arial, helvetica }

/**** column headers or days of the week ****/

.cellannee {
	background-color: #EDECD8;
	width: auto;
	border: thin solid #000000;
	height: 20px;
	background-position: center;
}

.cellanneeclair {
	background-color: #F5F4ED;
	width: auto;
	border: thin solid #000000;
	height: 20px;
}

/* Apparence des bulles */
#bulle {
	background-color:#FFFFFF;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#000000;
	font-size:10px;
	border:1px solid #000000;
	text-align: center;
	position:absolute;
	display:none;
	padding:1px;
	z-index:100;
}

ul#affdoss {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color:  ;
	list-style-type: none ;
	list-style-image: none ;
	margin-top: 0px;
	margin-bottom: 0px;
}


ul#affdoss li {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:  ;
	list-style-type: none ;
	list-style-image: none ;
	font-weight: normal;
	margin-top: 10px;
	margin-bottom: 10px;
}

ul#afforum {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color:  ;
	margin-top: 0px;
	margin-bottom: 0px;
	list-style-type: none;
}

ul#afforum li {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: normal;
	color:  ;
	padding: 0;
	margin-left: -15px;
	margin-top: 5px;
	margin-bottom: 0px;
	list-style-type: none;
}

ul#menuec li {
}

ul#menuec {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	margin-left:0 !important;
	padding-left:25px !important;
	/list-style-position: inside;
	margin-top: 0px;
	margin-bottom: 0px;
	list-style-type: none ;
}

ul#menuec li a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	list-style-type: none;
}

.ptit4 {

	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 2px;
}

.swipe {
  overflow: hidden;
  visibility: hidden;
  position: relative;
}

.swipe-wrap {
  overflow: hidden;
  position: relative;
}

.swipe-wrap > div {
  float:left;
  width:100%;
  position: relative;
}


/**** styles pour le bandeau ****/

.roundedImage {
    width:100px;
    height:100px;
    border-radius:50px;
	-webkit-border-radius:50px;
	-moz-border-radius: 50px;
    position:absolute; left:865px; top:10px;
    z-index:40;
  background: url("../images/fantomf.png") no-repeat;
    background-size: 100px;
    background-position:50% 50%;
}

.logoEpice {
    width:90px;
    height:90px;
    position:absolute; left:20px; top:15px;
    z-index:40;
    background: url("../images/logo.png") no-repeat; 
    background-size: 90px 90px;
    background-position:50% 50%; 
}

.bandeau {
    width:980px;
    height:120px;
	border-radius:12px;
	-webkit-border-radius:12px;
	-moz-border-radius: 12px;
    position:absolute; left:0px; top:0px;
    z-index:30;
    background: url("../images/bandeauvide.jpg") no-repeat;
    background-size: 1000px;
    background-position:50% 50%;
}

.texteBandeau {
    width:980px;
    height:120px;
	font-size:px; 
	color : #FFFFFF;
    /text-shadow: 1px 1px 6px #ffffff;
    line-height: 110px;
    position:absolute; left:0px; top:0px;
    z-index:31;
}

.texteBandeaugen {
    width:950px;
    height:120px;
	font-size:60px; 
	color : #FFFFFF;
    /text-shadow: 1px 1px 6px #ffffff;
    line-height: 110px;
    position:absolute; left:0px; top:0px;
    z-index:31;
}

.menuProfil {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
    font-size: 8pt;
	z-index: 998;
	opacity:0;
	-webkit-transition: opacity 200ms ease-in;
	-moz-transition: opacity 200ms ease-in;
	transition: opacity 200ms ease-in;
	pointer-events: none;
}

.menuProfil:target {
	opacity:1;
	pointer-events: auto;
}

.menuProfil > div {
	width: 120px;
    height:64px;
	position: relative; left:290px; top:-60px;
    z-index: 998;
    margin: 10% auto;
	padding: 10px;
	border-radius: 10px;
	background: #fff;
}

.close {
	background: #AAAAAA;
	color: #000000;
	line-height: 25px;
	position: absolute;
	right: -12px;
	text-align: center;
	top: -10px;
	width: 24px;
   	z-index: 999;
	text-decoration: none;
	font-weight: bold;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

.close:hover { background: #888888; }

.menuEpice {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
    font-size: 8pt;
    display:block;
	z-index: 998;
	opacity:0;
	-webkit-transition: opacity 200ms ease-in;
	-moz-transition: opacity 200ms ease-in;
	transition: opacity 200ms ease-in;
	pointer-events: none;
}

.invisibleLink {
    display: block;
    left: 0px; 
    top: 0px;
    position: fixed;
    height: 100%;
    width: 100%;
    background: rgba(0,0,0,0.6);
   	z-index: 900;
}

.menuEpice:target {
	opacity:1;
	pointer-events: auto;
}

.menuEpice > div {
	width: 120px;
    height:64px;
	position: relative; left:-300px; top:-60px;
    z-index: 998;
    margin: 10% auto;
	padding: 10px;
	border-radius: 10px;
	background: #fff;
}


/**** styles pour le menu accordeon ****/

/**** calque du bouton ****/

.accordion {
    min-height: 24px;
    color: #444;
    cursor: pointer;
    border: none;
    outline: none;
    transition: 0.4s;
}

.casesVerticales {
	display: table-cell;
    height: 32px;
   	padding: 0px 4px 0px 0px;
    vertical-align: middle;
    background: #ffffff;
    font-family: Verdana, Arial, Helvetica, sans-serif; 
    font-size: 8pt;
}


/**** calque du contenu qui s'ouvre (pouvant contenir des autres boutons ****/

.panel {
    text-align: left;
    max-height: 0;
    overflow: hidden;
    transition: 0.6s ease-in-out;
    opacity: 0;
}

.panel.show {
    opacity: 1;
    max-height: 500px;  
}



/**** menu pour changer la couleur de l'atelier ou d'une salle ****/

.menuPalette {
	
    position: fixed;
    top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 950;
	opacity:0;
	-webkit-transition: opacity 200ms ease-in;
	-moz-transition: opacity 200ms ease-in;
	transition: opacity 200ms ease-in;
	pointer-events: none;
}

.menuPalette:target {
	opacity:1;
	pointer-events: auto;
}

.invisibleLinkPalette {
    position: fixed;
    left: 0px; 
    top: 0px;
	height: 100%;
    width: 100%;
    display: block;
    background: rgba(160,160,160,0.75);
   	z-index: 900;
}

.menuPalette > div {
	position: relative; 
    left:40%; 
    top:30%;
    font-size: 8pt;
    padding: 4px 0px 0px 4px;
    height: 140px;
    width: 136px;
    vertical-align: middle;
    background: #ffffff;
    z-index: 990;
    border-radius: 16px;
}

.casesVerticalesPalette {
	display: table-cell;
    text-align: center;
    valign: middle;
    height: 24px;
    padding: 4px 4px 4px 4px;
    vertical-align: middle;
    background: #ffffff;
}

.menuPaletteCouleur {
    display: block;
    height: 24px;
    width: 24px;
    border-radius: 12px;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
    z-index: 999;
    font-size: 16px;
    font-weight: bold;
}

.top-container {
  background-color: #f1f1f1;
  padding: 30px;
  text-align: center;
}

.header {
  padding: 10px 16px;
  background: #555;
  color: #f1f1f1;
}

.container{
	width: 80%;
	margin: 0 auto; /* Center the DIV horizontally */
}
.fixed-header{
	width: 100%;
	position: fixed;        
	background: #666;
	padding: 10px 0;
	top: 0;
}