

/* For WHatsapp*/
/* Adjust the positioning and styling as needed */

.whatsapp-float {
  position: fixed;
  bottom: 30px;
  left: 20px;
  z-index: 9999;
  transition: transform 0.2s ease-in-out;
}

@media (max-width: 767px) {
.whatsapp-float {
  position: fixed;
  bottom: 30px;
  left: 20px;
  z-index: 9999;
  transition: transform 0.2s ease-in-out;
  }
}

.whatsapp-float:hover {
  transform: scale(1.1);
}

.whatsapp-float img {
  width: 60px;
  height: auto;
  border-radius: 50%;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
}


/* For WHatsapp end*/

/* For colour page slide text over image */
.image-text-slider-container {
  position: relative;
  width: 100%;
}

.image-text-slider-image {
  display: block;
  width: 100%;
  height: auto;
}

.image-text-slider-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background-color: #242745;
  overflow: hidden;
  height: 0;
  transition: .5s ease;
}

.image-text-slider-container:hover .image-text-slider-overlay {
  height: 100%;
}

.image-text-slider-text {
  color: white;
  font-size: 16px;
  position: absolute;
 top: 10px; /* Add 15px padding from the top */
  left: 30px; /* Add 15px padding from the left */
  right: 20px; /* Add 15px padding from the right */
  bottom: 20px; /* Add 15px padding from the bottom */*/
  transform: translate(-50%, -50%);
}



/* For sub-menu Start */
.mobmenu-content #mobmenuleft .sub-menu a:hover {
	  color:#454358;
    background-color: #fff;
	  border: 1px solid #242745; 
}
.mobmenu-content #mobmenuleft .sub-menu a {
	 
	
	padding-left:40px;
}

/* For sub-menu end */

/* For Flipping services Image  Start */
.flip-container {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 120%; /* Adjust this value based on your image aspect ratio */

	 overflow: hidden;
}

.flipper {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 0.5s;
}

.front,
.back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;

}

.front {
  z-index: 2;
  transform: rotateY(0deg);

}

.back {
  transform: rotateY(180deg);
}

.flip-container:hover .flipper {
  transform: rotateY(180deg);
}
.image-container {
  position: relative;
  margin-bottom: 20px;
}


.button-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
	margin-top: 250px;
}

.learn-more {
  display: inline-block;
  padding: 10px 20px;
  background-color: transparent;
  color: #fff !important;
  border: 2px solid #fff;
  text-decoration: none;
  transition: background-color 0.3s, color 0.3s;
}

.learn-more:hover {
  background-color: #fff !important;
  color: #454358 !important;
}
.text-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
	
	
}

.text-overlay h2 {
  font-size: 20px;
	margin-top:300px;
  margin-bottom: 10px;
	border: 2px solid #fff;
	color: #fff;
	 padding: 10px;
}

.text-overlay p {
  font-size: 16px;
}
@media (max-width: 767px) {
  .flip-container {
     /* Adjust this value based on your image aspect ratio */
  }
	
}
@media (min-width: 768px) and (max-width: 1023px) {

  .button-container {
    margin-top: 150px; /* Adjusted for tablet screens */
  }

  .text-overlay h2 {
    font-size: 18px; /* Adjusted font size for tablet screens */
    margin-top: 200px; /* Adjusted margin for tablet screens */
  }
}
/* For Flipping services Image End */




/* New button styles WP-Form Start */
.wpforms-form input[type=submit], 
.wpforms-form button[type=submit] {
    
    background-color: #242745 !important; 
    color: #fff !important; 

}
 
/* New button hover styles */
.wpforms-form input[type=submit]:hover, 
.wpforms-form input[type=submit]:active, 
.wpforms-form button[type=submit]:hover, 
.wpforms-form button[type=submit]:active, 
.wpforms-form .wpforms-page-button:hover, 
.wpforms-form .wpforms-page-button:active {
    background-color: #242745 !important; 
	/* New button styles WP-Form End */

