@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css");
@import url(https://fonts.googleapis.com/css?family=Roboto:700);

@font-face {
    font-family: 'poppinsbold';
    src: url('../fonts/poppins-bold-webfont.woff2') format('woff2'),
         url('../fonts/poppins-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'poppinsextrabold';
    src: url('../fonts/poppins-extrabold-webfont.woff2') format('woff2'),
         url('../fonts/poppins-extrabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'poppinslight';
    src: url('../fonts/poppins-light-webfont.woff2') format('woff2'),
         url('../fonts/poppins-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'poppinsmedium';
    src: url('../fonts/poppins-medium-webfont.woff2') format('woff2'),
         url('../fonts/poppins-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'poppinsregular';
    src: url('../fonts/poppins-regular-webfont.woff2') format('woff2'),
         url('../fonts/poppins-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'poppinssemibold';
    src: url('../fonts/poppins-semibold-webfont.woff2') format('woff2'),
         url('../fonts/poppins-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
/*Graphik Fonts*/
@font-face {
    font-family: 'graphik_trialbold';
    src: url('../fonts/graphik-bold-trial-webfont.woff2') format('woff2'),
         url('../fonts/graphik-bold-trial-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'graphik_trialmedium';
    src: url('../fonts/graphik-medium-trial-webfont.woff2') format('woff2'),
         url('../fonts/graphik-medium-trial-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'graphik_regular_trialregular';
    src: url('../fonts/graphik-regular-trial-webfont.woff2') format('woff2'),
         url('../fonts/graphik-regular-trial-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'graphik_trialsemibold';
    src: url('../fonts/graphik-semibold-trial-webfont.woff2') format('woff2'),
         url('../fonts/graphik-semibold-trial-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}



body{
   font-family: 'poppinsregular';
   font-size: 16px;
}
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-thumb {
    background: #e75927;
}

::-webkit-scrollbar-track {
    background: #dedede;
}
a{
    text-decoration: none;
    color: #2b2b2b;
}
a:hover{
    text-decoration: none;
    color: #000;
}

hr:not([size]) {
    height: 1px;
    color: #e75927;
}
h4{
    font-size: 1.4rem;
    font-family: 'Work Sans', sans-serif;
	font-weight: 600;
    color: #0694d1;
}
.orange-bold-text {
    font-size: 1.4rem;
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    color: #e75927;
}
.theme-bold-text {
    font-size: 1.4rem;
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
}
.blue-bold-text {
    font-size: 1.4rem;
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    color: #0694d1;
}
.accordion-button:not(.collapsed) {
    color: #fff;
    background: linear-gradient(90deg, #FFA811 0%, #F33B00 100%);
    box-shadow: none;
    border: none;
}

img.alignright {
    float: right;
    margin: 0 0 1em 1em;
}
img.alignleft {
    float: left;
    margin: 0 1em 1em 0;
}
img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
img.alignnone {
    float: none;
    margin: 0;
}
a img.alignright {
    float: right;
    margin: 0 0 1em 1em;
}
a img.alignleft {
    float: left;
    margin: 0 1em 1em 0;
}
a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.common-list {
    margin: 0;
    padding: 0;
}
.common-list-1{
    margin: 0;
    padding: 0;
}

.common-list li {
    list-style: none;
    position: relative;
    padding-left: 22px;
    margin-bottom: 10px;
}
.common-list li:before {
    content: "\f058";
    font-family: "Font Awesome 5 Free";
    background: transparent;
    font-weight: normal;
    border: 2px solid transparent;
    position: absolute;
    font-size: 0.8rem;
    border-radius: 50%;
    color: #fff;
    left: 0;
    top: 0px;
}

.common-list-1 li {
    list-style: none;
    position: relative;
    padding-left: 22px;
    margin-bottom: 10px;
}

.common-list-1 li:before {
    content: "\f058";
    font-family: "Font Awesome 5 Free";
    background: transparent;
    font-weight: normal;
    border: 2px solid transparent;
    position: absolute;
    font-size: 0.8rem;
    border-radius: 50%;
    color: #e75927;
    left: 0;
    top: 0px;
}

.img-rounded{
    border-radius: 20px;
}

.only-mob {
    display: none;
}

.small-text{
    font-size: 0.8rem;
}
.too-small-text{
    font-size: 0.7rem;
}
.theme-color{
    color: #007cb4;
    transition: 0.3s;
}
.theme-color:hover{
    color: #e75927;
}
.theme-color-orange{
	color: #e75927;
    transition: 0.3s;
}

.theme-color-orange:hover{
    color: #0da8ef;
}


.theme-color-2{
    color: #e75927;
    transition: 0.3s;
}
.theme-color-2:hover{
    color: #007cb4;
}
.orange-text{
    color: #e75927;
}
.common-heading.bg-white{
    -webkit-text-fill-color: inherit;
}

.big-btn{
    background: rgb(28,125,195);
    background: linear-gradient(90deg, rgba(28,125,195,1) 0%, rgba(29,134,209,1) 35%, rgba(27,148,235,1) 100%);
    color: #fff;
    text-align: center;
    padding: 7px 20px;
    border-radius: 40px;
    text-decoration: none;
    outline: none;
    transition: 0.3s ease-in-out;
    display: inline-block;
    cursor: pointer;
    font-size: 1.3rem;
    font-family: 'poppinsbold';
}
.big-btn:hover{
    background: rgb(28,125,195);
    background: linear-gradient(270deg, rgba(28,125,195,1) 0%, rgba(29,134,209,1) 35%, rgba(27,148,235,1) 100%);
    color: #fff;
}


.banner-btn{
    background: #ffe433;
    color: #000;
    text-align: center;
    padding: 7px 20px;
    border-radius: 40px;
    text-decoration: none;
    outline: none;
    transition: 0.3s;
    display: inline-block;
    cursor: pointer;
    border: 1px solid #ffe433;
}
.banner-btn:hover{
    background: transparent;
    border: 1px solid #ffe433;
    color: #ffe433;
}

.common-btn {
    background-color: #FF5000;
    background: linear-gradient(50deg, #FF5000 0%, #FFC947 100%);
    color: #fff;
    text-align: center;
    padding: 7px 30px;
    text-decoration: none;
    outline: none;
    border: 0;
    transition: 0.3s;
    display: inline-block;
    cursor: pointer;
    border-radius: 5px;
    font-size: 1rem;
    transition: 0.3s ease-in-out;
}
.common-btn:hover, .common-btn:focus {
    color: #fff;
    background: linear-gradient(to right, #f9d423, #f79713);
    box-shadow: 0 6px 8px rgb(0 0 0 / .5);
    transform: scale(1.05);
}

.navbar-nav .nav-link.common-btn{
    padding: 7px 20px;
}
.bar-menu-mob{
    display: none;
}
.white-btn {
    background: 0;
	border: 1px solid #fff;
    color: #000;
    text-align: center;
    padding: 10px 26px;
    text-decoration: none;
    outline: none;
    border: 1px solid #fff;
    transition: 0.3s;
    display: inline-block;
    cursor: pointer;
    font-size: 0.9rem;
}
.white-btn:hover, .white-btn:focus {
    background: #fff;
    color: #0da8ef;
	border: 1px solid #575757;
	
}




 a.read-more{   
   padding: 14px 40px;
    font-weight: 500;
    border: 1px solid #fff;
    background: 0;
    display: inline-block;
    position: relative;
    color: #fff;
}

a.read-more:before {
    content: '';
    width: 0;
    height: 100%;
    background: #0694d1;
    position: absolute;
    left: 0;
    top: 0;
    transition: .5s;
}
a.read-more:after {
    content: '';
    width: 0;
    height: 100%;
    background: #0694d1;
    position: absolute;
    right: 0;
    top: 0;
    transition: .5s;
}
a.read-more:hover {
   color: #fff;
}
a.read-more:hover:before {
    width: 51%;
}
a.read-more:hover:after {
    width: 49%;
}

a.read-more span{  
  position: relative;
    z-index: 2;
}

/*company*/

/*Owl Carousel CSS*/
.blog .owl-prev{
    top: 40% !important;
}
.blog .owl-next{
    top: 40% !important;
}
.owl-prev {
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 4px;
    text-align: center;
    background: #e75927;
    color: #fff;
    opacity: 1;
    position: absolute;
    top: 35% !important;
    left: -45px;
}

.owl-next {
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 4px;
    text-align: center;
    background: #e75927;
    color: #fff;
    opacity: 1;
    position: absolute;
    top: 35% !important;
    right: -45px;
}
.owl-theme .owl-nav [class*=owl-]{
    color: #686868;
    font-size: 14px;
    padding: 0;
    background: #ccc;
}
.owl-carousel .owl-stage{
  display: flex;
}
.owl-theme .owl-dots .owl-dot span{
  width: 15px;
  height: 15px;
}
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span{
  background: #000;
}
.owl-carousel .owl-stage-outer{
    display: flex;
	padding-top: 20px;
	padding-bottom: 20px;
}
.owl-carousel .owl-item img.comma{
    width: 70px;
    display: inline-block;
}


.common-bg{
    background: rgb(238,238,238);
    background: linear-gradient(0deg, rgba(238,238,238,1) 0%, rgba(238,238,238,1) 50%, rgba(245,245,245,1) 100%);
}
.up-font{
    font-family: 'poppinsmedium';
    font-size: 1.2rem;
	color: #0694d1;
}
.common-heading{
    font-family: 'poppinsbold';
    font-size: 2.2rem;
    background: linear-gradient(90deg, #FFA811 0%, #F33B00 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.common-heading-2{
    font-family: 'poppinsbold';
    font-size: 1.5rem;
    background: linear-gradient(90deg, #FFA811 0%, #F33B00 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.sub-heading{
    font-family: 'graphik_trialbold';
    font-size: 1.2rem;
}

label.paragraph-sub-text {
    font-size: 1.3rem;
    font-family: 'poppinsmedium';
}

.social-links a {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: #fff;
    color: #000;
    border: 1px solid #000;
    border-radius: 50%;
    line-height: 30px;
    text-align: center;
    font-size: .8rem;
    transition: 0.3s;
}
.social-links a i{
    color: #000;
}
.social-links a:hover {
    background: #e75927;
    color: #000;
}
.social-links a:hover i {
    color: #000;
}

/*For UL LI*/
.social-links{
    margin: 0;
    padding: 0;
	display: flex;
    justify-content: space-around;
}
.social-links li{
    list-style: none;
    display: inline-block;
    margin-right: 5px;
}
.social-links li a {
    display: inline-block;
    width: 45px;
    height: 45px;
    background: transparent;
    color: #9d9d9d;
    border: 1px solid #9d9d9d;
    border-radius: 5%;
    line-height: 45px;
    text-align: center;
    font-size: 1rem;
    transition: 0.3s;
}
.social-links li a i{
    color: #fff;
	font-size: 20px;
}
.social-links li a:hover {
    background: #e75927;
    border: 1px solid #e75927;
    color: #fff;
}
.social-links li a:hover i {
    color: #fff;
}

.offcanvas-body .social-links li a{
   border: 1px solid #0da8ef;
   color: #0da8ef;
}
.offcanvas-body .social-links li a:hover{
   border: 1px solid #e75927;
   color: #fff;
}
.offcanvas-body .social-links li a i{
	color: #0da8ef;
}
.offcanvas-body .social-links li a:hover i{
	color: #fff;
}
/*Logo CSS*/
.navbar-brand img{
    width: 220px;
}
.header-banner{
    position: relative;
    height: 100vh;
    overflow: hidden;
}
.navbar{
    background: transparent !important;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 2;
}
.navbar.navbar-dark.sticky {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 11;
    background: #fff !important;
    padding: 6px 0;
    box-shadow: 0px 0px 4px rgb(0 0 0 / 42%);
}
.navbar.navbar-dark .original-logo {
    display: none;
}
.navbar.navbar-dark.sticky .white-logo {
    display: none;
}
.navbar.navbar-dark.sticky .original-logo {
    display: block;
}
.navbar-dark.sticky .navbar-nav .nav-link {
    color: #000;
}
.navbar-dark.sticky .navbar-nav .nav-link.common-btn{
    color: #fff;
}

.carousel-item img{
    object-fit: cover;
}
.carousel-caption {
    bottom: auto;
    top: 30%;
}
.carousel-caption .banner-heading span {
    font-family: 'graphik_trialbold';
    font-size: 3rem;
}
.carousel-caption p{
    font-size: 1.5rem;
}

/*Menu CSS*/
.navbar-dark .navbar-nav .nav-link {
    color: #fff;
}
.navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .show>.nav-link{
	color:#0da8ef;
}
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover{
	color:#0da8ef;
}
.navbar-dark .navbar-nav .nav-link.common-btn:focus, .navbar-dark .navbar-nav .nav-link.common-btn:hover{
	color:#fff;
}
.navbar-dark .navbar-nav .nav-link{
	text-transform: uppercase;
}
.navbar-nav .dropdown-item{
    font-size: 1rem;
    padding: 10px 15px;
    transition: 0.3s;
}
.navbar-nav .dropdown-item i{
    color: #e75927;
    width: 20px;
}
.navbar-nav .dropdown-menu{
    padding: 0;
}
.navbar-nav .dropdown-item:hover{
    background: #e75927;
    color: #fff;
}
.navbar-nav .dropdown-item:hover i{
    color: #fff;
}
.dropdown-menu li:last-child a{
    border-bottom: 0px dashed transparent;
}

/*Mega Menu*/
.navbar-nav .ktm-mega-menu {
    position: static !important;
}
.dropdown-menu.mega-menu {
    background: url('../images/mega-menu-bg.jpg');
    background-size: cover;
    background-repeat: no-repeat;
}
.navbar-nav .mega-menu{
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    padding: 15px !important;
    margin: 0 auto !important;
    border-radius: 15px;
}
.navbar-nav .mega-menu ul{
    margin: 0;
    padding: 0;
}
.navbar-nav .mega-menu ul li {
    list-style: none;
}
.navbar-nav .mega-menu ul li a.dropdown-item {
    padding: .5rem 0;
    background: none;
    transition: 0.3s;
}

.navbar-nav .mega-menu ul li a.dropdown-item:hover{
    color: #00a6f4;
}
.navbar-nav .mega-menu ul li a.dropdown-item:hover i{
    color: #00a6f4;
}
.navbar-nav .mega-menu h5{
    font-size: 1rem;
    color: #e75927;
    text-transform: uppercase;
        
    font-family: 'poppinsmedium';
}
.navbar-nav .mega-menu h5 a{
    color: #e75927;
}
.navbar-nav .mega-menu ul li a.dropdown-item:before {
    left: 2px;
    top: 11px;
    transition: 0.3s;
}
.navbar-nav .mega-menu ul li a.dropdown-item:hover:before {
    left: 5px;
    top: 7px;
    color: #00a6f4;
}
.navbar-nav .dropdown-menu .dropdown-item{
    position: relative;
}
.navbar-nav ul li a.dropdown-item:hover:before{
    color: #fff;
}

/*End Mega Menu*/

.menu-contact-box{
    background: #fff;
    box-shadow: 0 0 15px rgba(0, 0, 0, .2);
    border-radius: 10px;
    padding: 15px;
    height: 100%;
}
.menu-contact-box i{
    font-size: 1.5rem;
}

/*Bar Menu*/
.navbar-dark .navbar-nav .nav-link.bar-menu{
    background: #fff;
    color: #e75927;
    display: inline-block;
    width: 37px;
    height: 37px;
    border-radius: 50%;
	line-height: normal;
    text-align: center;
    margin-left: 10px;
    transition: 0.3s;
    box-shadow: 0px 0px 4px rgb(0 0 0 / 42%);
    border: 1px solid #ccc;
}
.navbar-dark .navbar-nav .nav-link.bar-menu:hover{
    font-size: 1.1rem;
    color: #0694d1;
}
.navbar-nav .nav-item{
    margin-left: 10px;
}
.slide-logo img{
    width: 200px;
}
.offcanvas-menu {
    margin: 0;
    padding: 0;
    display: block;
}
.offcanvas-menu li{
    list-style: none;
    display: block;
}
.offcanvas-menu li a{
    display: block;
    font-size: 1.2rem;
    padding: 7px 0;
    transition: 0.3s;
    font-weight: bold;
}
.offcanvas-menu li:last-child a{
    border-bottom: 0px dashed transparent;
}
.offcanvas-menu li a:hover{
    color: #e75927;
    font-family: 'graphik_trialmedium';
}
.offcanvas-body {
    position: relative;
}
.offcanvas-footer{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
    padding: 1rem;
}

p.paragraph-text {
    text-align: justify;
}

/*recognitions*/
.recognitions{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(0 0 0 / 50%);
    z-index: 1;
}
.recognitions ul{
    margin: 0;
    padding: 0;
}
.recognitions ul li{
    list-style: none;
    display: inline-block;
    border-right: 1px solid #4e4e4e;
}
.recognitions ul li:last-child{
    border-right: 0px solid transparent;
}
.recognitions ul li img{
    width: 180px;
    transition: transform .2s;
}
.recognitions ul li img:hover{
    transform: scale(1.1);
}

/*what-we-do*/
.what-we-do{
    padding: 50px 0;
    background: url('../images/what-we-do-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}
.font-link {
    box-shadow: 0 0 15px rgba(0, 0, 0, .2);
    border-radius: 15px;
}
.what-we-do-box {
    position: relative;
    height:100%;
}
.what-we-do-box a.font-link {
    display: block;
    height: 100%;
    padding: 10px 10px;
    text-align: center;
    position: relative;
}
.what-we-do-box a.font-link .icon img {
    height: 70px;
}
.what-we-do-box a.font-link h4 {
    font-size: 21px;
    font-weight: 600;
    padding: 10px 0;
    position: relative;
    z-index: 2;
}
.what-we-do-box a.font-link .text {
    font-size: 15px;
    line-height: 22px;
    display: block;
    position: relative;
    z-index: 2;
}
.what-we-do-box a.font-link .text span {
    color: #e15a38;
    font-weight: 500;
    text-decoration: underline;
}
.back-part h5 a{
    font-family: 'poppinsmedium';
    font-size: 1.1rem;
    color: #fff;
}
.back-part .common-list li a{
    color: #fff;
    font-size: 0.9rem;
	transition: 0.3s;
}
.back-part .common-list li a:hover {
    padding-left: 5px;
}
.back-part .common-list li:before {
    color: #fff;
}
.back-part .common-list li{
    margin-bottom: 4px;
}
.what-we-do-box .back-part {
    background-color:#e75927 !important; 
    position:absolute; 
    left:-25px; 
    top:-25px; 
    width:calc(100% + 50px); 
    min-height:calc(100% + 50px); 
    z-index:20; 
    opacity:0; 
    transform:scale(0); 
    transition: .7s; 
    padding:15px;
}
.what-we-do-box:hover .back-part {
    opacity:1; 
    transform:scale(1); 
    border-radius: 15px
}
.font-link h5{
    font-family: 'poppinsmedium';
    font-size: 1.1rem;
}


/*Technology*/
.technology{
    padding: 50px 0;
 	background: url('../images/technology-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}
.technology-images{
    margin-top: 30px;
}
.technology-images ul {
    margin: 0;
    padding: 0;
}
.technology-images ul li {
    list-style: none;
    display: inline-block;
    border-radius: 7px;
    border: 1px solid #ccc;
    padding: 10px;
    margin-right: 10px;
    background: #fff;
    text-align: center;
    transition: 0.3s;
}
.technology-images ul li:hover{
    border: 1px solid #e75927;
}
.technology-images ul li img{
    width: 100px;
    transition: transform .2s;
}
.technology-images ul li:hover img{
    transform: scale(1.2);
}
.technology .nav-link{
    color: #000;
}

.technology .nav-tabs .nav-link{
    border: none;
    border-bottom: 4px solid transparent;
    transition: 0.3s;
}
.technology .nav-tabs .nav-link:hover{
    color: #e75927;
}
.technology .nav-tabs .nav-link.active {
    border: none;
    background: transparent;
    border-bottom: 4px solid #e75927;
}

ul.list li {
    text-decoration: none;
    list-style: none;
    margin-bottom: 10px;
}

img.check-icon {
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

.digital-milestone{
    padding: 15px;
    border-radius: 15px;
    border: 1px solid #f1f1f1;
    background-color: rgb(255 255 255 / 70%);
}

.highlight-text {
    font-size: 17px;
    color: #544d4d;
    font-weight: 500;
}

/*why Drona*/
.why-drona{
    padding: 50px 0;
}
.milestone{
    padding: 15px;
    border-radius: 15px;
    border: 1px solid #f1f1f1;
    background-color: rgb(255 255 255 / 70%);
}


.milestone-box{
    padding: 15px 5px;
    border-radius: 10px;
    text-align: center;
    color: #fff;
    height: 100%;
	box-shadow: 0 0 15px rgba(0, 0, 0, .2);
}
.milestone-box h2{
    font-family: 'poppinsextrabold';
}
.milestone-box p {
    margin-bottom: 0;
    color: #fff;
}
.bg-blue{
    background: #0694d1;
}
.bg-green{
    background: #1d9b47;
}
.bg-orange{
    background: #f78721;
}
.bg-dark-blue{
    background: #183883;
}
.text-testimonial{
    border-radius: 15px;
    border: 1px solid #ccc;
    height: 100%;
    padding: 50px 70px;
    background: #0694d1;
    color: #fff;
    text-align: center;
    height: 100%;
}
.p-text{
    position: relative;
}
.p-text:before{
    content: '';
    background: url(../images/start-quote.png);
    width: 23px;
    height: 14px;
    position: absolute;
    left: -17px;
    top: -5px;
}
.p-text:after{
    content: '';
    background: url(../images/end-quote.png);
    width: 23px;
    height: 14px;
    position: absolute;
    right: 0;
    bottom: 0;
}

.flexBox {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    text-align: left;
}
#VideoSlider .test-img-box {margin:10px 0 0 30px;}
#VideoSlider .test-img-box .img {width:52px; min-width:52px;}
#VideoSlider .test-img-box .img img {width:52px; height:52px; border-radius:50%;}
#VideoSlider .test-img-box .det {width:calc(100% - 52px); padding-left:15px; color:#fff; font-size:15px;}
#VideoSlider .test-img-box .det span {display:block; padding-bottom:0px; line-height: 1.2;font-size: 0.9rem;}
#VideoSlider .test-img-box .det span.name {color:#FABC41; font-size:17px; font-weight:bold;}

/*Affiliate*/
.affiliate-box{
    padding: 7px 10px;
    border-radius: 10px;
    transition: 0.3s;
    background: #fff;
    overflow: hidden;
	box-shadow: 0 0 15px rgba(0, 0, 0, .2);
    border: 1px solid transparent;
}
.affiliate-box:hover{
    border: 1px solid #e75927;
}
.affiliate-box img{
    width: 100%;
    transition: transform .2s;
}
.affiliate-box img:hover{
    transform: scale(1.2);
}
#VideoSlider .carousel-item img{
    border-radius: 15px;
}

/*Carousel Common CSS*/
#VideoSlider .carousel-item{
    position: relative;
    height: 100%;
}
#VideoSlider .carousel-inner{
    height: 100%;
}
#VideoSlider.carousel{
    height: 100%;
}
.carousel-control-next, .carousel-control-prev {
    align-self: center;
    width: 35px;
    height: 35px;
    background: #e75927;
    opacity: 1;
    border-radius: 7px;
    padding: 5px;
}
.carousel-control-next{
    right: 5%;
}
.carousel-control-prev{
    left: 5%;
}
.header-banner .carousel-control-next, .header-banner .carousel-control-prev{
    bottom: 100px;
}
#BannerSlider .carousel-indicators {
    bottom: 150px;
}
#VideoSlider .carousel-indicators{
    bottom: 0px;
}
/*End*/
.play-icon{
    position: absolute;
    top: 40%;
    z-index: 5;
    left: 0;
    right: 0;
    text-align: center;
}
#VideoSlider .carousel-item .play-icon img{
    transition: transform .2s;
}
#VideoSlider .carousel-item:hover .play-icon img{
    transform: scale(1.2);
}
.play-icon img{
    width: 55px !important;
    margin: 0 auto;
}

.modal .btn-close {
    padding: .5rem .5rem;
    margin: -.5rem -.5rem -.5rem auto;
    position: absolute;
    right: -30px;
    top: -13px;
    background-color: #fff;
    opacity: 1;
    background-size: 10px;
    border-radius: 50%;
}

/*success stories*/
.success-stories{
    padding: 50px 0;
    background: url(../images/technology-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.success-stories-box{
    height: 100%;
    position: relative;
}
.full-img{
    object-fit: cover;
    height: 100%;
}
.success-stories-box .client-logo-img {
    position: absolute;
    top: 30%;
    z-index: 2;
    left: 0;
    right: 0;
    text-align: center;
}
.success-stories-box .client-logo-img img {
    width: 130px;
    transition: transform .2s;
}
.success-stories-box:hover .client-logo-img img {
    transform: scale(1.2);
}
.success-stories-box span{
    position: absolute;
    z-index: 2;
    bottom: 20px;
    left: 20px;
    color: #fff;
}
.industry{
    padding: 50px 0;
    background: url('../images/industry-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}
.icon-box{
    box-shadow: 0 0 15px rgba(0, 0, 0, .2);
    border: 1px solid transparent;
    border-radius: 15px;
    padding: 10px;
    text-align: center;
    transition: 0.3s;
}
.icon-box:hover{
    box-shadow: none;
    border: 1px solid #e75927;
}
.icon-box img{
    width: 60px;
}
.icon-box img{
    transition: transform .2s;
}
.icon-box:hover img {
    transform: scale(1.2);
}

.change-color{
	font-size: 1.4rem;
    font-family: 'poppinsmedium';
    color: #5e5b5b;
}
 .box-change-color{
    font-family: 'poppinsbold';
    font-size: 1.1rem;
    color: #5e5b5b;
    margin-top: 10px;
}   
.turning-ideas{
	font-weight: 700 !important;
	font-family: 'poppinsmedium';
    font-size: 1.2rem;
	color: #0da8ef;
}

.bg-heading{
	font-family: 'poppinsbold';
    font-size: 2.2rem;
    color: #fff;
    -webkit-background-clip: text;
    background-clip: text;
}
.Process-heading{
	font-size: 1.25rem;
	font-family: 'poppinsbold';
	color: #5e5b5b;
}


/*our-clients*/
.our-clients{
    padding-bottom: 50px;
}

/*Blog*/
.blog{
    padding: 50px 0;
    background-repeat: no-repeat;
    background-size: cover;
}
.blog-box{
    color: #fff;
    position: relative;
    overflow: hidden;
    border-radius: 15px;
	box-shadow: 0 0 15px rgba(0, 0, 0, .2);
}
.blog-box img{
    transition: transform .2s;
    height: 250px;
    object-fit: cover;
}
.blog-box:hover img{
    transform: scale(1.2);
}
.blog-box-text{
    position: absolute;
    left: 0;
    right: 0;
    padding: 15px;
    bottom: 0;
	z-index: 2;
}
.blog-box-text p i.theme-color{
	color: #e75927;
}
.blog-box-text a{
    color: #fff;
    margin-top: 10px;
    font-size: 16px;
}

/*Locations CSS*/
.locations{
    background: url('../images/footer-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
    color: #fff;
    padding: 40px 0;
    padding-bottom: 0;
}
.locations p{
    font-size: 17px;
}
.locations p i{
    width: 20px;
}
.location-logo img {
    width: 340px;
}
.location-box{
    transition: 0.3s;
    opacity: 0.7;
}
.location-box img {
    transition: transform .2s;
}
.location-box:hover img{
    transform: scale(1.1);
}
.location-box:hover {
 opacity: 1;
 cursor: pointer;
}
.location-box hr{
    background: #ccc;
    border-color: #ccc;
}

/*Fotter*/
footer{
    padding: 30px 0;
    background: url('../images/footer-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}
footer .common-list li a{
    color: #fff;
    transition: 0.3s;
    font-size: 16px;
}
footer .common-list li a:hover{
    color: #e75927;
    padding-left: 5px;
}
footer .form-control{
    font-size: 0.8rem;
}
footer p a{
    font-size: 1rem;
}
.copyright{
    background: #e75927;
}

/*CTA CSS*/
.cta{
    padding: 30px 0;
    background: url('../images/cta-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}


/*Animation CSS Start*/
/*Line Animation CSS*/
.animatedLine {
    position: fixed;
    top: 0;
    height: 100%;
    width: 1px;
    background: rgba(255,255,255,0.04);
    overflow: hidden;
    z-index: 10;
}
.animatedLine:nth-child(1) {
    left: 33%;
}
.animatedLine:nth-child(1)::after {
    animation-delay: -2s;
}
.animatedLine:nth-child(2) {
    left: 66%;
}
.animatedLine:nth-child(2)::after {
    animation-delay: -1s;
}
.animatedLine::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 75px;
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #ffffff 75%, #ffffff 100%);
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #ffffff 75%, #ffffff 100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 75%, #ffffff 100%);
    animation: animatedLine 5s 0s infinite;
    animation-timing-function: cubic-bezier(0.4, 0.26, 0, 0.97);
    animation-fill-mode: forwards;
}

@keyframes animatedLine {
  0% {
      top: -150px;
  }
  60% {
      top: calc(100% + 150px);
  }
  100% {
      top: calc(100% + 150px);
  }
}


/*Loader Line CSS*/
.loader-line {
    width: 250px;
    height: 3px;
    position: relative;
    overflow: hidden;
    background-color: #fff;
    margin: 20px auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
}

.loader-line:before {
    content: "";
    position: absolute;
    left: -50%;
    height: 3px;
    width: 40%;
    background: linear-gradient(90deg, #FFC107 0%, #FF9800 35%, #FF5722 100%);;
    -webkit-animation: lineAnim 3s linear infinite;
    -moz-animation: lineAnim 3s linear infinite;
    animation: lineAnim 3s linear infinite;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
}

@keyframes lineAnim {
    0% {
        left: -40%;
    }
    50% {
        left: 20%;
        width: 20%;
    }
    100% {
        left: 100%;
        width: 80%;
    }
}


/*End*/

/*Popup Form CSS*/
.bg-gray{
    background: #242424b8;
    color: #fff;
    border: 1px solid #3d3d3d;
}
.popup-form-box .form-control{
    background: transparent;
    border: 1px solid #767676;
    font-size: 0.9rem;
}
.popup-form-box .form-select{
    background: transparent;
    border: 1px solid #767676;
    font-size: 0.9rem;
    color: #767676;
}
.popup-text{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
}

#VideoModal .modal-body {
    background: #000;
}

.d-none-desktop{
    display: none;
}

/*Same as Flexsin*/
.success-story-gaps .col-md-4, .success-story-gaps .col-md-6{
    padding: 0 5px;
}
.cus-p-end{
    padding-right: 5px;
    padding-left: 5px;
}
.pfInner {
    display: block;
    transition: .3s ease-in-out;
}
.pfLft {
    width: 100%;
    padding: 0;
    position: relative;
    overflow: hidden;
    height: 100%;
}
.pfLft .pfInner, .pfRgt .pfInner {
    background-size: cover!important;
    height: 100%;
    position: relative;
}
.pfInner .overBox, .pfLft .pfInner .name, .pfRgt .pfInner .name {
    position: absolute;
    left: 0;
    padding: 30px;
    width: 100%;
    color: #fff;
    height: 100%;
    display: flex;
}
.pfLft .pfInner .name, .pfRgt .pfInner .name {
    bottom: 0;
    font-size: 24px;
    line-height: 32px;
    align-items: flex-end;
}
.pfLft .pfInner img {
    opacity: 0;
    width: 100%;
    max-height: 600px;
}
.pfRgt {
    width: 70%;
    padding: 1px;
}
.pfRgtTopC {
    margin: -1px;
    height: calc(100% + 2px);
}
.pfRgtBot, .pfRgtTop {
    height: 50%;
    overflow: hidden;
    box-shadow: 0 0 0 3px #fff;
    position: relative;
}
.pfRgtTop {
    width: 50%
}
.pfRgtTop .pfInner img {
    opacity: 0;
    width: 100%;
    max-height: 360px;
}
.pfRgtBot {
    width: 33.33%
}
.pfRgtBot .pfInner img {
    opacity: 0;
    width: 100%
}
.pfInner .overBox {
    top: 0;
    background: #e14a25;
    text-align: center;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transform: scale(0);
    transition: .7s;
    line-height: 28px;
}
.pfInner .overBox .hd {
    font-weight: 500;
    font-size: 30px;
    line-height: 39px;
}
.pfInner .overBox a {
    color: #f64;
    font-size: 17px;
    background: #fff;
    line-height: normal;
}
.pfInner .overBox a.learnMore span:after {
    top: -1px;
    transform: scale(.8);
}
.pfInner .overBox a:after, .pfInner .overBox a:before {
    background: #1a448a;
}
.pfInner:hover .overBox {
    transform: scale(1);
}
.pfRgtBot .pfInner .overBox, .pfRgtTop .pfInner .overBox {
    padding: 20px;
    font-size: 16px;
    line-height: 26px;
}
.pfRgtBot .pfInner .overBox .hd, .pfRgtTop .pfInner .overBox .hd {
    font-size: 24px;
    line-height: 32px;
}
.pfLft .pfInner .name, .pfRgt .pfInner .name {
    justify-content: center;
    padding-bottom: 35px;
}
.pfInner .overBox .hd img, .pfLft .pfInner .name img, .pfRgt .pfInner .name img {
    opacity: 1;
    width: auto;
}
.pfInner .overBox .hd {
    justify-content: center;
    padding-bottom: 25px;
}

.pfInner:hover .textBox {
    padding-top: 20px;
    opacity: 1;
    transform: translate(0, 0);
    height: 120px;
}
.pfInner .textBox {
    color: #fff;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    transition: ease-in-out .8s;
    opacity: 0;
    transform: translate(0, 300%);
    height: 20px;
}
.pfInner .newOver {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 25px 20px 50px 20px;
    background: rgba(0, 0, 0, .3);
}
.pfInner .clientLogo {
    min-height: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pfLft .pfInner .clientLogo {
    min-height: 40px;
    height: 40px;
}
.pfInner .nameHd {
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    transition: .8s ease-in-out;
    padding-top: 20px;
    max-width: 350px;
    margin: 0 auto;
}

.pfInner:hover .nameHd {
    padding-top: 0;
}
.pfInner:hover .textBox {
    padding-top: 20px;
    opacity: 1;
    transform: translate(0, 0);
    height: 120px;
}
.pfInner .categoryNew {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 10px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.pfInner .categoryNew span {
    color: #fff;
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    background: none;
    text-transform: none;
}
.pfInner .clientLogo img {
    opacity: 1;
    width: auto;
    display: block;
    margin: auto;
    transition: ease-in-out .4s;
    max-height: 100%;
}
.pfInner:hover .clientLogo img {
    opacity: 0;
    transform: translate(0, -300%);
}


.offcanvas-header .btn-close {
    border: 1px solid #b7b7b7;
    border-radius: 50%;
    background-size: 35%;
    background-color: #fff;
    background-color: #fff;
    box-shadow: 0px 0px 4px rgb(0 0 0 / 42%);
}

/*Inner Page CSS*/
.main-title{
    position: absolute;
    left: 0;
    right: 0;
    top: 30%;
    text-align: center;
}
.main-title h1{
    font-family: 'graphik_trialbold';
    color: #fff;
}
.main-title p{
    color: #fff;
}
.main-title .banner-tag-line{
    font-size: 28px;
    color: #0da8ef;
    font-weight: 800;
    letter-spacing: 1px;
	font-family: cursive;
    text-shadow: -1px -1px 0 white, 0px -1px 0 white, 1px -1px 0 white, 1px 0px 0 white, 1px 1px 0 white, 0px 1px 0 white, -1px 1px 0 white, -1px 0 0 white;
}
.common-section{
    padding: 50px 0;
    background: #F6F4F1;
}
.breadcrumb-box{
    background: #f2f2f2;
	border-bottom: 1px solid #e7e7e7;
}
.breadcrumb-item a{
   color: #e75927;
}
.normal-font {
    font-size: 1rem;
}

.common-bg{
    padding: 50px 0;
	background: #fefaf2;
/*     background: url('../images/common-bg.jpg'); */
    background-size: cover;
    background-repeat: no-repeat;
}
.accordion-button{
    font-family: 'graphik_trialsemibold';
    background: transparent;
    border: 1px solid #ccc;
    border-radius: 10px;
}
.accordion-item:last-of-type .accordion-button.collapsed{
	border-radius: 10px;
}
.accordion-item:first-of-type .accordion-button{
    border-radius: 10px;
}
.accordion-flush .accordion-item .accordion-button {
    border-radius: 10px;
}
.accordion-item {
    background-color: transparent;
    background-color: transparent;
    margin-bottom: 20px;
    border: none;
}
.accordion-button:not(.collapsed)::after {
    background-image: url(../images/down-arrow.png);
}
.customer-box{
    position: relative;
    height: 100%;
}
.customer-box .play-icon img{
    transition: transform .2s;
}
.customer-box:hover .play-icon img{
    transform: scale(1.2);
}

.customer-box .test-img-box {margin:10px 0 0 30px;}
.customer-box .test-img-box .img {width:52px; min-width:52px;}
.customer-box .test-img-box .img img {width:52px; height:52px; border-radius:50%;}
.customer-box .test-img-box .det {width:calc(100% - 52px); padding-left:15px; color:#fff; font-size:15px;}
.customer-box .test-img-box .det span {display:block; padding-bottom:0px; line-height: 1.2;font-size: 0.9rem;}
.customer-box .test-img-box .det span.name {color:#FABC41; font-size:17px; font-weight:bold;}

/*Carousel Common CSS*/
.customer-carousel .carousel-item{
    position: relative;
    height: 100%;
}
.customer-carousel .carousel-inner{
    height: 100%;
}
.customer-carousel.carousel{
    height: 100%;
}
.customer-carousel .owl-next, .customer-carousel .owl-prev{
    top: 40% !important;
}

.service-box{
    height: 100%;
    padding: 15px;
    text-align: center;
    box-shadow: 0 0 15px rgba(0, 0, 0, .2);
    border-radius: 15px;
    background: #fff;
}
.service-box img {
    height: 50px;
}
.service-box p{
    margin-bottom: 0;
}
.service-box h5 {
    font-family: 'poppinsbold';
    font-size: 1.1rem;
    margin-top: 10px;
}
.service-box:hover{
    cursor: pointer;
    background: #e75927;
    color: #fff;
}
.service-box:hover h5{
    color: #fff;
}
.service-box:hover p{
    color: #fff;
}
.service-box:hover img {
    filter: brightness(0) invert(1);
}
.service-box:hover p a{
    color: #fff;
}

/*Progress*/
.progressBg {
  background-color: #fefaf2;
}
.process-box{
    background: #fff;
    border-radius: 15px;
    padding: 20px;
    height: 100%;
    box-shadow: 0 0 15px rgba(0, 0, 0, .2);
    position: relative;
    border: 1px solid transparent;
}
.process-box img{
    width: 60px;
    margin-bottom: 20px;
}
.process-box p{
    font-size: 0.9rem;
}
.process-box h5{
    font-family: 'graphik_trialmedium';
}
.process-footer{
    border-radius: 10px;
    border: 1px dashed #e75927;
    padding: 10px;
    background: #fff;
}
.process-content{
    margin-bottom: auto;
}
.process-step{
    position: absolute;
    top: 25px;
    right: 25px;
    font-size: 3rem;
    font-family: 'poppinsextrabold';
}
.process-box .process-step {
  transition: color 0.5s ease;
}
.process-box.active {
  border: 1px solid #e75927;
  background: #fff2f2;
}
.process-box.active .process-step {
  color: #e75927;
}

.recognitions.footer-recognitions{
    background: #000332;
}

/*Location*/
.location{
    padding: 50px 0;
    background: #000332;
}
footer p a{
    color: #fff;
}
footer p a:hover{
    color: #fff;
}

.digi-mkt-service-bg{
    background: url('../images/digi-mkt-service-bg.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    padding: 50px 0;
}
.digi-mkt-service-bg .accordion-header .accordion-button{
    font-size: 1rem;
    font-family: 'graphik_trialmedium';
    padding: 8px;
    background: rgb(0 0 0 / 20%);
    color: #fff;
}
.digi-mkt-service-bg .accordion-item{
    background: transparent;
}
.digi-mkt-service-bg .accordion-button:not(.collapsed) {
    color: #e75927;
}
.digi-mkt-service-bg .accordion-body{
    font-size: .9rem;
    background: transparent;
    color: #fff;
    padding: 10px;
    border-left: 2px solid #e75927;
}
.bold-text{
    font-family: 'graphik_trialbold';
}
.med-text{
    font-family: 'graphik_trialmedium';
}
.digi-mkt-service-bg .accordion-button::after{
    background-image: url('../images/down-arrow.png');
}
.digi-mkt-service-bg .accordion-button:not(.collapsed)::after{
    background-image: url('../images/down-active-arrow.png');
}

.cta-2{
    background-color: #100b08;
    background-image: url('../images/seo-bg.png');
    background-size: cover;
    background-repeat: no-repeat;
}
.cta-3{
    background: #fff2e8;
    background-size: cover;
    background-repeat: no-repeat;
}
/*Work Process Digital Marketing*/
.work-process-icon{
    position: relative;
}
.digi-process-icon-up img, .digi-process-icon-down img {
    width: 70px;
}
.digi-process-icon-up{
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    text-align: center;
}
.digi-process-icon-down{
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    text-align: center;
}
.digi-process-icon-down span, .digi-process-icon-up span{
    width: 110px;
    height: 110px;
    background: #fff;
    line-height: 110px;
    text-align: center;
    border-radius: 50%;
    display: inline-block;
}
.work-process-text{
    margin-top: 30px;
    text-align: center;
}
.work-process-text .common-heading{
    color: #e75927;
    opacity: calc(10 / 10);
    font-size: 36px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1em;
    letter-spacing: 0px;
        position: relative;
    top: auto;
    right: auto;
    background: linear-gradient(to bottom, #DD7109 0%, #00000000 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/*Startup Website Packages*/
body {
      background: linear-gradient(to bottom right, #fceaea, #ffffff);
      font-family: 'Segoe UI', sans-serif;
    }
 .package-header {
      text-align: center;
      font-weight: bold;
      font-size: 2rem;
      margin-top: 30px;
      margin-bottom: 20px;
    }
    .table thead th {
      background-color: #007bff;
      color: white;
      text-align: center;
    }
    .basic-col {
      background-color: #265d9b;
      color: white;
    }
    .starter-col {
      background-color: #d4aa00;
      color: white;
    }
    .advance-col {
      background-color: #007c4f;
      color: white;
    }
    .btn-enquire {
      background-color: red;
      color: white;
      font-weight: bold;
      border-radius: 20px;
    }
    .note {
      font-size: 0.9rem;
      color: #555;
      padding: 10px;
    }

    /* Zebra striping for table body rows */
    tbody tr:nth-child(even) {
      background-color: #f9f9f9;
    }
    tbody tr:nth-child(odd) {
      background-color: #ffffff;
    }

    /* Keep column colors from being overridden by row striping */
    .basic-col-bg {
      background-color: #265d9b !important;
      color: white;
    }
    .starter-col-bg {
      background-color: #d4aa00 !important;
      color: white;
    }
    .advance-col-bg {
      background-color: #007c4f !important;
      color: white;
    }


/*Case or Why Brands Choose to Drona Infotech*/
.dark-section{
    background: url('../images/row-bgimage-3.png');
    background-size: cover;
    background-repeat: no-repeat;
    padding: 50px 0;
}
.case1-section-area{
    background: linear-gradient(135deg, #e0c3fc, #f8efff, #d4fcf8);
    padding: 50px 0;
}
.case1-section-area .cs_case_study_1_list {
    display: flex;
}
.case1-section-area .cs_case_study.cs_style_1.cs_hover_active {
    margin: 0px 8px;
    border-radius: 5px;
    height: 475px;
}
.case1-section-area .cs_case_study_1_list .cs_case_study.cs_style_1 {
    min-height: 400px;
}
.case1-section-area .cs_case_study_1_list > .cs_case_study.cs_style_1 {
    flex: 1;
}
.case1-section-area .cs_case_study.cs_style_1 {
    height: 700px;
    display: flex;
    align-items: flex-end;
    position: relative;
    overflow: hidden;
    transition: all 0.4s ease;
}
.case1-section-area .cs_case_study.cs_style_1 .cs_case_study_thumb {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
}
.case1-section-area .cs_case_study_thumb.cs_case_study_thumb1 {
    background-image: url(../images/case-img1.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.case1-section-area .cs_case_study.cs_style_1 {
    position: relative;
    display: block;
}
.case1-section-area .cs_case_study.cs_style_1:before{
    content :'';
    position: absolute;
    background: rgb(0 0 0 / 70%);
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.case1-section-area .cs_case_study_thumb {
    background-image: url(../images/case-img1.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.case1-section-area .cs_case_study_thumb.cs_case_study_thumb2 {
    background-image: url(../images/case-img2.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.case1-section-area .cs_case_study_thumb.cs_case_study_thumb3 {
    background-image: url(../images/case-img3.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.case1-section-area .cs_case_study_thumb.cs_case_study_thumb4 {
    background-image: url(../images/case-img4.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.case1-section-area .cs_case_study_thumb.cs_case_study_thumb5 {
    background-image: url(../images/case-img5.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.case1-section-area .cs_case_study_thumb.cs_case_study_thumb6 {
    background-image: url(../images/case-img6.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.case1-section-area .cs_case_study_thumb.cs_case_study_thumb7 {
    background-image: url(../images/case-img7.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.case1-section-area .cs_case_study_thumb.cs_case_study_thumb8 {
    background-image: url(../images/case-img8.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.case1-section-area .cs_case_study.cs_style_1 .cs_case_study_thumb {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
}

.case1-section-area .cs_case_study.cs_style_1.cs_hover_active.active .content-area1 {
    opacity: 0;
    transition: all 0.4s;
}
.case1-section-area .cs_case_study.cs_style_1.cs_hover_active.active .content-area {
    left: 0;
    transition: all 0.4s;
    opacity: 1;
}
.case1-section-area .content-area1 {
    position: absolute;
    transform: rotate(-90deg);
    width: 290px;
    height: auto;
    left: -80px;
    bottom: 162px;
    transition: all 0.4s;
    opacity: 1;
    z-index: 2;
}
.case1-section-area .content-area1 a {
    color: #fff;
    display: inline-block;
    text-transform: capitalize;
    transition: all 0.4s;
    width: 100%;
    font-size: 20px;
    font-family: 'poppinssemibold';
}
.case1-section-area .content-area a {
    color: #fff;
    display: inline-block;
    text-transform: capitalize;
    transition: all 0.4s;
    width: 100%;
    margin-bottom: 8px;
}
.case1-section-area .content-area p {
    color: #fff;
    transition: all 0.4s;
    font-size: 0.9rem;
}
.case1-section-area .content-area {
    position: absolute;
    z-index: 1;
    transition: all 0.4s;
    padding: 0 24px 24px 24px;
    bottom: 0;
    left: -100%;
    opacity: 0;
}

.case1-section-area .cs_case_study_1_list .cs_case_study.cs_style_1.active {
    flex: 3;
}
.case1-section-area .cs_case_study.cs_style_1.cs_hover_active {
    margin: 0px 8px;
    border-radius: 5px;
    height: 300px;
}
.case1-section-area .cs_case_study_1_list .cs_case_study.cs_style_1 {
    min-height: 300px;
}

a.why-choose-heading {
    font-size: 1.3rem;
    font-weight: 700;
    font-family: 'poppinsregular';
}
/*End Case*/

/*Case Study*/
.case-study-box{
    position: relative;
}
.case-study-box .case-study-img-box{
    display: block;
}
.case-study-title{
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    padding: 15px;
    text-align: center;
    color: #fff;
    z-index: 2;
    display: block;
}
.case-study-title:hover h5{
    color: #fff;
}
.case-study-details{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px;
    color: #fff;
    z-index: 2;
    font-size: 13px;
    display: block;
}
.case-study-details:hover p{
    color: #fff;
}
.case-study-details label{
    color: #7fba00;
}

.case-study-img-box{
    position: relative;
    overflow: hidden;
}
.case-study-img-box:before{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: rgb(0 0 0 / 20%);
    z-index: 1;
}
.case-study-img-box img{
    transition: 0.3s ease-in-out;
    height: 347px;
}
.case-study-box:hover .case-study-img-box img {
    transform: scale(1.1);
}

.case-study-box:hover .case-study-img-box:before{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: rgb(0 0 0 / 50%);
}
.testimonial{
	border-radius: 15px;
    border: 1px solid #ccc;
    height: 100%;
    padding: 30px 40px;
	margin: 2px;
    background: #0694d1;
    color: #fff;
    height: 100%;
}
.col-lg-3.img-box img {
    width: 50px;
    border-radius: 5px;
    border: 1px solid #fff;
}
.det span.name {
    color: #FABC41;
    font-size: 17px;
    font-weight: bold;
}

.det span {
    display: block;
    padding-bottom: 0px;
    line-height: 1.2;
    font-size: 0.9rem;
}


.apply-form {
      max-width: 600px;
      margin: 50px auto;
      background-color: #fff;
      border-radius: 10px;
      box-shadow: 0 0 15px rgba(0,0,0,0.1);
      padding: 30px;
      position: relative;
    }
.form-title {
      text-align: center;
      font-size: 24px;
      font-weight: 600;
      margin-bottom: 25px;
    }
.choose-file-btn {
      background-color: #ff4b5c;
      color: #fff;
      border: none;
      padding: 5px 12px;
      border-radius: 5px;
    }
.captcha-box {
      background: #fefefe;
      border-radius: 5px;
      font-size: 24px;
      font-weight: 600;
      padding: 10px 20px;
      box-shadow: 0 0 5px rgba(0,0,0,0.1);
      display: inline-block;
    }
.career-list ul {
    margin-left: 0px;
}


/*Case Study Single Page*/
.case-points h5{
    font-family: 'poppinssemibold';
}
.our-process-box {
    border-radius: 20px;
    border: 1px solid #e75927;
    padding: 20px;
    height: 100%;
}
.features-list-box {
    border-radius: 20px;
    border: 1px solid #e75927;
    padding: 20px;
    height: 100%;
}
.features-list-box h5 {
    font-family: 'poppinssemibold';
    font-size: 1.1rem;
    border-bottom: 1px dashed #e75927;
    padding-bottom: 10px;
    margin-bottom: 10px
    color: #fff;
}
.ol-list{
    padding-left: 15px;
}
.ol-list li{
    margin-bottom: 15px;
}
.cta-box {
    padding: 40px;
    color: #fff;
    background: #00b3d3;
    border-radius: 50px;
}
.text-italic{
    font-style: italic;
}
.our-process-box {
    border-radius: 20px;
    border: 1px solid #00b3d3;
    padding: 20px;
    height: 100%;
}
.our-process-box h5 {
    font-family: 'poppinssemibold';
    font-size: 1.2rem;
    border-bottom: 1px dashed #00b3d3;
    padding-bottom: 10px;
    margin-bottom: 10px;
}
.stats-box {
    background: #fff;
    padding: 50px 60px;
    border-radius: 40px;
}
.stats-content h2{
    font-family: 'poppinsextrabold';
}
.line {
    width: 200px;
    border-color: #e75927;
    height: 5px !important;
    opacity: 1;
}
.career-icon {
	display:inline-block;
	padding: 5px;
	width: 60px;
	height: 60px;
	background: #ffe7df;
	text-align: center;
	border-radius: 50%;
	margin-bottom: 15px;
}
.career-icon img{
	width: 100%;
}
.moretext {
  display: none;
}
.box-text {
    border: 1px solid #FFA811;
    border-radius: 10px;
    padding: 10px;
	margin-top: 10px;
}

.box-text:hover a{
    color: #FFA811;
}


.bend-img:hover {
    transform: scale(1.08) rotate(1deg);
}
.bend-img {
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    transition: transform 0.5s ease;
}

 .up-down-img {
	 animation: float 6s ease-in-out infinite;
	 border-radius: 20px;
	 box-shadow: 0px 6px 18px rgba(0,0,0,0.15);
}
@keyframes float {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-10px); }
	100% { transform: translateY(0px); }
}

.help-box{
	position: fixed;
    right: 20px;
    bottom: 200px;
    background: #fff;
    padding: 10px;
    border-radius: 15px;
    border: 1px solid #e75927;
    font-size: 14px;
	display: flex;
	align-items: center;
	z-index: 2;
}
.help-btn-box a img{
	width: 22px;
}
.help-icon{
	width:60px;
	height:60px;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0 0 15px rgba(0, 0, 0, .2);
	display: inline-block;
	text-align: center;
    line-height: 60px;
    animation: bounceUp 2s infinite ease-in-out;
}
.help-icon img{
	width: 35px;
}
.help-btn-box {
    text-align: center;
    margin-right: 10px;
	display: none;
}

.help-btn-box a{
	border: 1px solid #ccc;
    border-radius: 10px;
    padding: 6px 10px;
    display: inline-block;
}
.help-btn-box a.wapp-bdr {
	border: 1px solid #4caf50;
}
.help-btn-box a.call-bdr {
	border: 1px solid #0da8ef;
}

@keyframes bounceUp {
  0%, 100% {
    transform: translateY(6px);
  }
  50% {
    transform: translateY(-6px); /* kitna bounce ho adjust kar sakte ho */
  }
}

.blog-overlay:before{
	content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgb(0 0 0 / 60%);
	z-index:1;
}


.case-study-tabs li {
  position: relative;
  cursor: pointer;
  padding: 5px 12px;
  font-weight: 500;
  transition: color 0.3s ease;
}

.case-study-tabs li::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 0;
  height: 2px;
  background: #e75927; /* अपनी brand color डाल सकते हो */
  transition: width 0.3s ease;
}

.case-study-tabs li.active {
  color: #e75927;
}

.case-study-tabs li.active::after {
  width: 100%;
}

/*Tabs CSS*/

.tech-stacks {
    padding: 120px auto;
    background: url(../images/service-bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}

/*Tabs CSS*/
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    background-color: #01a0e4;
    border-radius: 30px;
    position: relative;
}
.nav-pills .nav-link.active:before{
    position: absolute;
    content: '\f0dd';
    font-size: 20px;
    color: #01a0e4;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    left: 0;
    right: 0;
    bottom: -13px;
}
.nav-pills .nav-link{
    color: #01a0e4;
    border-radius: 30px;
    border: 1px solid #01a0e4;
}
.nav-pills .nav-item{
    margin-right: 10px;
    display: inline-block;
}
/* .industries-box img{
	border-radius: 15px;
} */

/*Media Query CSS For Tablet and iPad Screens*/
@media only screen and (max-width: 1024px) and (min-width: 768px) {
    .col-ipad-mob-4 {
        flex: 0 0 auto;
        width: 33.33333333%;
    }
    .header-banner{
        height: 100%;
    }
    .carousel-caption h2 {
        font-size: 1.8rem;
    }
    .carousel-caption{
        left: 5%;
        right: 5%;
        top: 25%;
    }
    .carousel-caption p {
        font-size: 1rem;
    }
    .recognitions ul li img {
        width: 105px;
    }
    .milestone .col-6 {
        margin-bottom: 15px;
    }
    .success-stories-box .client-logo-img img {
        width: 70px;
    }
    .technology .nav-tabs .nav-link{
        margin-bottom: 7px;
    }
    .navbar-collapse {
        background: #000;
        padding-bottom: 15px;
    }
    .bar-menu-mob{
        display: inline-block;
    }
    .bar-menu-mob{
        background: #fff;
        color: #e75927;
        display: inline-block;
        width: 37px;
        height: 37px;
        border-radius: 50%;
        text-align: center;
        margin-left: 10px;
        transition: 0.3s;
        padding: 0;
        line-height: 37px;
    }
    .navbar-dark .navbar-nav .nav-link.bar-menu.bar-menu-desktop{
        display: none;
    }
    .dropdown-menu.mega-menu.show{
        height: 250px;
        overflow-y: auto;
        overflow-x: hidden;
    }
    .navbar-nav .mega-menu{
        width: 95% !important;
    }
    #BannerSlider .carousel-indicators {
        bottom: 30px;
    }
}
/*Mobile CSS*/
@media only screen and (max-width: 767px) {
    .owl-prev{
        left: 0;
    }
    .owl-next{
        right: 0;
    }
    .col-mob-6 {
        flex: 0 0 auto;
        width: 50%;
    }
    .header-banner{
        height: 100%;
    }
    .recognitions{
        background: #000;
        position: relative;
        padding: 15px 0;
    }
    .recognitions ul li{
        border: 1px solid #4e4e4e;
        border-radius: 10px;
        margin: 5px 3px;
        width: 30%;
        display: inline-block;
    }
    #BannerSlider .carousel-item {
        position: relative;
        height: 450px;
        overflow: hidden;
    }
    #BannerSlider .carousel-item img{
        height: 100%;
        object-fit: cover;
    }
    .carousel-caption h2 {
        font-size: 1.5rem;
    }
    .carousel-caption{
        left: 5%;
        right: 5%;
        top: 25%;
    }
    .carousel-caption p {
        font-size: 1rem;
    }
    .technology .nav-tabs .nav-link{
        margin-bottom: 7px;
        font-size: 0.8rem;
    }
    .technology-images ul li{
        margin-bottom: 15px;
    }
    .why-drona .col-6{
        margin-bottom: 15px;
    }
    .success-stories .col-md-4{
        margin-bottom: 15px;
    }
    .success-stories .col-md-6 {
        margin-bottom: 15px;
    }
     .navbar-collapse {
        background: transparent;
        padding-bottom: 15px;
    }
    .bar-menu-mob{
        display: inline-block;
    }
    .bar-menu-mob{
        background: #fff;
        color: #e75927;
        display: inline-block;
        width: 37px;
        height: 37px;
        border-radius: 50%;
        text-align: center;
        margin-left: 10px;
        transition: 0.3s;
        padding: 0;
        line-height: 37px;
    }
    .navbar-dark .navbar-nav .nav-link.bar-menu.bar-menu-desktop{
        display: none;
    }
    .dropdown-menu.mega-menu.show{
        height: 250px;
        overflow-y: auto;
        overflow-x: hidden;
    }
    .navbar-nav .mega-menu{
        width: 95% !important;
    }
    #BannerSlider .carousel-indicators {
        bottom: 10px;
        z-index: 1;
    }
    .recognitions ul li img {
        width: 100%;    
    }
    .what-we-do-box .back-part {
        left: 0;
        right: 0;
        top: 0;
        width: 100%;
        font-size: 0.8rem;
    }
    .technology-images ul li img {
        width: 80px;
    }
    .affiliate-box {
        padding: 2px 2px;
        border-radius: 5px;
    }
    .text-testimonial {
        padding: 35px 15px;
    }

    .client-carousel.owl-carousel .owl-stage-outer {
        padding-bottom: 5px;
    }
    .client-carousel .owl-dots {
        text-align: center;
        margin-top: 5px;
    }
    .client-carousel.owl-carousel .owl-dot {
        margin: 3px;
        width: 10px;
        height: 10px;
        background: #ccc;
        border-radius: 50%;
        display: inline-block;
    }
    .client-carousel.owl-carousel .owl-dot.active{
        background: #e75927;
    }
    .client-carousel .owl-nav {
        display: none;
    }
    .up-font {
        font-size: 1rem;
    }
    .social-links li {
        margin-right: 0px;
    }
    .social-links li a {
        width: 45px;
        height: 45px;
        line-height: 50px;
        font-size: .7rem;
        display: inline-block;
    }
    footer .common-list li a {
        font-size: .8rem;
    }
    .common-list li {
        margin-bottom: 0px;
    }
    .navbar-brand img {
        width: 200px;
    }
    footer p a{
        font-size: .9rem;
    }
    .offcanvas-body .collapse:not(.show){
        display: block;
    }
   .bar-menu-mob{
        display: none;
    }
    .navbar-dark .navbar-toggler {
        color: #e75927;
        border-color: #fff;
        opacity: 1;
        background: #ffffff;
        padding: 0;
        width: 37px;
        height: 37px;
        display: inline-block;
        border-radius: 50%;
        box-shadow: 0px 0px 4px rgb(0 0 0 / 42%);
        border: 1px solid #ccc;
    }
    .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
        color: #e75927;
        padding-right: 0;
        padding-left: 0;
    }
    .nav-link.common-btn{
        background: transparent;
    }
    .navbar-nav .nav-link.common-btn{
        padding-right: 0;
        padding-left: 0;
    }
    .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .show>.nav-link {
        color: #000;
        font-size: 1.2rem;
        font-weight: bold;
    }
    .navbar-dark .navbar-nav .nav-link {
        color: #000;
        font-size: 1.2rem;
        font-weight: bold
    }
    .navbar-nav .dropdown-menu{
        max-height: 240px;
        overflow-x: hidden;
        overflow-y: auto;
    }
    .d-none-mob{
        display: none;
    }
    .dropdown-item{
        white-space: pre-wrap;
    }
    .navbar-nav .dropdown-item {
        font-size: .9rem;
    }
    .offcanvas-body {
        position: relative;
        background: url(../images/mega-menu-bg.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        padding-top: 90px;
    }
    #BannerSlider .carousel-inner{
        z-index: 0;
    }
    .dropdown-menu.mega-menu{
        background: #fff;
    }
    .modal-body.p-5.bg-gray.img-rounded{
        padding: 1rem !important;
    }
    .popup-form-img.position-relative{
        display: none;
    }
    .modal .btn-close{
        right: 10px;
        top: 10px;
        z-index: 3;
    }
    object{
        height: 250px !important;
    }
    .d-none-desktop{
        display: block;
    }
    .success-story-gaps .col-md-4, .success-story-gaps .col-md-6{
        padding: 5px 10px;
    }
    .cus-p-end{
        padding-right: 10px;
        padding-left: 10px;
    }
    .offcanvas-header {
        background: transparent;
        position: absolute;
        top: 5px;
        z-index: 1;
        left: 0;
        right: 0;
    }
    .p-text:before {
        left: 0;
    }
    .header-inner .banner{
        height: 450px;
        overflow: hidden;
    }
    .header-inner .banner img{
        height: 450px;
        object-fit: cover;
    }
    .header-inner .main-title h1 {
        font-size: 1.4rem;
    }
    .main-title .banner-tag-line {
        font-size: 20px;
		font-family: unset;
		letter-spacing: 1px;
    }
    .main-title p{
        font-size: .8rem;
    }
    .mob-margin{
        margin-bottom: 20px;
    }
    .text-testimonial{
        height: auto;
    }
    .customer-box {
        height: auto;
    }
    .owl-carousel .owl-stage{
        align-items: center;
    }
    #MobileAppAccordion{
        margin-top: 30px;
    }
    footer .common-heading {
        font-size: 1.4rem;
    }
    .digi-process-icon-up{
        position: relative;
        top: 0;
    }
    .digi-process-icon-down {
        position: relative;
        bottom: 0;
    }
    .case1-section-area .cs_case_study.cs_style_1.cs_hover_active {
        margin: 0;
        height: 250px;
        width: 50%;
        float: left;
    }
    .case1-section-area .cs_case_study_1_list{
        display: block;
    }
    .case1-section-area .cs_case_study_1_list .cs_case_study.cs_style_1 {
        min-height: 250px;
    }
    .text-end.mob-center{
        text-align: center !important;
    }
    .cta-3{
        text-align: center;
        padding: 50px 0;
    }
	.common-bg{
		padding: 30px 0;
	}
	.common-heading {
		font-size: 1.5rem;
	}
	.mob-mar {
		margin-top: 30px;
	}
	.common-heading-2 {
		font-size: 1.5rem;
	}
	.case-study-img-box img {
		height: 320px;
		object-fit: cover;
	}
	.mob-margin-top{
		margin-top: 30px;
	}
	.only-desktop {
		display: none;
	}
	.only-mob {
		display: block;
	}
	.common-section {
		padding: 35px 0;
	}
	.carousel-caption .banner-heading span {
    font-family: 'graphik_trialbold';
    font-size: 2rem;
}
}