

@media only screen and (min-width: 767px)    {
    .navbar {
        position:fixed;
        top: 0;
        width: 100%;
        z-index: 1000;
     
    }
    .navbar.scrolled {
        background-color: white;
    }
    .navbar-brand img {
        max-height: 50px; 
    }
}
header {
    background-color: white;
    color: #56A6CF;
    padding: 10px 0;
    width: 100%;
    position: fixed; 
    top: 0; 
    z-index: 1000;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); 
}

.navbar-nav {
    padding-right: 10px; 
    color: #56A6CF;
    font-family:'Montserrat';
    font-size: 18px;
}

.navbar-brand img {
    max-height: 50px; 
    margin-right: 10px; 
}

.nav-link {
    color: #fafafa;
   /* font-weight: bold;*/
}

.navbar-light .navbar-nav .nav-link {
    color: #ffffff;
}

.navbar-light .navbar-nav .nav-link:hover {
    color: #ffffff;
}

/*
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
    color:#56A6CF;
}
.navbar{
    text-align: right;
}
.navbar-light .navbar-nav .nav-link:hover {
    color:#56A6CF;
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: #56A6CF;
}
*/
@media (max-width: 768px) {
    .navbar-brand img {
        max-height: 30px; 
    }
}

@media only screen and (min-width: 320px) and (max-width: 767px)
{
.mobtext{
    margin-top:20px
}
h1.mobitext {
    margin-bottom: 0px !important;
    font-size: 2rem !important;
    line-height: 40px !important;
}
.sectionHead {
    margin-top: 0px !important; 
}
}
/*
.navbar-nav .nav-item.dropdown:hover .dropdown-menu {
    display: block;
}
    */
.dropdown-menu {
    display: none; 
    position: absolute;
  
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;

}

.dropdown-menu a {
    color: #000000;   
}

.dropdown-menu a:hover {

    color: #891717;
    background-color:transparent;
}
    
@media (max-width: 992px) {
    .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: static; 
        float: none; 
        width: auto; 
        margin-top: 0;
        background-color: transparent; 
        border: 0; 
        box-shadow: none; 
        display: none; 
        visibility: hidden; 
        opacity: 0; 
        transition: opacity 0.4s;
    }

    .navbar-expand-lg .navbar-nav .nav-item.dropdown:hover .dropdown-menu,
    .navbar-expand-lg .navbar-nav .nav-item.dropdown:focus-within .dropdown-menu {
        display: block; 
        visibility: visible; 
        opacity: 1; 
    }
}


/******************************************end header***********************************/
body {
    font-family: 'Montserrat';
    
}
h1, h2, h3, h4, h5, h6 {
    font-family: "Montserrat";
}
/* Basic styling for the video banner section */


/* Basic styling for the video banner section */
.video-banner {
    position: relative;
    height: 100vh; /* Adjust to desired height */
    overflow: hidden;
}
.video-banner h1{
    line-height:70px;
}
.video-banner video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent black overlay */
}

.content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    z-index: 1;
   
}

.content h1 {
    font-size: 3rem;
    margin-bottom: 20px;
}

.content p {
    font-size: 1.5rem;
    font-style: italic;
}
.contentmar {
    opacity: 0;
    position: absolute;
    width: 60%;
    text-align: inherit;
  top:50%;
    transform: translateY(-50%);
    z-index: 1;
}
#content1 {
    animation: fadeInOut 12s linear infinite;
    z-index: 3;
}
#content2 {
    animation: fadeInOut 12s linear 4s infinite;
    z-index: 2;
}
#content3 {
    animation: fadeInOut 12s linear 8s infinite;
    z-index: 1;
}
@keyframes fadeInOut {
    0%, 25%, 100% {
        opacity: 0;
    }
    10%, 20% {
        opacity: 1;
    }
}
/* @media (min-width:320px) and (max-width:620px){
    .button-container {
      
        margin-bottom: 180px !important;
       
    }
} */
@media (min-width:621px) and (max-width:1000px){
    .contentmar {
        width: 86%;
        padding-bottom: 162px;
    }
}
@media (min-width:1001px) and (max-width:1327px){
    .button-container {
        margin-bottom: 20px !important;
    }
}
@media (min-width:1001px) and (max-width:1024x){
    .contentmar {
        width: 86%;
        padding-bottom: 0px;
    }
}
@media (min-width:320px) and (max-width:620px){
    .contentBox.container1 {
        padding-left: 10px !important;
    }

    .contentmar {
        opacity: 0;
        position: absolute;
        width: 90%;
        text-align: inherit;
      top:30%;
        transform: translateY(-50%);
        z-index: 1;
        font-size:25px;
    }
    .bannerContent .contentBox p {
        font-size: 16px;
        line-height: 50px;
        font-weight: 700;
        margin-bottom: 40px;
    }
    
}
@media (min-width:621px) and (max-width:1300){
    .contentmar {
        opacity: 0;
        position: absolute;
        width: 90%;
        text-align: inherit;
      top:30%;
        transform: translateY(-50%);
        z-index: 1;
    }
}
.vedio-hoverable-button {
    background-color: white; 
   /* border: 2px solid black; /* Green border */
   /* border:black;*/
    color:black;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
   /* margin: 4px 2px;*/
    cursor: pointer;
    border-radius: 0px;
    transition: background-color 0.3s ease, border-color 0.3s ease; 
    margin-top: 10px;
    margin-right: auto;
  }
  
  /* Hover effect */
  .vedio-hoverable-button:hover {
    background-color:black; /* Darker green */
    color:white;
    text-decoration: none;
  }



  .bannerBottom {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: rgba(0,0,0,.35);
    -webkit-backdrop-filter: blur(62px);
    backdrop-filter: blur(62px);
    padding: 0px 0;
    width: 100%;
}

@media (min-width: 1400px) {
    .bannerBottom>.container {
        max-width:1380px;
    }
}

 .bannerBottom .trustLogoBox {
    gap: 30px 110px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-column-gap: 120px;
    -moz-column-gap: 120px;
    column-gap: 120px;
}

@media (max-width: 1399.98px) {
 .bannerBottom .trustLogoBox {
        -webkit-column-gap:60px;
        -moz-column-gap: 60px;
        column-gap: 60px;
    }
}

@media (max-width: 1299.98px) {
   .bannerBottom .trustLogoBox {
        -webkit-column-gap:40px;
        -moz-column-gap: 40px;
        column-gap: 40px;
    }
}

@media (max-width: 1199.98px) {
   .bannerBottom .trustLogoBox {
        -webkit-column-gap:40px;
        -moz-column-gap: 40px;
        column-gap: 40px;
    }
}

@media (max-width: 575.98px) {
.bannerBottom .trustLogoBox {
        row-gap:35px;
    }
}

 .bannerBottom .trustLogoBox .logoBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 21px;
    -moz-column-gap: 21px;
    column-gap: 21px;
    position: relative;
    z-index: 0;
}

@media (max-width: 1299.98px) {
.bannerBottom .trustLogoBox .logoBox {
        -webkit-column-gap:15px;
        -moz-column-gap: 15px;
        column-gap: 15px;
    }
}

@media (max-width: 991.98px) {
   .bannerBottom .trustLogoBox .logoBox {
        max-width:253px;
    }
}

@media (max-width: 767.98px) {
 .bannerBottom .trustLogoBox .logoBox {
        max-width:228px;
    }
}

@media (max-width: 575.98px) {
.bannerBottom .trustLogoBox .logoBox {
        -ms-flex-wrap:wrap;
        flex-wrap: wrap;
        -webkit-column-gap: 0;
        -moz-column-gap: 0;
        column-gap: 0;
        width: calc(50% - 30px);
    }
}

.bannerBottom .trustLogoBox .logoBox:after {
    content: "";
    width: 1px;
    opacity: .5;
    height: 36px;
    position: absolute;
    right: -60px;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    background: -webkit-gradient(linear,left top,left bottom,from(rgba(255,255,255,0)),color-stop(45.83%,#fff),to(rgba(255,255,255,0)));
    background: linear-gradient(180deg,rgba(255,255,255,0) 0%,#fff 45.83%,rgba(255,255,255,0) 100%);
}

@media (max-width: 1399.98px) {
  .bannerBottom .trustLogoBox .logoBox:after {
        right:-53px;
    }
}

@media (max-width: 1299.98px) {
    .bannerBottom .trustLogoBox .logoBox:after {
        right:-22px;
    }
}

@media (max-width: 991.98px) {
 .bannerBottom .trustLogoBox .logoBox:after {
        content:normal;
    }
}

 .bannerBottom .trustLogoBox .logoBox:last-child:after {
    content: normal;
}

 .bannerBottom .trustLogoBox .logoBox p {
    font-size: 14px;
    line-height: 18px;
    color: #fff;
}

@media (max-width: 1199.98px) {
    .bannerBottom .trustLogoBox .logoBox p {
        font-size:11px;
        line-height: 16px;
    }
}

@media (max-width: 991.98px) {
  .bannerBottom .trustLogoBox .logoBox p {
        font-size:13px;
        line-height: 18px;
    }
}

@media (max-width: 767.98px) {
  .bannerBottom .trustLogoBox .logoBox p {
        font-size:12px;
        line-height: 17px;
    }
}

@media (max-width: 575.98px) {
  .bannerBottom .trustLogoBox .logoBox p {
        width:100%;
        margin-top: 12px;
        text-align: center;
        font-size: 14px;
        line-height: 18px;
    }
}

@media (max-width: 575.98px) {
 .bannerBottom .trustLogoBox .logoBox figure {
        margin:0 auto;
    }
}

 .bannerBottom .trustLogoBox .logoBox:nth-child(1) figure {
    width: 127px;
}

 .bannerBottom .trustLogoBox .logoBox:nth-child(2) figure {
    width: 83px;
}

.bannerBottom .trustLogoBox .logoBox:nth-child(3) figure {
    width: 154px;
}

 .bannerBottom .trustLogoBox .logoBox:nth-child(4) figure {
    width: 154px;
}

/******************************************end vedio***********************************/
/*
.marquee-container {
    overflow: hidden;
    white-space: nowrap;
}

.marquee {
    display: inline-block;
    animation: marquee-animation 20s linear infinite;
}

@keyframes marquee-animation {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}
*/
.imgmarquee {
   
    margin-right: 20px;
    vertical-align: middle; 
}
.marquee {
    display: flex;
    block-size: var(--marquee-item-height);
    margin-block: var(--marquee-item-height);
    position: relative;
    overflow-x: hidden;
    
  }
 
  .marquee--6 {
    --marquee-item-width: 166px;
    --marquee-item-height: 122px;
    --marquee-duration: 32s;
    --marquee-items: 18;
  }
  
  .marquee__item {
    --marquee-item-offset: max(
      calc(var(--marquee-item-width) * var(--marquee-items)),
      calc(100% + var(--marquee-item-width))
    );
    --marquee-delay: calc(var(--marquee-duration) / var(--marquee-items) * (var(--marquee-items) - var(--marquee-item-index)) * -1);
    position: absolute;
    inset-inline-start: var(--marquee-item-offset);
    transform: translateX(-50%);
    animation: go linear var(--marquee-duration) var(--marquee-delay, 0s) infinite;
  }
  
  .marquee__item:nth-child(4n) {
    border-top-right-radius: 1rem;
  }
  
  .marquee__item:nth-child(4n + 1) {
    border-bottom-right-radius: 1rem;
  }
  
  .marquee__item:nth-child(4n + 2) {
    border-bottom-left-radius: 1rem;
  }
  
  .marquee__item:nth-child(4n + 3) {
    border-top-left-radius: 1rem;
  }
 
  .marquee--6 .marquee__item:nth-of-type(1) {
    --marquee-item-index: 1;
  }
  
  .marquee--6 .marquee__item:nth-of-type(2) {
    --marquee-item-index: 2;
  }
  
  .marquee--6 .marquee__item:nth-of-type(3) {
    --marquee-item-index: 3;
  }
  
  .marquee--6 .marquee__item:nth-of-type(4) {
    --marquee-item-index: 4;
  }
  
  .marquee--6 .marquee__item:nth-of-type(5) {
    --marquee-item-index: 5;
  }
  
  .marquee--6 .marquee__item:nth-of-type(6) {
    --marquee-item-index: 6;
  }
  .marquee--6 .marquee__item:nth-of-type(7) {
    --marquee-item-index: 7;
  }
  .marquee--6 .marquee__item:nth-of-type(8) {
    --marquee-item-index: 8;
  }
  .marquee--6 .marquee__item:nth-of-type(9) {
    --marquee-item-index: 9;
  }
  .marquee--6 .marquee__item:nth-of-type(10) {
    --marquee-item-index: 10;
  }
  .marquee--6 .marquee__item:nth-of-type(11) {
    --marquee-item-index: 11;
  }
  .marquee--6 .marquee__item:nth-of-type(12) {
    --marquee-item-index: 12;
  }
  .marquee--6 .marquee__item:nth-of-type(13) {
    --marquee-item-index: 13;
  }
  .marquee--6 .marquee__item:nth-of-type(14) {
    --marquee-item-index: 14;
  }
  .marquee--6 .marquee__item:nth-of-type(15) {
    --marquee-item-index: 15;
  }
  .marquee--6 .marquee__item:nth-of-type(16) {
    --marquee-item-index: 16;
  }
  .marquee--6 .marquee__item:nth-of-type(17) {
    --marquee-item-index: 17;
  }
  .marquee--6 .marquee__item:nth-of-type(18) {
    --marquee-item-index: 18;
  }
  @keyframes go {
    to {  
      inset-inline-start: calc(var(--marquee-item-width) * -1);
    }
  }
.ourclients{
    margin-top: 25px;
    margin-bottom: 40px;
}
.valueBox {
    width: 50%;
    padding: 25px;
    border-bottom: 1px solid #e4e9f2;
}
.valueBoxes{
    margin-top: 75px;
}
/*
.valueProposition .rightPan .valueBox:nth-child(odd) {
    border-right: 1px solid #e4e9f2;
    padding-left: 0;
}

.valueProposition .rightPan .valueBox:nth-child(even) {
    padding-right: 0;
}

.valueProposition .rightPan .valueBox:nth-last-child(-n+2) {
    border-bottom: none;
}
.valueProposition .rightPan .valueBox figure {
    margin-bottom: 25px;
}

.valueProposition .rightPan .valueBox figure img {
    width: auto;
}

.valueProposition .rightPan .valueBox p {
    font-size: 20px;
    line-height: 1.23;
    font-weight: 300;
}
    */
    p{
        font-size: 16px;
    }
    .superstar
    {
        background-color:#f2fbfe;
        margin-top: 60px;
        margin-bottom: 24px;
    }
    .superstar .sectionInner .textBox h4 {
        font-size: 16px;
        line-height: 1.3;
        letter-spacing: .5px;
        margin-left: 90px;
        margin-top: 5px !important;
    }
    
    .value{
        margin-top: 20px;
        margin-left: 20px; 
    }
    @media(min-width:320px) and (max-width:767px){
        .value{
            margin-left: 0px !important; 
        }
    }
.value p{
    margin-top: 20px;
}
    .superstar .sectionInner figure {
        width: 273px;
        padding: 20px 20px;
        
    }
    .count
    {
        text-align: center;
        
    }
    .titleText
    {
        font-weight: 700;
        font-size: 32px;
    }
        
       /* .count {
            background-color: #f0f0f0; 
            border: 2px solid #ccc; 
            padding: 20px; 
            text-align: center; 
            width: 200px; 
            margin: 0 auto; 
            border-radius: 10px; 
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
            transition: all 0.3s ease; 
        }
        
        .count:hover {
            background-color: #e0e0e0; 
            border-color: #999; 
            transform: translateY(-5px); 
            box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
        }
        
        .titleText {
            font-size: 24px;
            font-weight: bold; 
            margin-bottom: 10px; 
        } */
        .kpiSection {
            text-align: center;
            margin-top: 50px;
        }

        .kpiSection .container {
            max-width: 1450px;
        }

        .kpiSection .kpiBox {
            margin-bottom: 30px;
            border-right: 1px dashed #ced6e4;
            width: 33.33%;
        }

        .kpiSection .kpiBox:last-child {
            border: none;
        }

        @media (max-width: 991.98px) {
            .kpiSection .kpiBox {
                width:50%;
                margin-left: auto;
                margin-right: auto;
            }

            .kpiSection .kpiBox:nth-child(2) {
                border: none;
            }
        }

        .kpiSection p {
            font-size: 16px;
            line-height: 19.68px;
        }

        .kpiSection p.titleText {
            margin-bottom: 7px;
            font-weight: 700;
            font-size: 32px;
            line-height: 39.36px;
        }

        .kpiSection .buttonHolder {
            margin-top: 40px;
            line-height: 1;
        }

        @media (max-width: 991.98px) {
            .kpiSection .buttonHolder {
                margin-top:25px;
            }
        }

    .counts{
        margin-top:40px;
    }
    .counts .cnumber{
        margin-top: 20px;
    }
    .counts .GlobalClient{
        font-size: 16px;
        font-weight: 0px !important;
    }
    .button-container {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom:35px;
        margin-top: 30px;
       
      /*  height: 100vh; /* Adjust as needed */
      }
      .border-right {
        border-right: 1px dotted #ccc !important; /* Add a right border with color */
        padding-right: 15px; /* Optional: Add padding to the right of the left column */
    }
      /* Style for the hoverable button */
      .hoverable-button {
        background-color: black; 
       /* border: 2px solid black; /* Green border */
       /* border:black;*/
        color:white;
        padding: 15px 32px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
       /* margin: 4px 2px;*/
        cursor: pointer;
        border-radius: 0px;
        transition: background-color 0.3s ease, border-color 0.3s ease; 
        
      }
      
      /* Hover effect */
      .hoverable-button:hover {
        background-color:White; /* Darker green */
        color:black;
        text-decoration: none;
      }
      .border{
        border-style: thin !important;
        border-width:2px !important;
        border-color:black !important ;
      }
       /* Adjust carousel height and image size as needed */
       .carousel-item img {
        max-height: 500px; /* Set maximum height for images */
        width: 100%; /* Make images responsive */
        object-fit: cover; /* Ensure images cover the entire area */
        padding-top:50px;
        /* padding-bottom: 50px; */
        /* margin-left: 20px; */
      }
      .carousel-item .content {
        padding: 20px;
        margin-left: 25%;
        color:black;
      }
      .imgslide{
        background-color: #f2fbfe;
        height: 550px;
        
      }
      .buttoncou {
        position: relative; /* Ensure the position context for absolute positioning */
        display: inline-block; /* Ensure the buttons are inline */
    }
    .buttoncou button {
        position: absolute; /* Position the buttons absolutely */
        top: 50%; /* Adjust top position */
        left: 50%; /* Adjust left position */
        transform: translate(-50%, -50%); /* Center the buttons */
        opacity: 0; /* Initially hide the buttons */
        transition: opacity 0.3s ease; /* Smooth transition for opacity */
    }
    
    .buttoncou:hover button {
        opacity: 1; /* Show buttons on hover */
    }
     .button-containers {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom:35px;
        margin-top: 25px;
       
      /*  height: 100vh; /* Adjust as needed */
      }
      .button-containeres {
        display: flex;
        justify-content: center;
        align-items: center;
        /* margin-bottom: 35px; */
        /* margin-top: 25px; */
    }

    @media only screen and (min-width: 320px) and (max-width: 824px)    {
        .button-containeres {
            display: none !important;
        }
}
    @media (max-width: 825px)
    {
        .button-containeres {
            display: flex;
            justify-content: center;
            align-items: center;
            /* margin-bottom: 35px; */
            /* margin-top: 25px; */
        }
    }
      
      /* Style for the hoverable button */
      .hoverable-button1 {
        background-color: rgb(255, 255, 255); 
       /* border: 2px solid black; /* Green border */
       /* border:black;*/
        color:rgb(0, 0, 0);
        padding: 10px 29px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
       /* margin: 4px 2px;*/
        cursor: pointer;
        border-radius: 0px;
        transition: background-color 0.3s ease, border-color 0.3s ease; 
        border-style: thin !important;
        border-width:2px !important;
        border-color:rgb(255, 255, 255) !important ;
        
      }
      
      /* Hover effect */
      .hoverable-button1:hover {
        background-color:rgb(0, 0, 0); /* Darker green */
        color:rgb(255, 255, 255);
        border-style: thin !important;
        border-width:2px !important;
        border-color:rgb(255, 255, 255) !important ;
        
      }
      .border{
        border-style: thin !important;
        border-width:2px !important;
        border-color:black !important ;
      }
      .hoverable-button2 {
        background-color: black; 
       /* border: 2px solid black; /* Green border */
       /* border:black;*/
        color:white;
        padding: 10px 29px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
       /* margin: 4px 2px;*/
        cursor: pointer;
        border-radius: 0px;
        transition: background-color 0.3s ease, border-color 0.3s ease; 
        margin-left: 3px;
      }
      
      /* Hover effect */
      .hoverable-button2:hover {
        background-color:White; /* Darker green */
        color:black;
        
      }

      .works{
        margin-top:25px;
        margin-bottom: 30px;
      }
      .carousel-control-prev-icon{
       
        margin-right: 93%;
      }
      .carousel-control-next-icon{
        margin-left: 93%;
      }
      .carousel-control-prev-icon,
      .carousel-control-next-icon {
    background-color: black; /* Set the background color of the icons */
}

.carousel-control-prev-icon::before,
.carousel-control-next-icon::before {
    color: white; /* Set the color of the icon itself */
}
blockquote {
    font-style: italic; /* Italicize the text */
    border-left: 5px solid #007bff; /* Add a left border for emphasis */
    padding-left: 15px; /* Padding to separate the text from the border */
    margin: 20px 0; /* Margin for spacing */
}

.blockquote p {
    margin-bottom: 0; /* Remove default bottom margin for cleaner appearance */
}

.circle-img {
    width: 100px; /* Set the width and height of the circle */
    height: 100px;
    border-radius: 50%; /* Make it a circle */
    overflow: hidden; /* Hide overflow to ensure it stays a circle */
    margin: 0 auto 20px; /* Center the circle horizontally and add some bottom margin */
}

.circle-img img {
    width: 100%; /* Make the image fill the circle */
    height: auto; /* Maintain aspect ratio */
}
.info{
 margin-top: 60px;   
}
.blockquotess{
background-color: #f9f9f9;
}
/*
.contact-form-container {
    max-width: 600px;
    margin: 0 auto;
    padding: 20px;
    background-color: #f8f9fa;
    border: 1px solid #ced4da;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.contact-form {
    display: grid;
    gap: 10px;
}
*/
.form-group {
    margin-bottom: 15px;
}

label {
    font-weight: bold;
}
/*
.conform{
   max-width: 100%;
}*/
.form-control {
   /* width: 100%;*/
    padding: 8px;
    font-size: 16px;
    border: 1px solid #ced4da;
    border-radius: 4px;
}

textarea.form-control {
    resize: vertical; /* Allow vertical resizing of textarea */
}

.btn-primary {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    border-radius: 4px;
    font-size: 16px;
}

.btn-primary:hover {
    background-color: #0056b3;
}


.formcon {
  
  /* width: 500px;*/
    margin-left: 40px;
  }
  
  .conform h2 {
    margin: 0 0 30px;
    padding: 0;
    color: #fff;
    text-align: center;
    margin-top: 27px;
}

.conform .user-box {
    position: relative;
}

.conform .user-box input,
.conform .user-box textarea {
    width: 87%;
    padding: 10px 0;
    font-size: 16px 'Lato';
    color: #fff;
    margin-bottom: 30px;
    border: none;
    border-bottom: 1px solid #fff;
    outline: none;
    background: transparent;
}

.conform .user-box label {
    position: absolute;
    top: 0;
    left: 0;
    padding: 10px 0;
    font-size: 16px;
    color: #ccc;
    pointer-events: none;
    transition: .5s;
}

.conform .user-box input:focus ~ label,
.conform .user-box input:valid ~ label,
.conform .user-box textarea:focus ~ label,
.conform .user-box textarea:valid ~ label {
    top: -20px;
    left: 0;
    color: white !important;
    font-size: 16px;
}

.conform form a {
    display: inline-block;
    padding: 10px 20px;
    color: white;
    font-size: 16px 'Lato';
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    transition: .5s;
    margin-top: 20px;
    letter-spacing: 4px;
    border: 2px solid white;
    border-radius: 4px;
   margin-bottom: 20px;
}

.conform form a:hover {
    background-color: white;
    color: #000;
}
  .conform{
    background-color: black;
  }
 
.btn {
    display: inline-block;
    padding: 10px 20px;
    color: white !important;
    font-size: 16px;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    transition: .5s;
    margin-top: 40px;
    letter-spacing: 4px;
    border: 2px solid white !important;
    border-radius: 4px;
    background-color: #000;
}

.btn:hover {
    background-color: white !important;
    color: #000 !important;
    border: 2px solid black !important;
}
.footerSocial ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

 .footerSocial ul li {
    margin-right: 37px;
}
.footerSocial ul li:last-child {
    margin-right: 0;
}

.footerSocial ul li a {
    opacity: .75;
    display: block;
}

.footerSocial ul li a:hover {
    opacity: 1;
}

.footerMain .footerTop .leftPan .addressInfo .footerSocial ul li a img {
    width: 100%;
    height: auto;
}
/*--------------------footer------*/
.btn-footer {
    display: inline-block;
    padding: 10px 20px;
    color: white;
    font-size: 16px;
    text-decoration: none !important;
    text-transform: uppercase;
    overflow: hidden;
    transition: .5s;
    margin-top: 40px;
    letter-spacing: 4px;
    border: 2px solid white;
    border-radius: 4px;
    background-color: black;
}

.btn-footer:hover {
    background-color: white;
    color: #000;
    border: 2px solid black;
}

.social-icons {
    margin-top: 20px;
}

.social-icons a {
    display: inline-block;
    color: #fff;
    font-size: 24px;
    margin-right: 10px;
    transition: color 0.3s;
}

.social-icons a:hover {
    color: #0288d1;
}
.social{
    background-color: #000;
    color: white;
}
.social-contents{
    margin-top: 60px;
}
@media (max-width:992px){
    .social-contents{
        margin-top: 25px;
    } 
}
.social-contents h3{
    margin-top: 20px;
}
.imageBox img {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: bottom;
    object-position: bottom;
    max-height: 94vh;
   padding-right: 0px !important; 
    padding-left: 0px !important;
}





.privacyFooter {
   /* Adjust margin as needed */
}
.footer-copyright-menu {
    list-style: none; /* Remove default list decoration */
    padding: 0;
    margin: 0;
    font-size: 12px;
}

.footer-copyright-menu li {
    display: inline-block;
    margin-right: 20px; /* Adjust spacing between menu items */
}

.footer-copyright-menu li a {
    text-decoration: none; /* Remove underline from links */
    color: #333; /* Set default color */
    transition: color 0.3s; /* Add transition for color change */
}

.footer-copyright-menu li a:hover {
    color: #03e9f4; /* Change color on hover */
}
.footer-bottom .privacyFooter {
    color: #232636;
    width: 33.333333%;
    margin-bottom:0px;
    margin-top: 9px;
}
.footer-bottom .privacyFooter ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.footer-bottom.privacyFooter ul li {
    font-size: 16px !important;
    line-height: 26px;
}

 .footer-bottom .privacyFooter ul li::after {
    content: "|";
    padding: 0 0px;
    font-size: 16px;
}

 .footer-bottom .privacyFooter ul li:last-child:after {
    content: normal;
}

 .footer-bottom .privacyFooter ul li a {
    color: #232636;
    opacity: .7;
}

.footer-bottom .privacyFooter ul li a:hover {
    opacity: 1;
}

 .footer-bottom .copyRight {
    text-align: center;
    width: 33.333333%;
    margin-top:9px;
}


.footer-bottom .copyRight p {
    font-size: 12px;
    line-height: 26px;
    color: #232636;
    opacity: .7;
}

.footer-bottom .madeWith {
    text-align: right;
    width: 33.333333%;
}


 .footer-bottom .madeWith i {
    margin: 0 6px;
    display: inline-block;
    vertical-align: middle;
}

 .footer-bottom .madeWith i img {
    width: 12px;
    height: auto;
}

 .footer-bottom .madeWith span:after {
    content: "|";
    padding: 0 0px;
}

 .footer-bottom .madeWith p {
    font-size: 12px;
    line-height: 26px;
    color: #000;
    opacity: .7;
}

 .footer-bottom .madeWith p a img {
    display: inline-block;
    vertical-align: middle;
}
@media (max-width: 767px){
.for-desc{
    display:none !important;
}
.footer-bottom .copyRight {
    width: 100%;
    text-align: left !important;
}
}
@media (min-width: 768px){
.for-mobile{
    display:none;
}
.footer-copyright-menu li {
   
    margin-right: 0px;
}
}
@media (max-width: 575px) {
    .footer-bottom .privacyFooter {      
        width:100% !important;
        
    }

    .footer-copyright-menu li {
      
        margin-right: 0px !important; 
    }
   
}



@media (min-width: 768px) and (max-width: 991px) {
    .alert1 {
        
        margin-right: 40% !important; 
       
    }

    .carousel-item .content {
      margin-top: -50px;
       
      }
      .courow{
        height: 700px;
      }
      .courow img{
        height: 500px;
      } 
  }

  @media  (max-width: 767px) {
    .alert1 {
        
      /*  margin-right: 70% !important; */
       
    }
    .hoverable-button1 {
       
        padding: 7px 20px;
        
    }
    .hoverable-button2 {
       
        padding: 7px 20px;
        
    }

  }
  @media  (min-width: 768px) {
    .mobimgslide {
        
       display:none;
       
    }
    /*.foot2{
        display: none;
    }*/
  }
  @media  (max-width: 767px) {
    .carousel-item img {
        max-height: 700px;
        width: 100%;
        object-fit: cover;
        /* padding-top: 50px;
        padding-bottom: 50px; */
         margin-left: 0px; 
    }
    .carousel-control-prev-icon {
        margin-right: 0%;
    }
    .carousel-control-next-icon {
        margin-left: 0%;
    }
    .imgslide {
        
       display:none; 
       
    }
   /* .foot1{
        display: none;
    } */
    .mobimgslide {
    background-color:#f2fbfe !important;
    }
    .carousel-item .content{

    }
  }
  @media (min-width:320) and (max-width: 323) {

  }

  /************************************contactus.php*************************************/
  .sectionHead{
    margin-top:60px
}
.sectionHead h1{
    font-weight: 100px !important;
}
  .form-group {
    margin-bottom: 15px;
}

label {
    font-weight: bold;
}
/*
.conform{
   max-width: 100%;
}*/
.form-control {
   /* width: 100%;*/
    padding: 8px;
    font-size: 16px;
    border: 1px solid #ced4da;
    border-radius: 4px;
}

textarea.form-control {
    resize: vertical; /* Allow vertical resizing of textarea */
}

.btn-primary {
    background-color: #007bff;
    color: black;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    border-radius: 4px;
    font-size: 16px;
}

.btn-primary:hover {
    background-color: #0056b3;
}


.formcon {
  
  /* width: 500px;*/
    margin-left: 40px;
  }
  
  .conform1 h2 {
    margin: 0 0 30px;
    padding: 0;
    color: black;
    text-align: center;
    margin-top: 27px;
}

.conform1 .user-box {
    position: relative;
}

.conform1 .user-box input,
.conform1 .user-box textarea {
    width: 87%;
    padding: 10px 0;
    font-size: 16px 'Lato';
    color: black;
    margin-bottom: 30px;
    border: none;
    border-bottom: 1px solid black;
    outline: none;
    background: transparent;
}

.conform1 .user-box label {
    position: absolute;
    top: 0;
    left: 0;
    padding: 10px 0;
    font-size: 16px;
    color: black;
    pointer-events: none;
    transition: .5s;
}

.conform1 .user-box input:focus ~ label,
.conform1 .user-box input:valid ~ label,
.conform1 .user-box textarea:focus ~ label,
.conform1 .user-box textarea:valid ~ label {
    top: -20px;
    left: 0;
    color: black;
    font-size: 16px;
}

.conform1 form .buttonn {
    display: inline-block;
    padding: 10px 20px;
    color: #03e9f4;
    font-size: 16px 'Lato';
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    transition: .5s;
    margin-top: 20px;
    letter-spacing: 4px;
    border: 2px solid #03e9f4;
    border-radius: 4px;
   margin-bottom: 20px;
}

.conform1 form .buttonn:hover {
    background-color: #03e9f4;
    color: #000;
}
  .conform1{
    background-color: white;
  }
  .btn2 {
    display: inline-block;
    padding: 10px 20px;
    color: white;
    font-size: 16px;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    transition: .5s;
    margin-top: 40px;
    margin-bottom:30px ;
    letter-spacing: 4px;
    border: 2px solid white;
    border-radius: 4px;
    background-color: #000;
}

.btn2:hover {
    background-color: black !important;
    color: white !important;
    border:0px solid white !important;
}
.btn {
    display: inline-block;
    padding: 10px 20px;
    color: #03e9f4;
    font-size: 16px;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    transition: .5s;
    margin-top: 40px;
    letter-spacing: 4px;
    border: 2px solid #03e9f4;
    border-radius: 4px;
    background-color: #000;
}

.btn:hover {
    background-color: #03e9f4;
    color: #000;
}
.button-containers1 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom:35px;
    margin-top: 25px;
   
  /*  height: 100vh; /* Adjust as needed */
  }
  
  /* Style for the hoverable button */
  .hoverable-button3 {
    background-color: black; 
   /* border: 2px solid black; /* Green border */
   /* border:black;*/
    color:white;
    padding: 10px 29px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
   /* margin: 4px 2px;*/
    cursor: pointer;
    border-radius: 0px;
    transition: background-color 0.3s ease, border-color 0.3s ease; 
    
  }
  
  /* Hover effect */
  .hoverable-button3:hover {
    background-color:White; /* Darker green */
    color:black;
    
  }
  .border{
    border-style: thin !important;
    border-width:2px !important;
    border-color:black !important ;
  }

.concontent {
    margin-top: 0px;
   
}
.con-title{
    margin-top: 80px;
    font-size: 21px !important;
}

.contact .info {
   /* width: 100%; */
    background: #fff;
    margin-left: 20%;
  }
  
  .contact .info i {
    font-size: 20px;
    color: #2E92C4;
    float: left;
    width: 44px;
    height: 44px;
    background: #b1d8ec;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    transition: all 0.3s ease-in-out;
   /* margin-left: 40px; */
  }
  
  .contact .info h4 {
    padding: 0 0 0 60px;
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 5px;
    color: #2a2c39;
   /* margin-left: 60px; */
  }
  
  .contact .info p {
    padding: 0 0 0 60px !important;
    margin-bottom: 0 !important;
    font-size: 16px !important;
    color: #555974 !important;
   /* margin-left: 60px !important; */
  }
  
  .contact .info .email, .contact .info .phone {
    margin-top: 20px;
    text-align: left;
  }
  .contact .info .address{
    text-align: left;
  }
  .contact .info .email:hover i, .contact .info .address:hover i, .contact .info .phone:hover i {
    background: #2E92C4;
    color: #fff;
  }

  .card {
    border: 1px solid #ccc; /* Optional: Customize border */
    border-radius: 8px; /* Optional: Rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Optional: Shadow */
    margin-bottom: 20px; /* Optional: Margin bottom */
  /*  margin-left: 70px ;
    margin-right: 70px ; */
    margin-top: 30px;
}
.card-body {
    padding: 20px; /* Adjust padding as needed */
}

blockquote::before {
    content: "“";
    font-style: normal;
    padding-right: 3px;
}

blockquote::after {
    content: " ”";
    font-style: normal;
}
.profile-img {
    margin-bottom: 15px; /* Adjust margin as needed */
}

.profile-img img {
    width: 100px; /* Adjust image size */
    height: 100px; /* Adjust image size */
    object-fit: cover; /* Ensure the image covers the circle */
    border-radius: 50%; /* Create a circular shape */
    border: 3px solid #fff; /* Optional: Add border around the image */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Optional: Add shadow for depth */
}

blockquote {
    font-size: 18px; /* Adjust font size */
    font-style: italic; /* Italicize the quote */
    margin-top: 20px; /* Adjust top margin */
    color: #555; /* Optional: Adjust text color */
}

.map .card1 {
    border: 1px solid #ccc; /* Optional: Customize border */
    border-radius: 8px; /* Optional: Rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Optional: Shadow */
    margin-bottom: 20px; /* Optional: Margin bottom */
   
}
.map .card-body {
    padding: 20px; /* Adjust padding as needed */
}
.footsocial .faceicon, .twittericon, .instagramicon, .linkedinicon, .youtubeicon{
padding-left:40px;
}
.footsocial{
    margin-top: 95px;
    margin-bottom: 20px;
}
@media (max-width:991px) {
    .footer-bottom{
       
    }
}
/*
@media (min-width:381px) and (max-width:500px){
    .card {
        
        margin-left: 40px;
        margin-right: 40px;
        
    }
} 
@media (min-width:320px) and (max-width:380px)  {
    .card {
        
        margin-left: 28px;
        margin-right: 18px;
        
    }
}
    */
    /*----------------------------consulting page-------------------------------*/
   .consulting{
        margin-top:150px;
       
    }
    
    .consulting-service .consulting h5{
        letter-spacing: 3px;
    }
    .consulting-service .consulting h1 {
        line-height: 60px; 
    }
    .consulting-category-wrapper .consulting-category-card {
        height: 100%;
        min-height: 360px;
        background-color: #efefef;
    }
    .consulting-category-wrapper .consulting-category-card a {
        display: block;
        width: 100%;
        height: 100%;
        padding: 45px;
    }
    .consulting-category-wrapper .consulting-category-card a p {
        color: #000;
    }

    .consulting-category-wrapper .consulting-category-card a .holder {
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .consulting-category-wrapper .consulting-category-card a .holder .d-flex .checkbox-square span {
        width: 20px;
        min-width: 20px;
        height: 20px;
        border: 2px #000 solid;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        position: relative;
        z-index: 0;
    }

    .consulting-category-wrapper .consulting-category-card a .holder .d-flex .checkbox-square span:after {
        z-index: 0;
        content: "";
        position: absolute;
        display: block;
        width: 8px;
        height: 4px;
        border-width: 0 0 2px 2px;
        border-style: solid;
        border-color: rgba(0,0,0,0);
        inset: 0;
        bottom: 3px;
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        margin: auto;
    }

    .consulting-category-wrapper .consulting-category-card a .holder .d-flex .checkbox-label p {
        font-size: 24px;
        font-weight: bold;
        line-height: 1.33;
        padding-left: 25px;
        margin-top: -7px;
    }

    .consulting-category-wrapper .consulting-category-card a .holder .data-bottom .consulting-text p {
        font-size: 16px;
        letter-spacing: 3.4px;
        margin: 0;
        text-transform: uppercase;
    }
    .custom-link {
    text-decoration: none; /* Removes underline */
    color: inherit; /* Ensures link text color inherits from parent */
}

.custom-link:hover {
    text-decoration: none; /* Ensures no underline on hover */
    color: inherit; /* Ensures link text color remains the same on hover */
}

.Enterprise-card{
    padding-left: 53px !important;
}
.Startup-card{
    padding-right: 53px;
}
.category-card{
    margin-top: 70px;
    margin-bottom: 100px;
}
@media (max-width:767px){
    .Enterprise-card{
        padding-left: 20px !important;
        padding-right: 20px;
    }
    .Startup-card{
        padding-left: 20px !important;
        padding-right: 20px;
        margin-top: 20px;
    }
    .consulting-service .consulting h1 {
        line-height: 60px; 
    }
}

/*---------------------------------------------------------Web-design---------------------------------*/


.nyc-banner-wrapper .service-banner-content-holder .title .btn {
    margin-top: 35px;
}
.service-image-banner-wrapper {
    padding-top: 100px;
}

@media (max-width: 1199.98px) {
    .service-image-banner-wrapper {
        padding-top:140px;
    }
}

@media (max-width: 991.98px) {
    .service-image-banner-wrapper {
        padding-top:110px;
    }
}

.service-image-banner-wrapper .service-banner-content-holder .title h1 {
    line-height: 1.3;
    letter-spacing: .5px;
    font-weight: 700;
    color: #fff;
}
.service-image-banner-wrapper .service-banner-content-holder .title h1 small {
    display: block;
}

.service-image-banner-wrapper .service-banner-content-holder .title p {
    margin-top: 35px;
    color: #fff;
}

@media (max-width: 1199.98px) {
    .service-image-banner-wrapper .service-banner-content-holder .title p {
        margin-top:0;
    }
}
.bgImage {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.align-items-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}


.conform-web h2 {
    margin: 0 0 30px;
    padding: 0;
    color: white;
    text-align: center;
    margin-top: 27px;
}

.conform-web .user-box {
    position: relative;
}

.conform-web .user-box input,
.conform-web .user-box textarea {
    width: 87%;
    padding: 10px 0;
    font-size: 16px 'Lato';
    color: white;
    margin-bottom: 30px;
    border: none;
    border-bottom: 1px solid white;
    outline: none;
    background: transparent;
}

.conform-web .user-box label {
    position: absolute;
    top: 0;
    left: 0;
    padding: 10px 0;
    font-size: 16px;
    color: white;
    pointer-events: none;
    transition: .5s;
}

.conform-web .user-box input:focus ~ label,
.conform-web .user-box input:valid ~ label,
.conform-web .user-box textarea:focus ~ label,
.conform-web .user-box textarea:valid ~ label {
    top: -20px;
    left: 0;
    color: white;
    font-size: 16px;
}

.conform-web form a {
    display: inline-block;
    padding: 10px 20px;
    color: #03e9f4;
    font-size: 16px 'Lato';
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    transition: .5s;
    margin-top: 20px;
    letter-spacing: 4px;
    border: 2px solid #03e9f4;
    border-radius: 4px;
   margin-bottom: 20px;
}

.conform-web form a:hover {
    background-color: #03e9f4;
    color: #000;
}
  .conform-web{
    background-color: black;
    margin-bottom: 30px;
  }

  .web-hoverable-button {
    background-color: white; 
   /* border: 2px solid black; /* Green border */
   /* border:black;*/
    color:black;
    padding: 8px 23px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
   /* margin: 4px 2px;*/
    cursor: pointer;
    border-radius: 0px;
    transition: background-color 0.3s ease, border-color 0.3s ease; 
    margin-top: 5px;
  }
  
  /* Hover effect */
  .web-hoverable-button:hover {
    background-color:black; /* Darker green */
    color:white;
    text-decoration: none;
    border:2px solid white;
  }

  .button-container-web {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom:35px;
    margin-top: 10px;
   
  /*  height: 100vh; /* Adjust as needed */
  }

  
.section-quality{
    background-color: #f3f5f6;
   
 }
 .qualityhead{
     padding-top:70px;
 }
 .qualitycontent{
     margin-top: 40px;
 }  
 .quality-separate-content{
     margin-top: 20px;
 }

 
.listWrap {
    margin-bottom: -15px;
}

 .listWrap .listItem1 {
    margin-bottom: 30px;
}

.listWrap .listItem1 .listInner {
    height: 100%;
    background-color: #fff;
    padding: 35px 30px 37px;
}


 .listWrap .listItem1 .listInner h3 {
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 18px;
    font-weight: 700;
}

.listWrap .listItem1 .listInner p {
    font-size: 16px;
    line-height: 1.5;
}
.quality-btn{
    margin-top:20px;
    margin-bottom: 30px;
    text-decoration: none !important;
}
.web-design-message-wrapper {
    position: relative;
}

.web-design-message-wrapper .sectionHead {
    max-width: 500px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

@media (max-width: 991.98px) {
    .web-design-message-wrapper .sectionHead {
        max-width:100%;
    }
}

.web-design-message-wrapper .sectionHead p {
    margin-top: 30px;
}

@media (max-width: 991.98px) {
    .web-design-message-wrapper .sectionHead p {
        margin-top:15px;
    }
}

.web-design-message-wrapper .sectionHead p a {
    text-decoration: underline;
}

.web-design-message-wrapper .sectionHead p a:hover {
    text-decoration: none;
}

.web-design-message-wrapper .scroll-data {
    position: absolute;
    inset: 0;
    padding: 45px 0;
    max-width: 80%;
    margin: 0 auto;
}

@media (max-width: 991.98px) {
    .web-design-message-wrapper .scroll-data {
        display:none;
    }
}

.web-design-message-wrapper .scroll-data p {
    font-size: 130px;
    line-height: 2;
    color: rgba(0,0,0,.5);
    opacity: .1;
    font-weight: bold;
    margin-top: -145px;
}

@media (max-width: 1199.98px) {
    .web-design-message-wrapper .scroll-data p {
        font-size:110px;
    }
}

.web-design-message-wrapper .scroll-data p:nth-child(1),.web-design-message-wrapper .scroll-data p:nth-child(3) {
    text-align: left;
}

.web-design-message-wrapper .scroll-data p:nth-child(2) {
    text-align: right;
}
.nyc-mobile-first-wrapper .sectionHead {
    padding-right: 50px;
}

.nyc-mobile-first-wrapper .sectionHead h2 {
    margin-bottom: 25px;
}

@media (max-width: 991.98px) {
    .nyc-mobile-first-wrapper .sectionHead h2 {
        margin-bottom:15px;
    }
}

.nyc-mobile-first-wrapper .sectionHead span {
    display: block;
    margin-bottom: 30px;
    letter-spacing: 4px;
    font-weight: 700;
    text-transform: uppercase;
    margin-top: 30px;
}

.nyc-mobile-first-wrapper .row {
    margin-bottom: -30px;
}

.nyc-mobile-first-wrapper .row [class*=col-] {
    margin-bottom: 30px;
}

.nyc-mobile-first-wrapper .design-box {
  /*  height: 100%;*/
    aspect-ratio: 1;
}

.nyc-mobile-first-wrapper .design-box .web-design-proces {
    height: 100%;
    position: relative;
  /*  margin-top: 85px;*/
    
}

.nyc-mobile-first-wrapper .design-box .web-design-proces .design-proce-box {
    position: absolute;
    bottom: 0;
    left: 0;
}

.nyc-mobile-first-wrapper .design-box .web-design-proces .design-proce-box:nth-child(1) {
    border: 6px solid #000;
    width: 20%;
    height: 60%;
    z-index: 3;
    background: #fff;
}

.nyc-mobile-first-wrapper .design-box .web-design-proces .design-proce-box:nth-child(2) {
    border: 6px solid #787878;
    position: absolute;
    width: 45%;
    height: 75%;
    z-index: 2;
}

.nyc-mobile-first-wrapper .design-box .web-design-proces .design-proce-box:nth-child(3) {
    border: 6px solid #bfbfbf;
    width: 100%;
    height: 88%;
    z-index: 1;
}

.section-scroll-data{
    margin-top:40px;
}
.scrolldata{
   margin-bottom: 30px;
}
.section-design-proce-box{
    margin-top: 160px;
    background-color: #efefef;
    margin-bottom: 110px !important;
}



.designPrincipl {
    background-color: #efefef;
}

.designPrincipl [class*=col-] {
    margin-bottom: 30px;
}

@media (max-width: 1199.98px) {
    .designPrincipl [class*=col-] {
        margin-bottom:0;
    }
}

@media (max-width: 1199.98px) {
    .designPrincipl .sectionHead {
        margin-bottom:30px;
    }
}

.designPrincipl .sectionHead h2 {
    margin-bottom: 20px;
}

@media (max-width: 1199.98px) {
    .designPrincipl .lineWrap {
        display:-webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin-bottom: 30px;
       
    }
}
@media (min-width: 320px)and(max-width: 420px){
  /*  .designPrincip .lineWrap{
padding-left: 30px;
    }
*/
    .designPrincipl .lineWrap ul li:nth-child(10) {
       
        display: none !important;
    }
    
}
.designPrincipl .lineWrap ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 260px;
}

.designPrincipl .lineWrap ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 260px;
    -ms-flex-positive: 1;
    max-width: 100%;
    -ms-flex-item-align: center;
    align-self: center;
    margin-right: 20px;
    width: 14px;
    line-height: 14px;
    opacity: 0;
    -webkit-animation: lineWrapAnim .3s ease-in forwards;
    animation: lineWrapAnim .3s ease-in forwards;
}

@media (max-width: 479.98px) {
    .designPrincipl .lineWrap ul li {
        margin-right:12px;
    }
}

@-webkit-keyframes lineWrapAnim {
    0% {
        opacity: 0;
        -webkit-transform: scale(1) translate3d(0,0,0);
        transform: scale(1) translate3d(0,0,0);
    }

    50% {
        opacity: .5;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    80% {
        opacity: .8;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1) translate3d(0,0,0);
        transform: scale(1) translate3d(0,0,0);
    }
}

@keyframes lineWrapAnim {
    0% {
        opacity: 0;
        -webkit-transform: scale(1) translate3d(0,0,0);
        transform: scale(1) translate3d(0,0,0);
    }

    50% {
        opacity: .5;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    80% {
        opacity: .8;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1) translate3d(0,0,0);
        transform: scale(1) translate3d(0,0,0);
    }
}

.designPrincipl .lineWrap ul li:first-child {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: 13px;
    letter-spacing: 4px;
    visibility: visible;
}

.designPrincipl .lineWrap ul li:nth-child(2) {
    background-color: #000;
    height: 135px;
    -webkit-animation-delay: .2s;
    animation-delay: .2s;
}

.designPrincipl .lineWrap ul li:nth-child(3) {
    background-color: #000;
    height: 105px;
    -webkit-animation-delay: .5s;
    animation-delay: .5s;
}

.designPrincipl .lineWrap ul li:nth-child(4) {
    background-color: #000;
    height: 75px;
    -webkit-animation-delay: .75s;
    animation-delay: .75s;
}

.designPrincipl .lineWrap ul li:nth-child(5) {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: 13px;
    letter-spacing: 4px;
    -webkit-animation-delay: .1s;
    animation-delay: .1s;
}

.designPrincipl .lineWrap ul li:nth-child(6) {
    height: 75px;
    background-color: #000;
    -webkit-animation-delay: 1.25s;
    animation-delay: 1.25s;
}

.designPrincipl .lineWrap ul li:nth-child(7) {
    height: 105px;
    background-color: #000;
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s;
}

.designPrincipl .lineWrap ul li:nth-child(8) {
    height: 135px;
    background-color: #000;
    -webkit-animation-delay: 1.85s;
    animation-delay: 1.85s;
}

.designPrincipl .lineWrap ul li:nth-child(9) {
    background-color: #999;
    height: 165px;
    -webkit-animation-delay: 2.05s;
    animation-delay: 2.05s;
    
}

.designPrincipl .lineWrap ul li:nth-child(10) {
    background-color: #ccc;
    height: 195px;
    -webkit-animation-delay: 2.3s;
    animation-delay: 2.3s;
    display: none;
}

.designPrincipl .lineWrap ul li:nth-child(11) {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: 18px;
    letter-spacing: 4px;
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s;
}

@media (max-width: 991.98px) {
    .designPrincipl .lineWrap ul li:nth-child(11) {
        margin:0;
    }
}

.designPrincipl .web-design-flow-row {
    margin: 0 -5px;
}

@media (max-width: 1199.98px) {
    .designPrincipl .web-design-flow-row>div {
        margin-bottom:10px;
    }
}

.designPrincipl .web-design-flow-row .align-items-center {
    padding: 0 5px;
}

.designPrincipl .web-design-flow-row .align-items-center .holder {
    padding: 40px 25px;
    height: 100%;
    position: relative;
}

@media (max-width: 991.98px) {
    .designPrincipl .web-design-flow-row .align-items-center .holder {
        padding:25px 25px;
    }
}

.designPrincipl .web-design-flow-row .align-items-center .holder .title h3 {
    font-size: 26px;
    line-height: 1.4;
    margin-bottom: 20px;
    font-weight: 400;
}

@media (max-width: 991.98px) {
    .designPrincipl .web-design-flow-row .align-items-center .holder .title h3 {
        font-size:24px;
        line-height: 1.25;
    }
}

.designPrincipl .web-design-flow-row .align-items-center .holder .sub-title {
    padding-bottom: 30px;
}

@media (max-width: 991.98px) {
    .designPrincipl .web-design-flow-row .align-items-center .holder .sub-title {
        padding-bottom:40px;
    }
}

@media (max-width: 767.98px) {
    .designPrincipl .web-design-flow-row .align-items-center .holder .sub-title {
        padding-bottom:0;
    }
}

.designPrincipl .web-design-flow-row .align-items-center .holder .sub-title p {
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 0;
}

.designPrincipl .web-design-flow-row .align-items-center .holder .sub-title span {
    position: absolute;
    bottom: 25px;
    left: 25px;
    font-size: 14px;
    letter-spacing: 3.4px;
    text-transform: uppercase;
}

@media (max-width: 767.98px) {
    .designPrincipl .web-design-flow-row .align-items-center .holder .sub-title span {
        position:static;
        letter-spacing: 2px;
        display: block;
        margin-top: 15px;
    }
}
.designPrincipl.bgWhite {
    background-color: #fff;
}
.holder-black{
    background-color: black;
    color: white;
}
.section-designPrincipl{
    margin-left: 35px;
    margin-right: 35px;
    margin-top: 100px;
}
.section-designPrincipl1{
    margin-left: 50px;
    margin-right: 50px;
}

.profile-imgs {
    margin-bottom: 15px; /* Adjust margin as needed */
}

.profile-imgs img {
    width: 100px; /* Adjust image size */
    height:203px !important; /* Adjust image size */
    object-fit: cover; /* Ensure the image covers the circle */
    border-radius: 50%; /* Create a circular shape */
    border: 0px solid #fff !important; 
    box-shadow: 0 0 0px rgba(0, 0, 0, 0.1) !important; 
}
.carousel-indicators li{
    margin-top: 90px !important;
    border: 1px solid blue !important;
    width: 5px !important;
    height: 5px !important;
    border-radius: 4px !important;
}

.carousel-inner{
    margin-bottom: 20px;
}
.carousel-indicators .active {
    
    background-color: blue !important;
}
.section-head{
    margin-top:90px
}
.class-container{
    padding: 0 15px;
}

.class-container {
    
    margin: 0 auto;
}

@media (min-width: 1280px) {
    .class-container.lg {
        max-width:1280px;
    }
}

@media (max-width: 1399.98px) {
    .class-container {
        max-width:1280px;
    }
}

@media (max-width: 1299.98px) {
    .class-container {
        max-width:1140px;
    }
}

@media (max-width: 1199.98px) {
    .class-container {
        max-width:960px;
    }
}

@media (max-width: 991.98px) {
    .class-container {
        max-width:720px;
    }
}

@media (max-width: 767.98px) {
    .class-container {
        max-width:100%;
    }
}

@media (max-width: 575.98px) {
    .class-container {
        max-width:100%;
    }
}
.section-quality{
   
    margin-top: -84px !important;
 }
 .b-color{
    background-color: #efefef !important;
 }
 /*
 .carousel-indicators li {
    box-sizing: content-box;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 5px;
    height: 5px;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #fff;
    background-clip: padding-box;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    opacity: .5;
    transition: opacity .6s ease;
}*/
.design-box {
  background-color: #f0f0f0;
  padding: 20px;
  margin-bottom: 20px;
}

.web-design-process {
  display: flex;
  justify-content: space-around;
}

.design-proce-box {
  width: 50px;
  height: 50px;
 /* background-color: #007bff; */
  border-radius: 8px;
}

.fonticons {
    color: #007bff;
    font-size: 30px;
}
.sofservice {
    background-color: #dad9d9;
} 
.softservices {
    padding-top: 20px;
}
/*footer*/
section#team {
    background-color: #f2fbfe;
    padding-top: 10px;
    padding-bottom: 20px;
}
div#who {
    padding-top: 20px;
}
@media screen and (min-width: 320px) and (max-width:991px){
    #grad1 {
        height: 150px;
        background-image: linear-gradient(to right, rgb(30, 91, 154), rgb(21, 38, 67)) !important;
        padding-bottom: 20px !important;
    }
    .carousel-control-next {
        right: -17px;
    }
    .carousel-control-prev {
        left: -17px;
    }
    div#who {
        padding-top: 0px;
    }
    
}
@media screen and (min-width: 320px) and (max-width:388px)
{
    h4.titleimg {
        margin-top: -15px;
    } 
}
  
#grad1 {
    height: 150px;
    /* background-color: red; For browsers that do not support gradients */
    background-image: linear-gradient(to right, #F2FBFE, #1E5B9A,#152643);
  }
  
  .col-md-7.col-sm-12.sectionInner.d-flex.flex-wrap.align-items-center.textBox.alert1 {
    color: white;
}
div#scrollbut {
    margin-bottom: 120px !important;
}
.navbar-light .navbar-nav .nav-link {
    color: rgb(0 0 0);
}

a#navbarDropdownMenuLink
{
    color: rgb(0 0 0);
}
a#navbarcolor {
    color: black;
}
a#companyDropdownMenuLink {
    color: black;
}
.border {
    border: 1px solid #000000 !important;
}

/*  */
.dropdown-item {
    width: 300px;
    display: flex;
    align-items: center;
    padding: 10px 20px;
    text-decoration: none;
    color: #000;
    position: relative;
}
.dropdown-item .line {
    display: inline-block;
    width: 5px;
    height: 1px;
    background-color: #000;
    transition: width 0.3s ease;
    margin-right: 10px;
}
.dropdown-item:hover .line {
    width: 15px;
}
#drop {
    width: 200px;
}
@media(min-width: 320px) and (max-width: 767px) {
    #navbarNavDropdown {
        display: none;
    }
    .fixed-top {
        background-color: white;
    }
}
.cover-page {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    color: white;
    z-index: 99999;
    padding: 20px;
    box-sizing: border-box;
    overflow: hidden;
}
.close-button {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 10px 20px;
    background-color: white;
    color: black !important;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}
.dropdown-menu-in-cover {
    background-color: rgba(255, 255, 255, 0.1);
    border: none;
}
.dropdown-item-in-cover {
    color: white;
    padding: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.button-containeres {
    margin-left: 20px;
}
button.hoverable-button1 .border{
    border: 1px solid black !important;}
}