body{
    padding: 0;
    margin: 0;
    overflow-x: hidden;
}

a{
    text-decoration: none;
    color: #20247b;
}
/* inner_page */

/* navber*/
.navbar {
    
    transition: all 0.4s ease-in-out;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 9;
    background: #263a79;
}

.sticky {
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 9;
    border-top: 0;
    background-color: #253a7b !important;
    padding: 8px;
    border-bottom: none;
    box-shadow: 0 10px 30px -10px rgb(0 64 128 / 20%);
}

.about1 {

    color: #ffffff;
    text-align: justify;
}

.text-white1 {
    --bs-text-opacity: 1;
    color: #263a79 !important;
    margin-right: auto;
    font-size: 46px;
}
.aboutus {

    color: #263a79;
    text-align: justify;
}


.process{

    font-size: 3rem;
    --bs-text-opacity: 1;
    color: #263a79 !important;
    font-weight: 700!important;

}

.navbar-brand {
    color: #fff;
}

.sticky .navbar-brand {
    color: #808080;
}

.navbar-brand .h4 {
    letter-spacing: 10px;
    display: block;
}

.navbar li.nav-item {
    padding: 0 12px;
}

.navbar a.nav-link {
    color: #fff;
    font-weight: 700;
    transition: all 0.2s;
    font-size: 16px;
    text-transform: uppercase;
}


.sticky a.nav-link {
    color: #ffffff;
}


.text-success {
    --bs-text-opacity: 1;
    color: #263a79 !important;
    /* color: rgba(var(--bs-success-rgb),var(--bs-text-opacity))!important; */
}

.px-5 {
    padding-right: 1rem!important;
    padding-left: 1rem!important;
}

.navbar a.nav-link:hover {
    color: #808080;
    transition: all 0.2s;
}

.navbar-nav {
    align-items: center;
}

a {
    color: #3c71fa;
}

.navbar-toggler {
    color: #fff;
}

.navbar-toggler:focus {
    box-shadow: none;
}

.sticky .navbar-toggler {
    color: #000;
}
 
/* navber*/


/* mob_banner */
.container_banner_mob{
    height: 100vh;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background-color: aliceblue;
  }
  .profile_container{
    aspect-ratio :1/1; 
    width: min(400px,90%);
    position: relative;
  }
  .back{
    position: absolute;
    width: 100%;
    height: 100%;
    animation: rotate 4s infinite linear;
  }
  .profile{
    width: 100%;
    height: 100%;
    background-size: 100%;
    background-position: center;
    transition: all 0.2s ease-in-out;
    position: absolute;
  }
  @keyframes rotate {
    to{
      transform: rotate(360deg);
    }
  }
  .img-slider .slider-container {
      position: absolute;
      width: 300%;
      top: 0;
      left: 0;
      overflow: hidden;
      animation: slider 10s infinite;
  }
  .img-slider .slider-container .slide {
      position: relative;
      width: 33.33333333%;
      height: 100%;
      float: left;
      overflow: hidden
  }
  @keyframes slider {
      0%, 25%, 100%{left: 0}
      
      30%, 55%{left: -100%}
      
      60%, 85%{left: -200%}
  }
/* header */
.header{
    padding-top: 200px;
    padding-bottom: 100px; 
}
.carousel-item {
    height: 100vh;
    min-height: 350px;
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }


.btn-one{
    transition: all 0.5s;
}

.btn-one:hover{
    background-color: white;
    color: #152b6d;
    transform: translateY(-2px);
    transition: all 0.5s;
}

.hr-one {
    border: 0;
    border-bottom: solid 3px #263a79;
    width: 200px;
    margin: auto;
    opacity: 1;
}

.mx-auto {
    margin-right: auto!important;
    margin-left: 0px !important;
}
    
.hr-two {
    border: 0;
    border-bottom: solid 3px #2a3e7a;
    width: 150px;
    text-align: center;
    margin: auto;
    opacity: 1;
}


.container_banner {
    background-color: #fff;
    height: 30em;
    width: 65%;
    margin: auto;
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    -moz-box-shadow: 5px 5px 35px 0px #cbcbcb;
    -webkit-box-shadow: 5px 5px 35px 0px #cbcbcb;
    -o-box-shadow: 5px 5px 35px 0px #cbcbcb;
    box-shadow: 5px 5px 35px 0px #cbcbcb;
    overflow: hidden;
}
.banner_main {
    height: 100%;
    width: 100%;
    position: relative;
}
.banner_main .slide {
    height: 100%;
    width: 100%;
    background-color: #fff;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
  .banner_main .slide .slide-img {
    width: 40%;
    float: left;
    position: relative;
    height: 100%;
}
 .banner_main .slide .slide-img:before {
    content: "";
    height: 0%;
    background-color: #fff;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 5;
    transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
}
.banner_main .slide .slide-img.active:before {
    content: "";
    height: 100%;
    background-color: #fff;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 5;
}
.banner_main .slide .slide-img img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    top: 0;
    bottom: 0;
}
.banner_main .slide .slide-content {
    width: 60%;
    float: left;
    padding: 10% 8% 0em 8%;
    position: relative;
}
.banner_main .slide .slide-content h2 {
    position: relative;
}
 .banner_main .slide .slide-content h2:before {
    content: "";
    height: 0%;
    background-color: #fff;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 5;
    transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}
.banner_main .slide .slide-content h2.active:before {
    content: "";
    height: 100%;
}
@media only screen and (max-width: 767px) {
     .container_banner .banner_main .slide .slide-img {
        width: 100%;
        height: 45%;
   }
    .container_banner .banner_main .slide .slide-content {
        width: 100%;
        padding: 2em 2em;
        background-color: #fff;
   }
   .container_banner .banner_main .slide .slide-content .button {
        margin-top: 2em;
   }
   .images{
    width: 108vw !important;
    zoom: 0% !important;
    margin-left: 48px !important;
}
}
/* innerpages */
header .item .cover .header-content .line {
    content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
    border: 9px solid #fff;
    -webkit-clip-path: polygon(0 0, 60% 0, 36% 100%, 0 100%);
    clip-path: polygon(0 0, 60% 0, 36% 100%, 0 100%);
}
header .item .cover .header-content {
    position: relative;
    padding: 56px;
    overflow: hidden;
}
header .item .cover {
    padding: 75px 0;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgb(0 0 0 / 22%);
    display: flex;
    align-items: center;
}
header .item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
header .item {
    height: auto;
    position: relative;
}

/* header */

.card {
    border: none;
    border-radius: 0;
    box-shadow: 2px 6px 8px 0 rgba(22, 22, 26, 0.18);
  }
  .carousel-inner {
    padding: 0em;
  }
  .carousel-control-prev,
  .carousel-control-next {
    background-color: #263a79;
    width: 6vh;
    height: 6vh;
    border-radius: 50%;
    top: 53%;
    transform: translateY(-50%);
  }
  .carousel-control-prev span,
  .carousel-control-next span {
    width: 1.5rem;
    height: 1.5rem;
  }
  @media screen and (min-width: 1900px) {
    .fa-arrow-down {
        display: none;
    }
   
  }
  
  @media screen and (min-width: 577px) {
    .cards-wrapper {
      display: flex;
    }
    .card {
      margin: 0 0.5em;
      width: calc(100% / 2);
    }
    .image-wrapper {
      height: 20vw;
      margin: 0 auto;
    }
    .fa-arrow-down {
        display: none;
    }
    .mobile_view{
        display: block !important;
    }
    .logo img{
        width: 8vw !important;
    }
    .mob_content{
        display: block;
        font-size: 20px;
    }
    .images{
        margin-left: -90px !important;
        /* margin-left: 17px !important; */
        width: 108vw !important;
        zoom: 111% !important;
    }
    .mob_content{
        display: block;
        font-size: 24px;
    }
    
    .mob_content{
        font-size: 15px;
        text-align: center !important;
        margin-right: -80px;
    }
    .mob_content  b{
        font-size: 20px !important;

    }
    .carousel-caption {
        left: 41% !important;
        padding-bottom: -7.75rem !important;  
    }
   
  }
  @media screen and (max-width: 576px) {
    .card:not(:first-child) {
      display: none;
    }
    .carousel-caption{
        position: absolute;
        color: black;
        font-size: 30px;
        text-align: center;
      }
      .images{
        margin-left: -90px !important;
        width: 108vw !important;
        zoom: 0% !important;
    }
      .arrow {
          display: none;
        }
        .mobile_view{
            display: block !important;
        }
        .logo img{
            width: 8vw !important;
        }
        .in-left{
            font-size: 30px !important;
        }
        .mob_content{
            display: block;
            font-size: 24px;
        }
        
        .mob_content{
            font-size: 15px;
            text-align: center !important;
            margin-right: -80px;
        }
        .mob_content  b{
            font-size: 20px !important;
    
        }
        .carousel-caption {
            right: -4% !important;
             bottom: -6.75rem !important; 
        }

  }
  
  .image-wrapper img {
    max-width: 100%;
    max-height: 100%;
  }
  .main_banner{
	display: flex;
	justify-content: space-between;
}
.images{
    margin-left: 17px !important;
    padding-top: 5px;
     padding-bottom: 96px;
    zoom: 131% !important;
}
@media only screen and (max-width: 320px) {
   .carousel-caption{
     position: absolute;
     color: black;
     font-size: 30px;
     text-align: center;
    }
    .arrow {
        display: none;
      }
      a .navbar-brand{
        width: 92vw;
      }
      .mobile_view{
        display: block !important;
    }
    .logo img{
        width: 8vw !important;
    }
    .in-left{
        font-size: 26px !important; 
    }
    .images{
        margin-left: -90px !important;
        width: 108vw !important;
        zoom: 0% !important;
        
    }
    .mob_content{
        display: block;
        font-size: 24px;
    }
    
    .mob_content{
        font-size: 15px;
        text-align: center !important;
        margin-right: -80px;
    }
    .mob_content  b{
        font-size: 20px !important;

    }
    .in-left{
        display: none !important;
     }
    .carousel-caption{
        left: 92% !important;
    padding-bottom: 13.25rem !important;
    }
    .images{
       margin-top: 67px !important;
    }
    /* p{
        margin-bottom: -1rem !important;
    } */
    .line{
        display: none !important;
    }
    header .item .cover .header-content h1{
        font-size: 20px !important;
        margin: 65px 0 20px !important;
    }
    .inner_banner{
        padding-top: 62px !important;
    }
    
    
    }
    

  
  @media only screen and (max-width: 570px) {
    .carousel-caption{
      position: absolute;
      color: black;
      font-size: 30px;
      text-align: center;
    }
    .carousel-item {
        width: 93vw !important;
    }
    
    .arrow {
        display: none;
      }
     a .navbar-brand{
        width: 92vw;
      }
      .mobile_view{
        display: block !important;
    }
    .logo img{
        width: 8vw !important;
    }
    .images{
        margin-left: -90px !important;
        width: 108vw !important;
        zoom: 111% !important;
    }
   }
   /* bloginnerpage */
   .Blog-content{
    display: flex;
    background-color: #fff;
}

.Blog-content-img{
    flex: 1;
}

.Blog-content-img img{
    width: 100%;
    object-fit: cover;
}

.Blog-content-text{
    flex: 1.5;
    padding: 1rem;
}

.Blog-content-text .Blog-content-title{
    font-family: 'Playfair Display', serif;
    color: #222;
}

.Blog-content-text .Blog-content-subtitle{
    font-weight: 400;
    text-transform: uppercase;
    color: #444;
    margin: .5rem 0 2rem;
}

.Blog-content-text .Blog-content-paragraph{
    margin-bottom: 2rem;
}

.Blog-content-text .btn{
    display: inline-block;
    text-decoration: none;
    font-size: 1.5rem;
    text-transform: uppercase;
    padding: 1.5rem 2rem;
    border: 1px solid #444;
    color: #444;
}



@media screen and (max-width: 1100px){
    .Blog-content-text{
        flex: 1;
    }
    .address {
        display: block;
    }
    .ic-one{
        border: none !important;
    }
    .img-slider{
        display: none;
    }
    .carousel-captio{
        bottom: 8.25rem !important;
    }
   
}

@media screen and (max-width: 960px){
    .Blog-content-text .Blog-content-paragraph{
        margin-bottom: 1.6rem;
    }

    .Blog-content-text .btn{
        padding: 1rem 1.56rem;
    }
    .address {
        display: block;
    }
    .ic-one{
        border: none !important;
    }
    .navbar{
        display: none;
    }
    .img-slider{
        display: none;
    }
    .mobile_view{
        display: block !important;
    }
    .logo img{
        width: 8vw !important;
    }
    .in-left{
        display: none ;
    }
    .carousel-caption {
         bottom: -6.75rem !important; 
         font-size: 20px !important;
    }
}


@media screen and (max-width: 756px){
    .Blog-content{
        flex-direction: column;
        text-align: center;
    }

    .Blog-content-text .Blog-content-paragraph{
        text-align: justify;
    }

    .Blog-content-img{
        height: 350px;
        width: 100%;
    }
    .address {
        display: block !important;
    }
    .ic-one{
        border: none !important;
    }
    .navbar{
        display: none;
    }
    .mobile_view{
        display: block !important;
    }
    .logo img{
        width: 8vw !important;
    }
}

  /* inner_page */
  .parent {
    text-align: center;
  }
  
  .parent h1 {
    position: relative;
    border-width: 3px;
    font-size: 40px;
    border-style: solid;
    border-color: transparent transparent #ebe8e8 transparent;
    text-transform: uppercase;
    font-weight: bold;
    color: #f5f4f4;
    padding: 15px 30px;
    display: inline-block;
    overflow: hidden;
  }
  
  .parent h1 hr {
    border: 1px solid red;
    position: absolute;
    top: 62%;
    right: 0;
    left: 0;
    width: 5%;
  }
  
/*blog*/
.mx-auto1 {
    margin-right: 0px !important;
    margin-left: 0px !important;
}
header .item .cover .header-content {
    position: relative;
    padding: 30px;
    overflow: hidden;
}
header .item .cover .header-content .line {
    content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
    border: 9px solid #fff;
    -webkit-clip-path: polygon(0 0, 60% 0, 36% 100%, 0 100%);
    clip-path: polygon(0 0, 60% 0, 36% 100%, 0 100%);
}
header .item .cover .header-content h1 {
    font-size: 46px;
    font-weight: 600;
    margin: 5px 0 20px;
    word-spacing: 3px;
    color: #fff;
}


.blog .t-card {
    border: solid 1px #ddd;
    border-radius: 6px;
    position: relative;
    margin: 10px;
    transition: all 0.3s;
    overflow: hidden;
    min-height: 320px;
}
.blog .t-card {
    border: solid 1px #ddd0;
    border-radius: 6px;
    position: relative;
    margin: 10px;
    transition: all 0.3s;
    overflow: hidden;
    min-height: 320px;
}

.blog .t-card:hover {
    /* box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.31); */
    transition: all 0.3s;
}

.blog .t-card .img-box {
    overflow: hidden;
}

.blog .t-card img {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    position: relative;
    transition: 0.4s all ease-in-out;
    overflow: hidden;
    width: 100%;
}

.blog .t-card:hover img {
    transform: scale(1.1);
    transition: 0.4s all ease-in-out;
}

.blog .t-card .inner {
    align-items: center;
    margin-top: -40px;
    overflow: hidden;
}

.blog .t-card .inner img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin: auto;
    border: solid 3px #f4f4f4;
}

.blog .t-card .inner span {
    color: #8364e2;
    font-weight: 500;
}

.blog .fa-check-circle {
    color: #8364e2;
}
 

.blog .t-card a.main-url{
    color: #212121;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
}

.blog .t-card a {
    color: #212121;
}

.btn-style:hover{
    background: white;
    color: #283c79;
    border: solid 2px #283c79;
}
/*blog*/
.work{
    cursor: pointer;
}
/*servise*/
.servise{
    background: rgba(83, 84, 87, 0.48) url(../images/case.jpg);
    background-attachment: fixed;
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
}

.border-one{
    border: solid 1px rgba(39, 39, 39, 0.42);
    background: rgb(0 0 0 / 56%);
    border-radius: 4px;
    width: 100%;
    text-align: center;
    margin: auto;
    padding:40px 20px;
    box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.29);
}

.icons{
    font-size: 35px;
    padding: 5px 5px 5px 5px;
    background: white;
    color: black;
    border-radius: 5px;
    border: solid 1px rgb(130 130 130);
    transition: all 0.5s;
}

.icons:hover{
    background: #808080;
    color: white;
    transform: translateY(-5px);
    transition: all 0.5s;
}
/*servise*/
/*portfolio*/
.icons-ss{
    font-size: 50px;
    padding: 25px 25px 25px 25px;
    border: 2px solid rgb(163 193 36);
    border-radius: 50%;
    transition: all 0.5s;
}

.color-icon{
    color: rgba(242, 155, 16, 0.8);
}

.icons-ss:hover{
    background:#e1e2dc;
    transition: all 0.5s;
}

/*portfolio*/
/*footer*/
.footer{
    background: rgb(38 58 121);
}

hr:not([size]) {
    height: 1px;
    color: #e9ecec;
}

.strip {

    height: 40px;
    padding-top: 0px;

}
.ic-one{
    font-size: 24px;
    padding: 10px 10px 10px 10px;
    border-radius: 4px;
    border: 1px solid #efefef;
    color: white;
    margin-left: 10px;
    transition: all 0.5s;
}


.btn-success {
    color: #263a79;
    background-color: #ffffff;
    font-size: 12px;
    border-color: #575656;
}
.ic-one:hover{
    background: #808080;
    color: white;
    transition: all 0.5s;
}

.ft-text{
    color: white;
    transition: all 0.5s;
}
.ft-text:hover{
    transform: translateX(8px);
    transition: all 0.5s;
    color: #808080;
}
/*footer*/



.go-top.active {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    right: 3%;
    top: 84%;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.go-top {
    position: fixed;
    cursor: pointer;
    right: 3%;
    top: 87%;
    background-color: #808080;
    box-shadow: 0px 0px 10px rgb(0 0 0 / 31%);
    z-index: 4;
    width: 45px;
    text-align: center;
    height: 45px;
    line-height: 42px;
    border-radius: 8px;
    -webkit-transform: scale(0);
    transform: scale(0);
    visibility: hidden;
    -webkit-transition: .9s;
    transition: .9s;
}

.go-top::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-color:#808080;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: .5s;
    transition: .5s;
}

.text-dark {
    --bs-text-opacity: 1;
    color: aliceblue !important;
}
.mb-4 {
    margin-bottom: 1rem!important;
    color: aliceblue !important;
}

.h6 {
    color: aliceblue;
}


.go-top i {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin: 0 auto;
    color: #fff;
    -webkit-transition: .5s;
    transition: .5s;
    font-size: 18px;
}

@media screen and (max-width: 900px) {
    .container {
        overflow-x: hidden;
    }
    
    .navbar ul.navbar-nav.ms-auto  {
        background-color: rgba(0, 0, 0, 0.95);
    }
    
    .sticky ul.navbar-nav.ms-auto  {
        background-color: #fff;
    }
    .border-one {
        margin-bottom: 30px;
    }
    
    .header {
        padding-top: 100px;
        padding-bottom: 10px;
    }
    
    div#navbarSupportedContent {
        margin-top: 0px !important;
    }
    
    .navbar a.nav-link {
        padding: 4px 0;
    }
    .address {
        display: block ;
    }
    .mobile_view{
        display: block !important;
    }
    .logo img{
        width: 8vw !important;
    }
}



/* Gray Scale */
.hover08 figure img {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.hover08 figure:hover img {
	-webkit-filter: grayscale(0);
	filter: grayscale(0);
}

/* End Gray Scale */




.mx-auto1 {
    margin-right: 0px !important;
    margin-left: 0px !important;
}


.lh-lg {
    text-align: justify;
}


.h3 {
    font-size: 13px;
    font-weight: 600;
}
.ms-auto {
    margin-left: auto!important;
    margin-right: -20px;
}

.ser {

    font-size: 25px;
}

.go-down .fa-solid, .fas {
    font-weight: 900;
    font-size: 40px;
    padding-left: 14px;
    color: rgb(254, 254, 254);
    padding-bottom: 9px;
    padding-top: 10px;
    padding-right: 15px;
   
    border-radius: 25%;
}
 
/* animation */
/** fadeInLeft **/

@-webkit-keyframes fadeInLeft {
    from {
        opacity:0;
        -webkit-transform: translatex(-10px);
        -moz-transform: translatex(-10px);
        -o-transform: translatex(-10px);
        transform: translatex(-10px);
    }
    to {
        opacity:1;
        -webkit-transform: translatex(0);
        -moz-transform: translatex(0);
        -o-transform: translatex(0);
        transform: translatex(0);
    }
}
@-moz-keyframes fadeInLeft {
    from {
        opacity:0;
        -webkit-transform: translatex(-10px);
        -moz-transform: translatex(-10px);
        -o-transform: translatex(-10px);
        transform: translatex(-10px);
    }
    to {
        opacity:1;
        -webkit-transform: translatex(0);
        -moz-transform: translatex(0);
        -o-transform: translatex(0);
        transform: translatex(0);
    }
}
@keyframes fadeInLeft {
    from {
        opacity:0;
        -webkit-transform: translatex(-100px);
        -moz-transform: translatex(-100px);
        -o-transform: translatex(-100px);
        transform: translatex(-100px);
    }
    to {
        opacity:1;
        -webkit-transform: translatex(0);
        -moz-transform: translatex(0);
        -o-transform: translatex(0);
        transform: translatex(0);
    }
}
.in-left {
    -webkit-animation-name: fadeInLeft;
    -moz-animation-name: fadeInLeft;
    -o-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -o-animation-duration:1s;
    animation-delay: 1s;
}

@-webkit-keyframes fadeInDown {
    from {
        opacity:0;
        -webkit-transform: translatey(-10px);
        -moz-transform: translatey(-10px);
        -o-transform: translatey(-10px);
        transform: translatey(-10px);
    }
    to {
        opacity:1;
        -webkit-transform: translatey(0);
        -moz-transform: translatey(0);
        -o-transform: translatey(0);
        transform: translatey(0);
    }
}
@-moz-keyframes fadeInDown {
    from {
        opacity:0;
        -webkit-transform: translatey(-10px);
        -moz-transform: translatey(-10px);
        -o-transform: translatey(-10px);
        transform: translatey(-10px);
    }
    to {
        opacity:1;
        -webkit-transform: translatey(0);
        -moz-transform: translatey(0);
        -o-transform: translatey(0);
        transform: translatey(0);
    }
}
@keyframes fadeInDown {
    from {
        opacity:0;
        -webkit-transform: translatey(-10px);
        -moz-transform: translatey(-10px);
        -o-transform: translatey(-10px);
        transform: translatey(-10px);
    }
    to {
        opacity:1;
        -webkit-transform: translatey(0);
        -moz-transform: translatey(0);
        -o-transform: translatey(0);
        transform: translatey(0);
    }
}
.in-down {
    -webkit-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -o-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
}
  
  .item{
   
    margin:-10px;
    padding:5px;
  }

  
  @keyframes keyName{
    50% {
  transform: scale(1.4);
    }
    100% {
        transform: scale(1.4);
          }
  }
/* arrow_down */
.arrow {
    text-align: center;
    margin-top: 670px;
  }
  .bounce {
    -moz-animation: bounce 2s infinite;
    -webkit-animation: bounce 2s infinite;
    animation: bounce 2s infinite;
  }
  
  @keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
      transform: translateY(0);
    }
    40% {
      transform: translateY(-30px);
    }
    60% {
      transform: translateY(-15px);
    }
  }

 /* contact_form */
 .contact-parent{
    display:flex;
    margin:80px 0;
}

.contact-child{
    display:flex;
    flex:1;
    box-shadow:0px 0px 10px -2px rgba(0,0,0,0.75);
}

.child1{
    background:linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url("https://cdn.pixabay.com/photo/2019/06/28/00/17/architecture-4303279_1280.jpg");
    background-size:cover;
    display:flex;
    flex-direction:column;
    justify-content:space-around;
    color:#fff;
    padding:100px 0;
}

.child1 p{
    padding-left:20%;
    font-size:20px;
    text-shadow:0px 0px 2px #000;
}

.child1 p span{
    font-size:16px;
    color:#9df2fd;
}

.child2{
    flex-direction:column;
    justify-content:space-around;
    align-items:center;
}

.inside-contact{
    width:90%;
    margin:0 auto;
}

.inside-contact h2{
    text-transform:uppercase;
    text-align:center;
    margin-top:50px;
}

.inside-contact h3{
    text-align:center;
    font-size:16px;
    color:#0085e2;
}

.inside-contact input, .inside-contact textarea{
    width:100%;
    background-color:#eee;
    border:1px solid rgba(0,0,0,0.48);
    padding:5px 10px;
    margin-bottom:20px;
}

.inside-contact input[type=submit]{
    background-color:#000;
    color:#fff;
    transition:0.2s;
    border:2px solid #000;
    margin:30px 0;
}

.inside-contact input[type=submit]:hover{
    background-color:#fff;
    color:#000;
    transition:0.2s;
}

@media screen and (max-width:991px){
    .contact-parent{
        display:block;
        width:100%;
    }

    .child1{
        display:none;
    }

    .child2{
        background-image:linear-gradient(rgba(255,255,255,0.7),rgba(255,255,255,0.7)), url("https://cdn.pixabay.com/photo/2019/06/28/00/17/architecture-4303279_1280.jpg");
        background-size:cover;
    }

    .inside-contact input, .inside-contact textarea{
        background-color:#fff;
    }
    .address {
        display: block;
    }
    .mobile_view{
        display: block !important;
    }
    .logo img{
        width: 8vw !important;
    }
   
}



.header1 {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/5.jpeg);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.header2 {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/3.jpeg);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.header3 {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/blogs.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.Commitments {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/Commitments.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.history {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/History.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.leaders {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/Leaders.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.news {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/News.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.overview {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/Overview.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.fmcg {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.service {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.media {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.training {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.retail {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.telecommunication {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.travel {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.automotive {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}


.manufacturing {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.personal {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.business {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.root {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}


.strategic {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}


.Digital {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.research {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.sales {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.brand {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

    .Louder {
        padding-top: 200px;
        padding-bottom: 100px;
        background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
        background-blend-mode: overlay;
        background-position: center;
        background-size: cover;
        height: 100vh;
    }

.marketing {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.brand {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.marketing {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}
.health {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.medical {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/5.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}

.people {
    padding-top: 200px;
    padding-bottom: 100px;
    background: rgb(0 0 0 / 0%) url(../images/banner/thepeople.png);
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    height: 100vh;
}
/* =Jumbotron Main
-------------------------------------------------------------- */
/* .jumbotron.jumbotron-main { 
    height: 100%;
	width: 100%;
	font-family: 'Roboto', sans-serif;
	color: #fff;
	padding-top: 0;
	padding-bottom: 0;
	position: relative;
	margin:0;
}

#particles-js {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%;
	background: #6819e8;
	background: -moz-linear-gradient(left, #6819e8 0%, #7437d0 35%, #615fde 68%, #6980f2 100%); 
	background: -webkit-linear-gradient(left, #6819e8 0%,#7437d0 35%,#615fde 68%,#6980f2 100%); 
	background: linear-gradient(to right, #6819e8 0%,#7437d0 35%,#615fde 68%,#6980f2 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6819e8', endColorstr='#6980f2',GradientType=1 ); 
}

.jumbotron.jumbotron-main hr {
	border-width: 1px 0px;
    border-style: dotted none;
    border-color: rgba(255, 255, 255, 0.35);
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    width: 49px;
    height: 4px;
    text-align: center;
    position: relative;
    clear: both;
}

.jumbotron.jumbotron-main a {
    color: #fff;
}

.center-vertically {
    display: table-cell;
    vertical-align: middle;
    height: 100%;
}

.center-vertically-holder { 
	display: table;
	height: 100%;
}

.scroll-indicator {
	padding-top:6px;
    display: inline-block;
    width: 50px;
}

.arrow-scroll-indicator {
	font-size: 10px;
	color: rgba(255, 255, 255, 0.60);
}

.parallax-window {
    background: transparent;
} */

@media screen and (max-device-width:1000px), screen and (max-width:1900px) {


    .header3 {
        padding-top: 200px;
        padding-bottom: 100px;
        background: rgb(0 0 0 / 0%) url(../images/4.jpeg);
        background-blend-mode: overlay;
        background-position: center;
        background-size: cover;
        height: auto !important;
    }
}


 @media all and (min-width: 992px) {
	.navbar .nav-item .dropdown-menu{  display:block; opacity: 0;  visibility: hidden; transition:.3s; margin-top:0;  }
	.navbar .nav-item:hover .nav-link{ color: #fff;  }
	.navbar .dropdown-menu.fade-down{ top:80%; transform: rotateX(-75deg); transform-origin: 0% 0%; }
	.navbar .dropdown-menu.fade-up{ top:180%;  }
	.navbar .nav-item:hover .dropdown-menu{ transition: .3s; opacity:1; visibility:visible; top:100%; transform: rotateX(0deg); }
    .address {
        display: block  ;
    }
    .mobile_view{
        display: none !important;
    }
    .logo img{
        width: 8vw !important;
    }
    .img-slider{
        display: none !important;
    }
    .mob_content{
        display: none;
    }

}		

.dropdown-menu {
    position: absolute;
    z-index: 1000;
    display:inline-block;
    padding: 15px 15px;
    left: 0px;
    font-size: 1rem;
    color: #212529;
    text-align: center;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 0.25rem;
}

 /* mobli view  */
 nav{
  position: fixed;
  z-index: 99;
  width: 100%;
  background: #263a79;
}
nav .wrapper{
  position: relative;
  max-width: 1300px;
  padding: 0px 30px;
  height: 70px;
  line-height: 70px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.wrapper .logo a{
  color: #f2f2f2;
  font-size: 30px;
  font-weight: 600;
  text-decoration: none;
}
.logo img{
    width: 20vw;
}
.wrapper .nav-links{
  display: inline-flex;
}
.nav-links li{
  list-style: none;
}
.nav-links li a{
  color: #f2f2f2;
  text-decoration: none;
  font-size: 18px;
  font-weight: 500;
  padding: 9px 15px;
  border-radius: 5px;
  transition: all 0.3s ease;
}
.nav-links li a:hover{
  background: #3A3B3C;
}
.nav-links .mobile-item{
  display: none;
}
.nav-links .drop-menu{
  position: absolute;
  background: #242526;
  width: 180px;
  line-height: 45px;
  top: 85px;
  opacity: 0;
  visibility: hidden;
  box-shadow: 0 6px 10px rgba(0,0,0,0.15);
}
.nav-links li:hover .drop-menu,
.nav-links li:hover .mega-box{
  transition: all 0.3s ease;
  top: 70px;
  opacity: 1;
  visibility: visible;
}
.drop-menu li a{
  width: 100%;
  display: block;
  padding: 0 0 0 15px;
  font-weight: 400;
  border-radius: 0px;
}



.nav-links .drop_2{
    position: absolute;
    background: #242526;
    width: 180px;
    line-height: 45px;
    top: 85px;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 6px 10px rgba(0,0,0,0.15);
  }
  .nav-links li:hover .drop-menu,
  .nav-links li:hover .mega-box,
  .nav-links li:hover .drop_2
  {
    transition: all 0.3s ease;
    top: 70px;
    opacity: 1;
    visibility: visible;
  }
  .drop_2 li a{
    width: 100%;
    display: block;
    padding: 0 0 0 15px;
    font-weight: 400;
    border-radius: 0px;
  }

  /* crol */
  .nav-links .drop_4{
    position: absolute;
    background: #242526;
    width: 180px;
    line-height: 45px;
    top: 85px;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 6px 10px rgba(0,0,0,0.15);
  }
  .nav-links li:hover .drop-menu,
  .nav-links li:hover .mega-box,
  .nav-links li:hover .drop_2,
  .nav-links li:hover .drop_4
  {
    transition: all 0.3s ease;
    top: 70px;
    opacity: 1;
    visibility: visible;
  }
  .drop_4 li a{
    width: 100%;
    display: block;
    padding: 0 0 0 15px;
    font-weight: 400;
    border-radius: 0px;
  }  


.mega-box{
  position: absolute;
  left: 0;
  width: 100%;
  padding: 0 30px;
  top: 85px;
  opacity: 0;
  visibility: hidden;
}
.mega-box .content{
  background: #242526;
  padding: 25px 20px;
  display: flex;
  width: 100%;
  justify-content: space-between;
  box-shadow: 0 6px 10px rgba(0,0,0,0.15);
}
.mega-box .content .row{
  width: calc(25% - 30px);
  line-height: 45px;
}
.content .row img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.content .row header{
  color: #f2f2f2;
  font-size: 20px;
  font-weight: 500;
}
.content .row .mega-links{
  margin-left: -40px;
  border-left: 1px solid rgba(255,255,255,0.09);
}
.row .mega-links li{
  padding: 0 20px;
}
.row .mega-links li a{
  padding: 0px;
  padding: 0 20px;
  color: #d9d9d9;
  font-size: 17px;
  display: block;
}
.row .mega-links li a:hover{
  color: #f2f2f2;
}
.wrapper .btn{
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  display: none;
}
.wrapper .btn.close-btn{
  position: absolute;
  right: 30px;
  top: 10px;
}

@media screen and (max-width: 970px) {
  .wrapper .btn{
    display: block;
  }
  .wrapper .nav-links{
    position: fixed;
    height: 100vh;
    width: 100%;
    max-width: 350px;
    top: 0;
    left: -100%;
    background: #242526;
    display: block;
    padding: 50px 10px;
    line-height: 50px;
    overflow-y: auto;
    box-shadow: 0px 15px 15px rgba(0,0,0,0.18);
    transition: all 0.3s ease;
  }
  /* custom scroll bar */
  ::-webkit-scrollbar {
    width: 10px;
  }
  ::-webkit-scrollbar-track {
    background: #242526;
  }
  ::-webkit-scrollbar-thumb {
    background: #3A3B3C;
  }
  #menu-btn:checked ~ .nav-links{
    left: 0%;
  }
  #menu-btn:checked ~ .btn.menu-btn{
    display: none;
  }
  #close-btn:checked ~ .btn.menu-btn{
    display: block;
  }
  .nav-links li{
    margin: 15px 10px;
  }
  .nav-links li a{
    padding: 0 20px;
    display: block;
    font-size: 20px;
  }
  .nav-links .drop-menu{
    position: static;
    opacity: 1;
    top: 65px;
    visibility: visible;
    padding-left: 20px;
    width: 100%;
    max-height: 0px;
    overflow: hidden;
    box-shadow: none;
    transition: all 0.3s ease;
  }
  #showDrop:checked ~ .drop-menu,
  #showMega:checked ~ .mega-box{
    max-height: 100%;
  }
  .nav-links .desktop-item{
    display: none;
  }
  .nav-links .mobile-item{
    display: block;
    color: #f2f2f2;
    font-size: 20px;
    font-weight: 500;
    padding-left: 20px;
    cursor: pointer;
    border-radius: 5px;
    transition: all 0.3s ease;
  }
  .nav-links .mobile-item:hover{
    background: #3A3B3C;
  }
  .drop-menu li{
    margin: 0;
  }
  .drop-menu li a{
    border-radius: 5px;
    font-size: 18px;
  }


  .nav-links .drop_2{
    position: static;
    opacity: 1;
    top: 65px;
    visibility: visible;
    padding-left: 20px;
    width: 100%;
    max-height: 0px;
    overflow: hidden;
    box-shadow: none;
    transition: all 0.3s ease;
  }
  #showDrop:checked ~ .drop-menu,
  #showMega:checked ~ .mega-box,
  #showdrop_2:checked ~ .drop_2
  {
    max-height: 100%;
  }

  .drop_2 li{
    margin: 0;
  }
  .drop_2 li a{
    border-radius: 5px;
    font-size: 18px;
  }


  /* corl */
  .nav-links .drop_4{
    position: static;
    opacity: 1;
    top: 65px;
    visibility: visible;
    padding-left: 20px;
    width: 100%;
    max-height: 0px;
    overflow: hidden;
    box-shadow: none;
    transition: all 0.3s ease;
  }
  #showDrop:checked ~ .drop-menu,
  #showMega:checked ~ .mega-box,
  #showdrop_4:checked ~ .drop_4
  {
    max-height: 100%;
  }

  .drop_4 li{
    margin: 0;
  }
  .drop_4 li a{
    border-radius: 5px;
    font-size: 18px;
  }




  .mega-box{
    position: static;
    top: 65px;
    opacity: 1;
    visibility: visible;
    padding: 0 20px;
    max-height: 0px;
    overflow: hidden;
    transition: all 0.3s ease;
  }
  .mega-box .content{
    box-shadow: none;
    flex-direction: column;
    padding: 20px 20px 0 20px;
  }
  .mega-box .content .row{
    width: 100%;
    margin-bottom: 15px;
    border-top: 1px solid rgba(255,255,255,0.08);
  }
  .mega-box .content .row:nth-child(1),
  .mega-box .content .row:nth-child(2){
    border-top: 0px;
  }
  .content .row .mega-links{
    border-left: 0px;
    padding-left: 15px;
  }
  .row .mega-links li{
    margin: 0;
  }
  .content .row header{
    font-size: 19px;
  }
}
nav input{
  display: none;
}

 /* mobli view  */
 

 

.my-5 {
    margin-top: 0rem!important;
    margin-bottom: 2rem!important;
}

.caption {
    margin-bottom: 2rem!important;
}


.display-3 {
    font-size: 50px;
}

.navbar img {

    width: 80px;
}


.text-white {
    --bs-text-opacity: 1;
    color: #ffffff !important;
    margin-right: auto;
    font-size: 35px;
}

.how {

    display: flex;
}

.px-3 {
    padding-right: 1rem!important;
    padding-left: 0rem!important;
}


.blog1 {

    background: #81c49b;
}

.blog1 .px-3 {
    padding-right: 1rem!important;
    padding-left: 0rem!important;
    text-align: justify;
}

.blog1 .t-card {
    border: solid 1px #ddd0;
    border-radius: 6px;
    position: relative;
    margin: 10px;
    transition: all 0.3s;
    overflow: hidden;
    min-height: 320px;
}


.header2 .py-5 {
    padding-top: 15rem!important;
    padding-bottom: 3rem!important;
}

.blog1 .t-card:hover {
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0);
    transition: all 0.3s;
}

.address img {

    padding-bottom: 35px;
}

.tel img {
    padding-bottom: 0px;
}




.hidden {
	display: none;
}

.sticky-button {
	position: fixed;
	background-color: #25D366;
	bottom: 20px;
	left: 20px;
	border-radius: 50px;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
	z-index: 20;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 55px;
	height: 55px;
	-webkit-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}

.sticky-button svg {
	margin: auto;
	fill: #fff;
  width: 35px;
	height: 35px;
}

.sticky-button a,.sticky-button label {
	cursor: pointer;
	display: flex;
	align-items: center;
	width: 55px;
	height: 55px;
	-webkit-transition: all .3s ease-out;
	transition: all .3s ease-out;
}

.sticky-button label svg.close-icon {
	display: none;
}

.sticky-chat {
	position: fixed;
	bottom: 70px;
	left: 20px;
	width: 320px;
	-webkit-transition: all .3s ease-out;
	transition: all .3s ease-out;
	z-index: 21;
	opacity: 0;
	visibility: hidden;
}

.sticky-chat a {
  text-decoration: none;
  font-family: 'Roboto',sans-serif;
  color: #505050;
  
}

.sticky-chat svg {
	width: 35px;
	height: 35px;
}

.sticky-chat .chat-content {
	border-radius: 10px;
	background-color: #fff;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.25);
	overflow: hidden;
	font-family: 'Roboto',sans-serif;
	font-weight: 400;
}

.sticky-chat .chat-header {
	position: relative;
	display: flex;
	align-items: center;
	padding: 15px 20px;
	background-color: #25D366;
	overflow: hidden;
}

.sticky-chat .chat-header:after {
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 80px;
	height: 75px;
	background: rgba(0,0,0,.040);
	border-radius: 70px 0 5px 0;
}

.sticky-chat .chat-header svg {
	width: 35px;
	height: 35px;
	flex: 0 0 auto;
	fill: #fff;
}

.sticky-chat .chat-header .title {
	padding-left: 15px;
	font-size: 14px;
	font-weight: 600;
	font-family: 'Roboto',sans-serif;
  color: #fff;
}

.sticky-chat .chat-header .title span {
	font-size: 11px;
	font-weight: 400;
	display: block;
	line-height: 1.58em;
	margin: 0;
	color: #f4f4f4;
}

.sticky-chat .chat-text {
	display: flex;
	flex-wrap: wrap;
	margin: 30px 20px;
	font-size: 12px;
}

.sticky-chat .chat-text span {
	display: inline-block;
	margin-right: auto;
	padding: 10px;
	background-color: #f0f5fb;
	border-radius: 0px 15px 15px;
}

.sticky-chat .chat-text span:after {
	content: 'just now';
	display: inline-block;
	margin-left: 10px;
	font-size: 9px;
	color: #989b9f;
}

.sticky-chat .chat-text span.typing {
	margin: 15px 0 0 auto;
	padding: 10px;
	border-radius: 15px 0px 15px 15px;
}

.sticky-chat .chat-text span.typing:after {
	display: none;
}

.sticky-chat .chat-text span.typing svg {
	height: 13px;
	fill: #505050;
}

.sticky-chat .chat-button {
	display: flex;
	align-items: center;
	margin-top: 15px;
	padding: 12px 20px;
	border-radius: 10px;
	background-color: #fff;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.25);
	overflow: hidden;
	font-size: 12px;
	font-family: 'Roboto',sans-serif;
	font-weight: 400;
}

.sticky-chat .chat-button svg {
	width: 20px;
	height: 20px;
	fill: #505050;
	margin-left: auto;
	transform: rotate(40deg);
	-webkit-transform: rotate(40deg);
}

.chat-menu:checked+.sticky-button label {
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
}

.chat-menu:checked+.sticky-button label svg.chat-icon {
	display: none;
}

.chat-menu:checked+.sticky-button label svg.close-icon {
	display: table-cell;
}

.chat-menu:checked+.sticky-button+.sticky-chat {
	bottom: 90px;
	opacity: 1;
	visibility: visible;
}

/* Feature Box
---------------------*/
.feature-box-1 {
    padding: 32px;
    box-shadow: 0 0 30px rgba(31, 45, 61, 0.125);
    margin: 15px 0;
    position: relative;
    z-index: 1;
    border-radius: 10px;
    overflow: hidden;
    -moz-transition: ease all 0.35s;
    -o-transition: ease all 0.35s;
    -webkit-transition: ease all 0.35s;
    transition: ease all 0.35s;
    top: 0;
  }
  .feature-box-1 * {
    -moz-transition: ease all 0.35s;
    -o-transition: ease all 0.35s;
    -webkit-transition: ease all 0.35s;
    transition: ease all 0.35s;
  }
  .feature-box-1 .icon {
    width: 70px;
    height: 70px;
    line-height: 70px;
    background: #808080;
    color: #ffffff;
    text-align: center;
    border-radius: 50%;
    margin-bottom: 22px;
    font-size: 27px;
  }
  .feature-box-1 .icon i {
    line-height: 70px;
  }
  .feature-box-1 h5 {
    color: #20247b;
    font-weight: 600;
  }
  .feature-box-1 p {
    margin: 0;
  }
  .feature-box-1:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: auto;
    right: 0;
    border-radius: 10px;
    width: 0;
    background: #20247b;
    z-index: -1;
    -moz-transition: ease all 0.35s;
    -o-transition: ease all 0.35s;
    -webkit-transition: ease all 0.35s;
    transition: ease all 0.35s;
  }
  .feature-box-1:hover {
    top: -5px;
  }
  .feature-box-1:hover h5 {
    color: #ffffff;
  }
  .feature-box-1:hover p {
    color: rgba(255, 255, 255, 0.8);
  }
  .feature-box-1:hover:after {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    left: 0;
    right: auto;
  }
  .section {
      padding: 100px 0;
      position: relative;
  }
  .section-title {
      padding-bottom: 45px;
  }
  .section-title h2 {
      font-weight: 700;
      color: #20247b;
      font-size: 45px;
      margin: 0 0 15px;
      border-left: 5px solid #fc5356;
      padding-left: 15px;
  }



/* ============ desktop view End ============ */


.work1 {
    height: 160px;
    text-align: justify;
}

.address {
    display: flex ;
}



.slide-track img {
    width: 150px;
    height: 150px;
     animation: scroll 400s linear infinite ; 
  }
  
  .slide {
    width: auto;
  }
  .slide-track {
    width: 100%;
    display: flex;
    gap: 3em;
    overflow: hidden;  
  }
  
  .slider {
    margin-top: 0px; 
    background-color: #253a7b;
    padding: 2em 2em;
    width: auto;
  }
  
  @keyframes scroll {
    0% {transform: translateX(0);}
    100% {transform: translatex(calc(-250px * 97))
    }
  }
.box_work{
    padding: 22px;
}

  .sticky-icon  {
	z-index:1;
	position:fixed;
    top: 60%;
	right:0%;
	width: 200px;
	display:flex;
	flex-direction:column;
}  

.sticky-icon a  {
	transform:translate(160px,0px);
	border-radius:50px 0px 0px 50px;
	text-align:left;
	margin:2px;
	text-decoration:none;
	text-transform:uppercase;
	padding:10px;
    font-size: 15px;
	font-family:'Oswald', sans-serif;
	transition:all 0.8s;
}
.sticky-icon a:hover  {
	color:#FFF;
	transform:translate(0px,0px);
}	
.sticky-icon a:hover i  {
	transform:rotate(360deg);
}
/*.search_icon a:hover i  {
	transform:rotate(360deg);}*/
.Facebook  {
	background-color:#2C80D3;
	color:#FFF;}
	
.Youtube  {
	background-color:#fa0910;
	color:#FFF;
}
	
.Twitter  {
	background-color: #263a79;
	color:#FFF;
}
	
.Instagram  {
	background-color:#FD1D1D;
	color:#FFF;
}
	
.Google  {
	background-color:#d34836;
	color:#FFF;
}						
.sticky-icon a i {
	background-color:#FFF;
	height:40px;
	width:40px;
	color:#000;
	text-align:center;
	line-height:40px;
	border-radius:50%;
	margin-right:20px;
	transition:all 0.5s;}
	
.sticky-icon a i.fa-twitter  {
	background-color:#FFF;
	color:#53c5ff;
}
.fas fa-shopping-cart  {
	background-color:#FFF;
}	
#myBtn {
  height:50px;
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  text-align:center;
  padding:10px;
  text-align:center;
  line-height:40px;
  border: none;
  outline: none;
  background-color: #1e88e5;
  color: white;
  cursor: pointer;
  border-radius: 50%;
}
.fa-arrow-circle-up  {
	font-size:30px;
}

#myBtn:hover {
  background-color: #555;
}			



.blog2 .px-3 {
    color: #253a7b;
    text-align: justify;
}

.bl {

    color: #263a79;
}

.blog2 ul li {

    list-style: auto;
    color: #ffffff;
    text-align: justify;
}

.dev li {

    list-style: disc !important;
}
.main_link:hover{
    color: #acc533 ;
}
.main_link{
    color: #f0f8ff7a;
}
