body{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scroll-behavior: smooth;
}



  @media only screen   
  and (min-device-width : 320px)   
  and (max-device-width : 640px)  
  { 
    .top-row-2{
        margin-left: 1.5rem;
        padding: 0;
    }
    .top-row-2>i{
        margin-left: 15px;
        margin-right: 15px;
    }
    .carousel-img{
        width: 100%;
        height: 15rem;
    }
    .carousel-content{
        display: none;
    }
    
    .carousel-under-content{
        background-color: #281670;
        height: 4rem;
    }
    
    .carousel-under-content-1{
        margin-top: auto;
        margin-bottom: auto;
        font-size: 1rem;
        color: white;
    }
    .carousel-under-content-1-1{
        margin-left: 15%;
    }
    .button{
        margin-top: 12%;
        margin-bottom: auto;
        margin-left: 5%;
        font-size: 15px;
        color: #ffffff;
        border: 1px solid #381f9e;
        background-color: #381f9e;
    }
    .button:hover{
        border: 1px solid #543bba;
        background-color: #543bba;
        transition: 0.5s;
    }
    .about-us-1{
        margin-top: 2%;
        font-weight: 500;
        font-size: 2.5rem;
    }
    .about-img{
        border-radius: 5px;
        margin-left: 5%;
        margin-top: 5%;
    }
    .about-img > img{
        border-radius: 10px;
        width: 30rem;
    }
    .about-us-2{
        margin-top: 5%;
        font-size: large;
        padding-left:15px ;
    }
    .about-us-2>h4,p{
        margin-left: 2rem;
    }
    .services{
        background-color: #281670;
        margin-top: 5%;
    }
    .services-1{
        margin-top: 4%;
        font-weight: 500;
        font-size: 2.5rem;
    }
    .custom-cards{
        margin-bottom: 5rem;
    }
    .button-2{
        display: none;
    }
    .button-2:hover{
        border: 1px solid #543bba;
        background-color: #543bba;
        transition: 0.5s;
    }
    .services-bottom-row{
        margin-top: -70%;
    }
    .service-img{
        object-fit: contain;
    }
    .card-img-top{
        margin-left: auto;
        margin-right: auto;
        width: 20rem;
        margin-bottom: 3rem;
    }
    
    .card:hover{
        box-shadow:
        1px 1px #281670,
        2px 2px #281670,
        3px 3px #281670,
        4px 4px #281670,
        5px 5px #281670,
        6px 6px #281670,
        -1px 1px #281670, /* Left shadow */
        1px -1px #281670, /* Right shadow */
        0px 6px #281670; /* Bottom shadow */
    
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px);
    transition: .5s ease;
    
    }
    
    i:hover{
        cursor:pointer;
    }
    .counter-row-1{
        padding: 0;
    }
    .counter-row-2{
        background-color: #2363d5;
    }
    
    .p-counter{
        text-align: center;
      }
      .p-counter > h5 {
        color: #ffffff;
        font-size: 1.25rem;
      }
      .num{
        font-size: 3rem;  
        color: #ffffff;
      }
      .text{
        margin-left: -1rem;
        font-size: 1.5rem;
        color: #ffffff;
      }
      .counter{
        display: inline-block;
        margin-top: 1rem;
      }
      .counter > i{
        color:  #ffffff;
        margin-top: 1rem;
        font-size: 4rem;
        margin-left: 1rem;
      }
      .cust-counter{
        margin-top: 4rem;
      }

  }










  @media only screen   
  and (min-width: 1030px)   
  and (max-width: 1605px)  
  { 
    .top-row-2{
        width: 30rem;
        margin-left: 5rem;
        padding: 0;
    }
    .top-row-2>i{
        margin-left: 10px;
        margin-right: 10px;
    }
    .carousel-img{
        width: 100%;
        height: 38.5rem;
    }
    .carousel-content{
        margin-top: -15%;
    }
    .cust-card-1 {
        background-color: rgba(247, 137, 58, 0.85);
        color: white;
    }
    
    .cust-card-2 {
        background-color: rgba(232, 130, 46, 0.85);
        color: white;
    }
    
    .cust-card-3 {
        background-color: rgba(233, 118, 22, 0.85);
        color: white;
    }
    
    .card-btn{
        color: white;
        background-color: rgba(233, 118, 22);
    }
    
    .carousel-under-content{
        background-color: #281670;
        height: 4rem;
    }
    
    .carousel-under-content-1{
        margin-top: 2%;
        margin-bottom: auto;
        margin-left: 15%;
        width: 40rem;
        font-size: 2.3rem;
        color: white;
    }
    
    .button{
        margin-top: 6%;
        margin-bottom: auto;
        margin-left: 5%;
        font-size: large;
        height: 3rem;
        width: 15rem;
        color: #ffffff;
        border: 1px solid #381f9e;
        background-color: #381f9e;
    }
    .button:hover{
        border: 1px solid #543bba;
        background-color: #543bba;
        transition: 0.5s;
    }
    .about-us-1{
        margin-top: 2%;
        font-weight: 500;
        font-size: 2.5rem;
    }
    .about-img{
        border-radius: 5px;
        margin-left: 15%;
        margin-top: 5%;
    }
    .about-img > img{
        border-radius: 10px;
        width: 30rem;
    }
    .about-us-2{
        margin-top: 5%;
        font-size: large;
    }
    
    .services{
        background-color: #281670;
        margin-top: 5%;
    }
    .services-1{
        margin-top: 4%;
        font-weight: 500;
        font-size: 2.5rem;
    }
    
    .button-2{
        margin-top: 5%;
        margin-bottom: 2%;
        font-size: large;
        height: 3rem;
        width: 15rem;
        color: #ffffff;
        border: 1px solid #381f9e;
        background-color: #381f9e;
    }
    .button-2:hover{
        border: 1px solid #543bba;
        background-color: #543bba;
        transition: 0.5s;
    }
    .services-bottom-row{
        margin-top: -70%;
    }
    .service-img{
        object-fit: contain;
    }
    
    .card:hover{
        box-shadow:
        1px 1px #281670,
        2px 2px #281670,
        3px 3px #281670,
        4px 4px #281670,
        5px 5px #281670,
        6px 6px #281670,
        -1px 1px #281670, /* Left shadow */
        1px -1px #281670, /* Right shadow */
        0px 6px #281670; /* Bottom shadow */
    
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px);
    transition: .5s ease;
    
    }
    
    i:hover{
        cursor:pointer;
    }
    .counter-row-1{
        padding: 0;
    }
    .counter-row-2{
        background-color: #2363d5;
    }
    
    .p-counter{
        text-align: center;
      }
      .p-counter > h5 {
        color: #ffffff;
        font-size: 1.25rem;
      }
      .num{
        font-size: 3rem;  
        color: #ffffff;
      }
      .text{
        margin-left: -1rem;
        font-size: 1.5rem;
        color: #ffffff;
      }
      .counter{
        display: inline-block;
        margin-top: 1rem;
      }
      .counter > i{
        color:  #ffffff;
        margin-top: 1rem;
        font-size: 4rem;
        margin-left: 1rem;
      }
      .cust-counter{
        margin-top: 4rem;
      }
  }