/* Pour toute la page : GENERALITE */
*{
	padding:0px;
	margin:0px;
	font-family:calibri;
}
/* fixer la largeur d'un élément button par exemple indiquer custom dans la classe */
.custom {
    width: 200px;
}

/* faire apparaitre systématiquement barre de défilement */
html {
overflow: -moz-scrollbars-vertical;
overflow-y: scroll;
overflow-x: auto;
}
/* GENERALITE (suite) arrière-plan */
body  {	
	background: linear-gradient(#A4A4A4, #A4A4A4);
	background-attachment:fixed;
}

/* Coleurs des liens "au repos", sans souligné, visited(déjà visités)hover(au survol)focus active(au clic) */
a{
    color: #000000; 
	text-decoration:none
}
a:visited {
    color: #848484;
}
a:hover{
 color: #ff0000;
}
a:focus, a:active {
    color: #ff0000;
} 
/* Format des paragraphes */
p{
	margin-bottom:15px;	
	width: 80%;
	font-weight: normal;
	padding: 15px;
	font-size: 18px;
	color:#000000;
	background-color:#d4d4d4;
	border-radius: 50px 50px 50px 50px;
	box-shadow: 5px 5px 5px #424040;
	text-align:center;
	margin: 0 0 600px  0;
}



/* PERMET D'AUGMENTER LA LUMINOSITE DES IMAGES balises <section class="brightness"> et </section> à mettre dans la page*/
/* http://paulund.developpez.com/tutoriels/css/images-filters/ */
/* ou https://yesyouweb.com/filtres-images-css3/*/
/* ou https://yesyouweb.com/appliquer-transformations-images-css3/*/
.brightness img
{
        filter: brightness(100%);
        -webkit-filter: brightness(100%);
		transition-duration: 0.25s;
}
.brightness img:hover
{
        filter: brightness(142%) contrast(130%);
        -webkit-filter: brightness(142%) contrast(130%);
		transition-duration: 0.3s;
} 

/* Effet d'invertion (image en négative au survol)/////*/

.invert img
{
        filter: invert(0);
        -webkit-filter: invert(0);
		transition-duration: 0.25s;
}
.invert img:hover
{
        filter: invert(1);
        -webkit-filter: invert(1);
		transition-duration: 0.3s;
}


/* Afficher des boutons  class="button" à ajouter au liens dans la page html http://www.supportduweb.com/generateur-boutons-css3-effet-bordure-degrade-bouton-css-ombre-design.html*/
/* code plus récent https://www.w3schools.com/css/css3_buttons.asp*/	
.button {
  
  border: 2px solid #000000;
  padding: 8px 14px;
  background-color: white;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 18px;
  margin: 8px 8px;
  transition-duration: 0.4s;
  cursor: pointer;
  box-shadow: 0 4px 4px 0 rgba(0,0,0,0.2), 0 6px 14px 0 rgba(0,0,0,0.19);  
}

.buttonvert {
  background-color: white; 
  color: black; 
  border: 2px solid #60bb46;
}
.buttonvert:hover {
  background-color: #60bb46;
  color: white;
}


.buttonbleu {
  background-color: white; 
  color: black; 
  border: 2px solid #2aa2db;
}
.buttonbleu:hover {
  background-color: #2aa2db;
  color: white;
}


.buttonrouge {
  background-color: white; 
  color: black; 
  border: 2px solid #ee3b30;
}
.buttonrouge:hover {
  background-color: #ee3b30;
  color: white;
}


.buttongris {
  background-color: white;
  color: black;
  border: 2px solid #EEB500;
}


.buttongris:hover {
	background-color: #F2B800;
	color: black;
}


.buttonjaune {
  background-color: white;
  color: black;
  border: 2px solid #f6d62a;
}
.buttonjaune:hover {
  background-color: #f6d62a;
  color: black;
}