@layer utilities {
    .content-auto {
      content-visibility: auto;
    }
    .primaryBG{
        background-color: #121962;
    }
    .primaryTxt{
        color:  #121962;
    }
    .secondaryTxt{
        color: #f20574;
    }
    .secondaryBG{
        background-color:  #f20574;
    }
    .swiper-container {
        overflow: hidden;
      }
    .customTxt{
        color: #121962;
            -webkit-text-stroke-width: 1px;
            -webkit-text-stroke-color:  #f20574;
    }
    .bgcolor {
        background-color: #121962;
        width: 100%;
        
      }

  
      /* content below webjr img */
      .grid-container {
        display: grid;
        grid-template-columns: 50% 20% 30%;
        margin-top: 100px;
        padding: 80px;
        color: #ffffff;
        align-items: center;
        font-family: 'Montserrat', sans-serif;
      }
  
      .grid-container:nth-last-child(2) {
        font-weight: bold;
      }
  
      
  }


  .black_bg{
    background-color: #111827;
  }

  .contact_button{
    background-color: #f20574 !important;
  }



  /* logo */

   .loader_nav {
    
    position: relative;
    
  }
  
  .loader_nav span {
    font-family: montserrat;
    font-weight: 500;
    position: absolute;
    color: #fff;
    transform: translate(-50%, -50%);
    letter-spacing: 5px;
  }
  
  .loader_nav span:nth-child(1) {

    color: transparent;
    -webkit-text-stroke: 0.3px #ffffff
    
  }
  
  .loader_nav span:nth-child(2) {
    color: #ffffff;
    -webkit-text-stroke: 0.3px #000000;
    animation: uiverse723 3s ease-in-out infinite;
  }
  
  @keyframes uiverse723 {
    0%, 100% {
      clip-path: polygon(0% 45%, 15% 44%, 32% 50%, 
       54% 60%, 70% 61%, 84% 59%, 100% 52%, 100% 100%, 0% 100%);
    }
  
    50% {
      clip-path: polygon(0% 60%, 16% 65%, 34% 66%, 
       51% 62%, 67% 50%, 84% 45%, 100% 46%, 100% 100%, 0% 100%);
    }
  }

  /* service card */
  .service_card {
    width: 190px;
    height: 254px;
    margin: 0 auto;
    background-color: #F8FBFE;
    border-radius: 8px;
    z-index: 1;
    background: rgba(255,255,255,.05);
    box-shadow: 0 0 10px rgba(0,0,0,0.25);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter:blur(10px)
   
   }
   
   .service_tools {
    display: flex;
    align-items: center;
    padding: 9px;
   }
   
   .service_circle {
    padding: 0 4px;
   }
   
   .service_box {
    display: inline-block;
    align-items: center;
    width: 10px;
    height: 10px;
    padding: 1px;
    border-radius: 50%;
   }
   
   .service_red {
    background-color: #ff605c;
   }
   
   .service_yellow {
    background-color: #ffbd44;
   }
   
   .service_green {
    background-color: #00ca4e;
   }