body{
width:80%;
margin:100px;
font-size:16pt;
background:#931A1C;
font-family: Verdana, sans-serif;
color:black;
background-image:url("PhotoPartieFacade.jpg");
}

p{

width:100%;
min-width:300px;
max-width:1500px;

}



table{
width:80%;
}

label {
  font : 1.2em "typewriter", sans-serif;
}
input, textarea {
  font    : .7em/1.2em "handwriting", sans-serif;

  border  : none;
  padding : 0 10px;
  margin  : 0 10px;
  width   : 600px;

  background: none;
}
input:focus, textarea:focus {
  background   : rgba(0,0,0,.1);
  border-radius: 5px;
  outline      : none;
}
input {
    height: 2em; /* pour IE */
    vertical-align: right; /* optionnel mais donne meilleur aspect pour IE */
}

textarea {
  display : block;

  padding : 10px;
  margin  : 10px 0 0 10px;
  width   : 750px;
  height  : 260px;

  resize  : none;
  overflow: auto;
}

h1{
font-family: Verdana, sans-serif;
font-size:14pt;
color :#931A1C;
border: 3px  #B58442 double;
border-radius: 10px;
background: white ;

}

#header{
height:3%;
//background:#EFFBF8;
//background:#2F2F2E;
color: #B58442;
font-size:30pt;
text-align: center;
padding-top:5%;
padding-bottom : 5%;
padding-left:-40%;
border: 3px  #B58442 double;
border-radius: 10px;
background: white ;
    }
Encadrer{
padding : 5px 5px 5px 5px;
border-width:10px;
border-style: none;
border-color:white;
background-color: #B58442 ; 
color:#931A1C;
}
MargeTitre{
//margin-top : 10%;
margin-left: 0%;
color:#B58442;
}
#headerter{
height:15%;
background:lightblue;
//background:#B404AE;
//background:#2F2F2E;
color:white;
font-size:45pt;
text-align: center;
    }
#headerquater{
height:30px;
background:blue;
//background:#B404AE;
//background:#2F2F2E;
color:white;
font-size:10pt;
text-align: center;
    }
#headerbis{
height:80px;
background:blue;
color:white;
font-size:25pt;
text-align: center;
    }
.bouton a {
font-size:15pt;
display:block;
width:300px;
line-height:200px;
text-align:center;
vertical-align:middle;
background-color:lightblue;
font-weight:bold;
color:white;
text-decoration:none;
}
.bouton a:hover {
	font-size:20pt;
display:block;
width:300px;
line-height:200px;
text-align:center;
vertical-align:middle;
background-color: white;
font-weight:bold;
color:blue;
text-decoration:none;
<!--background:url(ImageBoutonBleuGrise.jpg)-->
} 
  
.boutonbis a {
font-size:25pt;
display:block;
width:300px;
line-height:200px;
text-align:center;
vertical-align:middle;
background-color:blue;
font-weight:bold;
color:white;
text-decoration:none;
}
.boutonbis a:hover {
	font-size:35pt;
display:block;
width:450px;
line-height:300px;
text-align:center;
vertical-align:middle;
background-color: white;
font-weight:bold;
color:blue;
text-decoration:none;
<!--background:url(ImageBoutonBleuGrise.jpg)-->
}  

.boutonter a {
font-size:15pt;
display:block;
width:353px;
line-height:100px;
text-align:center;
vertical-align:middle;
background-color:#EFFBF8;
font-weight:normal;
color:darkgreen;
text-decoration:none;
}
.boutonter a:hover {
	font-size:17pt;
display:block;
width:355px;
line-height:100px;
text-align:center;
vertical-align:middle;
background-color: white;
font-weight:bold;
font-style:italic;
color:blue;
text-decoration:none;
<!--background:url(ImageBoutonBleuGrise.jpg)-->
}  

.boutonpenterL2 a {
font-size:15pt;
display:block;
width:400px;
line-height:100px;
text-align:center;
vertical-align:middle;
background-color:white;
font-weight:normal;
color:black;
font-family: Verdana, sans-serif;
text-decoration:none;
border: 3px  black double;
}
.boutonpenterL2 a:hover {
	font-size:15pt;
display:block;
width:400px;
line-height:100px;
text-align:center;
vertical-align:middle;
background-color: grey;
font-weight:bold;
font-style:italic;
color:white;
text-decoration:none;
border: 3px  darkgreen double;
<!--background:url(ImageBoutonBleuGrise.jpg)-->
}  
.boutonpenter a {
font-size:12pt;
display:block;
width:200px;
line-height:50px;
text-align:center;
vertical-align:middle;
background-color:white;
font-weight:normal;
color:black;
font-family: Verdana, sans-serif;
text-decoration:none;
border: 3px  black double;
}
.boutonpenter a:hover {
	font-size:14pt;
display:block;
width:200px;
line-height:100px;
text-align:center;
vertical-align:middle;
background-color: #B58442;
font-weight:bold;
font-style:italic;
color:white;
text-decoration:none;
border: 3px  #750709 double;
<!--background:url(ImageBoutonBleuGrise.jpg)-->
}
.boutonpenterbis a {
    font-size:20pt;
    display:block;
    width:800px;
    line-height:30px;
    text-align:center;
    vertical-align:middle;
    background-color:white;
    font-weight:normal;
    color:#750709;
    font-family: Verdana, sans-serif;
    text-decoration:none;
    border: 3px  #B58442 double;
border-radius: 10px;
}
.boutonpenterbis a:hover {
    cursor: pointer;
    font-size:14pt;
    display:block;
    width:800px;
    line-height:30px;
    text-align:center;
    vertical-align:middle;
    background-color: #B58442;
    font-weight:bold;
    font-style:italic;
    color:white;
    text-decoration:none;
    border: 3px  #750709 double;
	border-radius: 10px;
    <!--background:url(ImageBoutonBleuGrise.jpg)-->
}
.boutonpenterbissmall a {
    font-size:20pt;
    display:block;
    width:300px;
    line-height:30px;
    text-align:center;
    vertical-align:middle;
    background-color:white;
    font-weight:normal;
    color:#750709;
    font-family: Verdana, sans-serif;
    text-decoration:none;
    border: 3px  #B58442 double;
border-radius: 10px;
}
.boutonpenterbissmall a:hover {
    font-size:14pt;
    display:block;
    width:300px;
    line-height:30px;
    text-align:center;
    vertical-align:middle;
    background-color: #B58442;
    font-weight:bold;
    font-style:italic;
    color:white;
    text-decoration:none;
    border: 3px  #750709 double;
	border-radius: 10px;
    <!--background:url(ImageBoutonBleuGrise.jpg)-->
}
.boutonIns a {
    font-size:12pt;
    display:block;
    width:80px;
    line-height:20px;
    text-align:center;
    vertical-align:middle;
    background-color:lightblue;
    font-weight:normal;
    color:white;
    font-family: Verdana, sans-serif;
    text-decoration:none;
    border: 3px  darkgreen double;
}
.boutonIns a:hover {
    font-size:14pt;
    display:block;
    width:100px;
    line-height:60px;
    text-align:center;
    vertical-align:middle;
    background-color: darkgreen;
    font-weight:bold;
    font-style:italic;
    color:white;
    text-decoration:none;
    border: 3px  darkgreen double;
    <!--background:url(ImageBoutonBleuGrise.jpg)-->
}
.boutonsexter a {
font-size:12pt;
display:block;
width:155px;
line-height:20px;
text-align:center;
vertical-align:middle;
background-color:white;
font-weight:normal;
color:darkgreen;
font-family: Verdana, sans-serif;
text-decoration:none;
border: 3px  darkgreen double;
}
.boutonsexter a:hover {
	font-size:12pt;
display:block;
width:155px;
line-height:20px;
text-align:center;
vertical-align:middle;
background-color: darkgreen;
font-weight:bold;
font-style:italic;
color:white;
text-decoration:none;
border: 3px  darkgreen double;
<!--background:url(ImageBoutonBleuGrise.jpg)-->
}  
.boutonsepter a {
font-size:20pt;
display:block;
width:455px;
line-height:40px;
text-align:center;
vertical-align:middle;
background-color:white;
font-weight:normal;
color:darkgreen;
font-family: Verdana, sans-serif;
text-decoration:none;
border: 3px  darkgreen double;
}
.boutonsepter a:hover {
	font-size:12pt;
display:block;
width:455px;
line-height:40px;
text-align:center;
vertical-align:middle;
background-color: darkgreen;
font-weight:bold;
font-style:italic;
color:white;
text-decoration:none;
border: 3px  darkgreen double;
<!--background:url(ImageBoutonBleuGrise.jpg)-->
} 
.grise {
 border:1px solid black; 
 background-color:silver;
 }
form {
 background-color:#FAFAFA;
 padding:3px;
 width:800px;
//text-align:center;
 }
fieldset {
 padding:0 20px 20px 20px;
 margin-bottom:10px;
 border:1px solid #DF3F3F;
 }
legend {
 color:#DF3F3F;
 font-weight:bold
 }
label {
 //margin-top:10px;
 display:block;
//text-align:center;
 }
label.inline {
 display:inline;
 margin-right:50px;
//text-align:center;
 }
input, textarea, select, option {
 background-color:#FFF3F3;
//text-align:center;
 }
input, textarea, select {
 font-size:25pt;
 padding:3px;
 border:1px solid #F5C5C5;
 border-radius:5px;
 width:400px;
 box-shadow:1px 1px 2px #C0C0C0 inset;
 }
select {
 margin-top:10px;
 }
input[type=radio] {
 background-color:transparent;
 border:none;
 width:10px;
 }
input[type=submit], input[type=reset] {
 width:200px;
 margin-left:5px;
 box-shadow:1px 1px 1px #D83F3D;
 cursor:pointer;
 }
d0  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);
position:absolute;
top: 50px;
right: 325px;
}
d1  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);
position:absolute;
top: 50px;
right: 100px;
}

d2  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);
position:absolute;
top: 200px;
right: 100px;
}


d3  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);
position:absolute;
top: 350px;
right: 100px;
}

d4  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);
position:absolute;
top: 500px;
right: 100px;
}

d5  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);
position:absolute;
top: 650px;
right: 100px;
}

l1  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);

position:absolute;
top: 400px;
right: 80%;
}

l2  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);
position:absolute;
top: 550px;
right: 80%;
}


l3  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);	
position:absolute;
top: 60%;
right: 80%;
}

l4  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);
position:relative;
top: 150px;
right: 0px;
}


l5  {
z-index:10;
  opacity:0.5;
  filter:alpha(opacity=50);
position:relative;
top: 300px;
right: 0px;
}

.boutonpenterbisbis a {
    font-size:10pt;
    display:block;
    width:100px;
    line-height:30px;
    text-align:center;
    vertical-align:middle;
    background-color:white;
    font-weight:normal;
    color:#750709;
    font-family: Verdana, sans-serif;
    text-decoration:none;
    border: 3px  #B58442 double;
}
.boutonpenterbisbis a:hover {
    font-size:12pt;
    display:block;
    width:200px;
    line-height:30px;
    text-align:center;
    vertical-align:middle;
    background-color: #B58442;
    font-weight:bold;
    font-style:italic;
    color:white;
    text-decoration:none;
    border: 3px  #750709 double;
    <!--background:url(ImageBoutonBleuGrise.jpg)-->
}
.breadcrumb ul {
    display: flex;
}
    
.breadcrumb li::before {
    content: "→";
}
    
.breadcrumb li:first-child::before {
    content: "";
}
/* CSS Document */
/* text decoration (balise a) :  
--> none : pas souligné,
--> underline : souligné (bas),
--> overline : souligné (haut)
--> overline underline : souligné en hait et en bas...*/


.date {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #FFFFFF;
    font-weight: bold;
    vertical-align:middle;
}


.jours {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #FFFFFF;
    font-weight: bold;
}

.tab_numero {
    background:url(img/icone.jpg);
    background-repeat:no-repeat;
    background-position:bottom right;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #000000;
    font-weight: normal;
    border-style:solid; 
    border-width:2px; 
    border-color:#000099;
    border-top:hidden;
}

.tab_cal {
    background:url(img/entete.jpg);
    background-repeat:no-repeat;
    border-style:solid; 
    border-width:2px; 
    border-color:#000099;
    border-bottom:hidden;
}

.reserve {
    background-color:#0099FF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color:#FFFFFF;
}

.descriptif {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #000000;
    padding-left:10px;
}
.tde {height:20px;width:20px;cursor:pointer;}
#value {height:20px; width: <?=$value1;?>px; background:#E0E001;}
#glob {display: flex;}