/* body {font-family: Arial;} */

/* Style the tab */
.tab {
  overflow: hidden;
  margin-left:5px; 
  margin-right:5px;
  margin-top:8px;   
}

/* Style the buttons inside the tab */
.tab button {
  display:block;	
  float: left;
  width:165px;  
  height:60px;
  outline: none;
  cursor: pointer;
  padding: 8px 8px;
  transition: 1.0s;
  font-family:arial;  
  font-size:1.35em;
  font-weight:bold;
  text-decoration:none;
  text-align:center;  
  color:white; 
  border:2px solid;
  background-color:#6495ED;  
  /*pour avoir un effet "outset" avec IE :*/
  border-color:#DCDCDC #696969 #696969 #DCDCDC;
}

/* Change background color of buttons on hover */
.tab button:hover {
   font-family:arial;
   font-size:1.35em;
   font-weight:bold;
   text-decoration:none;
   text-align:center;    
   color:black; 	
   background-color:#D3D3D3;
   border-color:#696969 #DCDCDC #DCDCDC #696969; 
  
}

/* Create an active/current tablink class */
.tab button.active {
   font-family:arial;
   font-size:1.35em;
   font-weight:bold;
   text-decoration:none;
   text-align:center;    
   color:green; 
   background-color:#D3D3D3; 
   border-color:#696969 #DCDCDC #DCDCDC #696969;
}

/* Style the tab content */
.tabcontent {
  display: none;
  border-top: none;
}