.imgFond {
		  display: block;
		  position: fixed;
		  top: 63px;
		  left: 50%;
		  transform: translate(-50%, 0%);
		  z-index: 1;
		  opacity: 0.3;
		  width: 100%;
		  max-width: 2000px;
		 }

.contenuAccueil {
				 display: flex;
				 flex-direction: column;
				 align-items: center;
				 width: 100%;
				 max-width: 2000px;
				}

.topPage {
		  display: flex;
		  flex-direction: column;
		  align-items: center;
		  position: relative;
		  z-index: 10;
		  width: 100%;
		 }

.formationGratuite {
					display: flex;
					flex-direction: column;
					align-items: center;
					width: 718px;
					max-width: calc(100% - 50px);
					padding: 25px 25px;
				    background-color: #ffd400;
				    text-decoration: none;
				    margin-bottom: 25px;
				   }

.formationGratuite p
			{
			 justify-content: center;
			 font-family: Lulo Clean One Bold, sans-serif;
			 font-size: 27pt;
			 font-weight: lighter;
			 line-height: 1.5;
			 text-align: center;
			 margin: 25px 0;
			 width: 100%;
			 color: black;
			}

.formationGratuite p sup
			{
			 font-size: 16pt;
			}

.h1Title {
		  width: 768px;
		  max-width: 92%;
		  margin-top: 70px;
		 }		 

.h1Title h1 {
			 font-family: Lulo Clean One Bold, sans-serif;
			 font-size: 27pt;
			 font-weight: lighter;
			 line-height: 1.5;
			 text-align: center;
			 margin: 0 0 0 25px;
			 width: 100%;
			 color: white;
			 opacity: 0;
			}

.h2Title {
		  width: 448px;
		  max-width: 92%;
		  margin-top: 45px;
		 }		 

.h2Title h2 {
			 font-family: Lulo Clean One Bold, sans-serif;
			 font-size: 11pt;
			 font-weight: lighter;
			 line-height: 1.5;
			 text-align: center;
			 margin: 0 0;
			 width: 100%;
			 color: white;
			 opacity: 0;
			 margin-left: 40px;
			}

video {
	   width: 768px;
	   max-width: 92%;
	   margin-top: 60px;
	   margin-bottom: 45px;
	   border: 1px solid #666666;
	  }

.corpsPage {
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 100%;
			background-color: white;
			position: relative;
		    z-index: 10;
		   }

.threeBox {
		   display: flex;
		   flex-direction: row;
		   justify-content: space-between;
		   align-items: flex-end;
		   flex-wrap: wrap;
		   width: 1030px;
		   max-width: calc(100% - 50px);
		   margin: 25px 25px 0 25px;
		  }

.boxPratique hr, .boxProf hr, .boxMateriel hr
				{
				 width: 50%;
				 border: 0.7px solid #545454;
			    }

.boxPratique, .boxProf, .boxMateriel
				{
			  	 display: flex;
			  	 flex-direction: column;
			  	 justify-content: center;
			  	 align-items: center;
			  	 width: 288px;
			  	 height: 216px;
			  	 position: relative;
			  	 cursor: pointer;
			 	}

.boxPratique {
			  background-color: #ff1500;
			 }

.imgBox {
		 display: flex;
		 flex-direction: column;
		 align-items: center;
		 margin: 20px 15px 50px 15px;
		 width: 288px;
		}

.imgBox .imgPratique {
					  width: 155px;
					  height: 110.2px;
					  margin-bottom: 15px;
					 }

.imgBox .deuxImg {
				  display: flex;
				  flex-direction: row;
				  justify-content: flex-end;
				  width: 100%;
				  margin-right: 25px;
				 }

.imgBox .imgMateriel {
					  width: 50px;
					  height: 50px;
					  margin: 0 10px 15px 10px;
					 }

.boxProf {
		  background-color: #ffd400;
		  margin: 40px 15px 50px 15px;
		 }

.boxMateriel {
			  background-color: #ffd400;
			 }

.boxPratique h3, .boxProf h3, .boxMateriel h3
				{
				 display: flex;
				 flex-direction: column;
				 align-items: center;
				 font-family: 'Nunito', sans-serif;
				 color: black;
				 font-size: 15pt;
				 font-weight: lighter;
				 letter-spacing: 0.4em;
			    }

.boxProf h3 span, .boxMateriel h3 span
				{
				 font-family: 'Lobster', sans-serif;
				 font-size: 24pt;
				 color: #545454;
				 letter-spacing: normal;
				}

.boxPratique h3 .whiteSpan
				{
				 font-family: 'Lobster', sans-serif;
			     font-size: 24pt;
				 font-weight: bold;
				 color: white;
				 letter-spacing: normal;
				}

.boxTexte {
		   position: absolute;
		   width: 204px;
		   height: 152px;
		   padding: 15px 25px 15px 25px;
		   top: 50%;
		   left: 50%;
		   transform: translate(-50%, -50%);
		   background-color: transparent;
		   color: transparent;

		   /* Active la transition */
		   transition-property: background-color, color;

		   /* Délai avant d'activer la transition */
		   transition-delay: 0.6s;

		   /* La transition dure 1s */
		   transition-duration: 1s;
		  }

.boxPratique:hover .boxTexte, .boxPratique.active .boxTexte,
.boxProf:hover .boxTexte, .boxProf.active .boxTexte,
.boxMateriel:hover .boxTexte, .boxMateriel.active .boxTexte
				{
				 background-color: black;
				 color: #EDEDED;
				}

.boxTexte p {
			 font-family: 'Nunito', sans-serif;
			 margin: 0 0;
			 text-align: center;
			}

.boxPourQui {
			 display: flex;
		  	 flex-direction: column;
		  	 align-items: center;
		  	 padding: 0 30px;
		  	 width: calc(100% - 60px);
		  	 margin: 50px 0;
		 	}

.h3Img {
		display: flex;
		flex-direction: row;
		align-items: flex-end;
		width: 1000px;
		max-width: 100%;
		margin-bottom: 30px;
		position: relative;
	   }

.h3Img h3 {
		   font-family: Lulo Clean One Bold, sans-serif;
		   font-size: 18pt;
		   font-weight: lighter;
		   line-height: 1.5;
		   margin: 0 0;
		   max-width: 100%;
		  }

.h3Img img {
			width: 90px;
			height: 90px;
			margin-left: 5px;
			margin-bottom: 25px;
		   }

.texteImgPourQui {
				  display: flex;
				  flex-direction: row;
				  width: 1000px;
				  max-width: 100%;
				 }

.contenuPourQui {
				 width: 465px;
				 margin-bottom: 50px;
				}

.contenuPourQui p {
				   font-family: Lucida Sans Unicode, sans-serif;
				   font-size: 13pt;
				   line-height: 1.4;
				   margin: 0 0;
				   color: #545454;
				  }

.texteImgPourQui img {
					  width: 164px;
					  height: 160px;
					  margin-left: 16%;
					 }

.boxControlRythme {
				   display: flex;
				   flex-direction: column;
				   align-items: center;
				   width: calc(100% - 60px);
				   padding: 0 30px;
				  }

.boxControlRythme h3 {
					  font-family: Lulo Clean One Bold, sans-serif;
				      font-size: 18pt;
				      font-weight: lighter;
				      line-height: 1.5;
					  margin: 0 0 30px 336.67px;
					  width: 663.33px;
					 }

.texteImgRythme {
				 display: flex;
				 flex-direction: row;
				 justify-content: center;
				 align-items: flex-end;
				 width: 1000px;
				 max-width: 100%;
				}

.texteImgRythme img {
					 width: 306.67px;
					 height: 216.17px;
					 margin-right: 30px;
					 margin-bottom: 5px;
					}

.contenuRythme {
				position: relative;
			   }

/*.texteImgRythme .contenuRythme img
				{
				 position: absolute;
				 width: 32px;
				 height: 32px;
				 border: 1px solid black;
				}*/

.texteImgRythme p {
				   font-family: Lucida Sans Unicode, sans-serif;
				   font-size: 13pt;
				   line-height: 1.4;
				   width: 663.33px;
				   margin: 0 0;
				   color: #545454;
				  }

.texteImgRythme p span {
						vertical-align: top;
						color: #1EB2BC;
					   }

.boxControlRythme .btnCommencons
				{
				 margin: 50px 0px 100px 0;
				}

.boxControlRythme .btnCommencons a
				{
				 text-decoration: none;
				}

.boxControlRythme .btnCommencons a p
				{
				 font-family: Lucida Sans Unicode, sans-serif;
				 padding: 6px 40px;
				 margin: 0 0;
				 color: white;
				 font-size: 13pt;
				 font-weight: bold;
				 background-color: #e2211c;
				 border: 1px solid #e2211c;
				 border-radius: 10px;
				 transition: 0.5s;
				}

.boxControlRythme a p span
				{
				 color: #1EB2BC;
				}

.boxControlRythme .btnCommencons a:hover p
				{
				 background-color: white;
				 color: #444444;
				}




@media screen and (max-width: 1090px)
		{
		 .boxControlRythme h3 {
							   margin: 0 0 30px 0;
							   width: 90%;
							   text-align: center;
							  }

		 .texteImgRythme {
						  display: flex;
						  flex-direction: row;
						  justify-content: center;
						  align-items: flex-end;
						  width: 700px;
						  max-width: 100%;
						 }

		 .texteImgRythme img {
							  display: none;
							 }

		 .texteImgRythme .contenuRythme img
		 				{
		 				 display: inline-block;
		 				}

		 .texteImgRythme p {
						    width: 100%;
						    text-align: center;
						   }

		 .boxControlRythme .btnCommencons
							{
							 margin: 40px 0 50px 0;
							}
		}

@media screen and (max-width: 1020px)
		{
		 .threeBox {
		 			justify-content: space-around;
		 		   }
		}

@media screen and (max-width: 875px)
		{
		 .texteImgPourQui img {
							   margin-left: 12%;
							  }
		}

@media screen and (max-width: 820px)
		{
		 .boxPourQui, .boxControlRythme
		 				{
						 width: 92%;
						 padding: 0 0;
						}

		 .h3Img {
		 		 flex-direction: column;
		 		 align-items: center;
				 margin-top: 100px;
			    }

		 .h3Img h3 {
		 			text-align: center;
		 		   }

		 .h3Img img {
					 position: absolute;
					 top: -115px;
					 left: 50%;
					 transform: translate(-50%, 0);
		   			}

		 /*.texteImgPourQui {
						   flex-direction: column;
						   align-items: center;
						  }*/

		 .contenuPourQui {
						  width: 100%;
						  max-width: 100%;
						  margin-bottom: 50px;
						 }

		 .contenuPourQui p {
		 					text-align: center;
		 				   }

		 .texteImgPourQui img {
							   display: none;
							  }
		}

@media screen and (max-width: 695px)
		{
		 .texteImgRythme .contenuRythme img
		 				{
		 				 display: none;
		 				}
		}

@media screen and (max-width: 685px)
		{
		 .imgBox .deuxImg {
						   justify-content: center;
						   margin-right: 0;
						  }
		}

@media screen and (max-width: 650px)
		{
		 .imgFond {
				   top: 43px;
				  }
		}

@media screen and (max-width: 550px)
		{
		 .threeBox {
				    margin: 25px 0 0 0;
				    max-width: 100%;
				   }

		 .boxPratique {
					   margin: 20px 0 50px 0;
					  }

		 .imgBox {
				  margin: 0 0 50px 0;
				 }
		}

@media screen and (max-width: 530px)
		{
		 .formationGratuite p
					{
					 font-size: 16pt;
					}

		 .formationGratuite p sup
					{
					 font-size: 10pt;
					}

		 .h1Title h1 {
					  font-size: 16pt;
					 }

		 .h2Title h2 {
			 		  font-size: 10pt;
			 		 }

		 .h3Img h3 {
				    font-size: 14pt;
				   }

		 .boxControlRythme h3 {
							   font-size: 14pt;
						      }
		}