/*===============================================
Template Name: Logistcwr - Transport and Logistics HTML5 Template
Author:  https://themeforest.net/user/sthemeit
Description: Description
Version: 1.0.0
Text Domain: Logistcwr
================================================*/

/* CSS Index
=====================
01. Header Top Area
02. Header Menu Area
03. SLider Area
04. Feature Area
05. About Area 
06. Service Area
07. Testimonial Area
08. Appointment Area
09. FAQ Area
10. Project Area
11. Team Member
12. Pricing Area
13. Subscribe Area
14. Map Area
15. Blog Area
16. Brand Area
17. Footer Area
18. Breadcumb Area
19. Back-To-Top
20. 404 Area
21. Team Details
22. Progress-Bar Area
23. Project Details
24. BLog Details
25. Service Details

*/
@import url('../../../css2');

:root{
  --st-theme-color-one:#f56602;
  --st-theme-color-two:#003d4d;
  --st-theme-body-color:#525459;
  --st-theme-color-white:#fff;
  --st-testi-bg:#1d1d1d;
  --st-header-bg:#d1e4ea;
  --st-bg:#f5f4f9;
  --st-team-color:#f4f4f9;
  --st-header-meta-icon-bg:#000;
  --st-project-bg:#ebebeb;
  --st-theme-dark-color:#171717;
  --st-theme-dark-color-two:#202020;
  --st-theme-dark-color-three:#1f1f1f;
  --st-theme-dark-color-four:#262626;
  --st-theme-dark-color-text:#9f9f9f;
  --st-theme-dark-bg2:#090d16;
  --st-theme-dark-bg3:#070a11;
  --st-theme-dark-bg4:#070e16;
  --st-theme-dark-bg5:#0f191b;
  --st-theme-dark-bg6:#091018;
  --st-theme-rgba:rgba(255,255,255,0.2);
  --st-theme-sidebar-bg:#f7f6f1;
}
/* Custom Container CSS */
.container {
  max-width: 1396px;
}
.book__container {
  max-width: 1683px;
  background: var(--st-bg);
  margin-bottom: 0;
  position: relative;
}
.container-large {
  max-width: 1600px;
}
.container-largetwo {
  max-width: 1920px;
  padding: 0px 0 0 138px;
}
/* 01. Header Top Area */
.st-header-top-area {
  padding: 8px 0;
  background: var(--st-theme-color-one);
}
.st-header-top-info ul li {
  display: inline;
  margin-right: 76px;
  position: relative;
}
.st-header-top-info ul li:before {
  position: absolute;
  content: "";
  top: -8px;
  right: -38px;
  height: 40px;
  width: 1px;
  background: rgba(255,255,255,0.3);
}
.st-header-top-info ul li:last-child::before{
  display: none;
}
.st-header-top-info ul li a {
  color: var(--st-theme-color-white);
  font-size: 16px;
}
.st-header-top-info ul li a i {
  margin-right: 4px;
}
.st-header-top-social {
  text-align: right;
}
.st-header-top-social span {
  display: inline-block;
  color: var(--st-theme-color-white);
  margin-right: 15px;
  font-size: 18px;
}
.st-header-top-social ul {
  display: inline-block;
}
.st-header-top-social ul li {
  display: inline;
  margin-right: 12px;
}
.st-header-top-social ul li a {
  display: inline-block;
  font-size: 18px;
  color: var(--st-theme-color-white);
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st-header-top-social ul li a:hover {
  color: var(--st-theme-color-two);
}
/* Header Top Style Two */
.style2.st-header-top-area {
  background: var(--st-theme-color-white);
  position: relative;
  z-index: 1;
}
.style2.st-header-top-area::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  background: var(--st-theme-color-white);
  height: 100%;
  width: 112px;
  z-index: -1;
}
.style2.st-header-top-area::after {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  background: var(--st-theme-color-two);
  height: 100%;
  width: 203px;
  z-index: -1;
}
.style2.st-header-top-area .st-header-top-info ul li a{
  color: var(--st-theme-color-two);
}
.style2.st-header-top-area .st-header-top-social span {
  color: var(--st-theme-color-two);
}
.style2.st-header-top-area .st-header-top-social ul li a{
  color: var(--st-theme-color-two);
}
.style2.st-header-top-area .st-header-top-social {
  text-align: left;
  display: inline-block;
}
.header-top-btn {
  display: inline-block;
  float: inline-end;
  margin-right: 25px;
}
.header-top-btn a{
  font-size: 17px;
  letter-spacing: 2px;
  color: var(--st-theme-color-white);
  font-weight: 500;
}
.style2.st-header-top-area .st-header-top-social ul li a:hover {
  color: var(--st-theme-color-one);
}
/* ST Header Area */
.st-header-menu-area {
  background: var(--st-header-bg);
  padding: 25px 0 25px;
  position: relative;
}
.st-header-menu-area::before {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  background: var(--st-theme-color-two);
  width: 342px;
  height: 139px;
  z-index: 1;
}
.st-header-logo {
  position: relative;
  z-index: 1;
}
.st__logo__overlay{
  position: relative;
}
.st-header-menu-area.style2 .st__logo__overlay::before {
  transform: skewX(25deg);
  width: 22%;
  height: 124px;
  top: -34px;
  left: -28px;
}
.st-header-menu-area.style2 .st__logo__overlay::after {
  top: -21px;
  left: 20%;
  background: var(--st-project-bg);
  width: 3%;
  transform: skewX(25deg);
}
.st__logo__overlay::before {
  position: absolute;
  content: "";
  top: -25px;
  left: -44px;
  background: #000;
  width: 26%;
  height: 122px;
  z-index: 1;
  transform: skewX(-36deg);
}
.st__logo__overlay::after {
  position: absolute;
  content: "";
  top: -25px;
  left: 22%;
  background: var(--st-header-bg);
  width: 3%;
  height: 93px;
  z-index: 1;
  transform: skewX(30deg);
}
.st-header-logo a img {
  position: relative;
  left: -75px;
  max-width: 100%;
}
/* 02 Header Menu Area */
.st__menu__wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.st__main__menu {
  text-align: center;
  display: inline-block;
  position: relative;
  left: 93px;
}
.st-contact-meta {
  display: inline-block;
}
.st__header__right {
  display: flex;
  align-items: center;
  justify-content: center;
}
.main__menu ul li {
  display: inline;
  position: relative;
  z-index: 2;
  padding-bottom: 0px;
}
.main__menu ul li a {
  display: inline-block;
  color: var(--st-theme-color-two);
  font-size: 20px;
  font-weight: 500;
  position: relative;
  margin-right: 52px;
}
.main__menu ul li a i {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
}
.main__menu ul li a::before {
  position: absolute;
  content: "";
  bottom: 0;
  right: 0;
  background: var(--st-theme-color-two);
  width: 0%;
  height: 1px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.main__menu ul li a:hover::before{
  width: 100%;
  left: 0;
}
.st-contact-content {
  font-size: 18px;
  font-weight: 500;
  color: var(--st-theme-color-white);
  margin-left: 28px;
}
.st-contact-content span {
  display: block;
  font-weight: 500;
  color: var(--st-theme-color-white);
  font-size: 18px;
}
.st__contact__meta__inner {
  display: flex;
  align-items: center;
  float: right;
  position: relative;
  z-index: 1;
  left: 105px;
}
.st-contact-icon a i {
  display: inline-block;
  width: 72px;
  height: 72px;
  line-height: 72px;
  background: var(--st-header-meta-icon-bg);
  text-align: center;
  color: var(--st-theme-color-white);
  font-size: 30px;
  border-radius: 50%;
  -webkit-animation: pulse2 linear 1000ms infinite;
  animation: pulse2 linear 1000ms infinite;
  -webkit-transition: all 0.4s;
}
@keyframes pulse2{
  0% {
    -webkit-box-shadow: 0 0 0 0 var(--st-header-meta-icon-bg);
    box-shadow: 0 0 0 0 var(--st-header-meta-icon-bg);
  }
  70% {
    -webkit-box-shadow: 0 0 0 20px rgba(94, 223, 255, 0);
    box-shadow: 0 0 0 20px rgba(94, 223, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(94, 223, 255, 0);
    box-shadow: 0 0 0 0 rgba(94, 223, 255, 0);
  }
}
/* Sub Menu */
.main__menu ul li .sub__menu {
  position: absolute;
  top: 71px;
  left: 0;
  width: 330px;
  background: var(--st-theme-color-two);
  text-align: left;
  padding: 20px 0 20px 20px;
  opacity: 0;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  visibility: hidden;
  -webkit-transform: rotateX(-90deg);
  transform: rotateX(-90deg);
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
}
.main__menu ul li:hover .sub__menu{
  opacity: 1;
  visibility: visible;
  -webkit-transform: rotateX(0);
  transform: rotateX(0);
}
.main__menu ul li .sub__menu li {
  display: block;
  padding-bottom: 10px;
  overflow: hidden;
}
.main__menu ul li .sub__menu li a {
  margin-right: 0;
  color: var(--st-theme-color-white);
  display: inline-block;
  font-size: 16px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.main__menu ul li .sub__menu li a:hover{
  color: var(--st-theme-color-one);
}
.main__menu ul li .sub__menu li a::before {
  position: absolute;
  content: "";
  bottom: 0;
  right: 0;
  background: var(--st-theme-color-one);
  width: 0%;
  height: 1px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.main__menu ul li .sub__menu li a:hover::before {
  width: 100%;
  left: 0;
}
/* Sticky */
.is-sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  animation: .95s ease-in-out 0s normal none 1 running fadeInDown;
  z-index: 9;
  transition: all 0.7s cubic-bezier(0.645, 0.045, 0.355, 1);
  background-color: var(--st-header-bg);
  padding: 25px 0;
}
.st-header-menu-area.style2 .is-sticky {
  background: var(--st-project-bg);
  padding: 33px 0;
  height: 123px;
}
.st-header-menu-area.style2 .is-sticky::before {
  background-color: transparent;
}
.is-sticky .st__logo__overlay::before {
  height: 122px;
}
.is-sticky .st-header-logo::before {
  top: -55px;
}
.is-sticky::before {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  background: #000;
  width: 342px;
  height: 100%;
  z-index: 1;
}
.is-sticky .st-header-menu ul li .sub__menu {
  top: 73px;
}
/* Header Style Two */
.st-header-menu-area.style2 {
  background: var(--st-project-bg);
  padding: 33px 0;
}
.st-header-menu-area.style2 .st__main__menu {
  left: 115px;
}
.style2.st-header-menu-area::before {
  background: transparent;
}
.style2.st-header-menu-area .st-contact-icon a i {
  width: 56px;
  height: 56px;
  line-height: 56px;
  font-size: 20px;
}
.style2.st-header-menu-area .st-contact-content span {
  color: var(--st-theme-color-two);
}
.style2.st-header-menu-area .st-contact-content {
  color: var(--st-theme-color-two);
}
.style2.st-header-menu-area .st__contact__meta__inner {
  left: 123px;
}
/* 03. SLider Area */
.st-slider-area{
  height: 585px;
  position: relative;
  overflow: hidden;
}
.slider__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  transition: all 7000ms linear;
  -webkit-transition: all 7000ms linear;
  -moz-transition: all 7000ms linear;
  -ms-transition: all 7000ms linear;
  -o-transition: all 7000ms linear;
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
}
.owl-item.active .slider__bg{
  transform: scale(1.3);
  -webkit-transform: scale(1.3);
  -moz-transform: scale(1.3);
  -ms-transform: scale(1.3);
  -o-transform: scale(1.3);
}
.slider-content h5 {
  color: var(--st-theme-color-white);
  font-weight: 400;
  font-size: 20px;
  position: relative;
  display: inline-block;
  margin-left: 46px;
}
.slider-content h5::before {
  position: absolute;
  content: "";
  top: 0;
  left: -34px;
  background: var(--st-theme-color-one);
  height: 16px;
  width: 16px;
  transform: rotate(45deg);
  transition: all 1000ms ease;
  -webkit-animation: st__rotate 10s infinite linear;
  -moz-animation: st__rotate 5s infinite linear;
  -o-animation: st__rotate 5s infinite linear;
  animation: st__rotate 5s infinite linear; 
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running; 
  z-index: 1;
}
.slider-content h5::after {
  position: absolute;
  content: "";
  top: 0;
  left: -39px;
  background: var(--st-theme-color-white);
  height: 16px;
  width: 16px;
  transform: rotate(45deg);
  transition: all 1000ms ease;
  -webkit-animation: st__rotate 10s infinite linear;
  -moz-animation: st__rotate 5s infinite linear;
  -o-animation: st__rotate 5s infinite linear;
  animation: st__rotate 5s infinite linear; 
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running; 
}
@keyframes st__rotate{
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.slider-content h1 {
  color: var(--st-theme-color-white);
  line-height: 84px;
  font-size: 72px;
  font-weight: 600;
}
.slider-content p {
  color: var(--st-theme-color-white);
  margin-top: 25px;
  margin-bottom: 0px;
  font-size: 18px;
  width: 56%;
}
button.st__btn {
  border: none;
}
.st__btn {
  display: inline-block;
  background: var(--st-theme-color-one);
  font-size: 24px;
  color: var(--st-theme-color-white);
  padding: 18px 42px;
  position: relative;
  overflow: hidden;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  z-index: 1;
}
.st__btn:hover{
  color: var(--st-theme-color-two);
}
.st__btn::before {
  position: absolute;
  content: "";
  top: 0;
  left: -12px;
  width: 30px;
  height: 100%;
  background: var(--st-theme-color-white);
  transform: skew(22deg);
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  z-index: -1;
}
.st__btn:hover::before {
  width: 95%;
}
.st__btn i {
  margin-left: 17px;
  transform: rotate(-49deg);
  display: inline-block;
  font-size: 22px;
  color: var(--st-theme-color-white);
}
.st__btn:hover i{
  color: var(--st-theme-color-two);
}
.owl-item.active .slider-content h5 {
  animation: .50s ease-in-out 0.5s normal none 1 running fadeInDown;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  -webkit-animation: .50s ease-in-out 0.5s normal none 1 running fadeInDown;
}
.owl-item.active .slider-content h1 {
  animation: .60s ease-in-out 0.6s normal none 1 running fadeInDown;
  animation-fill-mode: both;
  animation-name: fadeInDown;
  -webkit-animation: .60s ease-in-out 0.6s normal none 1 running fadeInDown;
}
.owl-item.active .slider-content p {
  animation: .70s ease-in-out 0.7s normal none 1 running fadeInDown;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  -webkit-animation: .70s ease-in-out 0.7s normal none 1 running fadeInDown;
}
.owl-item.active .slider-content a {
  animation: .80s ease-in-out 1s normal none 1 running fadeInUp;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  -webkit-animation: .80s ease-in-out 1s normal none 1 running fadeInUp;
}
.st__slider__carousel .owl-nav {
  position: absolute;
  top: 43%;
  right: 70px;
}
.st__slider__carousel .owl-nav div i {
  color: var(--st-theme-color-white);
  font-size: 18px;
  background: var(--st-theme-color-one);
  width: 45px;
  height:45px;
  line-height:45px;
  display: inline-block;
  text-align: center;
  margin: 10px 0;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__slider__carousel .owl-nav div i:hover{
  background: var(--st-theme-color-two);
}
/* Slider Style Two */
.slider__style2.st__slider__carousel .owl-nav {
	position: absolute;
	bottom: 0;
	right: 70px;
	top: inherit;
	display: flex;
	background: #fff;
	padding: 30px 30px;
	/* border-radius: 50px 0 0 0; */
}
.slider__style2.st__slider__carousel .owl-nav div i {
  width: 66px;
  height: 66px;
  line-height: 66px;
  border-radius: 0;
  background: var(--st-theme-color-two);
  margin: 0 1px;
  font-size: 26px;
}
.slider__style2.st__slider__carousel .owl-nav div i:hover{
  background: var(--st-theme-color-one);
}
.st__slider__carousel.slider__style2 {
  position: relative;
}
.st__slider__carousel.slider__style2::before {
  position: absolute;
  content: "Slide Image";
  bottom: 39px;
  right: 295px;
  font-size: 22px;
  color: var(--st-theme-color-two);
  z-index: 1;
  font-family: "Josefin Sans Roman";
  font-weight: 500;
  display:none;
}
/* 04. Feature Area */
.st-feature-area {
  background: var(--st-theme-color-two);
}
.st__feature__box {
  background: var(--st-theme-color-white);
  padding: 42px 33px 33px;
}
.st__feature__icon {
  position: relative;
  z-index: 1;
}
.st__feature__icon::before {
  position: absolute;
  content: "";
  top: 0;
  left: 32px;
  background: #f1f1f1;
  width: 50px;
  height: 50px;
  transform: rotate(45deg);
  z-index: -1;
  transition: all 1000ms ease;
  -webkit-animation: st__rotate 10s infinite linear;
  -moz-animation: st__rotate 5s infinite linear;
  -o-animation: st__rotate 5s infinite linear;
  animation: st__rotate 5s infinite linear; 
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running; 
}
.st__feature__content h2 {
  font-size: 26px;
  font-weight: 500;
  margin-top: 25px;
  margin-bottom: 18px;
}
.line {
  display: inline-block;
  width: 80px;
  height: 3px;
  background: var(--st-theme-color-one);
  position: relative;
}
.line:after {
  position: absolute;
  content: '';
  height: 4px;
  width: 12px;
  background-color: var(--st-theme-color-white);
  left: 0;
  bottom: 0;
  animation: st__line 3s ease infinite alternate;
  -webkit-animation: st__line 3s ease infinite alternate;
}
@keyframes st__line{
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(74px);
    -webkit-transform: translateX(74px);
    -moz-transform: translateX(74px);
    -ms-transform: translateX(74px);
    -o-transform: translateX(74px);
  }
}
.st__feature__carousel .owl-nav {
  position: relative;
}
.st__feature__carousel .owl-nav div i {
  color: var(--st-theme-color-white);
  font-size: 18px;
  background: var(--st-theme-color-one);
  width: 65px;
  height: 65px;
  line-height: 65px;
  display: inline-block;
  text-align: center;
  margin: 10px 0;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  font-size: 22px;
}
.st__feature__carousel .owl-nav div i:hover{
  background: var(--st-header-meta-icon-bg);
}
.st__feature__carousel .owl-next {
  position: absolute;
  right: -115px;
  top: 50%;
  transform: translateY(-211px);
}
.st__feature__carousel .owl-prev {
  position: absolute;
  left: -115px;
  top: 50%;
  transform: translateY(-211px);
}
.st__feature__bottom span {
  font-size: 18px;
  font-weight: 400;
}
.st__feature__bottom span a {
  display: inline-block;
  color: var(--st-theme-color-one);
  position: relative;
  margin-left: 11px;
}
.st__feature__bottom span a::before {
  position: absolute;
  content: "";
  bottom: 0;
  right: 0;
  background: var(--st-theme-color-one);
  width: 0%;
  height: 1px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__feature__bottom span a:hover::before {
  width: 100%;
  left: 0;
}
/* 05. About Area */
.st__about__wrap {
  padding-left: 40px;
  margin-top: 18px;
}
.st__about__thumb img {
  max-width: 100%;
}
.st__section__title h5 {
  color: var(--st-theme-color-one);
  position: relative;
  display: inline-block;
  margin-left: 46px;
  font-size: 24px;
  font-weight: 500;
}
.st__section__title h5::before {
  position: absolute;
  content: "";
  top: 0;
  left: -45px;
  background: var(--st-theme-color-one);
  height: 16px;
  width: 16px;
  transform: rotate(45deg);
  transition: all 1000ms ease;
  -webkit-animation: st__rotate 10s infinite linear;
  -moz-animation: st__rotate 5s infinite linear;
  -o-animation: st__rotate 5s infinite linear;
  animation: st__rotate 5s infinite linear;
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running;
  z-index: 1;
}
.st__section__title h5::after {
  position: absolute;
  content: "";
  top: 0;
  left: -39px;
  background: var(--st-theme-color-two);
  height: 16px;
  width: 16px;
  transform: rotate(45deg);
  transition: all 1000ms ease;
  -webkit-animation: st__rotate 10s infinite linear;
  -moz-animation: st__rotate 5s infinite linear;
  -o-animation: st__rotate 5s infinite linear;
  animation: st__rotate 5s infinite linear;
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running;
  z-index: 1;
}
.st__section__title h1 {
  font-size: 48px;
  line-height: 52px;
  color: var(--st-theme-color-two);
  font-weight: 600;
  margin-top: 22px;
}
.st__section__title p {
  margin-top: 23px;
}
/* Section Title Style2 */
.st__section__title.style2 h5 {
  color: var(--st-theme-color-two);
}
.st__about__iconbox {
  background: var(--st-bg);
  padding: 31px 59px 13px;
  align-items: center;
  border-left: 5px solid var(--st-theme-color-one);
}
.st__about__icon {
  background: var(--st-theme-color-white);
  padding: 17px 18px;
  position: relative;
  margin-top: -18px;
}
.st__about__icon img{
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__about__iconbox:hover .st__about__icon img{
  transform: scale(0.8);
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
}
.st__about__icon::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 1px dashed var(--st-theme-color-one);
}
.st__about__iconcontent {
  margin-left: 22px;
}
.st__about__iconcontent h3 {
  font-size: 24px;
  color: var(--st-theme-color-two);
  font-weight: 500;
  margin-bottom: 10px;
}
.st-about-area .st__about__btn {
  display: inline-block;
}
.st__btn2 {
  display: inline-block;
  background: var(--st-theme-color-one);
  font-size: 24px;
  color: var(--st-theme-color-white);
  padding: 18px 38px;
  position: relative;
  overflow: hidden;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  z-index: 1;
}
.st__btn2:hover {
  color: var(--st-theme-color-white);
}
.st__btn2::before {
  position: absolute;
  content: "";
  top: 0;
  left: -12px;
  width: 30px;
  height: 100%;
  background: var(--st-theme-color-two);
  transform: skew(22deg);
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  z-index: -1;
}
.st__btn2:hover::before {
  width: 95%;
}
.st__btn2 i {
  margin-left: 17px;
  transform: rotate(-49deg);
  display: inline-block;
  font-size: 22px;
}
.st__about__info__icon a i {
  display: inline-block;
  width: 64px;
  height: 64px;
  line-height: 64px;
  background: #fce6ce;
  text-align: center;
  color: var(--st-theme-color-one);
  font-size: 25px;
  border-radius: 50%;
  -webkit-transition: all 0.4s;
}
@keyframes pulse3{
  0% {
    -webkit-box-shadow: 0 0 0 0 #fce6ce;
    box-shadow: 0 0 0 0 #fce6ce;
  }
  70% {
    -webkit-box-shadow: 0 0 0 20px rgba(94, 223, 255, 0);
    box-shadow: 0 0 0 20px rgba(94, 223, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(94, 223, 255, 0);
    box-shadow: 0 0 0 0 rgba(94, 223, 255, 0);
  }
}
.st__about__infocontent span {
  display: block;
  font-weight: 500;
  font-size: 18px;
  color: var(--st-theme-color-one);
}
.st__about__infocontent {
  font-size: 18px;
  font-weight: 500;
  margin-left: 28px;
}
.st__about__infometa {
  display: inline-block;
  position: relative;
  top: -21px;
  left: 30px;
}
/* About Style2 */
.st__about__right {
  display: flex;
  align-items: center;
  margin-top: 38px;
}
.st__about__list__box {
  border-bottom: 1px solid #ebebea;
  padding-bottom: 19px;
}
.about__list li {
  opacity: 0.949;
  font-size: 20px;
  color: var(--st-theme-color-two);
  font-weight: 500;
  margin-bottom: 15px;
  padding-left: 28px;
  position: relative;
}
.about__list li::before {
  position: absolute;
  content: "";
  top: 9px;
  left: 2px;
  width: 9px;
  height: 9px;
  background: var(--st-theme-color-one);
}
.about__list li::after {
  content: '';
  position: absolute;
  left: -1px;
  top: 6px;
  height: 15px;
  width: 15px;
  border: 1px solid var(--st-theme-color-one);
}
.st__about__video__box {
  display: inline-block;
  margin-right: 70px;
  margin-top: -10px;
}
.st__about__video {
  display: inline-block;
  width: 60px;
  line-height: 60px;
  height: 60px;
  background: var(--st-theme-color-one);
  text-align: center;
  border-radius: 50%;
  color: #fff;
  -webkit-animation: pulse3 linear 1000ms infinite;
  animation: pulse3 linear 1000ms infinite;
  -webkit-transition: all 0.4s;
  font-size: 27px;
}
@keyframes pulse3{
  0% {
    -webkit-box-shadow: 0 0 0 0 #f4f4f4;
    box-shadow: 0 0 0 0 #f4f4f4;
  }
  70% {
    -webkit-box-shadow: 0 0 0 20px #f4f4f4;
    box-shadow: 0 0 0 20px #f4f4f4;
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 #f4f4f4;
    box-shadow: 0 0 0 0 #f4f4f4;
  }
}
.st__about__video__box span {
  font-size: 18px;
  text-decoration: underline;
  font-weight: 500;
  margin-left: 18px;
}
/* 06. Service Area */
.st-service-area{
  background: var(--st-bg);
}
.st__section__title.text-center h5 {
  margin-left: 13px;
}
.circle {
  display: inline-block;
  position: relative;
}
.circle::before {
  position: absolute;
  content: "";
  top: -20px;
  left: 20px;
  background: var(--st-theme-color-one);
  height: 16px;
  width: 16px;
  transform: rotate(45deg);
  transition: all 1000ms ease;
  -webkit-animation: st__rotate 10s infinite linear;
  -moz-animation: st__rotate 5s infinite linear;
  -o-animation: st__rotate 5s infinite linear;
  animation: st__rotate 5s infinite linear;
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running;
  z-index: 1;
}
.circle::after {
  position: absolute;
  content: "";
  top: -16px;
  left: 20px;
  background: var(--st-theme-color-two);
  height: 16px;
  width: 16px;
  transform: rotate(45deg);
  transition: all 1000ms ease;
  -webkit-animation: st__rotate 10s infinite linear;
  -moz-animation: st__rotate 5s infinite linear;
  -o-animation: st__rotate 5s infinite linear;
  animation: st__rotate 5s infinite linear;
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running;
  z-index: 1;
}
.st__service__thumb {
  position: relative;
  z-index: 1;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  overflow: hidden;
}
.st__service__box:hover .st__service__thumb::before{
  width: 100%;
}
.st__service__thumb::before {
  position: absolute;
  content: "";
  bottom: 0;
  left: 0;
  width: 0%;
  height: 10px;
  background: var(--st-theme-color-one);
  z-index: 1;
  transition: 1s;
  -webkit-transition: 1s;
  -moz-transition: 1s;
  -ms-transition: 1s;
  -o-transition: 1s;
}
.st__service__thumb img {
  width: 100%;
  height: 330px;
  object-fit: cover;
}
.st__service__icon {
  position: absolute;
  top: 46px;
  left: 33px;
}
.st__service__content {
  background: var(--st-theme-color-white);
  padding: 21px 40px 52px;
  filter: drop-shadow(0px 1px 20px rgba(109,109,109,0.11));
  position: relative;
  left: 25px;
  bottom: 50px;
  width: 89%;
  border-left: 5px solid var(--st-theme-color-one);
  z-index: 1;
  max-height: 100%;
}
.text__four {
  padding: 21px 40px 28px;
  position: inherit;
  bottom: 0;
  left: 0;
  width: 100%;
}
.st__service__content::before {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  background: var(--st-theme-color-one);
  width: 0%;
  height: 100%;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  z-index: -1;
}
.st__service__box:hover .st__service__content::before{
  width: 100%;
  left: 0;
}
.st__service__content span {
  font-size: 18px;
  color: var(--st-theme-color-two);
  font-weight: 500;
  position: relative;
  left: 46px;
}
.st__service__content span::before {
  position: absolute;
  content: "";
  top: 12px;
  left: -46px;
  width: 34px;
  height: 2px;
  background: var(--st-theme-color-one);
}
.st__service__content h2 a {
  font-size: 26px;
  color: var(--st-theme-color-two);
  font-weight: 500;
  margin-top: 18px;
  display: inline-block;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.p-relative{
  position: relative;
}
.st__service__btn {
  position: absolute;
  right: 0;
  bottom: -27px;
  z-index: 1;
}
.st__service__btn a {
  display: inline-block;
  padding: 12px 29px;
  background: var(--st-theme-color-two);
  color: var(--st-theme-color-white);
  font-size: 30px;
  position: relative;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__service__btn a::before {
  position: absolute;
  content: "";
  top: 27px;
  right: 87px;
  background: var(--st-theme-color-two);
  width: 32px;
  height: 27px;
  z-index: 1;
  clip-path: polygon(0 0, 100% 0%, 100% 100%);
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__service__btn__one {
  background: var(--st-theme-color-two);
  display: inline-block;
  font-size: 18px;
  padding: 12px 19px;
  margin-top: 17px;
  transition: .6s;
}
.st__service__btn__one a{
  color: var(--st-theme-color-white);
}
.st__service__btn__one a i{
  color: var(--st-theme-color-white);
}
.st__service__box:hover .st__service__btn__one{
  background: var(--st-theme-color-white);
}
.st__service__box:hover .st__service__btn__one a{
  color: var(--st-theme-dark-bg2);
}
.st__service__box:hover .st__service__btn__one a i{
  color: var(--st-theme-dark-bg2);
}
.st__service__box:hover .st__service__btn a::before{
  background: var(--st-theme-color-one);
}
.st__service__box:hover .st__service__btn a{
  background: var(--st-theme-color-one);
}
.st__service__box:hover .st__service__content span,
.st__service__box:hover .st__service__content h2 a{
  color: var(--st-theme-color-white);
}
.st__service__box:hover .st__service__content span::before {
  background: var(--st-theme-color-white);
}
/* Service Style2 */
.st-service-area.style2 .st__service__content h2 a {
  font-size: 21px;
  color: var(--st-theme-color-two);
  font-weight: 600;
}
.st-service-area.style2 .st__service__content h2 a:hover{
  color: var(--st-theme-color-one);
}
.st-service-area.style2 .st__service__icon__two {
  background: var(--st-theme-color-two);
  width: 90px;
  height: 100px;
  line-height: 90px;
  text-align: center;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 0px 0 50px 50px;
}
.st-service-area.style2 .st__service__content {
  padding: 26px 10px 60px 113px;
  bottom: 70px;
  height: 210px;
  border-left: none;
}
.st-service-area.style2 .st__service__thumb__two{
  overflow: hidden;
}
.st-service-area.style2 .st__service__thumb__two img {
  width: 100%;
  height: 300px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st-service-area.style2 .st__service__box__two:hover .st__service__thumb__two img{
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.st-service-area.style2 .st__service__content p {
  line-height: 1.5;
  margin-top: 15px;
}
.st-service-area.style2 .st__service__btn {
  position: absolute;
  right: 0;
  bottom: -26px;
  z-index: 1;
}
.st-service-area.style2 .st__service__content::before {
  top: -28px;
  right: -50px;
  background: url(../images/service/bg.png);
  background-position: center center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
}
.st-service-area.style2 .st__service__btn a::before{
  background: var(--st-theme-color-one);
}
.st__service__box__two:hover .st__service__btn a::before{
  background: var(--st-theme-color-two);
}
.st__service__box__two:hover .st__service__btn a {
  background: var(--st-theme-color-one);
}
/* 07. Testimonial Area */
.st__testimonial__box {
  background: var(--st-bg);
  padding: 47px 29px 71px;
  z-index: 1;
}
.st__testimonial__box::before {
  position: absolute;
  content: "";
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0%;
  background: var(--st-theme-color-two);
  z-index: -1;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__testimonial__box:hover::before{
  top: 0;
  height: 100%;
}
.st__testi__inner {
  border-bottom: 1px solid rgba(219,219,219,0.9);
  padding-bottom: 30px;
  margin-bottom: 35px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__testimonial__box:hover .st__testi__inner{
  border-bottom: 1px solid rgba(219,219,219,0.2);
}
.st__testi__content h2 {
  font-size: 32px;
  font-weight: 600;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__testi__content {
  margin-left: 20px;
}
.st__testi__content span {
  font-size: 17px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__testi__desc p {
  font-size: 20px;
  line-height: 30px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__testi_quote {
  position: absolute;
  right: -11px;
  bottom: -6px;
}
.st__testimonial__box:hover .st__testi_quote i{
  color: rgba(238,238,238,0.2);
}
.st__testi_quote i {
  font-size: 150px;
  color: #e8e7ec;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__testimonial__box:hover .st__testi__content h2,
.st__testimonial__box:hover .st__testi__content span,
.st__testimonial__box:hover .st__testi__desc p{
  color: var(--st-theme-color-white);
}
/* Testimonial Style2 */
.st-testimonial-area.style2 {
  background: var(--st-testi-bg);
  padding-top: 482px;
}
.st-testimonial-area.style2 .st__section__title h5::after {
  background: var(--st-theme-color-white);
}
.st-testimonial-area.style2 .circle::after {
  background: var(--st-theme-color-white);
}
/* 08. Appointment Area */
.st-appointment-area {
  background: var(--st-theme-color-one);
  z-index: 1;
  overflow: hidden;
}
.st__appointment__bg {
  position: absolute;
  top: 33px;
  z-index: -1;
  right: 0;
  width: 50%;
  overflow: hidden;
}
.st__appointment__video {
  position: absolute;
  top: 22%;
  right: 11%;
}
.st__appointment__shape1 {
  -webkit-animation: st__updown 10s infinite linear;
  animation: st__updown 10s infinite linear;
  position: absolute;
  right: 11%;
  bottom: 1%;
}
@keyframes st__updown{
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
100% {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  }
  
}
.st__video {
  display: inline-block;
  color: var(--st-theme-color-white);
  width: 100px;
  height: 100px;
  line-height: 103px;
  background: var(--st-theme-color-one);
  text-align: center;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  position: relative;
}
.st__video:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 1px solid var(--st-theme-color-white);
  -webkit-animation: st__video 1500ms ease-out infinite;
  animation: st__video 1500ms ease-out infinite;
  z-index: 1;
}
@keyframes st__video {
  0% {
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.8);
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.8);
    opacity: 0;
  }
}
.st__video:hover{
  background: var(--st-theme-color-white);
}
.st__video:hover i{
  color: var(--st-theme-color-one);
}
.st__video i:hover{
  color: var(--st-theme-color-one);
}
.st__video i {
  font-size: 50px;
}
.st__contact__position {
  background: var(--st-theme-color-two);
  padding: 81px 100px 35px;
}
.st__form__box {
  margin-bottom: 26px;
}
.st__form__box input {
  width: 100%;
  height: 60px;
  border: none;
  padding-left: 32px;
  border-radius: 5px;
}
.st__form__box input::placeholder{
  font-size: 16px;
  color: #929fa2;
  font-weight: 400;
}
.st__form__box i {
  position: absolute;
  right: 20px;
  bottom: 16px;
  color: var(--st-theme-color-one);
}
.st__contact__right .st__form__box .nice-select {
  width: 100%;
  background: #f3f3f3;
 width: 100%;
    height: 60px;
    border: none;
    padding-left: 32px;
    border-radius: 5px;
        padding-top: 10px;
}
.st__contact__position .st__form__box .nice-select {
  width: 100%;
  background: #fff;
 width: 100%;
    height: 60px;
    border: none;
    padding-left: 32px;
    border-radius: 5px;
        padding-top: 10px;
}

.st__form__box .nice-select .list{
  width: 100%;
}
.st__form__box .nice-select span{
  font-size: 16px;
  color: #929fa2;
  font-weight: 400;
}
.st__form__box .nice-select .list li{
  font-size: 16px;
  color: #929fa2;
  transition: .5s;
  font-weight: 400;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__form__box .nice-select .list li:hover{
  color: var(--st-theme-color-one);
}
.nice-select:after {
  border-bottom: 2px solid var(--st-theme-color-one);;
  border-right: 2px solid var(--st-theme-color-one);;
  height: 8px;
  right: 20px;
  width: 8px;
}
.st-appointment-area .st__section__title h5::after {
  background: var(--st-theme-color-white);
}
.st-appointment-area .st__btn {
  padding: 18px 51px;
  border: none;
}
.st__btn i {
  color: var(--st-theme-color-white);
  transition: .5s;
}
/* Style Two */
.style2.st-appointment-area {
  background: var(--st-theme-color-one);
  padding: 77px 0 38px;
}
.st-appointment-area .st__section__title p {
  margin-top: 23px;
  width: 55%;
  margin-bottom: 39px;
  margin: 0 auto;
}
.style2.st-appointment-area .st__btn {
  padding: 17px 42px;
  background: transparent;
  border: 1px solid #fff;
  border-left: 1px solid var(--st-theme-color-one);
  margin-left: 24px;
}
.style2.st-appointment-area .st__btn i {
  color: var(--st-theme-color-white);
  transition: .5s;
  position: inherit;
  right: 0;
  bottom: 0;
  margin-left: 17px;
}
.style2.st-appointment-area .st__btn:hover{
  border: 1px solid var(--st-theme-color-one);
}
.style2.st-appointment-area .st__btn::before {
  background: var(--st-theme-color-one);
}
.style2.st-appointment-area .st__appointment__video {
  top: 33%;
  right: 15%;
}
.style2.st-appointment-area .st__appointment__shape1 {
  right: 19%;
  bottom: 25%;
}
.st-book-appointment-area .st__contact__position{
  background: var(--st-bg);
  padding: 79px 132px 47px;
}
.st-book-appointment-area .st__btn::before {
  background: var(--st-theme-color-two);
}
.st-book-appointment-area .st__btn:hover {
  color: var(--st-theme-color-white);
}
.st-book-appointment-area .st__btn:hover i{
  color: var(--st-theme-color-white);
}
.st-book-appointment-area .st__btn {
  padding: 18px 27px;
  border: none;
}
.st-appointment-area .st__btn {
  padding: 18px 27px;
  border: none;
}
.st-appointment-area .st__btn i {
  color: var(--st-theme-color-white);
  transition: .5s;
  position: inherit;
  right: 0;
  bottom: 0;
  margin-left: 0;
}
.st-appointment-area .st__btn:hover i{
  color: var(--st-theme-color-two);
}
.st-book-appointment-area .st__btn i {
  color: var(--st-theme-color-white);
  transition: .5s;
  position: inherit;
  right: 0;
  bottom: 0;
  margin-left: 0;
}
.st__book__info {
  background: var(--st-theme-color-two);
  padding: 49px 36px 43px;
  position: relative;
  z-index: 1;
}
.st__book__info:before {
  position: absolute;
  content: "";
  top: -41px;
  left: 23%;
  width: 210px;
  height: 210px;
  background: var(--st-theme-color-two);
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  -webkit-animation: st__updown 10s infinite linear;
  animation: st__updown 10s infinite linear;
  z-index: -1;
}
.st__book__info h4 {
  font-size: 28px;
  font-weight: 600;
  color: var(--st-theme-color-white);
  line-height: 1.3;
}
.st__book__info p {
  color: var(--st-team-color);
  width: 100%;
}
.st__book__info a {
  display: inline-block;
  background: var(--st-theme-color-white);
  color: var(--st-theme-color-one);
  padding: 13px 28px;
  font-size: 20px;
  font-weight: 500;
  margin-top: 18px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__book__info a:hover{
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
}
/* 09. FAQ Area */
.my-accordion {
  padding: 0;
  margin: 0 20px 0 0;
}
.my-accordion li {
  list-style: none;
  border-radius: 5px;
  padding: 0px 32px 14px;
  background: var(--st-bg);
  margin-bottom: 18px;
}
.my-accordion li h2 {
  position: relative;
  display: block;
  outline: 0;
  border: none;
  cursor: pointer;
  transition: .3s;
  margin-left: 0;
  padding: 25px 0px 5px;
  font-size: 20px;
  font-weight: 600;
}
.my-accordion li h2::after {
  content: "\F280";
  font-family: bootstrap-icons !important;
  position: absolute;
  right: 0;
  top: 20px;
  width: 35px;
  height: 35px;
  background: var(--st-theme-color-two);
  text-align: center;
  line-height: 37px;
  border-radius: 5px;
  color: #fff;
  font-size: 17px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.my-accordion li h2.active::after {
  content: "\F27E";
  background: var(--st-theme-color-one);
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.my-accordion p {
  display: none;
  margin: 4px 0px 11px 0px;
  font-size: 16px;
  width: 88%;
  font-weight: 500;
}
/* 10. Project Area */
.st__project__area .container.container-large {
  max-width: 1827px;
}
.st__project__single {
  overflow: hidden;
}
.st__project__thumb{
  overflow: hidden;
  position: relative;
}
.st__project__thumb img {
  width: 100%;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__project__content h2 a {
  text-transform: capitalize;
  font-size: 26px;
  color: var(--st-theme-color-two);
  margin-bottom: 6px;
  display: inline-block;
  font-weight: 600;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__project__content h2 a:hover{
  color: var(--st-theme-color-one);
}
.st__project__content span {
  font-size: 18px;
  color: var(--st-theme-color-two);
}
.st__project__content {
  position: absolute;
  bottom: 8px;
  left: 10px;
  background: var(--st-project-bg);
  width: 89%;
  padding: 25px 30px 19px;
  border-radius: 0 35px 0 0;
  transform: translateY(119px);
  opacity: 0;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__project__single:hover .st__project__content{
  transform: translateY(0px);
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  opacity: 1;
}
.st__project__btn {
  position: absolute;
  top: -90px;
  right: 11px;
  opacity: 0;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__project__single:hover .st__project__btn{
  top: 11px;
  opacity: 1;
}
.st__project__btn a {
  display: block;
  background: var(--st-theme-color-one);
  padding: 17px 20px;
  font-size: 18px;
  color: var(--st-theme-color-white);
  text-align: center;
  border-radius: 25px 0 0 0;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__project__btn a:hover{
  background: var(--st-theme-color-two);
}
.st__project__btn a i {
  display: block;
}
.row.mt {
  margin: 0px;
}
.col-lg-12.pmt {
  margin-top: 28px;
}
/* 11. Team Member */
.st__team__box {
  background: var(--st-theme-color-two);
  padding: 0 0 37px;
  border-radius: 280px 280px 0 0;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.st__team__box:before{
  position: absolute;
  content: "";
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0%;
  background: var(--st-theme-color-one);
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  z-index: -1;
}
.st__team__box:hover:before{
  height: 100%;
}
.st__team__thumb img{
  width: 100%;
}
.st__team__content {
  margin-top: 32px;
}
.st__team__content h2 {
  font-size: 25px;
  font-weight: 600;
  color: var(--st-theme-color-white);
}
.st__team__content span {
  font-size: 16px;
  color: var(--st-team-color);
  margin-top: 3px;
  display: inline-block;
}
.st__team__social {
  margin-top: 16px;
}
.st__team__social a {
  display: inline-block;
  width: 42px;
  height: 42px;
  line-height: 42px;
  background: var(--st-theme-color-white);
  text-align: center;
  color: var(--st-theme-color-two);
  font-size: 18px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__team__social a:hover{
  background: var(--st-theme-color-two);
  color: var(--st-theme-color-white);
}
/* 12. Pricing Area */
.st__pricing__box {
  filter: drop-shadow(0px 1px 20px rgba(0,0,0,0.08));
  background: var(--st-theme-color-white);
  padding: 52px 32px 40px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__pricing__box:hover{
  box-shadow: 0px 16px 48px 0px rgba(0, 0, 0, 0.175);
  transform: translateY(-10px);
  -webkit-transform: translateY(-10px);
  -moz-transform: translateY(-10px);
  -ms-transform: translateY(-10px);
  -o-transform: translateY(-10px);
}
.st__pricing__box::before {
  position: absolute;
  content: "";
  top: 184px;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--st-theme-color-one);
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__pricing__box::after {
  position: absolute;
  content: "";
  top: 184px;
  right: 0;
  width: 0%;
  height: 1px;
  background: var(--st-theme-color-two);
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__pricing__box:hover.st__pricing__box::after{
  background: var(--st-theme-color-two);
  width: 100%;
  left: 0;
}
.st__pricing__content h4 {
  margin-bottom: 37px;
  text-decoration: underline;
}
.st-price {
  font-size: 48px;
  color: var(--st-theme-color-two);
  font-weight: 600;
}
.st-dollar {
  font-size: 28px;
  color: #f56602;
  font-weight: 500;
  position: relative;
  top: -19px;
  left: -7px;
}
.st-month {
  font-size: 18px;
  color: #f56602;
  font-weight: 500;
  position: relative;
  left: -31px;
  top: 8px;
}
.st__pricing__content {
  padding-bottom: 32px;
  margin-bottom: 31px;
}
.st__pricing__body ul li {
  position: relative;
  padding-left: 28px;
  padding-bottom: 13px;
  font-size: 18px;
  font-weight: 500;
  text-transform: capitalize;
  border-bottom: 1px solid #f2f2f2;
}
.st__pricing__body ul li:last-child{
  text-decoration: line-through;
}
.st__pricing__body ul li::before {
  position: absolute;
  content: "";
  top: 9px;
  left: 2px;
  width: 9px;
  height: 9px;
  background: var(--st-theme-color-one);
}
.st__pricing__body ul li::after {
  content: '';
  position: absolute;
  left: -1px;
  top: 6px;
  height: 15px;
  width: 15px;
  border: 1px solid var(--st-theme-color-one);
}
.st__pricing__btn a {
  display: inline-block;
  color: var(--st-theme-color-white);
  background: var(--st-theme-color-two);
  padding: 12px 30px;
  font-size: 20px;
  font-weight: 500;
  position: relative;
  z-index: 1;
}
.st__pricing__btn a:before{
  position: absolute;
  content: "";
  bottom: 0;
  z-index: -1;
  left: 0;
  width: 100%;
  height: 0%;
  background: var(--st-theme-color-one);
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__pricing__btn a:hover:before{
  height: 100%;
  top: 0;
}
/* ST Call Do Action */
.st-call-do-action-content h2 {
  font-size: 48px;
  color: var(--st-theme-color-white);
  font-weight: 600;
  line-height: 60px;
}
.st-call-do-action .st__btn2 {
  margin-right: 25px;
  background: var(--st-theme-color-two);
}
.st-call-do-action .st__btn2::before {
  background: var(--st-theme-color-one);
}
/* 13. Subscribe Area */
.sub__bg {
  background: var(--st-theme-color-white);
  filter: drop-shadow(0px 1px 20px rgba(0,0,0,0.08));
  margin-top: -267px;
  margin-left: 35px;
}
.st__subscribe__content {
  padding: 0 92px;
}
.st__subscribe__content h2 {
  font-size: 39px;
  color: var(--st-theme-color-two);
  font-weight: 600;
  margin-bottom: 34px;
}
.st__subscribe__content span{ 
  font-size: 18px;
  color: var(--st-theme-color-two);
}
.st__subscribe__form {
  position: relative;
  margin-top: 55px;
}
.st__subscribe__form input {
  width: 100%;
  height: 62px;
  border: 1px solid #ebebeb;
  padding-left: 32px;
}
.st__subscribe__form input::placeholder{
  font-size: 18px;
  color: #747474;
  font-weight: 400;
}
.st__subscribe__form button {
  border: none;
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
  padding: 17px 38px;
  font-size: 24px;
  font-weight: 500;
  position: absolute;
  right: 0;
  top: 0;
}
/* Sub Style2 */
.st-subscribe-area.style2 .st__subscribe__content h2 {
  font-size: 45px;
}
.st-subscribe-area.style2 .st__subscribe__content span {
  color: var(--st-theme-color-two);
  font-size: 20px;
  font-weight: 400;
}
.st-subscribe-area.style2 .st__subscribe__form input {
  background: var(--st-theme-color-two);
  color: var(--st-theme-color-white);
}
.st-subscribe-area.style2 .st__subscribe__form input::placeholder{
  font-size: 16px;
  color: #fff;
} 
.st-subscribe-area.style2 .st__subscribe__form button {
  border: none;
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
  padding: 17px 38px;
  position: absolute;
  right: -53px;
  top: 7px;
  font-size: 22px;
  font-weight: 500;
  line-height: 0.6;
}
.st-subscribe-area.style2 .st__subscribe__form {
  position: relative;
  margin-top: 33px;
}
.sub__bg2 {
  background: #f3f3f9;
  margin-bottom: -172px;
  position: relative;
}
.st-subscribe-area.style2 .st__subscribe__thumb img {
  width: 100%;
  margin-left: 13px;
}
/* 14. Map Area */
.st__map iframe{
  width: 100%;
  /* height:  745px; */
  /* filter: saturate(0); */
}
/* 15. Blog Area */
.st__blog__content {
  filter: drop-shadow(0px 1px 20px rgba(0,61,77,0.11));
  background: var(--st-theme-color-white);
  border-radius: 3px;
  padding: 42px 50px 28px;
  position: relative;
  overflow: hidden;
}
.st__blog__content::before {
  position: absolute;
  content: "";
  top: 100%;
  left: 82%;
  width: 55px;
  height: 55px;
  border: 2px dashed var(--st-theme-color-one);
  border-radius: 50px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__blog__content::after {
  position: absolute;
  content: "";
  top: 90%;
  left: 100%;
  transition: .5s;
  width: 55px;
  height: 55px;
  border: 2px dashed var(--st-theme-color-two);
  border-radius: 50px;
  z-index: -1;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__blog__single__box:hover .st__blog__content::before{
  top: 90%;
}
.st__blog__single__box:hover .st__blog__content::after{
  left: 88%;
}
.st__blog__content h2 {
  margin-bottom: 0px;
}
.st__blog__thumb img {
  width: 100%;
}
.st__meta__top {
  margin-bottom: 20px;
  position: relative;
}
.st__blog__meta img {
  border-radius: 50%;
}
.st__blog__meta__content {
  margin-left: 15px;
}
.st__blog__cmt {
  display: inline-block;
  margin-left: 35px;
  font-weight: 500;
}
.st__blog__cmt i {
  color: var(--st-theme-color-one);
}
.st__blog__content h2 a {
  font-size: 29px;
  line-height: 42px;
  color: var(--st-theme-color-two);
  font-weight: 500;
  margin-top: 21px;
  background-repeat: no-repeat;
  background-image: linear-gradient(transparent calc(100% - 1px),currentColor 1px);
  transition: .9s cubic-bezier(.32,.32,.15,1.17);
  background-size: 0 100%;
  text-transform: capitalize;
}
.st__blog__content h2 a:hover {
  color: var(--st-theme-color-one);
  background-size: 100% 100%;
}
.st_blog_btn {
  font-size: 17px;
  color: var(--st-theme-color-one);
  font-weight: 500;
  background-repeat: no-repeat;
  background-image: linear-gradient(transparent calc(100% - 1px),currentColor 1px);
  transition: .9s cubic-bezier(.32,.32,.15,1.17);
  background-size: 0 100%;
}
.st_blog_btn:hover {
  color: var(--st-theme-color-one);
  background-size: 100% 100%;
}
.st__blog__meta {
  display: inline-block;
}
.st_blog_btn i {
  margin-left: 0;
  transform: rotate(49deg);
  display: inline-block;
  font-size: 32px;
  position: relative;
  top: 6px;
}
.st__meta__top::before {
  position: absolute;
  content: "";
  background: #ebebeb;
  height: 36px;
  width: 1px;
  top: 8px;
  left: 141px;
}
.st__blog__thumb {
  margin-bottom: 30px;
}
.style2.st__blog__thumb {
  margin-bottom: 0px;
  margin-top: 30px;
}
/* BLog Style Two */
.st-blog-area.style2 .st__blog__single__box {
  margin-bottom: 30px;
}
.st-blog-area.style2 .st__blog__content::before {
 display: none;
}
.st-blog-area.style2 .st__blog__content::after {
 display: none;
}
.st-blog-area.style2 .st__blog__thumb {
  margin-bottom: 0;
  position: relative;
}
.st-blog-area.style2 .st__blog__content {
  filter: none;
  background: #f8f8f8;
  padding: 42px 40px 28px;
}
.st-blog-area.style2 .st__blog__date {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
.st__blog__date:before {
  position: absolute;
  content: "";
  width: 76px;
  height: 76px;
  background: var(--st-theme-color-one);
  transform: rotate(45deg);
  top: 36px;
  left: -62px;
  z-index: -1;
}
.st__blog__date span {
  text-align: center;
  align-items: center;
  display: flex;
  justify-content: center;
  font-size: 18px;
  color: var(--st-theme-color-white);
  font-weight: 500;
  position: relative;
  left: -48px;
  top: 42px;
}
/* 16. Brand Area */
.brand-title h2 {
  font-size: 24px;
  color: var(--st-theme-color-two);
  font-weight: 500;
  background: var(--st-theme-color-white);
  padding: 13px 50px;
  display: inline-block;
  position: relative;
  top: -28px;
}
.st-brand-area {
  border-top: 1px solid #ebebeb;
}
.st__brand__thumb {
  padding: 30px 0;
  text-align: center;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  margin-top: 8px;
}
.st__brand__thumb:hover{
  background: #f6f6f6;
}
.st__brand__thumb img {
  display: inline-block !important;
}
.st__blog__meta__content span {
  font-weight: 500;
  color: #292930;
}
.st__blog__meta__content span a {
  font-weight: 500;
  color: #292930;
}
/* BLog Pagination */
.st__blog__pagination ul li {
  display: inline;
  margin-right: 8px;
}
.st__blog__pagination ul li a {
  display: inline-block;
  line-height: 40px;
  height: 40px;
  width: 40px;
  text-align: center;
  border: 1px solid #dddddd;
  border-radius: 3px;
  color: #292930;
  font-size: 18px;
  font-weight: 500;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__blog__pagination ul li .active{
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
  border: 1px solid var(--st-theme-color-one);
}
.st__blog__pagination ul li a:hover{
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
  border: 1px solid var(--st-theme-color-one);
}
/* 17. Footer Area */
.st-footer-area {
  overflow: hidden;
}
.ft_borer {
  border-bottom: 1px dashed var(--st-theme-color-one);
  padding-bottom: 121px;
}
.st__footer__text p {
  color: var(--st-theme-color-white);
  width: 80%;
  margin: 24px 0 0;
}
.st__social__icon h2 {
  opacity: 0.800;
  font-size: 22px;
  color: var(--st-theme-color-white);
  font-weight: 500;
  margin: 25px 0 0 18px;
  position: relative;
}
.st__social__icon h2::before {
  position: absolute;
  content: "";
  top: -3px;
  left: -18px;
  width: 3px;
  height: 30px;
  background: var(--st-theme-color-one);
}
.st__social__icon a {
  display: inline-block;
  color: var(--st-theme-color-white);
  width: 38px;
  height: 38px;
  line-height: 38px;
  border: 1px dashed rgba(255,255,255,.2);
  text-align: center;
  margin-top: 22px;
  margin-right: 10px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__social__icon a:hover{
  background: var(--st-theme-color-one);
  border: 1px dashed var(--st-theme-color-one);
}
.st__footer__title h2 {
  font-size: 24px;
  color: var(--st-theme-color-white);
  font-weight: 500;
  position: relative;
  margin-bottom: 43px;
}
.st__footer__title h2::before {
  position: absolute;
  content: "";
  bottom: -17px;
  left: 0;
  background: var(--st-theme-color-one);
  width: 100px;
  height: 1px;
}
.st__footer__link a {
  display: block;
  color: var(--st-theme-color-white);
  margin-bottom: 17px;
  font-size: 16px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__footer__link a:hover{
  color: var(--st-theme-color-one);
}
.st__footer__link a i {
  color: var(--st-theme-color-one);
  margin-right: 7px;
}
.st__footer__title p {
  color: var(--st-theme-color-white);
  opacity: 0.8;
}
.st__footer__subscribe__form input {
  font-size: 16px;
  color: #939393;
  font-weight: 400;
  border: none;
  padding: 18px 17px;
  width: 89%;
}
.st__footer__subscribe__form input::placeholder{
  font-size: 16px;
  color: #939393;
  font-weight: 400;
}
.st__footer__subscribe__form button {
  border: none;
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
  padding: 12px 19px;
  position: absolute;
  top: 6px;
  right: 42px;
}
.st__footer__copyright span {
  color: var(--st-theme-color-white);
  font-size: 18px;
  margin-top: 32px;
  display: inline-block;
}
.st__footer__copyright span a{
  display: inline-block;
  color: var(--st-theme-color-one);
  text-decoration: underline;
}
/* Footer Style Two */
.st-footer-area {
    background-color: #000;
    height: 400px;
    padding: 55px 0px;
}

.st-footer-area.style2 {
    /* padding-top: 410px;
    padding-bottom: 40px; */
}
.st-footer-area.style2 .st__footer__title h2 {
  font-size: 22px;
}
.st-footer-area.style2 .st__footer__title h2::before {
  position: absolute;
  content: "";
  bottom: -5px;
  left: -17px;
  background: var(--st-theme-color-one);
  width: 2px;
  height: 31px;
}
.st-footer-area.style2 .st__footer__link a {
  margin-bottom: 0;
  line-height: 2;
}
.st-footer-area.style2 .st__footer__link a:hover{
  text-decoration: underline;
}
.st__footer__grid ul li {
  display: inline;
}
.st__footer__grid ul li img {
  margin: 5px;
}
/* Footer CopyRIght Area */
.st-footer-copyright-area {
  padding: 15px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.footer__scroll {
  position: absolute;
  top: 0px;
  right: 0;
  left: 0;
  display: flex;
  justify-content: center;
  z-index: -1;
}
.st__footer__copyright__link ul li {
  display: inline;
}
.right__all__content {
  margin-left: 41px;
}
.st__footer__copyright__link ul li {
  display: inline;
  margin-left: 27px;
  color: #cacaca;
}
.st__footer__copyright__link ul li a{
  display: inline-block;
  color: #cacaca;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__footer__copyright__link ul li a:hover{
  color: var(--st-theme-color-one);
}
.st-footer-copyright-area .st__footer__copyright span {
  margin-top: 0;
}
.footer__scroll a {
  display: inline-block;
  background: var(--st-theme-color-two);
  border-radius: 50%;
  width: 55px;
  height: 55px;
  line-height: 60px;
  text-align: center;
  color: var(--st-theme-color-white);
  font-size: 25px;
}
/* 18. Breadcumb Area */
.breadcumb__top__content span {
  font-size: 18px;
  color: var(--st-theme-color-white);
}
.breadcumb__top__content h2{
  font-size: 72px;
  font-weight: 600;
  color: var(--st-theme-color-white);
  margin-top: 48px;
  margin-bottom: 30px;
}
.breadcumb__links {
  background: var(--st-theme-color-one);
  display: inline-block;
  padding: 20px 39px;
  border-radius: 7px 7px 0px 0px;
  margin-top: 88px;
}
.breadcumb__links ul li{
  display: inline;
}
.breadcumb__links ul li a {
  font-size: 22px;
  color: var(--st-theme-color-white);
  font-weight: 500;
}
/*------ 19. Back-To-Top ------------*/
.prgoress_scrollup {
  position: fixed;
  right: 55px;
  bottom: 80px;
  height: 48px;
  width: 48px;
  cursor: pointer;
  display: block;
  border-radius: 50px;
  box-shadow: inset 0 0 0 2px var(--st-theme-color-two);
  z-index: 2;
  opacity: 0;
  visibility: hidden;
  transform: translateY(15px);
  transform: translateY(15px) !important;
  transition: all 200ms linear !important;
  overflow: hidden;
}
.prgoress_scrollup.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) !important;
}
.prgoress_scrollup::after {
  position: absolute;
  font-family: bootstrap-icons!important;
  content: "\f148";
  text-align: center;
  line-height: 46px;
  font-size: 18px;
  color: var(--st-theme-color-one);
  left: 0;
  top: 0;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  font-weight: 900;
  z-index: 1;
  transition: all 200ms linear !important;
}
.prgoress_scrollup::before {
  position: absolute;
  font-family: bootstrap-icons!important;
  content: "\f148";
  text-align: center;
  line-height: 46px;
  font-size: 18px;
  font-weight: 900;
  opacity: 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  left: 0;
  top: 0;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  z-index: 2;
  transition: all 200ms linear !important;
}
.prgoress_scrollup:hover ::after {
  color: var(--st-theme-color-one);
}
.prgoress_scrollup:hover ::before {
  opacity: 1;
}
.prgoress_scrollup svg path {
  fill: none;
}
.prgoress_scrollup svg.progress-circle path {
  stroke: var(--st-theme-color-one);
  stroke-width: 4;
  box-sizing: border-box;
  transition: all 200ms linear !important;
}
/* 20. 404 Area */
.st__404__thumb img {
  max-width: 100%;
}
.st__404__btn {
  margin-top: 38px;
}
/* Contact Page CSS */
.contact__bg {
  filter: drop-shadow(0px 1px 25.5px rgba(0,0,0,0.15));
  background: #fff;
  padding: 60px 25px 61px;
}
.st__contact__info {
  background: var(--st-theme-color-two);
  padding: 78px 36px 46px;
}
.st__contact__title h2 {
  font-size: 36px;
  color: var(--st-theme-color-white);
  font-weight: 600;
  border-bottom: 1px solid var(--st-theme-color-one);
  padding-bottom: 26px;
  margin-bottom: 40px;
}
.st__cinfobox {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
  background: var(--st-theme-color-white);
  padding: 20px;
}
.st__cinfobox_icon i {
  display: inline-block;
  width: 59px;
  line-height: 59px;
  height: 59px;
  text-align: center;
  background: var(--st-theme-color-two);
  color: var(--st-theme-color-white);
  font-size: 22px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.st__cinfobox:hover .st__cinfobox_icon i{
  background: var(--st-theme-color-one);
}
.st__cinfobox_content {
  margin-left: 20px;
}
.st__cinfobox_content h5 {
  font-size: 24px;
  font-weight: 500;
  margin-bottom: 5px;
}
.st-contact-section .st__form__box input {
  background: #f3f3f3;
}
.st__form__box textarea {
  width: 100%;
  border: none;
  background: #f3f3f3;
  padding: 15px 32px;
}
.st__form__box input::placeholder{
  font-size: 16px;
  color:  #757575;
  font-weight: 400;
}
.st__form__box textarea::placeholder{
  font-size: 16px;
  color:  #757575;
  font-weight: 400;
}
.st__form__box textarea:focus{
  border: none;
  outline: 0;
  box-shadow: none;
}
.st-contact-section .st__btn2 i {
  position: inherit;
  bottom: 0;
  right: 0;
  color: var(--st-theme-color-white);
  margin-left: 10px;
}
.st-contact-section .st__btn2 {
  padding: 18px 28px;
  border: none;
}
.st__contact__right__title h2 {
  font-size: 48px;
  font-weight: 600;
  margin-bottom: 60px;
  position: relative;
}
.st__contact__right__title h2:before {
  position: absolute;
  content: "";
  bottom: -25px;
  left: 0;
  width: 125px;
  height: 1px;
  background: var(--st-theme-color-two);
}
.st__contact__right {
  margin-left: 35px;
}
/* 21. Team Details */
.team__details__right__content {
  padding-left: 47px;
  padding-top: 47px;
}
.team_details_thumb img {
  width: 100%;
}
.st__team__info {
  background: var(--st-theme-sidebar-bg);
  padding: 40px 67px 15px;
  margin-left: -178px;
  margin-top: 15px;
}
.st__team__info_inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.st__name__info__content span {
  font-size: 20px;
  color: #888888;
  margin-bottom: 13px;
  display: inline-block;
}
.st__name__info__content h5 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 28px;
}
.st__team__info_inner .st__team__social {
  margin-top: 0px;
}
.st__team__info_inner .st__team__social a {
  display: block;
  margin-bottom: 13px;
  border-radius: 50%;
}
.st__team__info_inner .st__team__social a:hover{
  background: var(--st-theme-color-one);
}
/* 22. Progress-Bar Area */
.skill-item {
  margin-bottom: 10px;
  position: relative;
  padding-bottom: 36px;
  overflow: hidden;
}
.skill-title, .skill-percentage {
  margin-bottom: 14px;
  font-size: 20px;
  font-weight: 600;
}
.skill-percentage {
  position: absolute;
  top: 6px;
  right: 0;
}
.count-box {
  border-radius: 3px;
  text-align: center;
  margin-top: -10px;
  color: #000000;
  font-size: 20px;
  font-weight: 600;
}
.bar-inner {
  width: 100%;
  height: 19px;
  background: var(--st-theme-color-two);
  border-radius: 0;
  position: relative;
  margin: -2px;
  overflow: hidden;
}
.progress-line {
  position: absolute;
  top: 0;
  left: -4px;
  width: 0;
  height: 19px;
  background: var(--st-theme-color-one);
  border-radius: 0;
  transition: 3s;
  transform: skewX(23deg);
}
.skill-thumb{
  overflow: hidden;
  position: relative;
  z-index: 9;
}
/* 23. Project Details */
.project__details__content h2 {
  font-size: 30px;
  font-weight: 600;
  margin-top: 57px;
}
.desc-1 {
  margin-top: 32px;
}
.desc-2 {
  margin-top: 24px;
}
.project__thumb2 img {
  width: 95%;
}
.desc-3 {
  margin-top: 44px;
}
.project__details__content {
  margin-bottom: 55px;
}
/* 24. BLog Details */
.st__blog__details__all__content {
  padding-right: 30px;
}
.blog__details__meta__all {
  display: flex;
  justify-content: space-between;
}
.st__blog__details__all__content img {
  margin-bottom: 35px;
  width: 100%;
}
.blog__details__meta a {
  font-size: 16px;
  color: #4d4e4f;
  font-weight: 400;
  margin-right: 28px;
}
.blog__details__meta a i {
  color: var(--st-theme-color-one);
  font-size: 20px;
}
.blog__details__social a {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  background: #ebeae5;
  text-align: center;
  border-radius: 50%;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  color: var(--st-theme-color-two);
}
.blog__details__social a:hover{
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
}
.heading-one {
  font-size: 40px;
  color: var(--st-theme-color-two);
  font-weight: 600;
  margin-top: 15px;
}
.details__desc__one {
  margin-top: 40px;
}
.details__desc__two {
  margin-top: 32px;
}
.blog__tags {
  border: 1px solid var(--st-theme-color-two);
  padding: 26px 33px;
  margin-top: 39px;
  margin-right: 50px;
}
.blog__tags span {
  font-size: 24px;
  font-weight: 500;
  color: var(--st-theme-color-two);
  margin-right: 28px;
}
.blog__tags a {
  font-size: 16px;
  font-weight: 500;
  color: var(--st-theme-color-two);
  padding: 5px 20px;
  border: 1px solid #eceae5;
  margin-right: 15px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.blog__tags a:hover{
  background: var(--st-theme-color-two);
  color: var(--st-theme-color-white);
}
.blog__details__meta__box {
  display: flex;
  margin-top: 45px;
  margin-bottom: 8px;
}
.blog__details__meta__box h5{
  font-size: 24px;
  font-weight: 600;
}
.blog__details__meta__box p {
  font-size: 20px;
  margin-top: 16px;
}
.blogdetails__meta__content {
  margin-left: 30px;
  margin-top: 13px;
}
.blogdetails__meta__social span {
  font-size: 18px;
  color: var(--st-theme-color-one);
  font-weight: 400;
  margin-right: 10px;
}
.blogdetails__meta__social a {
  display: inline-block;
  font-size: 18px;
  color: #9da1b0;
  margin-right: 12px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.blogdetails__meta__social a:hover{
  color: var(--st-theme-color-one);
}
.blogdetails__items {
  display: flex;
  justify-content: space-between;
  border-top: 1px solid var(--st-theme-color-two);
  border-bottom: 1px solid var(--st-theme-color-two);
  margin-right: 50px;
}
.blogdetails__items__box a {
  display: inline-block;
  width: 67px;
  height: 67px;
  line-height: 67px;
  background: var(--st-theme-sidebar-bg);
  color: var(--st-theme-color-two);
  text-align: center;
  font-size: 28px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.blogdetails__items__box a:hover{
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
}
.blogdetails__items__box h5 {
  display: inline-block;
  font-size: 20px;
  font-weight: 500;
  position: relative;
  top: 8px;
  left: 0;
  margin-left: 20px;
  margin-right: 20px;
  padding: 25px 0 31px;
}
.blogdetails__comments {
  margin-top: 45px;
  margin-right: 50px;
}
.blogdetails__title h2 {
  font-size: 30px;
  color: #292930;
  font-weight: 500;
  position: relative;
  display: inline-block;
}
.blogdetails__title h2:before {
  position: absolute;
  content: "";
  bottom: -20px;
  left: 0;
  height: 2px;
  width: 90px;
  background: var(--st-theme-color-one);
}
.blogdetails__comment__reply {
  margin-top: 63px;
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 12px;
}
.blogdetails__comment__reply_content {
  margin-left: 31px;
}
.blogdetails__comment__reply_content h2 {
  font-size: 20px;
  color: #292930;
  font-weight: 600;
  margin-bottom: 0;
}
.blogdetails__comment__reply_content span {
  color: #4d4e4f;
  margin-bottom: 6px;
  display: inline-block;
}
.blogdetails__reply__text a {
  display: inline-block;
  color: var(--st-theme-color-one);
}
.blogdetails__comment__reply.ml {
  margin-left: 70px;
}
.blog__leave__comment .st__form__box input {
  background: var(--st-theme-sidebar-bg);
}
.blog__leave__comment .st__form__box textarea {
  background: var(--st-theme-sidebar-bg);
}
.blog__leave__comment {
  padding-top: 70px;
}
.blog__comment__form {
  margin-top: 52px;
}
.blog__comment__form .st__btn2 {
  padding: 18px 28px;
  border: none;
}
.blog__comment__form .st__btn2 i {
  position: inherit;
  bottom: 0;
  right: 0;
  color: var(--st-theme-color-white);
  margin-left: 10px;
}
/* Blog Details Sidebar */
.blogdetails__sidebar_search {
  position: relative;
}
.blogdetails__sidebar_search input{
  width: 100%;
  height: 60px;
  border: none;
  padding-left: 32px;
  border-radius: 5px;
  background: var(--st-theme-sidebar-bg);
}
.blogdetails__sidebar_search input::placeholder{
  font-size: 16px;
  color: #868686;
  font-weight: 400;
}
.blogdetails__sidebar_search i {
  font-size: 25px;
  color: var(--st-theme-color-one);
  position: absolute;
  right: 0;
  top: 0;
  border: 1px dashed #d5d5d3;
  padding: 15px;
  cursor: pointer;
}
.sidebar__box {
  background: var(--st-theme-sidebar-bg);
  margin-top: 30px;
  padding: 56px 36px 28px;
}
.sidebar__title h2 {
  position: relative;
  font-size: 30px;
  font-weight: 600;
  border-bottom: 1px solid #ece6e6;
  padding-bottom: 20px;
  margin-bottom: 35px;
}
.sidebar__title h2:before {
  position: absolute;
  content: "";
  bottom: -1px;
  left: 0;
  height: 1px;
  width: 70px;
  background: var(--st-theme-color-one);
}
.sidebar__blog__content i {
  color: var(--st-theme-color-one);
  font-size: 14px;
}
.sidebar__blog__content {
    margin-top: -7px;
    padding-left: 20px;
}
.sidebar__blog__box {
  padding: 20px;
  background: var(--st-theme-color-white);
  margin-bottom: 30px;
}
.sidebar__blog__content h5 a {
  display: inline-block;
  color: var(--st-theme-color-two);
  font-weight: 500;
}
.sidebar__blog__content span {
  margin-left: 5px;
}
.sidebar__box ul li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  border-bottom: 1px solid #dddddd;
  padding-bottom: 12px;
}
.sidebar__query {
  padding: 56px 0 68px;
  margin-top: 30px;
}
.sidebar__query__content h2 {
  font-size: 48px;
  color: #ffffff;
  font-weight: 600;
  line-height: 60px;
}
.sidebar__query__content p {
  color: #fff;
  margin-top: 13px;
}
.sidebar__query__content a {
  display: inline-block;
  background: var(--st-theme-color-one);
  padding: 15px 38px;
  color: #fff;
  border-radius: 5px;
  font-weight: 500;
  font-size: 18px;
  margin-top: 25px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.sidebar__query__content a:hover{
  background: var(--st-theme-color-white);
  color: var(--st-theme-color-one);
}
.tagcloud a {
  display: inline-block;
  background: #fff;
  padding: 8px 20px;
  margin-bottom: 15px;
  color: #4d4e4f;
  font-weight: 500;
  font-size: 17px;
  margin-right: 5px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
}
.tagcloud a:hover{
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
}
/* 25. Service Details */
.service__details__wrap h2 {
  font-size: 40px;
  font-weight: 600;
  margin-top: 45px;
}
.text1 {
  margin-top: 27px;
}
.service__thumb2 {
  margin-top: 18px;
}
.service__thumb2 img {
  width: 100%;
}
.service__details__content1 {
  padding-left: 20px;
  padding-top: 30px;
}
.service__details_thumb img {
  width: 100%;
  height: 400px;
  object-fit: cover;
}
.service__details__content1 ul li {
  font-weight: 500;
  margin-bottom: 5px;
  position: relative;
  margin-left: 30px;
}
.service__details__content1 ul li::before {
  position: absolute;
  content: "";
  width: 13px;
  height: 13px;
  background: var(--st-theme-color-one);
  top: 9px;
  left: -28px;
}
.service__details__content1 h3 {
  font-size: 24px;
  font-weight: 600;
  border-bottom: 1px solid #d5d5d5;
  padding-bottom: 27px;
  margin-bottom: 12px;
}
.servcie__links a {
  display: flex;
  justify-content: space-between;
}
.servcie__links a {
  display: flex;
  justify-content: space-between;
  background: #f7f6f1;
  padding: 18px 32px;
  font-size: 18px;
  font-weight: 600;
  color: var(--st-theme-color-two);
  border: 1px dashed #f7f6f1;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  margin-bottom: 20px;
}
.servcie__links a:hover{
  border: 1px dashed var(--st-theme-color-one);
}
.service__contact__wrap {
  padding: 71px 0 71px;
  margin-top: 35px;
}
.service__details__left__wrap {
  padding-right: 30px;
}
.service__contact__content h2 {
  font-size: 36px;
  color: #ffffff;
  font-weight: 600;
  line-height: 48px;
  margin-bottom: 32px;
}
.service__contact__content span {
  display: block;
  color: #ededed;
  margin-top: 35px;
  margin-bottom: 20px;
}
.service__contact__content h3{
  font-size: 30px;
  color: #ededed;
  font-weight: 600;
}
.service__Details__btn a img {
  margin-right: 10px;
}
.service__Details__btn a {
  display: inline-block;
  background: var(--st-theme-color-one);
  padding: 22px 30px;
  width: 100%;
  color: var(--st-theme-color-white);
  font-size: 24px;
  font-weight: 600;
  margin-top: 30px;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  margin-bottom: 30px;
}
.service__Details__btn a:hover{
  background: var(--st-theme-color-two);
}
/* Hero Area */
.si__hero__area {
  padding-top: 216px;
  padding-bottom: 217px;
}
.si__hero__text {
  border: 2px solid var(--st-theme-color-white);
  display: inline-block;
  padding: 9px 55px 0px 52px;
  border-radius: 25px;
}
.si__hero__text h5{
  font-weight: 500;
  font-size: 18px;
  color: var(--st-theme-color-white);
}
.si__hero__content h1{
  font-weight: 700;
  font-size: 75px;
  line-height: 90px;
  color: var(--st-theme-color-white);
  margin-top: 16px;
}
.si__hero__content p{
  font-weight: 400;
  color: var(--st-theme-color-white);
  margin-top: 16px;
}
.si__hero__mainbox{
  display: flex;
  margin-top: 29px;
}
.si__btn {
  background: var(--st-theme-color-one);
  display: inline-block;
  padding: 16px 39px 9px 42px;
  transition: .6s;
  border-radius: 5px;
  font-weight: 500;
  font-size: 15px;
  color: var(--st-theme-color-white);
}
.si__btn:hover{
  background: var(--st-theme-color-two);
  color: var(--st-theme-color-white);
}
.si__btn i {
  margin-left: 7px;
}
.si__hero__btn a i{
  color: var(--st-theme-color-white);
  font-size: 15px;
  margin-left: 5px;
}
.si__hero__box{
  display: flex;
  margin-left: 27px;
}
.si__hero__right{
  margin-left: 15px;
}
.si__hero__right h5{
  font-weight: 500;
  font-size: 20px;
  color: var(--st-theme-color-white);
}
.si__hero__right a{
  font-weight: 500;
  font-size: 20px;
  color: var(--st-theme-color-white);
  display: block;
}
.si__hero__phone i{
  background: var( --st-theme-dark-color-text);
  color: var(--st-theme-color-white);
  width: 60px;
  height: 60px;
  line-height: 60px;
  display: flex;
  text-align: center;
  justify-content: center;
  border-radius: 50px;
  font-size: 27px;
}
/* About Area */
.si__section__title h5 {
  font-weight: 700;
  font-size: 20px;
  color: var(--st-theme-color-one);
  position: relative;
  display: inline-block;
  margin-left: 120px;
}
.si__section__title h5::before {
  position: absolute;
  content: "";
  top: 11px;
  left: -119px;
  background: var(--st-theme-color-one);
  width: 105px;
  height: 4px;
}
.si__section__title h1 {
  font-weight: 700;
  font-size: 44px;
  line-height: 53px;
  margin-top: -5px;
}
.si__section__title p{
  font-weight: 400;
  margin-top: 14px;
}
.si__about__list {
  display: flex;
  margin-top: -7px;
}
.si__about__list ul{
  margin-right: 33px;
}
.si__about__list ul li{
  font-weight: 700;
  font-size: 16px;
  margin-top: 12px;
}
.si__about__list ul li i{
  width: 24px;
  height: 24px;
  line-height: 24px;
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
  border-radius: 50px;
  text-align: center;
  margin-right: 17px;
}
.si__btn__two {
  background: var(--st-theme-color-two);
  display: inline-block;
  padding: 16px 40px 18px 39px;
  transition: .6s;
  border-radius: 5px;
  margin-top: 44px;
}
.si__btn__two{
  color: var(--st-theme-color-white);
}
.si__btn__two i{
  color: var(--st-theme-color-white);
  margin-left: 7px;
}
.si__btn__two:hover{
  background: var(--st-theme-color-one);
  color: var(--st-theme-color-white);
}
/* SI service Area */
.si__service__area {
  background:#fff9f3;
}
.si__service__text p {
  float: right;
}
.si__service__thumb__three {
  margin-top: 21px;
  position: relative;
  overflow: hidden;
}
.si__service__thumb__three img {
  transition: .8s;
  width: 100%;
  border-radius: 13px;
  margin-bottom: 7px;
}
.si__service__content__three {
  position: absolute;
  bottom: 0px;
  left: 31px;
  opacity: 0;
  transition: .5s;
}
.si__service__thumb__three:hover .si__service__content__three{
  opacity: 1;
  bottom: 40px;
}
.si__service__content__three h2{
  color: var(--st-theme-color-white);
}
/* SI Project Three Area */
.si__why__choose__three__area {
  border-radius: 30px;
}
.custom__width {
  max-width: 1860px;
  margin: 0 30px;
}
.si__why__choose__three__bg{
  max-width: 1200px;
  margin: 0 auto;
}
.si__project__three__thumb {
  position: relative;
  overflow: hidden;
}
.si__project__three__thumb img {
  width: 100%;
}
.si__project__three__content {
  display: inline-block;
  position: absolute;
  bottom: 27px;
  left: 20px;
  right: 20px;
  background: var(--st-theme-color-one);
  padding: 25px 30px 19px;
  border-radius: 0;
  transform: translateY(119px);
  opacity: 0;
  transition: .5s;
  -webkit-transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  border-radius: 5px;
}
.si__project__three__thumb:hover .si__project__three__content{
  opacity: 1;
  transform: translateY(0px);
}
.si__project__three__content__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.si__project__three__text span {
  font-weight: 500;
  font-size: 16px;
  color: var(--st-theme-color-two);
  padding-bottom: 8px;
  display: inline-block;
}
.si__project__three__text h6{
  font-weight: 700;
  font-size: 20px;
  color: #fff;
}
.si__project__three__icon a{
  background: var(--st-header-meta-icon-bg);
  display: inline-block;
  padding: 6px 11px;
  border-radius: 0 50px 50px 0px;
}
.si__project__three__icon a i {
  color: var(--st-theme-color-white);
  font-size: 20px;
  text-align: center;
}
.st__form__box2 .si__btn__two {
  margin-top: 0;
  border: none;
}
.form3__title h2 {
  font-size: 38px;
  color: #fff;
  margin-bottom: 50px;
  display: inline-block;
}
/* SI Why Choose Three Area */
.si__why__choose__three__content {
  margin-top: 29px;
}
.si__why__choose__three__content ul li{
  font-weight: 500;
  font-size: 15px;
  color: var(--st-theme-color-white);
}
.si__why__choose__three__content ul li i {
  color: var(--st-theme-color-one);
  margin-right: 7px;
}
.si__why__choose__three__btn {
  margin-top: 45px;
}
.si__why__choose__three__text h6{
  font-weight: 700;
font-size: 30px;
}
/* SI Trusted Three Area */
.si__trust__items {
  display: flex;
  justify-content: center;
}
.trustbox__list {
  background: var(--st-header-meta-icon-bg);
  width: 238px;
  height: 238px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  margin: 0 10px 20px;
}
.si__trusted__three__thumb{
  text-align: center;
}
.si__trusted__three__thumb h6{
  font-weight: 700;
  font-size: 20px;
  color: var(--st-theme-color-white);

}
.si__trusted__three__thumb img {
  margin-top: -84px;
}
.si__trusted__three__text h5 {
  font-weight: 500;
  font-size: 20px;
  margin-top: 39px;
}
.si__trusted__three__text h5 a{
  color: var(--st-theme-color-one);
}
/* SI Why Choose Area */
.si__why__choose__three__area {
  border-radius: 30px;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center center !important;
  position: relative;
}
.si__work__process__thumb{
  position: relative;
  display: inline-block;
}
.si__work__process__thumb img {
  width: 100%;
}
.si__work__process__text {
  position: absolute;
  top: 97px;
  left: -37px;
  border-radius: 50%;
}
.si__work__process__text span {
  color: var(--st-theme-color-white);
  font-size: 24px;
  font-weight: 500;
  background: var(--st-theme-color-one);
  width: 70px;
  height: 70px;
  line-height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: .6s;
  border: 4px solid var(--st-theme-color-two);
}
.si__work__process__box:hover .si__work__process__text span{
  background: var(--st-theme-color-two);
}
.si__work__process__content h3{
  color: var(--st-theme-color-white);
  font-size: 23px;
}
.si__work__process__content {
  margin-top: 28px;
}
.why-choose-shape {
  position: absolute;
  right: 95px;
  bottom: 34px;
  -webkit-animation: st__updown 10s infinite linear;
  animation: st__updown 10s infinite linear;
}
/* SI Testimonial Area */
.si__testimonial___navigation{
  gap: 30px;
  display: flex;
  justify-content: right;
  margin-top: 8px;
}
.si__testimonial___navigation button{
  height: 60px;
  width: 60px;
  line-height: 60px;
  background: var(--st-theme-color-one);
  border: none;
  border-radius: 50%;
  transition: .6s;
}
.si__testimonial___navigation button:hover{
  background: var(--st-theme-color-two);
}
.si__testimonial___navigation button i{
  font-weight: 900;
  font-size: 16px;
  line-height: 16px;
  color: var(--st-theme-color-white);
}
.si__testimonial__box {
  position: relative;
  margin-top: 78px;
}
.si__testimonial__content {
  border: 1px solid rgba(0, 0, 0, 0.2);
  padding: 41px 0 46px 25px;
  border-radius: 10px;  
}
.si__testimonial__content h4{
  font-weight: 700;
  font-size: 19px;
}
.si__testimonial__content p{
  width: 80%;
}
.si__testimonial__thumb {
  display: flex;
  margin-top: 39px;
}
.si__testimonial__text {
  margin-left: 15px;
}
.si__testimonial__text h5{
  font-size: 20px;
}
.si__testimonial__text span {
  top: -10px;
  position: relative;
  color: var(--st-theme-dark-bg2);
}
.si__testimonial__icon {
  position: absolute;
  top: -24px;
  right: 33px;
}
/* SI Promotion Area */
.si__promotion__content span{
  font-weight: 600;
  font-size: 20px;
  color: var(--st-theme-color-white);
}
.si__promotion__content h2 {
  font-weight: 600;
  font-size: 40px;
  color: var(--st-theme-color-white);
  margin-top: 23px;
  margin-bottom: 147px;
}
.si__promotion__content img {
  margin: 0 17px;
}
.si__promotion__text span{
  font-weight: 600;
  font-size: 20px;
  color: var(--st-theme-color-white);
}
.si__promotion__text h3{
  font-weight: 600;
  font-size: 40px;
  color: var(--st-theme-color-white);
  margin-top: 23px;
  margin-bottom: 147px;
}
.si__promotion__text img {
  margin: 0 17px;
}
/* SI Team Area */
.si__team__thumb img {
  width: 100%;
}
.si__team__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.si__team__inner__icon span {
  color: var(--st-theme-color-white);
  font-weight: 700;
  font-size: 15px;
  width: 62px;
  height: 62px;
  line-height:62px;
  background: var(--st-theme-color-one);
  display: inline-block;
  text-align: center;
  border-radius: 50px;
  border: 9px solid var(--st-theme-color-two);
}
.si__team__inner__icon a i {
  color: var(--st-theme-color-white);
  width: 33px;
  height: 33px;
  line-height: 33px;
  background: var(--st-theme-color-one);
  text-align: center;
  border-radius: 10px;
}
.text-black h5 {
  color: #000;
}
.text-black h1 {
  color: #000;
}
.text-black p {
  color: #000;
}
.st__slider__thumb{
  position: relative;
}
.st__slider__img {
  position: absolute;
  top: 144px;
  right: 99px;
}
/* Slider Style-five */
.si__slider__area__five {
  padding: 77px 0px;
}
.si__slider__thumb__five img{
  width: 100%;
}
.si__slider__content__five h1{
  color: var(--st-theme-color-white);
  font-weight: 700;
  font-size: 72px;
  line-height: 80px;
}
.si__slider__content__five h5{
  color: var(--st-theme-color-one);
  font-weight: 600;
  font-size: 15px;
  margin-bottom: 5px;
  text-transform: uppercase;
}
.si__slider__content__five p{
  color: var(--st-theme-color-white);
}
.si__slider__btn__five{
margin-top: 62px;
}
.si__btn__one {
  color: var(--st-theme-color-white);
  padding: 22px 48px;
  background: var(--st-theme-color-one);
  border-radius: 5px;
  font-size: 20px;
  transition: .5s;
  position: relative;
  text-transform: capitalize;
}
.si__btn__one::before{
  position: absolute;
  content: "";
  bottom: 0px;
  right: 0px;
  background:#163967;
  width: 53px;
  height: 55px;
  border-radius: 45px 0 0 0;
  opacity: 0.07;
  transition: .5s;
}
.si__btn__one:hover::before{
  width: 100%;
  height: 100%;
  border-radius: 0;
}
.si__btn__one:hover{
  color: #fff;
}
.si__slider__thumb img{
  width: 100%;
}
/* About Style-5 */
.si__about__area__five{
  padding: 100px 0 100px;
}
.si__about__thumb__five{
  position: relative;
}
.si__about__thumb__five img{
 width: 100%;
}
.si__section__title h1{
  text-transform: capitalize;
}
.si__section__title h5{
  text-transform: uppercase;
    font-weight: 600;
   font-size: 15px;
   margin-bottom: 16px;
}
.si__section__title p{
  font-size: 14px;
}
.si__about__content__five {
  display: inline-block;
  bottom: 189px;
  left: 104px;
  background: var(--st-theme-color-one);
  padding: 20px;
  border-radius: 30px;
  position: absolute;
}
.si__about__content__five h1{
  display: inline-block;
  color: var(--st-theme-color-white);
  font-size: 60px;
}
.si__about__content__five span{
   display: inline-block;
    top: 4px;
    position: relative;
    line-height: 1.3;
    color: var(--st-theme-color-white);
    font-weight: 500;
    font-size: 16px;
}
.si__about__list__five {
  display: flex;
  justify-content: space-between;
}
.si__about__list__five ul li{
  font-weight: 500;
  font-size: 13px;
  margin-bottom: 14px;
}
.si__about__list__five ul li i{
  color: var(--st-theme-color-one);
  font-size: 9px;
  font-weight: 500;
  margin-left: -1px;
  margin-right: 12px;
}
.si__about__btn__five{
  margin-top: 51px;
}
.si__about__box__five {
  display: flex;
  gap: 35px;
}
.si__about__box__two__five {
  margin-top: 27px;
  background: var(--st-theme-color-white);
  box-shadow: 0px 4.4px 12px -1px rgba(19, 16, 34, 0.06), 0px 2px 6.4px -1px rgba(19, 16, 34, 0.03);
  padding: 10px;
  border-radius: 5px;
}
.si__about__thumb__two__five{
  display: inline-block;
}
.si__about__thumb__two__five img{
  margin-top: -26px;
}
.si__about__content{
  display: inline-block;
}
.si__about__content h6{
  margin-bottom: 0;
}
.si__about__box__two__five {
  margin-top: 30px;
}
/* Service Style-5 */
  .si__service__box__five {
    background: #F7F8FA;
    box-shadow: 0px 4.4px 12px -1px rgba(19, 16, 34, 0.06), 0px 2px 6.4px -1px rgba(19, 16, 34, 0.03);
    padding: 55px 49px 53px 65px;
    display: inline-block;
    position: relative;
    z-index: 1;
    margin-bottom: 26px;
    transition: .5s;
    overflow: hidden;
}
.boc-fiesc{
  height: 480px;
}
.ser-boc12 {
    height: 302px;
    padding: 40px;
}

@media (max-width:575px) {
  .boc-fiesc{
  height: auto;
}
}

.si__service__box__five::before{
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: transparent;
  transition: 0.5s;
  z-index: -1;
}
.si__service__box__five::after{
  position: absolute;
  content: "";
  top: -193px;
  left: 0;
  width: 53%;
  height: 53%;
  transition: 0.6s;
  z-index: -1;
  background:#dd7d1e;
  border-radius: 0 0 226px 0px;
  opacity: 0;
}
.si__service__box__five:hover::after {
  top:-1px;
  opacity: 1;
}
.si__service__box__five:hover .si__service__icon__five img{
  filter: brightness(0) invert(1);
}
.si__service__box__five:hover::before {
  width: 100%;
  background:var(--st-theme-color-one);
}
.si__service__icon__five {
  margin-bottom: 25px;
}
.si__service__icon__five img {
  color: var(--st-theme-color-one);
  width: 50px;
}
.si__service__text__five h3 {
  margin-bottom: 24px;
  font-size: 26px;
}
.si__service__text__five{
  transition: .5s;
}
.si__service__box__five:hover .si__service__text__five h3,
.si__service__box__five:hover .si__service__text__five p,
.si__service__box__five:hover .si__service__btn{
  color: #fff;
}
.si__service__text__five p {
  font-size: 16px;
  transition: .5s;
  margin-bottom: 31px;
}
.si__service__btn {
  color:var(--st-theme-color-one);
  text-transform: uppercase;
  margin-top: 51px;
}
.si__service__btn i {
font-size: 26px;
display: inline-block;
margin-left: 14px;
top: 4px;
position: relative;
}
.si__service__btn__one{
  font-weight: 600;
font-size: 16px;
padding: 22px 30px;
display: inline-block;
background: var(--st-theme-color-one);
color: var(--st-theme-color-white);
position: relative;
z-index: 1;
transition: .6s;
}
.si__service__btn__one::before{
  position: absolute;
  content: "";
  bottom: 0px;
  right: 0px;
  background:#163967;
  width: 53px;
  height: 57px;
  border-radius: 45px 0 0 0;
  opacity: 0.07;
  z-index: -1;
}
.si__service__btn__one:hover{
  color: var(--st-theme-color-white);
  background: #000;
}
/* latest Project Style-5 */
.si__latest__project__area__five{
padding: 121px 0px 90px 0px;
}
.si__latest__project__thumb__five {
  position: relative;
  overflow: hidden;
  margin-bottom: 24px;
}
.si__latest__project__thumb__five img{
  width: 100%;
}
.si__latest__project__thumb__five::before{
content: "";
height: 50%;
width: 100%;
background: linear-gradient(180deg, rgba(9, 7, 33, 0) 26.5%, rgba(0, 61, 77, 0.7) 78.5%);
position: absolute;
bottom: 0;
left: 0;
right: 0;
transition: 0.6s;
opacity: 0;

}
.si__latest__project__thumb__five:hover::before{
  opacity: 1;
}
.si__latest__project__text__five{
  position: absolute;
  bottom: -25px;
  left: 38px;
  opacity: 0;
  transition: .5s;
}
.si__latest__project__thumb__five:hover .si__latest__project__text__five{
  bottom: 30px;
  opacity: 1;
  z-index: 1;
} 

.si__latest__project__text__five span{
  color: var(--st-theme-color-white);
}
.si__latest__project__text__five h3{
  color: var(--st-theme-color-white);
  margin-top: 6px;
  font-size: 25px;
}
/* Si Touch Style-5 */
.si__touch__area__five{
  position: relative;
  z-index: 2;
}
.si__touch__bg__five{
  background: var(--st-theme-color-white);
  box-shadow: 0px 4.4px 20px -1px rgba(19, 16, 34, 0.05);
  margin-bottom: -193px;
  padding: 81px 74px;
}
.si__touch__thumb__five img{
width: 100%;
}
.si__touch__from input{
  border: none;
  padding: 19px 24px;
  margin-bottom: 20px;
  width: 100%;
  border-bottom: 1px solid #e3e3e3;
}
.si__touch__from__five input:focus{
  border: none;
  outline: 0;
}
.si__touch__from input::placeholder {
  font-size: 16px;
}
.si__touch__from textarea {
  border: none;
  width: 100%;
  border-bottom: 1px solid #e3e3e3;
  height: 173px;
  padding-top: 15px;
  margin-left: 21px;
}
.si__touch__from textarea:focus {
  border-bottom: 1px solid #e3e3e3;
  outline: 0;
}
.si__touch__from textarea::placeholder{
 font-size: 16px;
}
.si__touch__btn__five{
  margin-top: 53px;
}
/* Si Our Experts Style-5 */
.si__our__experts__five__area{
  padding: 307px 0 200px;
  position: relative;
  z-index: 1;
}
.si__our__experts__five__area::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #003d4d;
  z-index: -1;
  opacity: 0.9;
}
.si__our__experts__five__box{
  padding-bottom: 56px;
}
.si__our__experts__five__thumb{
  position: relative;
}
.si__our__experts__five__thumb img{
  width: 100%;
}
.si__our__experts__five__inner{
  background:var(--st-theme-color-white);
  padding: 28px 33px 22px 33px;
  box-shadow: 0px 4.4px 12px -1px rgba(19, 16, 34, 0.06), 0px 2px 6.4px -1px rgba(19, 16, 34, 0.03);
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 347px;
  position: absolute;
  bottom: -54px;
  left: 33px;
  border-radius: 8px;
}
.si__our__experts__five__icon a i {
  width: 50px;
  height: 50px;
  line-height: 50px;
  background: var(--st-theme-color-one);
  display: inline-block;
  text-align: center;
  font-weight: 500;
  color: var(--st-theme-color-white);
  border-radius: 8px;
  transition: .5s;
  z-index: 2;
  position: relative;
}
.si__our__experts__five__icon a i:hover{
  background: var(--st-header-meta-icon-bg);
}
.si__our__experts__five__social__icon{
  position: absolute;
  content: "";
  bottom: 15px;
  opacity: 0;
  transition: .5s;
  display: inline-block;
  margin-left: -50px;
}
.si__our__experts__five__social__icon a i{
  margin-bottom: 12px;
}
.si__our__experts__five__icon:hover .si__our__experts__five__social__icon{
  opacity: 1;
  bottom: 90px;
}
.si__our__experts__five__navigation{
   gap: 30px;
    display: flex;
    justify-content: right;
    margin-top: 8px;
}
.si__our__experts__five__navigation button{
  height: 60px;
  width: 60px;
  line-height: 60px;
  background: var(--st-theme-color-one);
  border: none;
  border-radius: 50%;
  transition: .6s;
}
.si__our__experts__five__navigation button i{
  color: var(--st-theme-color-white);
  font-size: 30px;
}
.si__our__experts__five__navigation button:hover{
  background: var(--st-header-meta-icon-bg);
  color: var(--st-theme-color-white);
}
/* Si Counter Style-5 */
.si__counter__area__five {
  z-index: 2;
  position: relative;
}
.si__counter__bg__five {
  background: #002841;
  padding: 79px 71px;
  margin-top: -232px;
  z-index: -1;
}
.si__counter__box__five {
  display: flex;
}
.si__counter__inner__five{
  background: var(--st-header-meta-icon-bg);
  width: 75px;
  height: 75px;
  line-height: 75px;
  text-align: center;
  border: 2px solid #335367;
  border-radius: 5px;
}
.si__counter__text__five {
  top: 7px;
  position: relative;
  margin-left: 9px;
}
.si__counter__text__five h1{
  display: inline-block;
  color: var(--st-theme-color-white);
}
.si__counter__text__five h2{
  display: inline-block;
  font-size: 48px;
  color: var(--st-theme-color-white);
}
.si__counter__text__five span{
  display: block;
  color: var(--st-theme-color-white);
}
/* Si Our Faq Style-5 */
  .si__our__faq__area__five {
    padding: 35px 0 0;
}
.si__our__fap__thumb__five img {
  width: 100%;
}
.accordion-button:not(.collapsed) {
color: var(--st-theme-color-white);
  background-color:var(--st-theme-color-one);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
}
/* Si Our Recent Style-5 */
.si__our__recent__area__five {
  padding: 117px 0px 112px;
}
.si__our__recent__right__five {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.si__our__recent__thumb__five img {
  width: 100%;
}
.si__our__recent__taq__five a {
  font-weight: 400;
  font-size: 14px;
  color: #38495F;
}
.si__our__recent__taq__five i {
 
 color: var(--st-theme-color-one);
 font-weight: 500;
}
.si__our__recent__text__five h4 {
  margin-bottom: 16px;
  line-height: 1.5;
  transition: .6s;
}
.si__our__recent__text__five h4:hover{
  color: #E02E2E;
}
.si__our__recent__text__five p {
  line-height: 35px;
}
.si__our__recent__box__five{
  transition: .5s;
  z-index: 1;
}
.si__our__recent__thumb__five{
  overflow: hidden;

}
.si__our__recent__thumb__five img{
  transition: .5s;
}
.si__our__recent__box__five:hover .si__our__recent__thumb__five img{
transform: scale(1.1);
}
.si__our__recent__inner__five {
  background: var(--st-theme-color-white);
  padding: 32px 29px 30px 38px;
  border: 1px solid #E3E3E3;
  position: relative;
  z-index: 1;
}
.si__our__recent__inner__five::before{
position: absolute;
  content: "";
  height: 3px;
  width: 100%;
  background-color: var(--si-theme-color);
  position: absolute;
  bottom: 0;
  left: 0px;
  border-radius: 8px;
  z-index: -1;
  transition: 0.6s;
}
.si__our__recent__inner__five:hover::before{
  width: 100%;
  opacity: 1;
  background: #f00;
}
.si__our__recent__inner__five::after{
  position: absolute;
  content: "";
  height: 1px;
  width: 100%;
  background-color: #E1E1E1;
  position: absolute;
  bottom: 0;
  left: 3px;
  right: 0px;
  border: 1px solid #f00;
  border-radius: 8px;
  z-index: -1;
  opacity: 0;

}
.si__our__recent__taq__five {
  margin-bottom: 14px;
}
.si__our__recent__taq__five i {
  margin-right: 11px;
}
.si__btn2{
  display: inline-block;
  color:  #38495F;
position: relative;
transition: .6s;
}
.si__btn2:hover{
  color: #E02E2E;
}
.si__btn2 i{
  font-size: 27px;
  color:  #38495F;
  position: relative;
  top: 5px;
  margin-left: 13px;
}
/* Si Subscribe Style-5 */
.si__subscribe__area__five{
  padding: 97px 0 97px 0;
}
.si__subscribe__content__five h1{
  margin-bottom: 38px;
}
.si__subscribe__from input{
  border: none;
  padding: 19px 24px;
  margin-bottom: 20px;
  width: 63%;
  border-bottom: 1px solid #e3e3e3;
}
.si__subscribe__from input:focus{
  border: none;
  outline: 0;
}
.si__subscribe__from input::placeholder{
 font-size: 18px;
}
header{
  height: 123px;
}

.st__service__icon__two img {
    width: 44px !important;
    text-align: center;
    justify-content: center;
    margin: 0 auto;
    align-items: center;
    margin: 0 auto;
    padding-top: 20px;
}
/* Icon Animation */
.si__service__icon__five {
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-bottom: 25px;
}

.si__service__icon__five i {
    font-size: 48px;
    color: #ff6b00;
    display: inline-block;
    transition: all 0.4s ease;
}

/* Hover Icon Animation */
.si__service__box__five:hover .si__service__icon__five i {
    transform: scale(1.15) rotate(8deg);
    color: #ffffff;
}

/* Orange Glow */
.si__service__box__five:hover .si__service__icon__five {
    animation: iconPulse 1s ease-in-out;
}

@keyframes iconPulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.12);
    }

    100% {
        transform: scale(1);
    }
}

.st__footer__logo img {
    width: 214px;
    background: #000;
    padding: 11px 17px;
}

/* =========================================================
   CONTACT INFO CARD
========================================================= */

.st__book__info {
    position: relative;
    padding: 42px;
    overflow: hidden;
}


/* Decorative circle */

.st__book__info::before {
    content: "";
    position: absolute;

    width: 230px;
    height: 230px;

    right: -120px;
    top: -120px;

    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 50%;

    transition: all 0.7s ease;
}

.st__book__info:hover::before {
    transform: scale(1.3);
}


/* =========================================================
   TAG
========================================================= */

.st__book__info .book-info-tag {
    position: relative;
    z-index: 2;

    display: inline-block;

    margin-bottom: 15px;
}

.st__book__info .book-info-tag span {
    display: inline-block;

    padding: 8px 14px;

    border: 1px solid rgba(255,255,255,0.35);
    border-radius: 30px;

    color: #ffffff !important;

    font-size: 11px;
    font-weight: 600;

    letter-spacing: 2px;

    transition: all 0.4s ease;
}

.st__book__info .book-info-tag span:hover {
    background: rgba(255,255,255,0.10);
    letter-spacing: 3px;
}


/* =========================================================
   HEADING
========================================================= */

.st__book__info h4 {
    position: relative;
    z-index: 2;

    color: #ffffff !important;

    font-size: 32px;
    line-height: 1.15;

    margin-bottom: 18px;

    transition: all 0.4s ease;
}

.st__book__info:hover h4 {
    transform: translateX(5px);
}


/* =========================================================
   DESCRIPTION
========================================================= */

.st__book__info .book-info-desc {
    position: relative;
    z-index: 2;

    color: rgba(255,255,255,0.85) !important;

    font-size: 14px;
    line-height: 1.8;

    margin-bottom: 28px;
}


/* =========================================================
   CONTACT LIST
========================================================= */

.st__book__info .book-contact-list {
    position: relative;
    z-index: 3;
}


/* =========================================================
   CONTACT ITEM
========================================================= */

.st__book__info .book-contact-item {
    display: flex;
    align-items: center;

    gap: 15px;

    padding: 14px;

    margin-bottom: 10px;

    border: 1px solid rgba(255,255,255,0.13);

    border-radius: 12px;

    background: rgba(255,255,255,0.025);

    transition:
        transform 0.4s ease,
        background 0.4s ease,
        border-color 0.4s ease,
        box-shadow 0.4s ease;
}


/* ITEM HOVER */

.st__book__info .book-contact-item:hover {
    transform: translateX(8px);

    background: rgba(255,255,255,0.08);

    border-color: rgba(255,255,255,0.30);

    box-shadow: 0 10px 25px rgba(0,0,0,0.12);
}


/* =========================================================
   ICON BOX
========================================================= */

.st__book__info .book-contact-icon {
    width: 48px;
    height: 48px;

    min-width: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(255,255,255,0.10);

    border: 1px solid rgba(255,255,255,0.22);

    border-radius: 10px;

    color: #ffffff !important;

    transition: all 0.5s ease;
}


/* ICON */

.st__book__info .book-contact-icon i {
    color: #ffffff !important;

    font-size: 18px;

    line-height: 1;

    transition: all 0.45s ease;
}


/* ICON HOVER */

.st__book__info .book-contact-item:hover .book-contact-icon {
    transform: rotate(360deg) scale(1.08);

    background: rgba(255,255,255,0.18);

    border-color: rgba(255,255,255,0.40);

    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}


/* =========================================================
   CONTACT CONTENT
========================================================= */

.st__book__info .book-contact-content {
    min-width: 0;

    transition: all 0.35s ease;
}

.st__book__info .book-contact-item:hover .book-contact-content {
    transform: translateX(4px);
}


/* LABEL */

.st__book__info .book-contact-content span {
    display: block;

    color: rgba(255,255,255,0.60) !important;

    font-size: 10px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: 1.5px;

    margin-bottom: 4px;
}


/* EMAIL / PHONE */

.st__book__info .book-contact-content a {
    display: inline-block;

    color: #ffffff !important;

    font-size: 15px;
    font-weight: 500;

    text-decoration: none !important;

    transition: all 0.35s ease;
}


/* LINK HOVER */

.st__book__info .book-contact-content a:hover {
    color: #ffffff !important;

    transform: translateX(6px);
}


/* =========================================================
   ADDRESS
========================================================= */

.st__book__info .book-contact-content p {
    color: rgba(255,255,255,0.85) !important;

    font-size: 13px;

    line-height: 1.55;

    margin: 0;
}


/* =========================================================
   CONTACT BUTTON
========================================================= */

.st__book__info .book-contact-btn {
    position: relative;
    z-index: 3;

    display: inline-flex;
    align-items: center;

    gap: 9px;

    margin-top: 15px;

    padding: 13px 22px;

    background: #ffffff !important;

    color: #ff5a00 !important;

    border-radius: 2px;

    text-decoration: none !important;

    overflow: hidden;

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


/* BUTTON TEXT */

.st__book__info .book-contact-btn span {
    color: #ff5a00 !important;
}


/* BUTTON ICON */

.st__book__info .book-contact-btn i {
    color: #ff5a00 !important;

    transition: transform 0.35s ease;
}


/* BUTTON HOVER */

.st__book__info .book-contact-btn:hover {
    transform: translateY(-5px);

    box-shadow: 0 12px 25px rgba(0,0,0,0.20);
}

.st__book__info .book-contact-btn:hover i {
    transform: translateX(7px);
}


/* =========================================================
   BUTTON SHINE
========================================================= */

.st__book__info .book-contact-btn::before {
    content: "";

    position: absolute;

    top: 0;
    left: -120%;

    width: 70%;
    height: 100%;

    background: rgba(255,255,255,0.5);

    transform: skewX(-25deg);

    transition: left 0.6s ease;
}

.st__book__info .book-contact-btn:hover::before {
    left: 130%;
}


/* =========================================================
   ENTRY ANIMATION
   WOW JS KI NEED NAHI HAI
========================================================= */

.st__book__info .book-info-tag {
    animation: contactTag 0.7s ease both;
}

.st__book__info h4 {
    animation: contactHeading 0.8s ease both;
    animation-delay: 0.15s;
}

.st__book__info .book-info-desc {
    animation: contactDesc 0.8s ease both;
    animation-delay: 0.25s;
}

.st__book__info .book-contact-item {
    opacity: 1 !important;

    animation: contactItem 0.7s ease both;
}

.st__book__info .book-contact-item:nth-child(1) {
    animation-delay: 0.35s;
}

.st__book__info .book-contact-item:nth-child(2) {
    animation-delay: 0.50s;
}

.st__book__info .book-contact-item:nth-child(3) {
    animation-delay: 0.65s;
}

.st__book__info .book-contact-btn {
    animation: contactButton 0.7s ease both;
    animation-delay: 0.80s;
}


/* =========================================================
   KEYFRAMES
========================================================= */

@keyframes contactTag {

    from {
        opacity: 0;
        transform: translateY(-15px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


@keyframes contactHeading {

    from {
        opacity: 0;
        transform: translateX(-30px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}


@keyframes contactDesc {

    from {
        opacity: 0;
        transform: translateY(15px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


@keyframes contactItem {

    from {
        opacity: 0;
        transform: translateX(-35px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}


@keyframes contactButton {

    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .st__book__info {
        padding: 30px 22px;
    }

    .st__book__info h4 {
        font-size: 28px;
    }

    .st__book__info .book-info-desc {
        font-size: 13px;
    }

    .st__book__info .book-contact-item {
        padding: 12px;
    }

    .st__book__info .book-contact-icon {
        width: 44px;
        height: 44px;
        min-width: 44px;
    }

    .st__book__info .book-contact-content a {
        font-size: 14px;
    }

    .st__book__info .book-contact-content p {
        font-size: 12px;
    }

}

.cta-banner{
    position:relative;
    overflow:hidden;
    padding: 64px 0;
    background: linear-gradient(115deg, #f2650f 0%, #ff8a2b 55%, #f2650f 100%);
    background-size: 200% 200%;
    animation: gradientDrift 10s ease-in-out infinite;
  }
 
  @keyframes gradientDrift{
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
  }
 
  /* decorative floating circles for depth */
  .cta-banner::before,
  .cta-banner::after{
    content:"";
    position:absolute;
    border-radius:50%;
    background: rgba(255,255,255,0.08);
    pointer-events:none;
  }
  .cta-banner::before{
    width: 380px; height: 380px;
    top: -180px; right: 8%;
    animation: float1 7s ease-in-out infinite;
  }
  .cta-banner::after{
    width: 220px; height: 220px;
    bottom: -140px; right: 22%;
    animation: float2 8s ease-in-out infinite;
  }
 
  @keyframes float1{
    0%,100% { transform: translateY(0) translateX(0); }
    50%     { transform: translateY(25px) translateX(-15px); }
  }
  @keyframes float2{
    0%,100% { transform: translateY(0) translateX(0); }
    50%     { transform: translateY(-20px) translateX(10px); }
  }
 
  .cta-heading{
    color:#fff;
    font-weight:500;
    font-size: clamp(1.9rem, 3.4vw, 2.75rem);
    letter-spacing:-0.5px;
    margin-bottom:14px;
    opacity:0;
    transform: translateY(18px);
    animation: riseIn 0.7s ease forwards;
    animation-delay: 0.05s;
  }
 
  .cta-text{
    color: #ffe9d6;
    font-size: 1.05rem;
    line-height:1.55;
    max-width: 560px;
    opacity:0;
    transform: translateY(18px);
    animation: riseIn 0.7s ease forwards;
    animation-delay: 0.22s;
  }
 
  .cta-btn-wrap{
    opacity:0;
    transform: translateY(18px);
    animation: riseIn 0.7s ease forwards;
    animation-delay: 0.4s;
  }
 
  @keyframes riseIn{
    to{ opacity:1; transform: translateY(0); }
  }
 
  .quote-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background: #0d1117;
    color:#fff;
    font-weight:600;
    font-size:1rem;
    padding: 16px 30px;
    border-radius:3px;
    border:none;
    text-decoration:none;
    white-space:nowrap;
    position:relative;
    overflow:hidden;
    transition: transform 0.28s cubic-bezier(.34,1.56,.64,1), box-shadow 0.28s ease;
    box-shadow: 0 6px 18px rgba(0,0,0,0.25);
  }
 
  .quote-btn::before{
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.18), transparent);
    transform: translateX(-120%);
  }
 
  .quote-btn:hover{
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 12px 26px rgba(0,0,0,0.35);
    color:#fff;
  }
 
  .quote-btn:hover::before{
    transform: translateX(120%);
    transition: transform 0.7s ease;
  }
 
  .quote-btn:active{
    transform: translateY(-1px) scale(0.98);
  }
 
  .quote-btn .arrow{
    display:inline-flex;
    transition: transform 0.28s ease;
  }
 
  .quote-btn:hover .arrow{
    transform: translateX(6px);
  }
 
  @media (max-width: 767px){
    .cta-banner{ padding: 44px 0; text-align:center; }
    .cta-text{ margin:0 auto 28px auto; }
    .cta-btn-wrap{ display:flex; justify-content:center; }
  }

  @media (max-width:575px) {
    header {
    height: auto;
}
.slider-content p {
        width: 100% !important;
    }
    .st-header-menu-area.style2 .is-sticky {
    height: auto;
}
.st-service-area.style2 .st__service__content {
    height: auto;
    border-left: none;
}
.si__service__box__five {
    padding: 20px 20px 20px 20px;
}
  }

  /* =========================================
   PREMIUM PRELOADER
========================================= */

#loading {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* Subtle background glow */
#loading::before {
    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(255,255,255,0.08) 0%,
        rgba(255,255,255,0.02) 35%,
        transparent 70%
    );
    animation: loaderGlow 3s ease-in-out infinite;
}

#loading-center {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

#loading-center-absolute {
    position: relative;
    z-index: 2;
    width: 320px;
    text-align: center;
}

/* Logo */
.preloader__logo {
    position: relative;
    width: 150px;
    height: 150px;
    margin: 0 auto 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Rotating ring */
.preloader__logo::before {
    content: "";
    position: absolute;
    inset: -15px;
    border: 2px solid transparent;
    border-top-color: #fff;
    border-right-color: rgba(255,255,255,0.25);
    border-radius: 50%;
    animation: logoRotate 1.5s linear infinite;
}

/* Second ring */
.preloader__logo::after {
    content: "";
    position: absolute;
    inset: -7px;
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 50%;
    animation: logoPulse 2s ease-in-out infinite;
}

.preloader__logo img {
    position: relative;
    z-index: 2;
    max-width: 125px;
    max-height: 125px;
    width: auto;
    height: auto;
    object-fit: contain;
    animation: logoPulse 2s ease-in-out infinite;
    filter: drop-shadow(0 0 12px rgba(255,255,255,0.45));
}

/* Loading bar */
.preloader__bar {
    width: 100%;
    height: 4px;
    background: rgba(255,255,255,0.15);
    border-radius: 50px;
    overflow: hidden;
    position: relative;
}

/* Progress */
.preloader__bar-inner {
    width: 0%;
    height: 100%;
    background: linear-gradient(
        90deg,
        #ffffff,
        #777,
        #ffffff
    );
    border-radius: 50px;
    box-shadow: 0 0 15px rgba(255,255,255,0.8);
    transition: width 0.15s ease;
    position: relative;
}

/* Moving shine */
.preloader__bar-inner::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 80px;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,0.9),
        transparent
    );
    animation: barShine 1s linear infinite;
}

/* Animations */

@keyframes logoRotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes logoPulse {
    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.06);
        opacity: 0.8;
    }
}

@keyframes loaderGlow {
    0%,
    100% {
        transform: scale(0.9);
        opacity: 0.5;
    }

    50% {
        transform: scale(1.15);
        opacity: 1;
    }
}

@keyframes barShine {
    0% {
        transform: translateX(-100px);
    }

    100% {
        transform: translateX(100px);
    }
}

/* Mobile */
@media (max-width: 575px) {

    #loading-center-absolute {
        width: 75%;
        max-width: 300px;
    }

    .preloader__logo {
        width: 120px;
        height: 120px;
        margin-bottom: 30px;
    }

    .preloader__logo img {
        max-width: 100px;
        max-height: 100px;
    }

}


@media (min-width: 576px) and (max-width: 767.98px) {
      header {
        height: auto;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  header {
        height: auto;
    }
}


@media (min-width: 992px) and (max-width: 1199.98px) {
   header {
        height: auto;
    }
}

.st-breadcumb-area {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

/* Black Overlay */
.st-breadcumb-area::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: -1;
}

/* Content image ke upar rahe */
.st-breadcumb-area > * {
    position: relative;
    z-index: 2;
}



/* =========================================
   STATS SECTION
========================================= */
.stats-section {
    position: relative;
    padding: 70px 0;
    background: #f56602;
    overflow: hidden;
}

/* Background Glow */
.stats-section::before {
    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    left: -180px;
    top: -220px;
    background: rgba(55, 175, 227, 0.12);
    border-radius: 50%;
    filter: blur(80px);
    animation: statsGlow 6s ease-in-out infinite alternate;
}

.stats-section::after {
    content: "";
    position: absolute;
    width: 400px;
    height: 400px;
    right: -180px;
    bottom: -220px;
    background: rgba(55, 175, 227, 0.10);
    border-radius: 50%;
    filter: blur(80px);
    animation: statsGlow 7s ease-in-out infinite alternate-reverse;
}

@keyframes statsGlow {
    0% {
        transform: scale(1);
        opacity: .5;
    }

    100% {
        transform: scale(1.35);
        opacity: 1;
    }
}


/* =========================================
   ROW
========================================= */
.stats-section .row {
    position: relative;
    z-index: 2;
}


/* =========================================
   STAT ITEM
========================================= */
.stat-item {
    position: relative;
    min-height: 150px;
    padding: 28px 22px;
    display: flex;
    align-items: center;
    gap: 20px;

    background: #fff;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 18px;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    overflow: hidden;

    transition:
        transform .45s ease,
        border-color .45s ease,
        box-shadow .45s ease,
        background .45s ease;

    animation: statReveal .8s ease both;
}


/* Card Animation Delay */
.col-lg-3:nth-child(1) .stat-item {
    animation-delay: .1s;
}

.col-lg-3:nth-child(2) .stat-item {
    animation-delay: .2s;
}

.col-lg-3:nth-child(3) .stat-item {
    animation-delay: .3s;
}

.col-lg-3:nth-child(4) .stat-item {
    animation-delay: .4s;
}

@keyframes statReveal {
    from {
        opacity: 0;
        transform: translateY(35px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* =========================================
   CARD HOVER
========================================= */
.stat-item:hover {
    transform: translateY(-10px);
    background: rgba(255, 255, 255, 0.09);
    border-color: rgba(55, 175, 227, 0.55);

    box-shadow:
        0 20px 50px rgba(0, 0, 0, .30),
        0 0 30px rgba(55, 175, 227, .12);
}


/* =========================================
   SHINE EFFECT
========================================= */
.stat-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 70%;
    height: 100%;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, .10),
        transparent
    );

    transform: skewX(-20deg);
    transition: .8s ease;
}

.stat-item:hover::before {
    left: 140%;
}


/* =========================================
   BOTTOM GLOW LINE
========================================= */
.stat-item::after {
    content: "";
    position: absolute;
    left: 25px;
    right: 25px;
    bottom: 0;

    height: 2px;

    background: linear-gradient(
        90deg,
        transparent,
        #000,
        transparent
    );

    transform: scaleX(0);
    transform-origin: center;
    transition: transform .45s ease;

    box-shadow: 0 0 12px rgba(55, 175, 227, .7);
}

.stat-item:hover::after {
    transform: scaleX(1);
}


/* =========================================
   ICON
========================================= */
.stat-icon {
    flex: 0 0 62px;
    width: 62px;
    height: 62px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 16px;

    background: linear-gradient(
        135deg,
        rgba(55, 175, 227, .20),
        rgba(55, 175, 227, .05)
    );

    border: 1px solid rgba(55, 175, 227, .30);

    box-shadow:
        inset 0 0 20px rgba(55, 175, 227, .08),
        0 0 20px rgba(55, 175, 227, .08);

    transition: all .45s ease;
}


.stat-icon i {
    font-size: 25px;
    color: #000;

    transition: all .45s ease;

    filter: drop-shadow(
        0 0 8px rgba(55, 175, 227, .5)
    );
}


/* Icon Hover */
.stat-item:hover .stat-icon {
    transform: rotate(-6deg) scale(1.1);

    background: #000;

    box-shadow:
        0 0 25px rgba(55, 175, 227, .45),
        0 0 50px rgba(55, 175, 227, .15);
}

.stat-item:hover .stat-icon i {
    color: #f56602;
    transform: scale(1.12);
    filter: none;
}


/* =========================================
   CONTENT
========================================= */
.stat-content {
    position: relative;
    z-index: 2;
}


/* =========================================
   NUMBER
========================================= */
.stat-content h3 {
    margin: 0 0 6px;

    font-size: 42px;
    line-height: 1;
    font-weight: 800;

    letter-spacing: -1px;

    color: #000;

    display: flex;
    align-items: baseline;
    gap: 2px;

    transition: all .4s ease;
}


.stat-content .counter {
    display: inline-block;
    min-width: 25px;
}


/* Number Glow on Hover */
.stat-item:hover .stat-content h3 {
    color: #000;
    text-shadow:
        0 0 10px rgba(55, 175, 227, .45),
        0 0 25px rgba(55, 175, 227, .20);
}


/* =========================================
   DESCRIPTION
========================================= */
.stat-content p {
    margin: 0;

    color: #000;

    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;

    transition: color .35s ease;
}


.stat-item:hover .stat-content p {
    color: rgba(255, 255, 255, .90);
}


/* =========================================
   FLOATING ANIMATION
========================================= */
.stat-item {
    animation-name: statReveal, floatingCard;
    animation-duration: .8s, 4s;
    animation-timing-function: ease, ease-in-out;
    animation-iteration-count: 1, infinite;
    animation-fill-mode: both, both;
}

.col-lg-3:nth-child(2) .stat-item {
    animation-delay: .2s, .4s;
}

.col-lg-3:nth-child(3) .stat-item {
    animation-delay: .3s, .8s;
}

.col-lg-3:nth-child(4) .stat-item {
    animation-delay: .4s, 1.2s;
}

@keyframes floatingCard {
    0%,
    100% {
        margin-top: 0;
    }

    50% {
        margin-top: -5px;
    }
}


/* =========================================
   TABLET
========================================= */
@media (max-width: 991px) {

    .stats-section {
        padding: 60px 0;
    }

    .stat-item {
        min-height: 140px;
        padding: 24px 20px;
    }

    .stat-content h3 {
        font-size: 36px;
    }

    .stat-icon {
        width: 58px;
        height: 58px;
        flex-basis: 58px;
    }
}


/* =========================================
   MOBILE
========================================= */
@media (max-width: 575px) {

    .stats-section {
        padding: 45px 0;
    }

    .stats-section .row {
        --bs-gutter-y: 15px;
    }

    .stat-item {
        min-height: 120px;
        padding: 20px 18px;
        gap: 16px;
        border-radius: 15px;
    }

    .stat-icon {
        width: 52px;
        height: 52px;
        flex-basis: 52px;
        border-radius: 13px;
    }

    .stat-icon i {
        font-size: 21px;
    }

    .stat-content h3 {
        font-size: 32px;
        margin-bottom: 5px;
    }

    .stat-content p {
        font-size: 13px;
    }
}


/* =========================================
   SMALL MOBILE
========================================= */
@media (max-width: 380px) {

    .stat-item {
        padding: 17px 14px;
        gap: 13px;
    }

    .stat-icon {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
    }

    .stat-content h3 {
        font-size: 28px;
    }

    .stat-content p {
        font-size: 12px;
    }
}


@media (max-width:575px) {
  .st-footer-area{
    height: auto;
  }
}

.st__form__box select {
	width: 100%;
	height: 58px;
	padding: 0 20px;
	background: #0d1117;
	color: #fff;
	border: 1px solid #555;
	border-radius: 5px;
	font-size: 16px;
	outline: none;
	cursor: pointer;
}

.st__form__box select:focus {
	border-color: #e87514;
	box-shadow: 0 0 0 1px #e87514;
}

.st__form__box select option {
	background: #0d1117;
	color: #fff;
	padding: 10px;
}

.st__form__box select option:checked {
	background: #246dcc;
	color: #fff;
}

.network-section {
    position: relative;
    background: #ffffff;
    padding: 100px 0;
    overflow: hidden;
}


/* subtle background decoration */
.network-section::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: rgba(255, 107, 0, 0.045);
    top: -180px;
    left: -180px;
    animation: networkFloat 8s ease-in-out infinite;
}

.network-section::after {
    content: "";
    position: absolute;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: rgba(255, 107, 0, 0.035);
    right: -150px;
    bottom: -150px;
    animation: networkFloat 10s ease-in-out infinite reverse;
}

.network-section .container {
    position: relative;
    z-index: 2;
}


/* ================= LEFT CARDS ================= */

.network-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}


/* card */
.network-card {
    position: relative;
    min-height: 150px;
    padding: 27px 25px;
    background: #ffffff;
    border: 1px solid #e7e7e7;
    border-radius: 12px;

    display: flex;
    align-items: center;
    gap: 17px;

    overflow: hidden;
    cursor: pointer;

    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.045);

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease,
        border-color 0.4s ease;
}


/* orange animated line */
.network-card::before {
    content: "";
    position: absolute;
    width: 4px;
    height: 0;
    left: 0;
    top: 0;
    background: #ff6b00;
    border-radius: 10px;
    transition: height 0.4s ease;
}


/* hover */
.network-card:hover {
    transform: translateY(-8px);
    border-color: #ff6b00;
    box-shadow: 0 18px 40px rgba(255, 107, 0, 0.12);
}

.network-card:hover::before {
    height: 100%;
}


/* active card */
.network-card.active-card {
    border-color: #ff6b00;
    background: linear-gradient(
        135deg,
        #fffaf6 0%,
        #ffffff 100%
    );
}

.network-card.active-card::before {
    height: 100%;
}


/* icon */
.network-icon {
    flex: 0 0 55px;
    width: 55px;
    height: 55px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #fff1e7;
    color: #ff6b00;

    font-size: 22px;

    transition: all 0.4s ease;
}


.network-card:hover .network-icon {
    background: #ff6b00;
    color: #ffffff;
    transform: rotateY(180deg) scale(1.08);
}


/* content */
.network-content {
    padding-right: 20px;
}

.network-content h4 {
    margin: 0 0 8px;
    color: #111827;
    font-size: 18px;
    font-weight: 700;
}

.network-content p {
    margin: 0;
    color: #718096;
    font-size: 14px;
    line-height: 1.7;
}

.network-content p span {
    color: #ff6b00;
    font-weight: 600;
}


/* arrow */
.card-arrow {
    position: absolute;
    right: 17px;
    bottom: 15px;

    width: 27px;
    height: 27px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #b8b8b8;
    font-size: 11px;

    transition: all 0.4s ease;
}

.network-card:hover .card-arrow {
    color: #ff6b00;
    transform: translateX(5px);
}


/* ================= RIGHT CONTENT ================= */

.network-info {
    max-width: 600px;
    padding-left: 20px;
}


/* label */
.network-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    color: #ff6b00;

    font-size: 14px;
    font-weight: 800;
    letter-spacing: 2px;

    margin-bottom: 18px;

    animation: fadeUp 0.8s ease both;
}

.network-label span {
    width: 30px;
    height: 2px;
    display: inline-block;
    background: #ff6b00;
}


/* heading */
.network-info h2 {
    color: #111827;
    font-size: 40px;
    line-height: 1.12;
    font-weight: 700;

    margin: 0 0 28px;

    animation: fadeUp 0.9s ease 0.1s both;
}

.network-info h2 strong {
    /* display: block; */
    color: #ff6b00;
    font-weight: 700;
}


/* paragraphs */
.network-info p {
    color: #64748b;
    font-size: 17px;
    line-height: 1.85;

    margin-bottom: 20px;

    animation: fadeUp 1s ease 0.2s both;
}


/* button */
.network-btn {
    display: inline-flex;
    align-items: center;
    gap: 18px;

    margin-top: 18px;
    padding: 17px 24px;

    color: #ffffff;
    background: #ff6b00;

    border-radius: 7px;

    font-size: 16px;
    font-weight: 700;
    text-decoration: none;

    box-shadow: 0 12px 30px rgba(255, 107, 0, 0.22);

    transition: all 0.4s ease;

    animation: fadeUp 1s ease 0.3s both;
}


.network-btn i {
    transition: transform 0.4s ease;
}


.network-btn:hover {
    color: #ffffff;
    background: #e95d00;
    transform: translateY(-4px);
    box-shadow: 0 18px 35px rgba(255, 107, 0, 0.30);
}

.network-btn:hover i {
    transform: translateX(7px);
}


/* ================= ANIMATIONS ================= */

@keyframes fadeUp {

    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


@keyframes networkFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(25px);
    }

}


/* card floating animation */
.network-card:nth-child(1) {
    animation: cardReveal 0.7s ease both;
}

.network-card:nth-child(2) {
    animation: cardReveal 0.7s ease 0.15s both;
}

.network-card:nth-child(3) {
    animation: cardReveal 0.7s ease 0.3s both;
}

.network-card:nth-child(4) {
    animation: cardReveal 0.7s ease 0.45s both;
}


@keyframes cardReveal {

    from {
        opacity: 0;
        transform: translateY(35px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* ================= RESPONSIVE ================= */

@media (max-width: 991px) {

    .network-section {
        padding: 75px 0;
    }

    .network-info {
        padding-left: 0;
        max-width: 100%;
    }

    .network-info h2 {
        font-size: 44px;
    }

}


@media (max-width: 767px) {

    .network-section {
        padding: 60px 0;
    }

    .network-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .network-card {
        min-height: 125px;
        padding: 22px 20px;
    }

    .network-info h2 {
        font-size: 36px;
    }

    .network-info p {
        font-size: 15px;
        line-height: 1.7;
    }

    .network-btn {
        width: 100%;
        justify-content: center;
    }

}


@media (max-width: 400px) {

    .network-info h2 {
        font-size: 31px;
    }

    .network-icon {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
        font-size: 19px;
    }

    .network-content h4 {
        font-size: 16px;
    }

    .network-content p {
        font-size: 12px;
    }

}





.fox-regional {

    position: relative;

    padding: 105px 0;

    background: #111827;

    overflow: hidden;

}


/* subtle background light */

.fox-regional::before {

    content: "";

    position: absolute;

    width: 600px;
    height: 600px;

    left: -350px;
    top: 15%;

    border-radius: 50%;

    background: rgba(255, 107, 0, .045);

    filter: blur(80px);

}


.fox-regional::after {

    content: "";

    position: absolute;

    width: 450px;
    height: 450px;

    right: -250px;
    bottom: -200px;

    border-radius: 50%;

    background: rgba(30, 136, 229, .04);

    filter: blur(80px);

}


.fox-regional-container {

    position: relative;

    z-index: 3;

    max-width: 1250px;

    margin: auto;

    padding: 0 20px;

}


/* =====================================================
   HEADER
===================================================== */

.fox-regional-header {

    margin-bottom: 55px;

}


.fox-kicker {

    position: relative;

    display: inline-block;

    margin-bottom: 14px;

    padding-left: 18px;

    color: #ff6b00;

    font-size: 13px;

    font-weight: 600;

    letter-spacing: 2px;

}


.fox-kicker::before {

    content: "";

    position: absolute;

    left: 0;
    top: 50%;

    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: #ff6b00;

    transform: translateY(-50%);

    box-shadow:
        0 0 0 5px rgba(255,107,0,.08);

}


.fox-regional-header h2 {

    margin: 0;

    color: #f8fafc;

    font-size: 50px;

    line-height: 1.1;

    font-weight: 600;

}


.fox-regional-header h2 span {

    color: #ff6b00;

}


/* =====================================================
   MAIN
===================================================== */

.fox-regional-main {

    display: grid;

    grid-template-columns: 1.15fr .85fr;

    gap: 60px;

    align-items: center;

}


/* =====================================================
   GLOBAL VISUAL
===================================================== */

.fox-global-visual {

    position: relative;

    height: 540px;

    min-height: 540px;

    border: 1px solid rgba(255,255,255,.07);

    border-radius: 24px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.025),
            rgba(255,255,255,.008)
        );

    overflow: hidden;

}


/* glow */

.fox-visual-glow {

    position: absolute;

    width: 280px;
    height: 280px;

    left: 50%;
    top: 50%;

    border-radius: 50%;

    transform: translate(-50%,-50%);

    background: rgba(255,107,0,.07);

    filter: blur(45px);

}


/* =====================================================
   ORBITS
===================================================== */

.fox-orbit {

    position: absolute;

    left: 50%;
    top: 50%;

    border: 1px solid rgba(255,107,0,.13);

    border-radius: 50%;

    transform: translate(-50%,-50%);

}


.orbit-1 {

    width: 300px;
    height: 300px;

    animation: foxOrbit 14s linear infinite;

}


.orbit-2 {

    width: 410px;
    height: 210px;

    transform:
        translate(-50%,-50%)
        rotate(-35deg);

    animation: foxOrbitReverse 18s linear infinite;

}


.orbit-3 {

    width: 460px;
    height: 300px;

    transform:
        translate(-50%,-50%)
        rotate(55deg);

    border-color: rgba(255,255,255,.045);

}


/* =====================================================
   GLOBE
===================================================== */

.fox-globe {

    position: absolute;

    left: 50%;
    top: 50%;

    width: 175px;
    height: 175px;

    transform: translate(-50%,-50%);

    border-radius: 50%;

    background:
        radial-gradient(
            circle at 35% 30%,
            #273449,
            #182334 55%,
            #111827 100%
        );

    border: 1px solid rgba(255,107,0,.28);

    box-shadow:
        inset -25px -20px 50px rgba(0,0,0,.35),
        0 0 60px rgba(255,107,0,.08);

}


.fox-globe::before {

    content: "";

    position: absolute;

    inset: 13px;

    border-radius: 50%;

    border: 1px dashed rgba(255,255,255,.08);

}


.fox-globe-inner {

    position: absolute;

    inset: 0;

    display: flex;

    align-items: center;

    justify-content: center;

}


.fox-globe-inner i {

    color: rgba(255,107,0,.8);

    font-size: 65px;

    animation: globeFloat 4s ease-in-out infinite;

}


/* =====================================================
   LOCATION NODES
===================================================== */

.fox-location {

    position: absolute;

    display: flex;

    align-items: center;

    gap: 9px;

    border: 0;

    background: transparent;

    padding: 5px;

    cursor: pointer;

    color: #8290a5;

    transition: all .35s ease;

}


.fox-location-dot {

    position: relative;

    width: 15px;
    height: 15px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #182334;

    border: 1px solid #46546a;

    transition: all .35s ease;

}


.fox-location-dot i {

    font-size: 4px;

    color: #68778c;

}


.fox-location-text {

    font-size: 12px;

    font-weight: 600;

    white-space: nowrap;

}


/* active */

.fox-location.active {

    color: #ff6b00;

}


.fox-location.active .fox-location-dot {

    width: 19px;
    height: 19px;

    border-color: #ff6b00;

    background: rgba(255,107,0,.1);

    box-shadow:
        0 0 0 7px rgba(255,107,0,.07),
        0 0 20px rgba(255,107,0,.3);

}


.fox-location.active .fox-location-dot i {

    color: #ff6b00;

}


/* locations */

.location-asia {

    right: 17%;

    top: 36%;

}


.location-europe {

    left: 25%;

    top: 25%;

}


.location-middle {

    right: 27%;

    top: 58%;

}


.location-americas {

    left: 13%;

    top: 63%;

}


/* =====================================================
   CONNECTIONS
===================================================== */

.fox-connection {

    position: absolute;

    height: 1px;

    background:
        repeating-linear-gradient(
            to right,
            rgba(255,107,0,.45) 0,
            rgba(255,107,0,.45) 4px,
            transparent 4px,
            transparent 9px
        );

    transform-origin: left center;

    opacity: .45;

}


.connection-1 {

    width: 180px;

    left: 27%;

    top: 30%;

    transform: rotate(17deg);

}


.connection-2 {

    width: 150px;

    left: 50%;

    top: 34%;

    transform: rotate(10deg);

}


.connection-3 {

    width: 130px;

    left: 48%;

    top: 57%;

    transform: rotate(-17deg);

}


.connection-4 {

    width: 210px;

    left: 20%;

    top: 61%;

    transform: rotate(-2deg);

}


/* =====================================================
   SMALL DOTS
===================================================== */

.fox-mini-dot {

    position: absolute;

    width: 4px;
    height: 4px;

    border-radius: 50%;

    background: #435066;

    animation: miniBlink 3s ease-in-out infinite;

}


.mini-1 {

    left: 18%;
    top: 35%;

}


.mini-2 {

    right: 14%;
    top: 25%;

}


.mini-3 {

    left: 40%;
    bottom: 17%;

}


.mini-4 {

    right: 34%;
    bottom: 25%;

}


/* =====================================================
   RIGHT CONTENT
===================================================== */

.fox-regional-content {

    min-height: 500px;

}


/* navigation */

.fox-region-nav {

    display: flex;

    flex-wrap: wrap;

    gap: 7px;

    padding-bottom: 22px;

    margin-bottom: 25px;

    border-bottom: 1px solid rgba(255,255,255,.08);

}


.fox-region-btn {

    display: flex;

    align-items: center;

    gap: 9px;

    border: 0;

    background: #182334;

    color: #8d9db5;

    padding: 4px 7px;

    border-radius: 5px;

    font-size: 12px;

    cursor: pointer;

    transition: all .3s ease;

}


.fox-region-btn span {

    color: #55647a;

    font-size: 10px;

}


.fox-region-btn i {

    font-size: 9px;

    opacity: 0;

    transform: translateX(-5px);

    transition: .3s ease;

}


.fox-region-btn:hover {

    color: #fff;

    background: #223047;

}


.fox-region-btn.active {

    color: #fff;

    background: #ff6b00;

}


.fox-region-btn.active span {

    color: rgba(255,255,255,.7);

}


.fox-region-btn.active i {

    opacity: 1;

    transform: translateX(0);

}


/* =====================================================
   CONTENT
===================================================== */

.fox-region-content {

    display: none;

    animation: foxContent .45s ease;

}


.fox-region-content.active {

    display: block;

}


.fox-content-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 20px;

}


.fox-content-number {

    color: #ff6b00;

    font-size: 12px;

    font-weight: 700;

}


.fox-content-label {

    color: #536177;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.5px;

}


.fox-region-content h3 {

    margin: 0 0 15px;

    color: #f8fafc;

    font-size: 38px;

    font-weight: 700;

}


.fox-region-content p {

    margin: 0 0 27px;

    color: #91a2bb;

    font-size: 14px;

    line-height: 1.8;

}


/* =====================================================
   STRENGTHS
===================================================== */

.fox-sub-title {

    display: block;

    margin-bottom: 12px;

    color: #65748b;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.fox-strength-list {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 9px 20px;

    margin-bottom: 25px;

}


.fox-strength-list div {

    color: #e4e8ee;

    font-size: 12px;

}


.fox-strength-list i {

    margin-right: 7px;

    color: #ff6b00;

    font-size: 9px;

}


/* =====================================================
   COUNTRIES
===================================================== */

.fox-country-items {

    display: flex;

    flex-wrap: wrap;

    gap: 6px;

}


.fox-country-items span {

    padding: 6px 10px;

    border: 1px solid rgba(255,255,255,.07);

    border-radius: 4px;

    background: #182334;

    color: #91a2bb;

    font-size: 11px;

    transition: all .3s ease;

}


.fox-country-items span:hover {

    border-color: rgba(255,107,0,.4);

    color: #ff6b00;

    transform: translateY(-2px);

}


/* =====================================================
   ANIMATIONS
===================================================== */

@keyframes foxOrbit {

    from {
        transform:
            translate(-50%,-50%)
            rotate(0deg);
    }

    to {
        transform:
            translate(-50%,-50%)
            rotate(360deg);
    }

}


@keyframes foxOrbitReverse {

    from {
        transform:
            translate(-50%,-50%)
            rotate(-35deg);
    }

    to {
        transform:
            translate(-50%,-50%)
            rotate(-395deg);
    }

}


@keyframes globeFloat {

    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-6px);
    }

}


@keyframes miniBlink {

    0%, 100% {
        opacity: .3;
        transform: scale(1);
    }

    50% {
        opacity: 1;
        transform: scale(1.7);
    }

}


@keyframes foxContent {

    from {
        opacity: 0;
        transform: translateY(15px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 991px) {

    .fox-regional {

        padding: 80px 0;

    }

    .fox-regional-main {

        grid-template-columns: 1fr;

        gap: 35px;

    }

    .fox-global-visual {

        height: 450px;

        min-height: 450px;

    }

    .fox-regional-content {

        min-height: auto;

    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 767px) {

    .fox-regional {

        padding: 60px 0;

    }

    .fox-regional-header {

        margin-bottom: 35px;

    }

    .fox-regional-header h2 {

        font-size: 34px;

    }

    .fox-global-visual {

        height: 340px;

        min-height: 340px;

    }

    .fox-globe {

        width: 115px;

        height: 115px;

    }

    .fox-globe-inner i {

        font-size: 43px;

    }

    .orbit-1 {

        width: 210px;

        height: 210px;

    }

    .orbit-2 {

        width: 290px;

        height: 150px;

    }

    .orbit-3 {

        width: 320px;

        height: 210px;

    }

    .location-asia {

        right: 7%;

    }

    .location-europe {

        left: 10%;

    }

    .location-middle {

        right: 9%;

    }

    .location-americas {

        left: 5%;

    }

    .fox-region-nav {

        gap: 6px;

    }

    .fox-region-btn {

        padding: 8px 9px;

        font-size: 11px;

    }

    .fox-region-content h3 {

        font-size: 30px;

    }

    .fox-strength-list {

        grid-template-columns: 1fr;

    }

}


@media (max-width: 420px) {

    .fox-global-visual {

        height: 300px;

        min-height: 300px;

    }

    .fox-location-text {

        font-size: 10px;

    }

    .fox-location-dot {

        width: 11px;

        height: 11px;

    }

    .fox-region-btn {

        font-size: 10px;

    }

}


.fox-why-section {
        position: relative;
        padding: 110px 0;
        background: #111827;
        overflow: hidden;
    }

    .fox-why-section::before {
        content: "";
        position: absolute;
        width: 450px;
        height: 450px;
        left: -250px;
        top: -200px;
        border-radius: 50%;
        background: rgba(255, 107, 0, 0.08);
        filter: blur(10px);
        pointer-events: none;
    }

    .fox-why-section::after {
        content: "";
        position: absolute;
        width: 400px;
        height: 400px;
        right: -220px;
        bottom: -180px;
        border-radius: 50%;
        background: rgba(255, 107, 0, 0.06);
        filter: blur(15px);
        pointer-events: none;
    }


    /* Heading */
    .fox-why-heading {
        position: relative;
        z-index: 2;
        max-width: 800px;
        margin: 0 auto 55px;
    }

    .fox-why-heading span {
        display: inline-block;
        margin-bottom: 12px;
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 3px;
        color: #ff6b00;
    }

    .fox-why-heading h2 {
        margin: 0;
        color: #ffffff;
        font-size: 48px;
        line-height: 1.15;
        font-weight: 700;
    }


    /* Card */
    .fox-why-card {
        position: relative;
        height: 100%;
        padding: 35px;
        background: rgba(255, 255, 255, 0.045);
        border: 1px solid rgba(255, 255, 255, 0.09);
        border-radius: 18px;
        overflow: hidden;
        transition: all 0.45s ease;
        backdrop-filter: blur(8px);
        z-index: 2;
    }

    .fox-why-card::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: #ff6b00;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.45s ease;
    }

    .fox-why-card:hover {
        transform: translateY(-10px);
        border-color: rgba(255, 107, 0, 0.45);
        background: rgba(255, 255, 255, 0.07);
        box-shadow: 0 20px 45px rgba(0, 0, 0, 0.28);
    }

    .fox-why-card:hover::before {
        transform: scaleX(1);
    }


    /* Top */
    .fox-why-card-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 28px;
    }


    /* Icon */
    .fox-why-icon {
        width: 68px;
        height: 68px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 15px;
        background: rgba(255, 107, 0, 0.11);
        border: 1px solid rgba(255, 107, 0, 0.20);
        color: #ff6b00;
        font-size: 28px;
        transition: all 0.4s ease;
    }

    .fox-why-card:hover .fox-why-icon {
        background: #ff6b00;
        color: #ffffff;
        transform: rotate(-5deg) scale(1.08);
        box-shadow: 0 10px 25px rgba(255, 107, 0, 0.25);
    }


    /* Number */
    .fox-why-number {
        color: rgba(255, 255, 255, 0.22);
        font-size: 42px;
        line-height: 1;
        font-weight: 800;
        transition: all 0.4s ease;
    }

    .fox-why-card:hover .fox-why-number {
        color: rgba(255, 107, 0, 0.55);
    }


    /* Content */
    .fox-why-content h3 {
        margin: 0 0 15px;
        color: #ffffff;
        font-size: 24px;
        line-height: 1.3;
        font-weight: 700;
    }

    .fox-why-content p {
        margin: 0;
        color: #aeb8c8;
        font-size: 15px;
        line-height: 1.8;
    }


    /* Bottom Line */
    .fox-why-line {
        position: absolute;
        left: 35px;
        bottom: 0;
        width: 70px;
        height: 3px;
        background: #ff6b00;
        transition: width 0.45s ease;
    }

    .fox-why-card:hover .fox-why-line {
        width: calc(100% - 70px);
    }


    /* ================= RESPONSIVE ================= */

    @media (max-width: 991px) {

        .fox-why-section {
            padding: 90px 0;
        }

        .fox-why-heading h2 {
            font-size: 40px;
        }

    }


    @media (max-width: 767px) {

        .fox-why-section {
            padding: 75px 0;
        }

        .fox-why-heading {
            margin-bottom: 40px;
        }

        .fox-why-heading span {
            font-size: 11px;
            letter-spacing: 2px;
        }

        .fox-why-heading h2 {
            font-size: 32px;
        }

        .fox-why-card {
            padding: 28px;
        }

        .fox-why-icon {
            width: 58px;
            height: 58px;
            font-size: 23px;
        }

        .fox-why-number {
            font-size: 32px;
        }

        .fox-why-content h3 {
            font-size: 21px;
        }

        .fox-why-content p {
            font-size: 14px;
            line-height: 1.7;
        }

    }


    /*=========================================
        PREMIUM INDUSTRIES SECTION
=========================================*/

.industry-showcase-section{
    position: relative;
    background: #0b1120;
    padding:120px 0;
    overflow:hidden;
    z-index:1;
}

/*==============================
      Background Shapes
==============================*/

.industry-bg-shape{
    position:absolute;
    border-radius:50%;
    filter:blur(100px);
    opacity:.18;
    z-index:-1;
    animation:floatShape 8s ease-in-out infinite;
}

.shape-one{
    width:420px;
    height:420px;
    background:#ff7b00;
    top:-150px;
    left:-120px;
}

.shape-two{
    width:350px;
    height:350px;
    background:#1d4ed8;
    bottom:-120px;
    right:-80px;
    animation-delay:2s;
}

@keyframes floatShape{

    0%{
        transform:translateY(0px) scale(1);
    }

    50%{
        transform:translateY(30px) scale(1.08);
    }

    100%{
        transform:translateY(0px) scale(1);
    }

}

/*==============================
        Top Heading
==============================*/

.industry-top-line{
    position:relative;
    margin-bottom:70px;
}

.industry-number{

    width:60px;
    height:60px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#121b30;

    color:#ff7b00;

    font-size:20px;

    font-weight:700;

    border:1px solid rgba(255,255,255,.08);

    box-shadow:0 0 20px rgba(255,123,0,.15);

}

.industry-line{

    flex:1;

    height:1px;

    margin:0 25px;

    background:linear-gradient(to right,
    rgba(255,123,0,.6),
    rgba(255,255,255,.08));

}

.industry-small-title{

    font-size:13px;

    letter-spacing:3px;

    text-transform:uppercase;

    color:#ff7b00;

    font-weight:600;

}

/*==============================
      Image Wrapper
==============================*/

.industry-image-wrapper{

    position:relative;

}

.industry-image-glow{

    position:absolute;

    width:100%;

    height:100%;

    background:linear-gradient(45deg,#ff7b00,#ff9b32);

    border-radius:30px;

    transform:rotate(-4deg);

    filter:blur(40px);

    opacity:.18;

    transition:.5s;

}

.industry-image-card{

    position:relative;

    overflow:hidden;

    border-radius:28px;

    background:#10192d;

    border:1px solid rgba(255,255,255,.08);

    box-shadow:
    0 25px 70px rgba(0,0,0,.45);

}

.industry-image-card img{

    width:100%;

    display:block;

    transition:.8s cubic-bezier(.2,.7,.2,1);

    height: 540px;

}

.industry-image-card:hover img{

    transform:scale(1.08);

}

.industry-image-card::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(180deg,
    transparent 20%,
    rgba(0,0,0,.75));

    opacity:.9;

    z-index:1;

}

.industry-image-card::after{

    content:"";

    position:absolute;

    top:-150%;

    left:-60%;

    width:60%;

    height:300%;

    background:rgba(255,255,255,.15);

    transform:rotate(25deg);

    transition:1s;

    z-index:2;

}

.industry-image-card:hover::after{

    left:130%;

}

/*==============================
      Overlay Content
==============================*/

.industry-image-overlay{

    position:absolute;

    left:30px;

    bottom:30px;

    z-index:5;

}

.industry-overlay-content span{

    display:inline-block;

    padding:8px 18px;

    border-radius:50px;

    background:rgba(255,123,0,.18);

    color:#ffb25c;

    font-size:13px;

    margin-bottom:12px;

    backdrop-filter:blur(12px);

}

.industry-overlay-content h5{

    color:#fff;

    font-size:26px;

    font-weight:700;

    margin:0;

}

/*==============================
      Floating Badge
==============================*/

.industry-floating-badge{

    position:absolute;

    right:-20px;

    bottom:60px;

    display:flex;

    align-items:center;

    gap:12px;

    background:rgba(255,255,255,.06);

    backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.12);

    padding:15px 22px;

    border-radius:60px;

    color:#fff;

    animation:badgeFloat 3s ease-in-out infinite;

    box-shadow:0 15px 35px rgba(0,0,0,.35);

}

.industry-floating-badge i{

    width:42px;

    height:42px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#ff7b00;

    color:#fff;

}

@keyframes badgeFloat{

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-10px);
    }

    100%{
        transform:translateY(0);
    }

}

/*==============================
      Certifications
==============================*/

.industry-certification-list{

    display:flex;

    flex-wrap:wrap;

    gap:14px;

    margin-top:35px;

}

.industry-certification-list span{

    padding:10px 18px;

    border-radius:10px;

    background:#121b30;

    border:1px solid rgba(255,255,255,.08);

    color:#9cb3d9;

    font-size:14px;

    transition:.4s;

}

.industry-certification-list span:hover{

    background:#ff7b00;

    color:#fff;

    transform:translateY(-5px);

}


/*=========================================
        CONTENT WRAPPER
=========================================*/

.industry-content-wrapper{
    position: relative;
    padding-left: 25px;
}

.industry-subtitle{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #ff7a00;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.industry-subtitle::before{
    content: "";
    width: 45px;
    height: 2px;
    background: linear-gradient(90deg,#ff7a00,#ffb347);
}

.industry-title {
    font-size: 25px;
    font-weight: 700;
    line-height: 1.15;
    color: #fff;
    margin-bottom: 20px;
}

.industry-title span{
    color: #ff7a00;
    position: relative;
}

.industry-title span::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 1px;
    /* border-radius: 10px; */
    background: linear-gradient(90deg, #ff7a00, #ffb347);
}

.industry-description {
    color: rgba(255, 255, 255, .72);
    font-size: 14px;
    margin-bottom: 15px;
    text-align: justify;
}
/*=========================================
              TABS
=========================================*/

.industry-tabs{
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 8px;
    border-radius: 70px;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
    margin-bottom: 35px;
}

.industry-tab-btn{
    border: none;
    outline: none;
    background: transparent;
    color: rgba(255,255,255,.75);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 15px;
    border-radius: 60px;
    cursor: pointer;
    transition: .4s;
    font-weight: 600;
    font-size: 15px;
}

.industry-tab-btn svg{
    transition: .35s;
}

.industry-tab-btn:hover{
    color: #fff;
    background: rgba(255,122,0,.15);
}

.industry-tab-btn:hover svg{
    transform: rotate(-10deg) scale(1.15);
}

.industry-tab-btn.active{
    background: linear-gradient(135deg,#ff7a00,#ff9d2f);
    color: #fff;
    box-shadow: 0 15px 35px rgba(255,122,0,.35);
}

/*=========================================
          TAB CONTENT
=========================================*/

.industry-tab-content{
    display: none;
    animation: fadeContent .45s ease;
}

.industry-tab-content.active{
    display: block;
}

@keyframes fadeContent{

    from{
        opacity:0;
        transform:translateY(20px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

/*=========================================
          FEATURE LIST
=========================================*/

.industry-feature-list{
    list-style: none;
    padding: 0;
    margin: 0 0 40px;
}

.industry-feature-list li{
    display: flex;
    align-items: center;
    gap: 15px;
    color: #fff;
    font-size: 17px;
    margin-bottom: 10px;
    transition: .35s;
}

.industry-feature-list li i{
    width: 36px;
    height: 36px;
    min-width: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255,122,0,.12);
    color: #ff7a00;
    transition: .35s;
}

.industry-feature-list li:hover{
    transform: translateX(12px);
    color: #ffb347;
}

.industry-feature-list li:hover i{
    background: #ff7a00;
    color: #fff;
    transform: rotate(360deg);
}

/*=========================================
          BUTTON GROUP
=========================================*/

.industry-button-group{
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.industry-btn{
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 10px 34px;
    border-radius: 60px;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    overflow: hidden;
    transition: .4s;
}

.industry-btn i{
    transition: .35s;
}

/* Primary */

.industry-btn-primary{
    color: #fff;
    background: linear-gradient(135deg,#ff7a00,#ff9d2f);
    box-shadow: 0 20px 40px rgba(255,122,0,.30);
}

.industry-btn-primary::before{
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,.25);
    transform: skewX(-30deg);
    transition: .6s;
}

.industry-btn-primary:hover::before{
    left: 130%;
}

.industry-btn-primary:hover{
    color: #fff;
    transform: translateY(-6px);
    box-shadow: 0 25px 50px rgba(255,122,0,.45);
}

.industry-btn-primary:hover i{
    transform: translateX(6px);
}

/* Outline */

.industry-btn-outline{
    color: #fff;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(255,255,255,.04);
    backdrop-filter: blur(12px);
}

.industry-btn-outline:hover{
    background: #fff;
    color: #111;
    border-color: #fff;
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(255,255,255,.12);
}

/*=========================================
          CONTENT HOVER EFFECT
=========================================*/

.industry-content-wrapper:hover .industry-title span{
    color: #ffb347;
}

.industry-content-wrapper:hover .industry-subtitle::before{
    width: 70px;
    transition: .4s;
}

/*=========================================
        PREMIUM IMAGE HOVER EFFECT
=========================================*/

.industry-image-wrapper:hover .industry-image-glow{
    transform:rotate(-6deg) scale(1.08);
    opacity:.35;
}

.industry-image-wrapper:hover .industry-image-card{
    transform:translateY(-12px);
    transition:.45s ease;
    box-shadow:
        0 40px 90px rgba(0,0,0,.45),
        0 0 50px rgba(255,122,0,.12);
}

.industry-image-card{
    transition:.45s ease;
}

.industry-image-card img{
    transition:1s cubic-bezier(.2,.8,.2,1);
}

.industry-image-wrapper:hover img{
    transform:scale(1.08) rotate(.5deg);
}

/*=========================================
        GLOW BORDER
=========================================*/

.industry-image-card::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:28px;
    padding:1px;
    background:linear-gradient(
        135deg,
        rgba(255,122,0,.7),
        transparent,
        rgba(255,255,255,.08)
    );

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite:xor;
            mask-composite:exclude;

    pointer-events:none;
}

/*=========================================
        FLOATING DOTS
=========================================*/

.industry-showcase-section::before{

    content:"";

    position:absolute;

    width:220px;
    height:220px;

    border-radius:50%;

    border:1px dashed rgba(255,122,0,.15);

    top:80px;
    right:-100px;

    animation:rotateCircle 16s linear infinite;

}

.industry-showcase-section::after{

    content:"";

    position:absolute;

    width:130px;
    height:130px;

    background:rgba(255,122,0,.06);

    border-radius:50%;

    bottom:80px;
    left:-60px;

    filter:blur(20px);

}

@keyframes rotateCircle{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}

/*=========================================
        FLOATING BADGE
=========================================*/

.industry-floating-badge{

    transition:.4s;

}

.industry-floating-badge:hover{

    transform:translateY(-8px) scale(1.05);

    background:#ff7a00;

    color:#fff;

}

.industry-floating-badge:hover i{

    background:#fff;

    color:#ff7a00;

}

/*=========================================
        CERTIFICATE TAGS
=========================================*/

.industry-certification-list span{

    position:relative;

    overflow:hidden;

}

.industry-certification-list span::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:80%;

    height:100%;

    background:rgba(255,255,255,.18);

    transform:skewX(-25deg);

    transition:.6s;

}

.industry-certification-list span:hover::before{

    left:150%;

}

/*=========================================
        BUTTON RIPPLE
=========================================*/

.industry-btn{

    overflow:hidden;

}

.industry-btn::after{

    content:"";

    position:absolute;

    width:0;

    height:0;

    background:rgba(255,255,255,.15);

    border-radius:50%;

    left:50%;

    top:50%;

    transform:translate(-50%,-50%);

    transition:.55s;

}

.industry-btn:hover::after{

    width:320px;

    height:320px;

}

/*=========================================
        TEXT ANIMATION
=========================================*/

.industry-title{

    animation:titleFade .8s ease;

}

.industry-description{

    animation:fadeUp .9s ease;

}

@keyframes titleFade{

    from{

        opacity:0;

        transform:translateY(30px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(25px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================
        FEATURE LIST ANIMATION
=========================================*/

.industry-feature-list li{

    animation:listFade .6s ease both;

}

.industry-feature-list li:nth-child(1){

    animation-delay:.10s;

}

.industry-feature-list li:nth-child(2){

    animation-delay:.20s;

}

.industry-feature-list li:nth-child(3){

    animation-delay:.30s;

}

.industry-feature-list li:nth-child(4){

    animation-delay:.40s;

}

.industry-feature-list li:nth-child(5){

    animation-delay:.50s;

}

@keyframes listFade{

    from{

        opacity:0;

        transform:translateX(-25px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

/*=========================================
        RESPONSIVE
=========================================*/

@media(max-width:991px){

    .industry-showcase-section{

        padding:80px 0;

    }

    .industry-title{

        font-size:40px;

    }

    .industry-content-wrapper{

        padding-left:0;
        margin-top:40px;

    }

    .industry-floating-badge{

        right:15px;
        bottom:15px;

    }

    .industry-top-line{

        flex-wrap:wrap;
        gap:15px;

    }

    .industry-small-title{

        width:100%;
        margin-left:0!important;

    }

}

@media(max-width:767px){

    .industry-title{

        font-size:32px;

    }

    .industry-description{

        font-size:15px;
        line-height:1.8;

    }

    .industry-tabs{

        width:100%;
        justify-content:center;
        flex-wrap:wrap;

    }

    .industry-tab-btn{

        width:100%;
        justify-content:center;

    }

    .industry-button-group{

        flex-direction:column;
        align-items:stretch;

    }

    .industry-btn{

        width:100%;
        justify-content:center;

    }

    .industry-floating-badge{

        position:relative;
        right:auto;
        bottom:auto;
        margin-top:20px;

    }

}

.industry-tab-content{
    display:none;
}

.industry-tab-content.active{
    display:block;
    animation:fadeContent .4s ease;
}

@keyframes fadeContent{

    from{
        opacity:0;
        transform:translateY(20px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

@media (max-width:575px) {
  .industry-image-card img {
    height: auto;
}
    .industry-title {
        font-size: 25px;
    }
}

    .services-section {
      position: relative;
      overflow: hidden;
      padding: 90px 0;
      background: #070b14;
    }

    .services-section::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255,255,255,0.02) 1px, transparent 1px);
      background-size: 120px 120px;
      opacity: 0.15;
      pointer-events: none;
      mask-image: radial-gradient(circle at center, black 30%, transparent 100%);
    }

    .section-label {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      color: #ff8a00;
      font-weight: 700;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      font-size: 0.78rem;
      margin-bottom: 18px;
    }

    .section-label::before {
      content: "";
      width: 34px;
      height: 1px;
      background: linear-gradient(90deg, #ff8a00, transparent);
    }

    .section-title {
      font-size: clamp(2rem, 4vw, 3.45rem);
      line-height: 1.05;
      font-weight: 800;
      margin: 0;
      max-width: 900px;
      letter-spacing: -0.03em;
      color: #ffffff;
    }

    .section-subtitle {
      margin-top: 18px;
      max-width: 820px;
      color: #9aa7be;
      font-size: 1.02rem;
      line-height: 1.8;
    }

    .accordion-shell {
      margin-top: 42px;
      border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

    .service-item {
      position: relative;
      border-bottom: 1px solid rgba(255, 255, 255, 0.08);
      transition: all 0.35s ease;
      background: transparent;
    }

    .service-item:hover {
      background: rgba(255, 255, 255, 0.015);
    }

    .service-item.active {
      background: linear-gradient(90deg, rgba(255, 138, 0, 0.06), rgba(255, 255, 255, 0.01));
    }

    .service-head {
      width: 100%;
      padding: 22px 10px;
      background: transparent;
      border: 0;
      color: #e9eef9;
      display: grid;
      grid-template-columns: 56px 42px 1fr auto;
      align-items: center;
      gap: 18px;
      text-align: left;
      cursor: pointer;
    }

    .index {
      font-size: 0.72rem;
      letter-spacing: 0.2em;
      color: rgba(233, 238, 249, 0.45);
      font-weight: 600;
    }

    .service-icon {
      width: 38px;
      height: 38px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: rgba(255, 138, 0, 0.10);
      border: 1px solid rgba(255, 138, 0, 0.22);
      color: #ff8a00;
      font-size: 1rem;
      transition: all 0.35s ease;
    }

    .service-item:hover .service-icon,
    .service-item.active .service-icon {
      transform: translateY(-1px) rotate(8deg);
      background: rgba(255, 138, 0, 0.16);
      border-color: rgba(255, 138, 0, 0.48);
      box-shadow: 0 0 0 6px rgba(255, 138, 0, 0.05);
    }

   .service-title {
    font-size: 23px;
    font-weight: 600;
    line-height: 1.2;
    margin: 0 0 7px;
    letter-spacing: -0.02em;
    color: #ffffff;
}



    .service-desc {
      margin: 0;
      color: #9aa7be;
      font-size: 0.95rem;
      line-height: 1.65;
      max-width: 720px;
    }

    .chev {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 1px solid rgba(255, 255, 255, 0.08);
      color: rgba(233, 238, 249, 0.70);
      transition: all 0.35s ease;
      background: rgba(255, 255, 255, 0.02);
      flex-shrink: 0;
      font-size: 1rem;
    }

    .service-item:hover .chev,
    .service-item.active .chev {
      border-color: rgba(255, 138, 0, 0.45);
      color: #ff8a00;
      transform: translateY(-1px);
      background: rgba(255, 138, 0, 0.08);
      box-shadow: 0 0 0 6px rgba(255, 138, 0, 0.05);
    }

    .service-item.active .chev i {
      transform: rotate(180deg);
    }

    .chev i {
      transition: transform 0.35s ease;
    }

    /* FIXED PANEL LOGIC */
    .service-panel {
      max-height: 0;
      overflow: hidden;
      opacity: 0;
      transition: max-height 0.5s ease, opacity 0.35s ease;
    }

    .service-item.active .service-panel {
      opacity: 1;
    }

    .panel-inner {
      padding-bottom: 22px;
    }

    .panel-card {
      margin-top: 4px;
      border: 1px solid rgba(255, 255, 255, 0.08);
      background:
        linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02)),
        rgba(5, 9, 16, 0.8);
      border-radius: 6px;
      padding: 28px;
      box-shadow: 0 18px 60px rgba(0, 0, 0, 0.35);
      position: relative;
    }

    .panel-grid {
      display: grid;
      grid-template-columns: 1.25fr 1fr;
      gap: 22px;
      align-items: start;
    }

    .panel-heading {
      font-size: 1.2rem;
      font-weight: 500;
      margin: 0 0 12px;
      color: #ffffff;
    }

    .panel-text {
      color: #9aa7be;
      line-height: 1.9;
      margin: 0 0 18px;
      font-size: 0.98rem;
    }

    .points {
      display: grid;
      gap: 6px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .points li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      color: #dbe4f3;
      line-height: 1.65;
      font-size: 0.95rem;
    }

    .points i {
      color: #ff8a00;
      margin-top: 3px;
      flex-shrink: 0;
    }

    .cta-wrap {
      margin-top: 20px;
    }

    .cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    background: linear-gradient(135deg, #ff8a00, #ff9c20);
    color: #fff;
    padding: 10px 20px;
    border-radius: 2px;
    font-weight: 500;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    box-shadow: 0 14px 30px rgba(255, 138, 0, 0.22);
}

    .cta-btn:hover {
      transform: translateY(-2px);
      color: #0b0f18;
      box-shadow: 0 18px 36px rgba(255, 138, 0, 0.32);
    }

    .mini-stat {
      border: 1px solid rgba(255, 255, 255, 0.08);
      border-radius: 6px;
      padding: 10px 8px;
      background: rgba(255, 255, 255, 0.025);
      margin-bottom: 14px;
    }

    .mini-stat .num {
      color: #ff8a00;
      font-size: 1.7rem;
      font-weight: 900;
      line-height: 1;
      margin-bottom: 8px;
    }

    .mini-stat .lbl {
      color: #9aa7be;
      font-size: 0.92rem;
      line-height: 1.7;
      margin: 0;
    }

    @media (max-width: 991px) {
      .service-head {
        grid-template-columns: 48px 38px 1fr auto;
        gap: 12px;
      }

      .panel-grid {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 768px) {
      .services-section {
        padding: 70px 0;
      }

      .service-head {
        grid-template-columns: 34px 34px 1fr auto;
        padding: 18px 0;
      }

      .index {
        font-size: 0.66rem;
      }

      .service-icon,
      .chev {
        width: 34px;
        height: 34px;
      }

      .panel-card {
        padding: 20px;
        border-radius: 18px;
      }

      .service-title {
        font-size: 1rem;
      }

      .service-desc {
        font-size: 0.9rem;
      }
    }

    .solar-products-area {
    width: 100%;
}

.solar-product-box {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    transition: all 0.4s ease;
    margin-bottom: 15px;
}

.solar-product-box::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 0;
    background: #f56602;
    transition: all 0.4s ease;
}

.solar-product-box:hover {
    transform: translateY(-5px);
    border-color: #f56602;
    box-shadow: 0 12px 35px rgba(245, 102, 2, 0.12);
}

.solar-product-box:hover::before {
    height: 100%;
}

.solar-product-content {
    position: relative;
    z-index: 1;
    padding: 15px 35px;
}

.solar-product-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin-bottom: 15px;
    border-radius: 50%;
    background: #fff1e8;
    color: #f56602;
    font-size: 14px;
    font-weight: 700;
    transition: all 0.4s ease;
}

.solar-product-box:hover .solar-product-number {
    background: #f56602;
    color: #fff;
}

.solar-product-box h3 {
    margin: 0 0 10px;
    color: #010f30;
    font-size: 24px;
    font-weight: 700;
    transition: all 0.3s ease;
}

.solar-product-box:hover h3 {
    color: #f56602;
}

.solar-product-box strong {
    display: block;
    margin-bottom: 12px;
    color: #555;
    font-size: 14px;
    font-weight: 600;
}

.solar-product-box p {
    margin: 0 0 20px;
    color: #666;
    font-size: 15px;
    line-height: 1.7;
}

.solar-inquire-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 3px 18px;
    border: 1px solid #f56602;
    border-radius: 4px;
    background: transparent;
    color: #f56602;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.35s ease;
}

.solar-inquire-btn:hover {
    background: #f56602;
    color: #fff;
}

.solar-inquire-btn i {
    transition: transform 0.3s ease;
}

.solar-inquire-btn:hover i {
    transform: translateX(5px);
}

@media (max-width: 767px) {

    .solar-product-content {
        padding: 25px 20px;
    }

    .solar-product-box h3 {
        font-size: 20px;
    }

}

.st__service__box:hover .st__service__content span, .st__service__box:hover .st__service__content p {
    color: var(--st-theme-color-white);
}

.cta-heading {
  line-height: 35px;
}

aside.sidebar-area{position:sticky;top:10px;}
.pulse:nth-child(1){-webkit-animation:pulse 2s infinite;animation:pulse 2s infinite;}
.pulse:nth-child(2){-webkit-animation:pulse 2s infinite 0.3s;animation:pulse 2s infinite 0.3s;}
.pulse:nth-child(3){-webkit-animation:pulse 2s infinite 0.3s;animation:pulse 2s infinite 0.3s;}
.whatsapp-info,
.pulse{font-family:"Lato", sans-serif;display:inline-block;color:#fff;background:#1ab744;position:fixed;bottom:100px;right:50px;font-size:45px;text-align:center;z-index:99;border-radius:90%;height:50px;width:50px;line-height:45px;cursor:pointer;-webkit-transition:all 0.2s;-moz-transition:all 0.2s;transition:all 0.2s;}
@keyframes pulse{0%{-webkit-transform:scale(0.1);transform:scale(0.1);opacity:0;}
50%{opacity:0.3;}
100%{-webkit-transform:scale(2);transform:scale(2);opacity:0;}
}
.calles:nth-child(1){-webkit-animation:calles 2s infinite;animation:calles 2s infinite;}
.calles:nth-child(2){-webkit-animation:calles 2s infinite;animation:calles 2s infinite;}
.calles:nth-child(2){-webkit-animation:calles 2s infinite;animation:calles 2s infinite;}
.phone-info,
.calles{font-family:"Lato", sans-serif;display:inline-block;color:#fff;background:#066de3;position:fixed;bottom:100px;left:50px;font-size:45px;text-align:center;z-index:99;border-radius:90%;height:50px;width:50px;line-height:45px;cursor:pointer;-webkit-transition:all 0.2s;-moz-transition:all 0.2s;transition:all 0.2s;}
@keyframes calles{0%{-webkit-transform:scale(0.1);transform:scale(0.1);opacity:0;}
50%{opacity:0.3;}
100%{-webkit-transform:scale(2);transform:scale(2);opacity:0;}
}