#hero-3 {
    background-image:  url('../images/steptodown.com397311.jpg') !important;
}
.tech-div{margin-left: 1rem;}
.card-title {font-size: 18px; color: white !important; font-weight: bold;}

.img-1{
    margin-left: 15px;  
    width: 18%; 
    border-radius: 10%;
}
.img-ai{
    margin-left: 3px; 
    padding: 10px; 
    width: 23%; 
    border-radius: 50%;
}
.card-icon{
    display: flex; 
    flex-direction: column;
    align-items: flex-start;
    /* align-items: center; */
    color: white; 
    padding: 15px 0; 
    border-radius: 10px; 
}


.img1-icon{
    margin-left: 12px; 
    padding: 10px 15px; 
    border-radius: 10%; 
    background: #58ADEE; 
    width:18%;
    
}
.img2-icon{
    margin-left: 10px; 
    padding: 10px 15px; 
    border-radius: 10%; 
    background: #16C579; 
	width: 18%;					
}
.img3-icon{
     margin-left: 10px; 
     padding: 10px 15px;
    border-radius: 10%; 
    background: #E189D5; 
    width: 18%;
}


.tech-heading h6{
    font-size: 3rem;
    font-weight: bold;
    padding: 0px 3px 0px 3px;
}

.section-title h1{
    font-size: 60px;
    
}
.case-study-title h1{font-size: 3rem; font-weight: bold;}
.case-study-desc{font-size: 1.5rem;}
.container1{
    display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}
.card-v1
{
    flex: 1 1 300px;       /* default width flex item */
    max-width: 375px;       /* card max-width */
    background: rgba(13, 25, 58, 1);
    border-radius: 10px;
    padding: 15px;
    margin: 0;
    
}
.discuss-card {
    background: #0D193A;
    border-radius: 20px;
    padding: 20px;
    max-width: 47%;
    width: 100%;
}
.container-v1{
    display: flex;
    flex-wrap: wrap;
    justify-content: center; 
    gap: 20px; 
    padding: 20px 0;
    padding-left: 1rem;
    padding-right: 1rem;
}

.footer-grid{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    }
.digit-span{
    font-size:70px; 
    font-weight:700; 
    line-height:1;
    /* color:#be6cbe; */
}




.s-30,
.s-22,
.s-26,
.s-18 ,
.s-50,
.s-24{
    color: white !important;
}

.mb-20 {
    color: white !important; 
}

.p-1,
.s-21,
.s-17{
    color: rgb(211, 208, 208) !important;
}

.show-less {
    color: rgb(211, 208, 208) !important;
}

.review-txt {
    text-align: center;
    color: white !important;
}
.review-ico {
    color: white !important;
}

.fbox-txt {
    color: white !important;
}

.p-md {
    color: white !important;
}

.strong-text {
    color: white !important;
}

#hero-3:after {
    position: absolute;
    content: '';
    z-index: -1;
    width: 100%;
    height: 0%;
    bottom: 0;
    left: 0;
    background-color: #001339 !important;
  }

  .bg--03 {
    background-image: url("https://img.freepik.com/free-photo/artistic-blurry-colorful-wallpaper-background_58702-8553.jpg") !important;
}

.about-info, .service-box {
    /* background-color: #102144; */
    color: white !important;
}

#rw-2-1, #rw-2-2 {
    background-color: transparent;
    color: white !important;
}

.details {
    color: rgb(211, 208, 208) !important;
}

.gr--whitesmoke1 {
    background-image: linear-gradient(180deg, rgba(14, 14, 102, 0.8) 50%, rgba(8, 8, 73, 0.05) 100%);
    background-color:  #001339 !important;
}
#features-11,
#features-12,
#reviews-2 {
    background-color:  #001339 !important;
}

.shape-ico.color--theme path, .shape-ico.color--theme path, .shape-ico.color--theme path {
    fill: #f9f7f7;
}
.btn--theme1 {
    color: #fff !important;
    border-color: #070007 !important;
    background-color: #be6cbe !important;
}
.count-element {
    color: white !important;
}
.card {
    background-color: #153c8c;
    height: 300px;
}

.card {
    background-color: #11244e;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}
.card h2 {
    font-size: 1.5em;
}
.icon {
    font-size: 30px;
    margin-bottom: 10px;
}
#hero-3 {
    background-image:  url('../images/steptodown.com397311.jpg') !important;
}

#loading {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    /* Full viewport height */
    background-color: white;
}

.loader-logo {
    width: 25%;
    animation: fade 2s ease-in-out infinite;
}


.footer2 a:hover {
    color: #F467CA!important;
}





@keyframes fade {

    0%,
    100% {
        opacity: 0.3;
    }

    50% {
        opacity: 1;
    }
}

.topmenu-li-heading strong {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    /* background-color: rgba(244, 244, 249, 1); */
    color: #F467CA;
    font-size: 20px;
}

.project-description .project-txt ul {
    margin-top: 15px;
}

.project-description .project-txt strong {
    font-size: 20px;
}

.tech_images img {
    border-radius: 15px;
}

@media (min-width: 1400px) {
    #hero-3 .container {
        max-width: 1320px !important;
    }
}

@media (min-width: 1200px) {

    #hero-3 .container {
        max-width: 1140px;
    }

    .hero-3-img {
        margin: 0 -65% 0 -60px;
    }

    .wsmenu>.wsmenu-list>li>.wsmegamenu.w-75 ul.link-list>li>a {
        padding-left: 0px !important;
    }

    .wsmenu>.wsmenu-list>li>.wsmegamenu.w-75 ul.link-list>li>a:hover {
        padding-left: 15px !important;
        color: #be6cbe !important;
    }
}

@media (max-width: 1400px) {
    .topmenu-li-text a {
        font-size: 12px !important;
        color: white !important;
    }

    .topmenu-li-heading strong {
        font-size: 12px !important;
    }

}

.video-banner {
  position: relative;
  width: 100%;
  height: 100vh; /* Fullscreen height */
  overflow: hidden;
}

.background-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Cover entire section without distortion */
  z-index: -1; /* Push behind content */
}

.video-overlay {
  position: relative;
  z-index: 1;
  text-align: center;
  color: #fff;
  top: 50%;
  transform: translateY(-50%);
}

.statistic-div{border-right:1px solid white;}


/* VIDEO BANNER CSS STARTS */
@media (max-width: 1279px) {
  .video-banner {
    height: 80dvh;
  }
}

@media (max-width: 1023px) {
  .video-banner {
    height: 70dvh;
  }
}


@media (max-width: 991px) {
  .video-banner {
    height: 60dvh;
  }
}


/* @media (max-width: 768px) {
  .video-banner {
    height: 40dvh;
  } */

  .background-video {
    object-position: left;
  }


/* VIDEO BANNER CSS ENDS */

/* STATISTIC BLOCK STARTS */
 
.text-pink { color: rgba(225,137,213,1); }
/* STATISTIC BLOCK ENDS */



/* NEW VERSION 6 CARDS  */
.chipset-btn {
    display: inline-block;        /* prevents full-width overflow */
    width: auto;                  /* let content size itself */
    max-width: 100%;              /* never exceed card width */
    box-sizing: border-box;       /* include padding and border */
    white-space: normal;          /* allow wrapping */
    word-wrap: break-word;
    border: 1px solid hsl(206, 82%, 64%);
    border-radius: 5px;
    color: hsl(206, 82%, 64%);
    font-size: 14px !important;
    font-weight: 600;
    padding: 8px 12px;            /* adjust horizontal padding */
     margin-top: 2em; 
    text-align: center;
    margin-left: .5rem;
    padding-left: .75rem;
    
}

.chipset-btn:hover{
				background: hsl(206, 82%, 64%);
				color: #0D193A;
                transition: ease-out .25s;
    
}

.fintech-btn{
                    
					
    display: inline-block;        /* prevents full-width overflow */
    width: auto;                  /* let content size itself */
    max-width: 100%;              /* never exceed card width */
    box-sizing: border-box;       /* include padding and border */
    white-space: normal;          /* allow wrapping */
    word-wrap: break-word;
    border: 1px solid hsl(154, 80%, 43%);
    border-radius: 5px;
    color: hsl(154, 80%, 43%);
    font-size: 14px !important;
    font-weight: 600;
    padding: 8px 12px;            /* adjust horizontal padding */
    margin-top: 2em;              /* spacing from text */
    text-align: center;           /* center text inside button */
    margin-left: .5rem;
    padding-left: .75rem;
    margin-top: 2.7rem;
}


.fintech-btn:hover{
                    
					background: hsl(154, 80%, 43%);
                    color: #0D193A;
                    transition: ease-out .25s;
}

.iot-btn{
                    
    display: inline-block;        /* prevents full-width overflow */
    width: auto;                  /* let content size itself */
    max-width: 100%;              /* never exceed card width */
    box-sizing: border-box;       /* include padding and border */
    white-space: normal;          /* allow wrapping */
    word-wrap: break-word;
    border: 1px solid hsl(308, 59%, 71%);
    border-radius: 5px;
    color: hsl(308, 59%, 71%);
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 8px 12px;            /* adjust horizontal padding */
    margin-top: 2em;              /* spacing from text */
    text-align: center;           /* center text inside button */
    margin-left: .5rem;
    padding-left: .75rem;
}
 

.iot-btn:hover{
    background-color: hsl(308, 59%, 71%);
    color: #0D193A;
    transition: ease-out .25s;
}
.cloud-btn {
    display: inline-block;        /* prevents full-width overflow */
    width: auto;                  /* let content size itself */
    max-width: 100%;              /* never exceed card width */
    box-sizing: border-box;       /* include padding and border */
    white-space: normal;          /* allow wrapping */
    word-wrap: break-word;
    border: 1px solid hsl(206, 82%, 64%);
    border-radius: 5px;
    color: hsl(206, 82%, 64%);
    font-size: 14px !important;
    font-weight: 600;
    padding: 8px 12px;            /* adjust horizontal padding */
     margin-top: 2.2em; 
    text-align: center;
    margin-left: .5rem;
    padding-left: .4rem;
    
}

.cloud-btn:hover{
				background: hsl(206, 82%, 64%);
				color: #0D193A;
                transition: ease-out .25s;
    
}

.data-btn{
                    
					
    display: inline-block;        /* prevents full-width overflow */
    width: auto;                  /* let content size itself */
    max-width: 100%;              /* never exceed card width */
    box-sizing: border-box;       /* include padding and border */
    white-space: normal;          /* allow wrapping */
    word-wrap: break-word;
    border: 1px solid hsl(154, 80%, 43%);
    border-radius: 5px;
    color: hsl(154, 80%, 43%);
    font-size: 14px !important;
    font-weight: 600;
    padding: 8px 12px;            /* adjust horizontal padding */
    margin-top: 2em;              /* spacing from text */
    text-align: center;           /* center text inside button */
    margin-left: .5rem;
    padding-left: .75rem;
    margin-top: .75rem;
}
.data-btn:hover{
                    
					background: hsl(154, 80%, 43%);
                    color: #0D193A;
                    transition: ease-out .25s;
}
.devops-btn{
                    
    display: inline-block;        /* prevents full-width overflow */
    width: auto;                  /* let content size itself */
    max-width: 100%;              /* never exceed card width */
    box-sizing: border-box;       /* include padding and border */
    white-space: normal;          /* allow wrapping */
    word-wrap: break-word;
    border: 1px solid hsl(308, 59%, 71%);
    border-radius: 5px;
    color: hsl(308, 59%, 71%);
    font-size: 14px !important;
    font-weight: 600;
    padding: 8px 12px;            /* adjust horizontal padding */
    margin-top: 1.3em;              /* spacing from text */
    text-align: center;           /* center text inside button */
    margin-left: .5rem;
    padding-left: .75rem;
}
 

.devops-btn:hover{
    background-color: hsl(308, 59%, 71%);
    color: #0D193A;
    transition: ease-out .25s;
}
.discuss-btn{
                    
    display: block;        /* prevents full-width overflow */
    width: auto;                  /* let content size itself */
    max-width: 80%;              /* never exceed card width */
    box-sizing: border-box;       /* include padding and border */
    white-space: normal;          /* allow wrapping */
    word-wrap: break-word;
    border: 1px solid hsl(308, 59%, 71%);
    border-radius: 5px;
    color: hsl(308, 59%, 71%);
    font-size: 20px !important;
    font-weight: 600;
    padding: 8px 12px;            /* adjust horizontal padding */
    margin-top: 1.3em;              /* spacing from text */
    text-align: center;           /* center text inside button */
    margin-left: .5rem;
    padding-left: .75rem;
}
 

.discuss-btn:hover{
    background-color: hsl(308, 59%, 71%);
    color: #0D193A;
    transition: ease-out .25s;
}
/* FOOTER a TAGS HOVER EFFECTS  */
.ryadh-tel:hover,
.about-us:hover,
.our-services:hover,
.our-tech:hover,
.contact-us:hover,
.terms-of-use:hover,
.privacy-policy:hover,
.cookie-policy:hover,
.info-mail:hover,
.toll-free:hover,
.direct-call:hover,
.tel:hover {
  color: #be6cbe !important;
}

.footer-logo{width: 23vw;}
.footer-content{margin-left: 5vw;}
.footer-text{color: white; }
.ryadh-tel{margin-left: 22px;}
/* ======================================= My Css =================================================== */


/*=========================================================== MEDIA QUERY FOR 320px - 576px PHONES */
@media screen and (min-width: 300px) and (max-width: 576px) {
.section-title h1{font-size: 27px;}
.statistic-div{border-right: none !important;} /* HIDE BORDER */

.digit-span{font-size: 40px;}

.custom-2{margin-top: 1rem;}

/* .tech-sub-1{font-size: .5rem;} */

    
  footer .global-heading {
    font-size: 13px !important;
  }

  footer li 
{
    font-size: 10px !important;
     margin: 0 !important;
    padding: 0 !important;
}

  footer .ryadh-tel{font-size: 10px !important;}
  
    footer .footer-logo 
{
    width: 36vw;
    margin-left: .3rem;
}
 
  .global-location-icon{display: none;}
 
 .footer-content
 {
    overflow-x: auto;
    margin-left: 0;
    padding: 0;
    gap: 0;
 }

 .footer-grid{gap: 0;}
 .global-location-text{font-size: 7px;}
 .footer-grid li{padding: 0; margin: 0;}
 .legal-div{margin-left: 15px;}
 .connect-div{margin-left: 15px;}
 .company-div{margin-left: 15px;}
 .global-div{margin-left: 15px;}
 .ryadh-tel{margin-left: 0px;}

 .img-1, /* ICONS */
 .img-ai
{
    margin-left: auto;
    width: 20%;
}

.br-1{display: none;} /* JUST REMOVING BR TAG */


.card-header /* DIV COTAINNG ICONS & H2 WHEN MEDIA QUERY HITS */
{ 
    flex-direction: row; 
    justify-content: space-between; 
    align-items: center;
}

.tech-heading h6 /* LEFT TEXT OF TECH SOLUTIONS DIV */
{
    font-size: 27px;
    margin: 0 1.3rem 0 auto;
    text-align: center;            
    padding: 0 1rem;               
    word-wrap: break-word;         
}

.tech-heading h6 b {display: inline-block;} /* LEFT TEXT OF TECH SOLUTIONS DIV */
            
.tech-div p{display: none;} /* LEFT TEXT OF TECH SOLUTIONS DIV */


.top-row /* DIV COTAINNG ICONS & H2 WHEN MEDIA QUERY HITS */
{
    display: flex;
    align-items: center;
    gap: 10px;
    
}

.img1-icon /* 6 ICONS IN CORE SERVICES CARDS */
{
    width: 60px;
    margin-left: 0;
}

    .top-row h2 {flex: 1;} /* DIV COTAINNG ICONS & H2 WHEN MEDIA QUERY HITS */

    .card-title{ font-size: 20px;} /* H2 HADINGS BELOW ICONS */

    .chipset-btn{ /* READ MORE BUTTONS */
        width: 100%; 
        margin-top: 15px;   
        margin-left: 0;
    }
    
    .fintech-btn, /* READ MORE BUTTONS */
    .data-btn
    {
        width: 100%; 
        margin-top: 15px;
        margin-left: 0;
        padding-left: 0;
        
    }
    .iot-btn, /* READ MORE BUTTONS */
    .devops-btn,
    .cloud-btn
    {
        width: 100%;
        margin-left: 0;
        padding-left: 0;
    }
    .discuss-btn /* LETS BUILD SOMETHING GREAT TOGETHER BUTTON */
    {
        margin-left: auto;   
        margin-right: auto;   
        font-size: 12px !important; 
        margin-top: 0 !important;
    }
    
    
    .card-v1
    {
        flex: 1 1 100%;
        max-width: 100%;   
    }
    .discuss-card
    {
        flex: 1 1 100%;
        max-width: 94%;
        margin-left: 1rem; 
    }
    .tech-div{margin-left: .5rem;} /* LEFT TEXT OF TECH SOLUTIONS DIV */

    .footer-grid /* FOOTER WITH PURPLE HEADINGS, WHITE TEXT AND HR LINE */
 {
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* 2x2 layout */
        gap: 20px;
        margin-left: 2.5rem;
}

    .footer-grid ul li /* ALL WHITE SUBHEADINGS BELOW 4 PURPLE HEADINGS IN FOOTER */
{
    padding: 0 !important;
    margin: 0 !important;
}

.footer-content .global-heading /* 4 PURPLE HEADINGS IN FOOTER */
{
    padding: 0;
    margin: 0;
}

.footer-logo{margin-left: 7.5rem !important;} /* LOGO OF BITKNOX INSIDE FOOTER */

} 
 /* END OF MEDIA QUERY  320px - 576px PHONES */


/*=========================================================== MEDIA QUERY FOR 577px - 768px TABLETS */
@media screen and (min-width: 577px) and (max-width: 991px)
{
    /* STATISTIC BLOCK CSS */  
    .statistic-div{border-right: none !important;} /* HIDE BORDER */
    .section-title h1{font-size: 35px;}

    /* OUR CORE SERVICES CARDS */
    .card-v1
    {
        flex: 1 1 100%;
        max-width: 90%;   
    }

    /* TECH SOLUTIONS SECTIONS */
    .discuss-card
    {
        flex: 1 1 100%;
        max-width: 100%;
        margin-left: 1rem;   
    }
    
    .digit-span{font-size: 45px;}

     .discuss-btn /* LETS BUILD SOMETHING GREAT TOGETHER BUTTON */
    {
        /* margin-left: auto;    */
        margin-right: auto;   
        font-size: 18px !important; 
        margin-top: 0 !important;
    }

    /* 6 ICONS IN CORE SERVICES CARDS */
    .img1-icon,
    .img2-icon,
    .img3-icon 
    {width: 80px;}

    .top-row /* DIV COTAINNG ICONS & H2 WHEN MEDIA QUERY HITS */
    {   
    display: flex;
    align-items: center;
    gap: 10px;
    }

    .top-row h2{font-size: 25px;}
    
    .tech-div p{display: none;} /* LEFT TEXT OF TECH SOLUTIONS DIV */
    
    .br-1{display: none;}
    
.tech-heading h6{display: none;}

       .footer-grid /* FOOTER WITH PURPLE HEADINGS, WHITE TEXT AND HR LINE */
 {
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* 2x2 layout */
        gap: 20px;
        margin-left: 2.5rem;
}

    .footer-grid ul li /* ALL WHITE SUBHEADINGS BELOW 4 PURPLE HEADINGS IN FOOTER */
{
    padding: 0 !important;
    margin: 0 !important;
}

.footer-content .global-heading /* 4 PURPLE HEADINGS IN FOOTER */
{
    padding: 0;
    margin: 0;
}

.footer-logo{margin-left: 14rem !important;} /* LOGO OF BITKNOX INSIDE FOOTER */
.global-location-icon{display: none;}
.ryadh-tel{margin-left: 0;}
.legal-div{margin-left: .75rem;}

.br-1{display: none;}
}   
   

/* END OF MEDIA QUERY  577px - 768px TABLETS */

/*========================================================= MEDIA QUERY  769px - 1400px DESKTOP */
@media screen and (min-width: 992px) and (max-width: 1100px)
{
.section-title h1{font-size: 50px;}
.tech-heading h6{display: none;}
.br-1{display: none;}

 /* STATISTIC BLOCK CSS */   
.row-cols-lg-3 > * 
{
    flex: 0 0 auto;
    width: calc(100% / 3); /* 33.3333% */
}
.card-v1
    {
        flex: 1 1 100%;
        max-width: 90%;   
    }

 .discuss-card
    {
        flex: 1 1 100%;
        max-width: 100% ;
    }
    .top-row /* DIV COTAINNG ICONS & H2 WHEN MEDIA QUERY HITS */
    {   
    display: flex;
    align-items: center;
    gap: 10px;
    }
    .top-row h2{font-size: 30px;}
    .digit-span{font-size: 50px;}

.tech-div p{display: none;} /* LEFT TEXT OF TECH SOLUTIONS DIV */
    

     /* 6 ICONS IN CORE SERVICES CARDS */
    .img1-icon,
    .img2-icon,
    .img3-icon 
    {width: 70px;}

       .footer-grid /* FOOTER WITH PURPLE HEADINGS, WHITE TEXT AND HR LINE */
 {
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* 2x2 layout */
        gap: 20px;
        margin-left: 2.5rem;
}

    .footer-grid ul li /* ALL WHITE SUBHEADINGS BELOW 4 PURPLE HEADINGS IN FOOTER */
{
    padding: 0 !important;
    margin: 0 !important;
}

.footer-content .global-heading /* 4 PURPLE HEADINGS IN FOOTER */
{
    padding: 0;
    margin: 0;
}

.footer-logo{margin-left: 17rem !important;} /* LOGO OF BITKNOX INSIDE FOOTER */
.global-location-icon{display: none;}
.ryadh-tel{margin-left: 0;}
.legal-div{margin-left: .75rem;}


}   

/* END OF MEDIA QUERY 769px - 1400px DESKTOP */