* 
	{
		box-sizing: border-box;
	}

.responsive
	{
		margin: auto;
		width: 1200px;
	}

@media screen and (max-width: 1200px)
	{
		.responsive
		{
			width: 100%;
		}
	}
	
.capsule-left-20
	{
		float: left;
		height: 100%;
		width: 20%;
	}
	
.capsule-right-80
	{
		float: right;
		height: 100%;
		width: 80%;
	}
	
.logo
	{
		height: 80px;
		padding-right: 25px;
	}

@media screen and (max-width: 1200px)
	{
		.logo
		{
			display: none;
		}
	}
	

/* Apparence du carrousel */

.mySlides 
	{
		display: none;
	}
	
.slideshow-container 
	{
		position: relative;
		height: 450px;
		overflow: hidden;
	}

.fade 
	{
		-webkit-animation-name: fade;
		-webkit-animation-duration: 1.5s;
		animation-name: fade;
		animation-duration: 1.5s;
	}

@-webkit-keyframes fade 
	{
	  from {opacity: .4} 
	  to {opacity: 1}
	}

@keyframes fade 
	{
	  from {opacity: .4} 
	  to {opacity: 1}
	}

.content
	{
		padding: 16px;
		min-height: 80px;
		text-align: center;
	}

.separation
	{
		background-color: #666666;
		position: relative;
		text-align: center;
		overflow: hidden;
		margin: auto;
		z-index: -1;
	}

.titre
	{
		position: absolute;
		top: 80%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 100%;
	}
	
.inline-block
{
	display: inline-block;
}

.sticky 
	{
	  position: fixed;
	  top: 0;
	  width: 100%;
	}

.sticky + .content
	{
	  padding-top: 60px;
	}

/* Apparence du contenu de page*/

#bgsilver
	{
		background-color: silver;
	}
	
#bge6e7e8
	{
		background-color: #e6e7e8;
	}

#bg333333
	{
		background-color: #333333;
	}

#bg555555
	{
		background-color: #555555;
	}

#imgcaps
	{
		width: 120px;
		height: 120px;
	}

#capsule
	{
		display: inline-block;
		width: 28%;
		height: 500px;
		overflow: hidden;
		padding: 10px;
	}

#bloctext
	{
		display: inline-block;
		height: 200px;
		width: 100%;
		overflow: hidden;
	}
	
#bloctext p
	{
		text-align: justify;
		font-family: Arial;
		font-size: medium;
		font-weight: normal;
		padding: 5px;
		color: #232939;
	}

/* RESPONSIVE */

@media screen and (max-width: 1280px)
{
#bloctext p
	{
		font-size: small;
	}
}

@media screen and (max-width: 900px)
{
#bloctext p
	{
		font-size: x-small;
	}
}
	
.linkcaps
	{
		display: inline-block;
		width: 100%;
		padding: 10px;
	}
	
.linkcaps a
	{
		color: #232939;
		font-size: medium;
		text-decoration: none;
		border: 2px solid #232939;
		padding: 5px;
	}
	
/* RESPONSIVE */

@media screen and (max-width: 1280px)
{
.linkcaps a
	{
		font-size: small;
	}
}

@media screen and (max-width: 900px)
{
.linkcaps a
	{
		font-size: x-small;
	}
}
	
.linkcaps a:hover
	{
		color: #e6e7e8;
		text-decoration: none;
		border: 2px solid #232939;
		padding: 5px;
		background-color: #232939;
	}


/* RESPONSIVE */

@media screen and (max-width: 1280px)
{
#capsule h5
	{
		font-size: small;
	}
}

@media screen and (max-width: 900px)
{
#capsule h5
	{
		font-size: x-small;
	}
}
	
/* Apparence de la partie equipe */

.tab 
	{
	  border: 2px solid #333333;
	  background-color: silver;
	}

.tab button 
	{
	  display: inline-block;
	  background-color: silver;
	  color: black;
	  padding: 22px 16px;
	  width: 24%;
	  border: none;
	  outline: none;
	  text-align: center;
	  cursor: pointer;
	}

.tab button:hover 
	{
	  background-color: #333333;
	  color: white;
	}

.tab button.active
	{
	  background-color: #333333;
	  color: white;
	}
	
.tabcontent
	{
		 background-color: #e6e7e8;
		 padding: 0px 12px;
		 width: 100%;
		 border-left: none;
		 height: 400px;
		 display: none;
		 margin-top: 35px;
	}



#texte-groupe
	{
		font-size: small;
		text-align: center
	}

/* RESPONSIVE */	
@media screen and (max-width: 1320px)
{
#texte-groupe
	{
		font-size: x-small;
	}
}

@media screen and (max-width: 1180px)
{
#texte-groupe
	{
		font-size: xx-small;
	}
}

@media screen and (max-width: 1050px)
{
#texte-groupe
	{
		display: none;
	}
}

/* Style the links inside the sidenav */
#socialnav
{
  position: fixed;
  bottom: -50px;
  right: 40px;
  transition: 0.3s;
  padding: 15px;
  width: 150px;
  border-radius: 7px 0 0 7px;
  background-color: #FFCC00;
  text-align: center;
}

#socialnav:hover 
{
  bottom: 0;
}

@media screen and (max-width: 1050px)
{
#socialnav
	{
		display: none;
	}
}

#copyright
{
  position: fixed;
  bottom: 0px;
  left: 40px;
  padding: 5px;
  width: 280px;
  height: 20px;
  border-radius: 7px 0 0 7px;
  background-color: silver;
  text-align: center;
  font-size: x-small;
}