
body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
header {
            
            padding: 1rem;
            text-align: center;
        }
		
.video-background {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: -1;
        }
		
.container {
            padding: 1rem;
        }
.row {
            display: flex;
            flex-wrap: wrap;
        }
.column {
            flex: 33.33%;
            padding: 0rem;
        }

.logo {
           
            z-index: 1;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
        }
		.fade-in-image 
		{ opacity: 0; transition: opacity 4s ease-in-out; } 
		.fade-in-image.visible { opacity: 1; }
		

		
	


	
/* Styles pour les petits écrans d'iPhone (ex: iPhone SE, 5s) */ 
@media only screen and (min-width: 321px) and (max-width: 375px)
{ 

.hidden-text {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            padding-top:5px;
			 padding-bottom:5px;
            color: white;
            font-size: 18px;
			font-weight: 800;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	
			
        }
		.hidden-text2 {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			padding-top:20px;
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: white;
            font-size: 16px;
			font-weight: 600;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	        }
			
		.hidden-text3 {
            opacity: 0;
            transition: opacity 2s ease-in;
			background-color:white;
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: #ED5321;
            font-size: 16px;
			font-weight: 900;
            text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
			margin-top: 5px;
			margin-bottom: 5px;
	        }
				
.visible-text {
            opacity: 1;
        }
		
		.delayed-hr { width: 200px; padding:0;0;0;0;}
		
.button-container { text-align: center; } 
	.jump-shake-button { padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 10px; cursor: pointer; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; outline: none; }
	@keyframes jump { 0% { transform: translateY(0); } 50% { transform: translateY(-10px); } 100% { transform: translateY(0); } } 
	@keyframes shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 50% { transform: translateX(5px); } 75% { transform: translateX(-5px); } }
		
	.call-button-container { text-align: center; } .call-button { display: inline-block; padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 50px; text-decoration: none; cursor: pointer; transition: transform 0.3s; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; } .call-button:hover { background-color: #036D9D; }
	.phone-icon { margin-right: 10px;color: #ED5321; }		
		
		
} 

/* Styles pour les écrans d'iPhone de taille moyenne (ex: iPhone 6, 7, 8) */
@media only screen and (min-width: 321px) and (max-width: 375px) 
{ 


.hidden-text {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            padding-top:5px;
			 padding-bottom:5px;
            color: white;
            font-size: 18px;
			font-weight: 800;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	
			
        }
		.hidden-text2 {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			padding-top:20px;
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: white;
            font-size: 16px;
			font-weight: 600;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	        }
			
		.hidden-text3 {
            opacity: 0;
            transition: opacity 2s ease-in;
			background-color:white;
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: #ED5321;
            font-size: 16px;
			font-weight: 900;
            text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
			margin-top: 5px;
			margin-bottom: 5px;
	        }
				
.visible-text {
            opacity: 1;
        }
		
		.delayed-hr { width: 200px; padding:0;0;0;0;}
		
.button-container { text-align: center; } 
	.jump-shake-button { padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 10px; cursor: pointer; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; outline: none; }
	@keyframes jump { 0% { transform: translateY(0); } 50% { transform: translateY(-10px); } 100% { transform: translateY(0); } } 
	@keyframes shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 50% { transform: translateX(5px); } 75% { transform: translateX(-5px); } }
		
	.call-button-container { text-align: center; } .call-button { display: inline-block; padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 50px; text-decoration: none; cursor: pointer; transition: transform 0.3s; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; } .call-button:hover { background-color: #036D9D; }
	.phone-icon { margin-right: 10px;color: #ED5321; }		
		
		
 } 
 
/* Styles pour les grands écrans d'iPhone (ex: iPhone X, 11, 12) */ 
@media only screen and (min-width: 376px) and (max-width: 414px) 
{ 

.hidden-text {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            padding-top:5px;
			 padding-bottom:5px;
            color: white;
            font-size: 18px;
			font-weight: 800;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	
			
        }
		.hidden-text2 {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			padding-top:20px;
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: white;
            font-size: 16px;
			font-weight: 600;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	        }
			
		.hidden-text3 {
            opacity: 0;
            transition: opacity 2s ease-in;
			background-color:white;
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: #ED5321;
            font-size: 16px;
			font-weight: 900;
            text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
			margin-top: 5px;
			margin-bottom: 5px;
	        }
				
.visible-text {
            opacity: 1;
        }
		
		.delayed-hr { width: 200px; padding:0;0;0;0;}
		
.button-container { text-align: center; } 
	.jump-shake-button { padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 10px; cursor: pointer; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; outline: none; }
	@keyframes jump { 0% { transform: translateY(0); } 50% { transform: translateY(-10px); } 100% { transform: translateY(0); } } 
	@keyframes shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 50% { transform: translateX(5px); } 75% { transform: translateX(-5px); } }
		
	.call-button-container { text-align: center; } .call-button { display: inline-block; padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 50px; text-decoration: none; cursor: pointer; transition: transform 0.3s; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; } .call-button:hover { background-color: #036D9D; }
	.phone-icon { margin-right: 10px;color: #ED5321; }		
		
		

}

 /* Styles pour les petits écrans Android (ex: Google Pixel 4a) */ 
@media only screen and (min-width: 410px) and (max-width: 600px) 
 { 


.hidden-text {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            padding-top:9px;
			 padding-bottom:9px;
            color: white;
            font-size: 22px;
			font-weight: 800;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	
			
        }
		.hidden-text2 {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			padding-top:20px;
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: white;
            font-size: 16px;
			font-weight: 600;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	        }
			
		.hidden-text3 {
            opacity: 0;
            transition: opacity 2s ease-in;
			background-color:white;
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: #ED5321;
            font-size: 16px;
			font-weight: 900;
            text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
			margin-top: 5px;
			margin-bottom: 5px;
	        }
				
.visible-text {
            opacity: 1;
        }
		
		.delayed-hr { width: 200px; padding:0;0;0;0;}
		
.button-container { text-align: center; } 
	.jump-shake-button { padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 10px; cursor: pointer; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; outline: none; }
	@keyframes jump { 0% { transform: translateY(0); } 50% { transform: translateY(-10px); } 100% { transform: translateY(0); } } 
	@keyframes shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 50% { transform: translateX(5px); } 75% { transform: translateX(-5px); } }
		
	.call-button-container { text-align: center; } .call-button { display: inline-block; padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 50px; text-decoration: none; cursor: pointer; transition: transform 0.3s; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; } .call-button:hover { background-color: #036D9D; }
	.phone-icon { margin-right: 10px;color: #ED5321; }		
		

 } 
 
 /* Styles pour les grands écrans Android (ex: Samsung Galaxy S21) */
@media only screen and (min-width: 601px)

 { 
 
 
.hidden-text {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            padding-top:5px;
			 padding-bottom:5px;
            color: white;
            font-size: 18px;
			font-weight: 800;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	
			
        }
		.hidden-text2 {
            opacity: 0;
            transition: opacity 2s ease-in;
			
			padding-top:20px;
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: white;
            font-size: 16px;
			font-weight: 600;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	        }
			
		.hidden-text3 {
            opacity: 0;
            transition: opacity 2s ease-in;
			background-color:white;
			
			position: relative;
            z-index: 1;
            display: flex;
            justify-content: center;
            align-items: center;
            
            color: #ED5321;
            font-size: 16px;
			font-weight: 900;
            text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
			margin-top: 5px;
			margin-bottom: 5px;
	        }
				
.visible-text {
            opacity: 1;
        }
		
		.delayed-hr { width: 200px; padding:0;0;0;0;}
		
.button-container { text-align: center; } 
	.jump-shake-button { padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 10px; cursor: pointer; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; outline: none; }
	@keyframes jump { 0% { transform: translateY(0); } 50% { transform: translateY(-10px); } 100% { transform: translateY(0); } } 
	@keyframes shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 50% { transform: translateX(5px); } 75% { transform: translateX(-5px); } }
		
	.call-button-container { text-align: center; } .call-button { display: inline-block; padding: 15px 25px; font-size: 20px; color: white; background-color: #009CE6; border: none; border-radius: 50px; text-decoration: none; cursor: pointer; transition: transform 0.3s; animation: jump 0.6s ease-in-out infinite alternate, shake 0.6s infinite ease-in-out; } .call-button:hover { background-color: #036D9D; }
	.phone-icon { margin-right: 10px;color: #ED5321; }		
		
 
 
 }