body{  font-family: "Merienda", cursive !important; }
h1, h2, h3 {font-family: "Original Surfer", sans-serif !important;letter-spacing: 2px; }
/** whatsapp style**/
.whatsapp-float {position: fixed;bottom: 100px;right: 20px;z-index: 999;background-color: #25d366;border-radius: 50%;padding: 10px;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);transition: all 0.3s ease;}
a:hover {text-decoration:underline !important;}
a {text-decoration:none !important;}
.whatsapp-float img {width: 40px;height: 40px;}
.whatsapp-float:hover {transform: scale(1.1);}

/* Blog page breadcrumps */
ul.breadcrumb {padding: 8px 12px;list-style: none;background-color: #f8f9fa;}
ul.breadcrumb li {display: inline;font-size: 18px;}
ul.breadcrumb li+li:before {padding: 4px;color: black;content: "/\00a0";}
ul.breadcrumb li a {color: #00a77c;text-decoration: none;font-size:16px;}
ul.breadcrumb li a:hover {color: #01447e;text-decoration: underline;}

.alert-success{background:#fff976 !important;}
.underline:hover{text-decoration:underline;}

/* Blog page styles */
.blog-box {background: #fff;border-radius: 12px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);padding: 12px;margin-bottom: 30px;transition: transform 0.3s ease, box-shadow 0.3s ease;}
    .blog-box:hover {transform: translateY(-5px);box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);}
    .sticky-sidebar {position: sticky;top: 20px;}
    .connect-widget {background: #00a77c;color: #fff;border-radius: 12px;padding: 12px;text-align: center;box-shadow: 0 10px 20px rgba(0,0,0,0.1);margin-bottom:40px;}
    .connect-widget img {max-width: 100%;border-radius: 10px;margin-bottom: 15px;}
    .connect-widget h5 {margin-bottom: 15px;}
    .connect-widget .btn {background-color: #fff;color: #000;font-weight: bold;border: none;}
    .connect-widget .btn:hover {background-color: #f1e6f5;}
    .blogimg{width:380px;height:auto;padding-bottom:20px;}
    .blogheading{font-size:22px;color:#000;}
    .blogpara{font-size:16px;color:#000;}

 .serimg{width:100px;height:100px;padding:6px;border-radius:12px;margin-top:14px;}
 .formreq{color:red;font-weight:500;}
 .suglabel{position: absolute;top: 10px;right: 10px;background-color: #0c521c; color: white;padding: 4px 10px;font-size: 12px;font-weight: bold;border-radius: 10px;z-index: 10;}
/* Service Bubble effects */
.service-bubbles{display: flex;flex-wrap: wrap;gap: 20px;justify-content: center;margin-top: 20px;}
.bubble {background-color: #ffffff;padding: 14px;border-radius: 8px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);transition: all 0.3s ease;text-align: center;font-weight: 500;color: #333;}
.bubble:hover {background:#000;color: #fff;transform: translateY(-5px) scale(1.03);}
    
/* Cta button effects */
  .cta-button {position: relative;background: #00a77c;color: white;font-weight: 600;border: none;padding: 8px 26px;font-size: 20px;border-radius: 12px;transition: all 0.3s ease;overflow: hidden;}
  .cta-button::before {content: "";position: absolute;top: 0;left: -100%;width: 100%;height: 100%;background: rgba(255, 255, 255, 0.15);transition: all 0.5s ease;transform: skewX(-20deg);}
  .cta-button:hover::before {left: 100%;}
  .cta-button:hover {transform: translateY(-2px);}
  .cta-button:active {transform: scale(0.98);}
  .cta-button:focus {outline: none;}


  /* Hover dropdown effect for desktop */
  @media (min-width: 992px) {
    .navbar-nav .dropdown:hover .dropdown-menu {display: block;margin-top: 0;animation: fadeIn 0.3s ease-in-out;}
  }

  @keyframes fadeIn {
    from {opacity: 0;transform: translateY(10px);}
    to {opacity: 1;transform: translateY(0);}
  }

  /* Hamburger to Close Icon Animation 
  .navbar-toggler {border: none;background: none;outline: none;padding: 0;}
  .navbar-toggler-icon {background-image: none;width: 30px;height: 3px;background-color: #fff;display: block;position: relative;transition: background 0.3s ease;}
  .navbar-toggler-icon::before,
  .navbar-toggler-icon::after {content: '';background-color: #fff;width: 30px;height: 3px;position: absolute;left: 0;transition: transform 0.3s ease;}
  .navbar-toggler-icon::before {top: -10px;}
  .navbar-toggler-icon::after {top: 10px;}
  .navbar-toggler.collapsed .navbar-toggler-icon {background-color: transparent;}
  .navbar-toggler.collapsed .navbar-toggler-icon::before {transform: rotate(45deg) translate(5px, 5px);}
  .navbar-toggler.collapsed .navbar-toggler-icon::after {transform: rotate(-45deg) translate(5px, -5px);}*/

.dropdown-item:focus, .dropdown-item:hover {color: #000 !important;background-color: #f9ee23  !important;}
 .p-4 {padding: 0.5rem !important;height:510px !important;}
 .nav-link{color:white !important; font-size:20px;padding-right:32px !important; }
 .service-name {padding: 12px;}
  
  .cta-button1{background: white;color: #000;font-weight: 600;font-size: 20px;padding: 8px 26px;border: none;border-radius: 12px;}
  .cta-button1:hover{background: #f9ee23 !important;color: #000 !important;font-weight: 600;font-size: 20px;padding: 8px 26px;border: none;border-radius: 12px;}
  .cta-button2{background: #B10DC9;color: white;font-weight: 600;font-size: 20px;padding: 8px 26px;border: none;border-radius: 12px;}
  .cta-button2:hover{background: #fff;color: #fff;font-weight: 600;font-size: 20px;padding: 8px 26px;border: none;border-radius: 12px;}
  p{font-size:18px;}
  a{text-decoration:none;}
  .service-dec{font-size:16px;}
  .footer-heading{color:#000; font-weight:600;font-size:1.5rem;text-decoration: underline;text-decoration-color: #00a77c;}
  .h-100{height:160px !important;padding:12px !important;} 
  .bg-purple{background: linear-gradient(to right, #B10DC9, #FFDC00);}
  .bg-purple1{background: linear-gradient(to left, #B10DC9, #FFDC00);}
  .bg-purple .why-p {color:#B10DC9 !important;}
  .why-p1 {color:#fff !important;}
  .fw-semibold {color: #b10dbc;}
  #more {display: none;}
  #more1 {display: none;}
  #more2 {display: none;}
  #more3 {display: none;}
  #more4 {display: none;}
  .mobile-show{display:none;}
  .visionbx{height:400px !important;}
  @media only screen and (max-width: 768px) {
  /* Your styles for all mobile devices go here */
  .h-100{height:240px !important;}
  .desk-show{display:none;}
  .mobile-show{display:block;margin-bottom:48px;}
  .cta-button{text-align:center;}
   .p-4 {padding: 0.5rem !important;height:580px !important;}
    .blogimg{width:316px;height:auto;padding-bottom:20px;}
    .visionbx{height:460px !important;}
}

@media only screen and (max-width: 480px) {
  /* Styles for smartphones */
}


/* Styles for tablets in portrait and larger phones */
@media only screen and (min-width: 481px) and (max-width: 768px) {
   .p-4{height:500px !important;}
}
    
    /* Custom Styles */
    .banner-slide {height: 400px;background-size: cover;background-position: center;position: relative;}
    .banner-text {position: absolute;bottom: 20px;left: 30px;color: white;background: rgba(0, 0, 0, 0.5);padding: 10px 20px;border-radius: 8px;}
    .service-box {transition: transform 0.3s;}
    .service-box:hover {transform: translateY(-10px);}
    .testimonial {background-color: #f9f9f9;border-radius: 10px;padding: 20px;margin-bottom: 20px;}
    .star-rating {color: #ffc107;}
    @media (max-width: 768px) {
      .banner-text {font-size: 14px;bottom: 10px;left: 10px;}
    }
    
    /* about Asan Page Style */
    
     .hero {background: linear-gradient(to right, #B10DC9, #FFDC00);color: white;padding: 60px 0;text-align: center;animation: fadeIn 2s ease-in;}
    .hero h1 {font-size: 3rem;font-weight: 700;}
    .hero p {font-size: 1.2rem;max-width: 700px;margin: 0 auto;}
    .content {padding: 60px 15px;}
    .section-title {font-weight: 600;margin-bottom: 30px;color: #343a40;animation: slideIn 1s ease-in-out;}
    .content p {line-height: 1.8;color: #555;}

    @keyframes fadeIn {
      from {opacity: 0;}
      to {opacity: 1;}
    }

    @keyframes slideIn {
      from {transform: translateY(30px);opacity: 0;}

      to {transform: translateY(0);opacity: 1;}
    }