.noir{color: #000000;}
.violet{color: #990099; text-align: left;}
.violet-pali{color: #9900CC;}
.orange{color: #CC6633;}
.vert{color: #339900;}
.gris{color: #666666;font-size: 18px;}
.truc {color: #000000;}
.titre {text-align: center;font-size: 400%}
.soustitre {text-align: center;font-size: 130%}
#toto{display:block;background-color: #FFEEC7;}
#tooltip {
	position: absolute;
	visibility: hidden;
	background-color: #FFEEC7;
	border: 1px solid black;
	padding: 0.5em 0.7em;
	font-size: 1.1em;
	left: 8px;
	top: 19px;
	border-radius: 8px;
	z-index:2;
}

.css_button {
	display:block;
	text-align: center;
   padding: 5%;
   border: 1px solid #171414;
   background: -webkit-gradient(linear, left top, left bottom, from(#E0DDDD), to(#B59C70));
   background: -webkit-linear-gradient(top, #E0DDDD, #B59C70);
   background: -moz-linear-gradient(top, #E0DDDD, #B59C70);
   background: -ms-linear-gradient(top, #E0DDDD, #B59C70);
   background: -o-linear-gradient(top, #E0DDDD, #B59C70);
   background-color: #B59C70;
   box-shadow: 0px 7px 2px -5px #1A1A1A, inset 0px 0px 3px #5E4401;
   -webkit-box-shadow: 0px 7px 2px -5px #1A1A1A, inset 0px 0px 3px #5E4401;
   -moz-box-shadow: 0px 7px 2px -5px #1A1A1A, inset 0px 0px 3px #5E4401;
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 15%;
   text-shadow: #470707 1px 1px 0px;
   color: #A35858;
   font-size: 1.6vw;
   font-family: Arial;
   text-decoration: none;
   font-weight: bold;
   -webkit-transition: 0.3s;
   -moz-transition: 0.3s;
   -o-transition: 0.3s;
   cursor: pointer;
   }
.css_button:hover {
   background: none;
   background-color: #B59C70;
   box-shadow: 0px 0px 5px 0px #AAAAAA;
   -webkit-box-shadow: 0px 0px 5px 0px #AAAAAA;
   -moz-box-shadow: 0px 0px 5px 0px #AAAAAA;
   border: 1px solid #ffffff;
   color: #240707;
   }
.css_button:active {
   top: 1px;
   position: relative;
   }

  .css_button2 {
	display:block;
	text-align: center;
   padding: 7%;
   border: 1px solid #171414;
   background: -webkit-gradient(linear, left top, left bottom, from(#E0DDDD), to(#B59C70));
   background: -webkit-linear-gradient(top, #E0DDDD, #B59C70);
   background: -moz-linear-gradient(top, #E0DDDD, #B59C70);
   background: -ms-linear-gradient(top, #E0DDDD, #B59C70);
   background: -o-linear-gradient(top, #E0DDDD, #B59C70);
   background-color: #B59C70;
   box-shadow: 0px 7px 2px -5px #1A1A1A, inset 0px 0px 3px #5E4401;
   -webkit-box-shadow: 0px 7px 2px -5px #1A1A1A, inset 0px 0px 3px #5E4401;
   -moz-box-shadow: 0px 7px 2px -5px #1A1A1A, inset 0px 0px 3px #5E4401;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 15%;
   text-shadow: #470707 1px 1px 0px;
   color: #ee5858;
   font-size: 0.7vw;
   font-family: Arial;
   text-decoration: none;
   font-weight: bold;
   -webkit-transition: 0.3s;
   -moz-transition: 0.3s;
   -o-transition: 0.3s;
   cursor: pointer;
   }
.css_button2:hover {
   background: none;
   background-color: #B59C70;
   box-shadow: 0px 0px 5px 0px #AAAAAA;
   -webkit-box-shadow: 0px 0px 5px 0px #AAAAAA;
   -moz-box-shadow: 0px 0px 5px 0px #AAAAAA;
   border: 1px solid #ffffff;
   color: #240707;
   }
.css_button2:active {
   top: 1px;
   position: relative;
   } 
   

     
  .css_button3 {
	text-align: center;
   padding: 3px 6px;
   border: 1px solid #171414;
   background: -webkit-gradient(linear, left top, left bottom, from(#E0DDDD), to(#B59C70));
   background: -webkit-linear-gradient(top, #E0DDDD, #B59C70);
   background: -moz-linear-gradient(top, #E0DDDD, #B59C70);
   background: -ms-linear-gradient(top, #E0DDDD, #B59C70);
   background: -o-linear-gradient(top, #E0DDDD, #B59C70);
   background-color: #B59C70;
   box-shadow: 0px 7px 2px -5px #1A1A1A, inset 0px 0px 3px #5E4401;
   -webkit-box-shadow: 0px 7px 2px -5px #1A1A1A, inset 0px 0px 3px #5E4401;
   -moz-box-shadow: 0px 7px 2px -5px #1A1A1A, inset 0px 0px 3px #5E4401;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 7px;
   text-shadow: #470707 1px 1px 0px;
   color: #ee5858;
   font-size: 16px;
   font-family: Arial;
   text-decoration: none;
   font-weight: bold;
   -webkit-transition: 0.3s;
   -moz-transition: 0.3s;
   -o-transition: 0.3s;
   cursor: pointer;
   }
.css_button3:hover {
   background: none;
   background-color: #B59C70;
   box-shadow: 0px 0px 5px 0px #AAAAAA;
   -webkit-box-shadow: 0px 0px 5px 0px #AAAAAA;
   -moz-box-shadow: 0px 0px 5px 0px #AAAAAA;
   border: 1px solid #ffffff;
   color: #240707;
   }
.css_button3:active {
   top: 1px;
   position: relative;
   } 

/*Start Lightbox*/
.preview-container {
   display: flex;
   justify-content: center;
   flex-direction: row;
   flex-wrap: wrap;
   max-height: 300px;
   overflow: hidden;
}

div.cssbox {
   display: block;
   width: 200px;
   height: 150px;
   overflow: hidden;
}
 
.object-fit-cover {
 object-fit: cover;
}

.preview-dim {
   min-height: 150px;
   max-width: 200px;
}
 
figcaption.lightbox {
   position: relative;
   color: rgb(255, 255, 255);
   font-size: 1.5rem;
   top: 90%; 
}
 
span.cssbox_full {
   z-index: 999999;
   position: fixed;
   height: 100%;
   width: 100%;
   background-color: rgba(0,0,0,0.9);
   top: 0;
   left: 0;
   opacity: 0;
   pointer-events: none;
   cursor: default;
   transition: opacity 0.5s linear;
   text-align: center;
   vertical-align: bottom;
}
 
span.cssbox_full img {
   position: fixed;
   background-color: white;
   margin: 0;
   padding: 0;
   max-height: 80%;
   max-width: 80%;
   top: 50%;
   left: 50%;
   margin-right: -50%;
   transform: translate(-50%, -50%);
   box-shadow: 0 0 20px black;
}
 
a.cssbox_close,
a.cssbox_prev,
a.cssbox_next {
   z-index: 999999;
   position: fixed;
   text-decoration: none;
   visibility: hidden;
   color: white;
   font-size:60px;
}
 
a.cssbox_close {
   top: 2%;
   right: 2%;
}
 
a.cssbox_close::after {
   content: '\00d7';
}
 
a.cssbox_prev,
a.cssbox_next {
   top: 50%;
   transform: translate(0%, -50%);
}
 
a.cssbox_prev {
   left: 5%;
}
 
a.cssbox_next {
   right: 5%;
}
 
a:target ~ a.cssbox_close,
a:target ~ a.cssbox_prev,
a:target ~ a.cssbox_next {
   visibility: visible;
}
 
a:target > img.cssbox_thumb + span.cssbox_full {
   visibility: visible;
   opacity: 1;
   pointer-events: initial;
}
 
/*End Lightbox*/