html {-moz-tab-size: 4;tab-size: 4;-webkit-text-size-adjust: 100%;scroll-behavior: smooth;}
body{font-family: "Poppins", sans-serif; font-style: normal;-webkit-font-smoothing: antialiased;  font-weight: normal; font-style: normal; padding: 0; margin: 0; background: #111111}
*{box-sizing: border-box;}
img {max-width: 100%;height: auto;vertical-align: middle;border-style: none;}
ul li{list-style: none;display: inline-block;}
ul {margin: 0;padding: 0;}
button, input[type=submit] {appearance: none;-webkit-appearance: none;-ms-appearance: none;}
h1,h2,h3,h4,h5,h6,p{margin: 0 0 15px;}
a{text-decoration: none;transition: all 0.3s ease-in-out; color: #fff;}
.container{max-width: 1368px; margin: 0 auto; width: 100%;}
h2{ color: #fff;font-weight: 700;}
h1{font-size: 65px;color: #ffffff;line-height: 1.2;}
h2{font-size: 60px;padding-bottom: 15px;}
h3{color: #fff;font-size: 35px;padding-bottom: 25px; font-weight: 700;}
h4{color: #fff; font-size: 40px;font-weight: 300;}
h5{color: #fff; font-size: 22px; line-height: 26px; font-weight: 600;font-family: Jost;}
h6{color: #fff; font-size: 22px; line-height: 26px;font-weight: 600;}
p{font-size: 24px; font-family: Jost;color: #C8C8C8;line-height: 159.5%;}
.journey-head{color: #ffffff; font-size: 40px; line-height: 61px; font-weight: 600;margin-bottom: 0;padding-bottom: 0;}
.text-span{color: #F1592A;}
.small-pera{font-size: 18px;font-family: Jost;color: #C8C8C8; font-weight: 300;line-height: 159.5%;}
.theme-flex{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;}
.news-pera{font-size: 16px;font-family: Jost;color: #C8C8C8;}
.port-pera{font-size: 20px; color: #9C9C9C;font-family: Jost;}
.faq-head{font-size: 26px;line-height: 159.5%; color: #ffffff;font-family: Jost;}

/* ========================================  Body BG IMG  ======================================== */
.main-inner-section {
    padding-top: 110px;
    padding-bottom: 130px;
    background-image: url(../images/bg/body-left-bg.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
}
.portfolio{
    padding: 135px 0px;
    background-image: url(../images/bg/body-left-bg.png);
    background-repeat: no-repeat;
    background-position: left center;
}
.port-slider .container {
    
    width: 100%;
    max-width: fit-content;
    padding-left: 70px;
}

.news{
    padding: 160px 0px;
    background-image: url(../images/bg/body-left-bg.png);
    background-repeat: no-repeat;
    background-position: left center;
}
.we-are{background-image: url(../images/bg/body-right-bg.png);
    background-repeat: no-repeat; 
    background-position: right center;}



    
/* ========================================  Theme BG  ======================================== */
.theme-bg-30{background: rgb(48 44 44 / 30%);}
.theme-bg-dark{background: #111111;}
.theme-bg-50{background: rgb(48 44 44 / 50%);}
.theme-bg-red{background: #210800}
.theme-bg-cp{background: #211F1F;}
.theme-bg-20{background: rgb(48 44 44 / 20%);}
.theme-bg-10{background: rgb(255 255 255 / 10%);}
/* ========================================  Theme btn  ======================================== */
.theme-btn{
font-size: 14px;
border: 1px solid#F1592A;
color: #fff;
border-radius: 37px;
background:transparent;
padding: 11px 48px;
font-family: "Poppins", sans-serif;
font-weight: 600;
display: inline-block;
margin-top: 20px;
transition: all 0.4s ease-in-out;}

.theme-btn:hover{
    background: #F1592A;
    color: #fff;
}


.theme-btn-form{
    background: #F1592A !important;
    font-size: 14px;
    border: 1px solid#F1592A;
    color: #fff;
    border-radius: 37px;
    background:transparent;
    padding: 11px 48px;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    display: inline-block;
    margin-top: 20px;
    transition: all 0.4s ease-in-out;
}
.theme-btn-form:hover{
    background: transparent !important;
}
.submit-btn{text-align: right; margin-top: 4px;}

:focus-visible {
    outline: -webkit-focus-ring-color auto 1px;
    outline: 1px solid#F1592A !important;
    box-shadow: 0px 0px 27px 0px rgb(241 89 42 / 20%);
}


/* ========================================  We are section  ======================================== */
.we-are .we-are-info{width: 50%; padding-right: 25px;}
.we-are .we-are-img {width: 50%;}
/* ========================================  Services section  ======================================== */

.service {padding-top: 155px;}
.service .service-banner{padding-top: 115px;}
.service .services-img{position: absolute;left: -68px;top: -156px;}
.service-info p{padding-top: 5px;}
.service-info{    width: calc(33% - -4px);
    padding: 18px;
    margin: 0px -17px 110px;
    position: relative;
    min-height: 300px;} 
    .solutions {
       
        padding-top: 135px;
        padding-bottom: 106px;
    }
.solutions,
.solutions .solutions-head {justify-content: inherit;}
.solutions-head p {
    max-width: 742px;
    padding-left: 90px;
    padding-top: 15px;
}
.service .service-info.admin img{left: -32px;}
.service-info:nth-child(4),
.service-info:nth-child(5),
.service-info:nth-child(6){
    margin: 0px -17px 0px;
}



/* ========================================  Style the tab  ======================================== */
/* ========================================  Style the tab  ======================================== */
/* ========================================  Style the tab  ======================================== */
/* ========================================  Style the tab  ======================================== */
.solutions .tab {
    width: calc(32% - 6px);
    height: 100%;
    background: #262626;
    padding: 30px 0px;
  }
  
  /* Style the buttons inside the tab */
  .solutions .tab button {
    display: block;
    background-color: inherit;
    color: #fff;
    padding: 17px 40px;
    width: 100%;
    border: none;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
    font-size: 24px;
    line-height: 159.5%;

  }
  
  /* Change background color of buttons on hover */
  .solutions .tab button:hover {
    background-color: #F1592A;
  }
  
  /* Create an active/current "tab button" class */
  .solutions .tab button.active {
    background-color: #F1592A;
  }
  
  /* Style the tab content */
  .solutions .tabcontent {
   
    width: 100%;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }



  .solutions .sol-tab {
    display: flex;
    flex-wrap: wrap;
    margin-top: 55px;
}

.solutions .tab-info {
    width: calc(68% - -6px);
    background: rgb(48 44 44 / 50%);
    padding: 15px 60px;
  
}

.solutions .tab-info p {
    max-width: 781px;
    margin: auto;
    font-size: 18px;
}


.news-info {
    width: calc(33% - -4px);
    background: #111111;
}
.news-head{background: rgb(48 44 44 / 30%);}
.news-banner{text-align: center ;}

.portfolio .slide-img img {
    height: 100%;
    height: 493px;
    /* object-fit: cover; */
    width: 100%;
}
.portfolio .slide-img {
    margin: 0 15px;
}


.portfolio .slick-list {
    padding: 0 10% 0 0;
  }





/* slick slider */
.port-slider {
    position: relative;
    padding-top: 5px;

}
.solutions-head {
       align-items: flex-start;
    justify-content: flex-start;


}
.solutions-head h2{margin-bottom: 0; padding-bottom: 0;}
.slick-prev, .slick-next {
    position: absolute;
    top: -118px;
}
.slick-prev {
  
    left: 0;
    right: 120px;
    left: auto;
    width: auto;
    pointer-events: none;
}
.slick-next {
  
    right: 80px;
}

.slick-next:before{
    content: "";
    position: absolute;
    background-image: url(../images/port-slider/slider-right.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 37px;
    height: 25px;
    top: -1px;
    left: -8px;
    opacity: 1;
}


.slick-prev:before {
    content: "Scroll Next";
    font-size: 20px;
    font-family: Jost;
    color: #fff;
    opacity: 1;
    font-weight: 600;
}







.techno .techno-head p{max-width: 830px;}
.techno{padding: 60px 0px;}


/* ======================================   techno tab   ======================================    */
/* ======================================   techno tab   ======================================    */
/* ======================================   techno tab   ======================================    */
/* ======================================   techno tab   ======================================    */
/* Style the buttons inside the tab */
.portlinks{ color: #fff; font-family: Jost; font-size: 24px;}
.techno-tab .tab {
    overflow: hidden;
    color: #F1592A;
    padding: 20px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 75px;
}
  .techno-tab .tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 15px 50px;
    transition: 0.3s;
    font-size: 24px;
    border-bottom: 1px solid #AEAEAE;
  }
  
  /* Change background color of buttons on hover */
  .techno-tab .tab button:hover {
   
  }
  
  /* Create an active/current tablink class */
  .techno-tab .tab button.active {
   
    color: #F1592A;
  }
  .techno-tab .portlinks.active::before,
  .techno-tab .portlinks.active::after{
      display: block;
  }
  
  /* Style the tab content */
  .techno-tab .tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
  }
  
  .techno-tab .portlinks{position: relative;}
  .techno-tab .portlinks::after{
      content: "";
      position: absolute;
      width: 100%;
      height: 2px;
      background: #F1592A;
      left: 0;
      bottom: -1px;
      display: none;
  }
  .techno-tab .portlinks::before{
      content: "";
      position: absolute;
      width: 18px;
      height: 18px;
      border-radius: 50px;
      background: #F1592A;
      left: 0;
      right: 0;
      margin: 0 auto;
      bottom: -9px;
      z-index: 1;
      display: none;
  }
  .tabport-banner{    display: flex;padding-top: 25px;
    flex-wrap: wrap;
    margin: 0 -15px;}
  .tabport-logo{
    width: calc(16% - 21px);
    margin: 0 15px 0px;
    text-align: center;
    height: 200px;
   
    position: relative;;}
  .tabport-logo img {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: 0 auto;
    transform: translateY(-50%);
    max-width: 90px;
}
.tabport {
    margin-top: 50px;
}
/* ======================================   techno tab   ======================================    */
/* ======================================   techno tab   ======================================    */
/* ======================================   techno tab   ======================================    */
/* ======================================   techno tab   ======================================    */


/* ====================================== Articles section ====================================== */
.articles{margin-bottom: 60px; padding-top: 85px;}
.articles .articles-info{width: calc(33% - 32px);padding: 60px 20px;margin: 0 18px; border: 1px solid;    transition: all 0.4s ease-in-out;}
.articles .head {
    text-align: center;
    padding-top: 62px;
    max-width: 800px;
    margin: auto;
}
.articles h6{margin-bottom: 20px;}
.articles .news-pera{margin-bottom: 9px;}
.articles .articles-box{justify-content: flex-start;max-width: 1214px;margin: 0 auto;padding-top: 60px;padding-bottom: 95px;}
.articles .articles-info a {margin-top: 40px;display: inline-block;}
.articles .articles-info:hover{    box-shadow: 0px 13px 22px rgb(241 89 42 / 20%);border: 1px solid#F1592A;}
/* ====================================== Award section ====================================== */

.award .award-logo {width: calc(20% - 40px);}

.award .award-box.theme-bg-50 {
    width: 202px;
    height: 202px;
    border-radius: 130px;
    position: relative;
    text-align: center;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.award .award-box.theme-bg-50 {width: 202px;height: 202px;border-radius: 130px;position: relative;}
.award .award-box.theme-bg-50 img {position: absolute;top: 50%;left: 0;right: 0;margin: 0 auto;transform: translateY(-50%);}
.award .award-banner.theme-flex {max-width: 1214px;margin: 0 auto;}
.award .head{text-align: center;}
.award h3 {margin-bottom: 27px;}
.award {
    padding-top: 50px;
    padding-bottom: 30px;
}
/* ====================================== FAQ section ====================================== */
.faq .faq-head{text-align: center; }
.faq .faq-head h2 span{text-transform: lowercase; font-weight: 600;font-size: 22px;}
.faq .faq-head p {max-width: 541px;margin: auto; }
.faq .accordion-group {margin: 1rem 0;}
.faq .ac-state {display: none;}
.faq .ac-trigger {padding: 32px 20px;display: flex;justify-content: space-between;align-items: baseline;cursor: pointer; }
.faq .ac-content {display: grid;grid-template-rows: 0fr;transition: grid-template-rows 300ms ease;}
.faq .ac-content-inner {overflow: hidden;padding: 0 1rem;}
.faq .ac-content img {display: block;margin: 0 auto;}
.faq .ac-state:not(:checked) ~ .ac-trigger .ac-icon-close {display: none;}
.faq .ac-state:checked ~ .ac-trigger .ac-icon-open {display: none;}
.faq .ac-state:checked ~ .ac-content {grid-template-rows: 1fr;}
.faq .accordion label{    border-top: 1px solid rgb(174 174 174 / 50%);}
.faq {
    /* padding-top: 121px; */
     padding-bottom: 93px;}
.faq .accordion-group .accordion:last-child label{border-bottom: 1px solid rgb(174 174 174 / 50%);}
.faq .head{padding-bottom: 16px; margin-bottom: 50px;}
.faq .ac-content-inner {
    overflow: hidden;
    padding: 0 1rem;
}
/* ====================================== home form section ====================================== */
.home-form.theme-bg-red {padding: 53px 0px 60px;}
.home-form .form-control{background: #111111; border: 1px solid #302C2C; height: 63px;}
.home-form .form-control.f-name{background-image: url(../images/contact-page/form-name.svg);} 
.home-form .form-control.f-email{background-image: url(../images/contact-page/f-email.svg);} 
.home-form .form-control.f-subject{background-image: url(../images/contact-page/f-subject.svg);} 
.home-form .form-control.f-phone{background-image: url(../images/contact-page/f-phone.svg);} 
.home-form .form-control{ background-repeat: no-repeat;background-size: auto;background-position: 30px;}
.home-form .home-textarea {width: 100%;height: 122px;padding: 15px 30px 15px 30px;border-radius: 20px;}

/* ====================================== journey section ====================================== */
.journey-btn .theme-btn{margin-top: 0;}
.journey .journey-info {width: calc(60% - 0px);}
.journey .journey-btn {width: calc(40% - 0px);text-align: right;}
.journey .journey-btn .theme-btn{margin-top: 0;}
.journey .journey-banner.theme-flex {padding: 7px 0px;}
.journey{padding: 32px 0px;}




.start-info {
    width: calc(60% - 0px);    padding-top: 130px;
}
.journey-btn {
    margin-top: 0px;
}
.start-img {
    width: calc(40% - 0px);
}
.start-jour{position: relative;}
.start-jour::after {
    content: "";
    position: absolute;
    background-image: url(../images/journey/jour-bg.png);
    top: 102px;
    left: 0;
    height: 407px;
    width: 100%;
}
.start-banner.theme-flex {
    position: relative;
    z-index: 1;
}

.jour-img {
 
    position: relative;
    height: 508px;
}

.jour-img img {
    position: absolute;
    /* bottom: 0; */
    right: 0;
    top: 0;
}
































/* ======================================   Contact Page css   ======================================    */
/* ======================================   Contact Page css   ======================================    */



.form-section {max-width: 1256px;margin: auto;margin-top: 60px;}

.form-control {
    border: none;
    background: #302C2C;
    border-radius: 100px;
    height: 88px;
    padding: 15px 30px 15px 76px;
    width: calc(50% - 15px);
    font-size: 20px;
    font-family: 'Poppins';
    color: #fff;
    margin-bottom: 30px;
    background-repeat: no-repeat;
    background-size: auto;
    background-position: 30px;
}

 .form-control.f-name{background-image: url(../images/contact-page/form-name.svg);} 
 .form-control.f-email{background-image: url(../images/contact-page/f-email.svg);} 
 .form-control.f-subject{background-image: url(../images/contact-page/f-subject.svg);} 
 .form-control.f-phone{background-image: url(../images/contact-page/f-phone.svg);} 

.form-section textarea{
    width: 100%;
    height: 266px;
    border-radius: 30px;
    padding-top: 50px;
}
 .form-control::placeholder {
    color: #fff;
   
  }

  .contact-footer-bg {
    margin-top: 12px;
}





.port-info{width: calc(50% - 0px);padding: 0px 80px;}
.port-img{width: calc(50% - 40px);    margin-right: 35px;}

.port-info h6{font-size: 28px; line-height: 40px; color: #fff;font-family: Jost;}
.port-flex {background: rgb(48 44 44 / 20%);    padding: 58px 0px;}
.port-flex {margin-top: 105px; margin-bottom: 30px;}

.port-flex.port-flip {flex-direction: row-reverse;}
.port-flex.port-flip .port-info {width: calc(50% - 64px);padding: 0px 51px;}
.port-flex.port-flip .port-img {width: calc(50% - 40px);padding-left: 0px;margin-left: 35px;}




/* ===============================  About Us  =============================== */
.inner-head.about-us{text-align: left;}
.inner-head.about-us p{margin: inherit;    max-width: 619px;}
.requir-info {
    width: calc(48% - 0px);
}

.requir-img {
    width: calc(48% - 0px);
}

.requir-banner{
    margin-bottom: 50px;
}

.hope {padding-top: 33px;padding-bottom: 106px;}
.hope h2{font-size: 290px;color: #ffffff;line-height: 295px;font-weight: 400;font-family: "Jost", sans-serif;}
.hope h2 span{font-size: 80px; color: #F1592A;line-height: 90%; font-family: "Jost", sans-serif;    margin-left: -42px;}
.about-family .family-info{background: rgb(48 44 44 / 20%);width: calc(24% - 6px);text-align: center;border: 1px solid #302c2c33;    transition: all 0.4s ease-in-out;}
.about-family .family-detail h5{font-size: 24px; font-family: "Jost", sans-serif;margin-bottom: 6px;}

.family-detail {
    margin-top: 47px;
}
.family-social {
    margin-bottom: 66px;
    margin-top: 30px;
}
.family-social ul li {
    margin: 0 5px;
}
.family-social ul li a{pointer-events: none;}
.family-banner.theme-flex {
    margin-top: 190px;
    
}
.family-img img {
    width: 178px;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: -90px;
}
.family-detail {
    margin-top: 135px;
}
.family-img {
    position: relative;
}
.about-family .family-info:hover{
    border: 1px solid #F1592A;
    box-shadow: 0px 13px 22px rgb(241 89 42 / 20%);
}





.moving-text .geek1 {
    font-size: 250px; font-weight: bold; color: #232323;
}


.demo ul li{display: block;}
.demo .image-area{position: relative;}
.demo .image-area img{ position: absolute; left: 0; top: 0;} 






.dropdown {
    display: inline-block;
    position: relative;
  }
  
  .dd-button {
    display: inline-block;
    cursor: pointer;

  }
  
  .dd-button:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    width: 0; 
    height: 0; 
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #fff;
  }
  
  
  
  .dd-input {
    display: none;
  }
  
  .dd-menu {
    position: absolute;
    top: 100%;
    
  }
  
  .dd-input + .dd-menu {
    display: none;
  } 
  
  .dd-input:checked + .dd-menu {
    display: block;
    padding: 10px 2px;
    border: 1px solid #f1592a;
    border-radius: 10px 10px 10px 10px;
    max-width: 181px;
    left: 4px;
    top: 51px;
    text-align: center;
    background: #000;
}
  
  .dd-menu li {
    padding: 10px 20px;
    cursor: pointer;
    white-space: nowrap;
    width: 100%;
  }
  
  
  .dd-menu li a {
    display: block;
    margin: -15px -25px;
    padding: 12px 15px;
    font-size: 15px;
	      position: relative;
  }

.dd-menu li a:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background: #ffffff47;
    left: 15px;
    width: calc(100% - 30px);
    bottom: 3px;
}
.dd-menu li:last-child a:before {
    display: none;
}


  .dd-menu li a:hover{
    color: #f1592a;
  }
  
  .dd-menu li.divider{
    padding: 0;
    border-bottom: 1px solid #cccccc;
  }

.scrolled .dd-menu{background-color: #f1592abf;}