/**
 * WEBSITE: https://themefisher.com
 * TWITTER: https://twitter.com/themefisher
 * FACEBOOK: https://facebook.com/themefisher
 * GITHUB: https://github.com/themefisher/
 */

/*!------------------------------------------------------------------
[MAIN STYLESHEET]

PROJECT:	Biztrox | Business HTML5 Template
VERSION:	1.0.0
-------------------------------------------------------------------*/
/*------------------------------------------------------------------
[TABLE OF CONTENTS]

1. BASE

    1.1. Typography
    1.2. Common Styles
        1.2.1 Page Title
        1.2.1 404 page
    1.3 Button Style

2. NAVIGATION

3. HERO AREA

4. SKILL SECTION

    4.1. fun-facts
    4.2. counter

5. PROGRESS SECTION

    5.1. progressbar title
    5.2. progressbar value

6. MISSION SECTION

    6.1. card header
    6.2. card body

7. PROMO VIDEO SECTION

8. TESTIMONIAL SECTION

    8.1. testimonial slider
    8.2. testimonial content

9. CONTACT

    9.1. Address Item
    9.2. Google Map
    9.3. COntact Form

10. CLIENT LOGO SLIDER

11. FUN-FACTS SECTION

12. CONSULTATION SECTION

    12.1 background image
    12.2 form-control

13. ABOUT SECTION

    13.1 about content
    13.2 about item
    13.3 about content 2
    13.4 about video
    13.5 about content 3
    13.6 about slider
    13.7 philosophy
    13.8 ceo

        13.8.1 ceo item
        13.8.1 ceo content
        13.8.1 ceo content-2


14. SERVICE SECTION

    14.1 service item
    14.2 service item 2
    14.3 clients
    14.4 Process
    14.5 service menu
    14.6 service brochure
    14.7 service schedule
    14.8 service consultation
    14.9 service single

        14.9.1 service single image
        14.9.2 service single content
        14.9.3 service single list
        14.9.4 service single benefit
        14.9.5 widget

15. WORK SECTION

    15.1 work slider
    15.2 slick dots

16. CALL TO ACTION

17. TEAM SECTION

    17.1 team item
    17.2 team content
    17.3 team member
    17.4 team single

        17.4.1 team member info item
        17.4.2 team member details

18. PRICING SECTION

    18.1 pricing item

19. PROJECT SECTION

    19.1 project menu
    19.2 project item
    19.3 project single

        19.3.1 project overview
        19.3.2 case study
        19.3.3 project single content

    19.4 nav-tabs
    19.5 tab content

20. FAQ SECTION

21. BLOG SECTION

    21.1 blog item
    21.2 blog content
    21.3 blog content 2
    21.4 blog post

        21.4.1 post slider
        21.4.2 post video
        21.4.3 pagination
        21.4.4 sidebar

    21.5 blog single

        21.5.1 blog single container
        21.5.2 blog single content
        21.5.3 blog single list
        21.5.4 blog single testimonial
        21.5.5 share tags
        21.5.6 comments
        21.5.7 blog-sidebar

22. CONTACT SECTION

    22.1 contact item
    22.2 contact form
    22.3 google map

23. SIGNUP WRAPPER

    23.1 signup greetngs
    23.2 signup form

24. COMMING SOON

    24.1 SYOtimer

25. FOOTER SECTION

    25.1 social link
    25.2 footer link
    25.3 subcription
    25.4 copyright
    25.5 back to top
-------------------------------------------------------------------*/
/* 1.1 typography */
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700|Poppins:300,400,500,600,700|Work+Sans:400,500,600");
body {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  font-size: 15px;
}

p, .paragraph {
  font-weight: 400;
  color: #666;
  font-size: 14px;
  line-height: 25px;
  font-family: "Open Sans", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  color: #222;
  font-weight: 500;
  font-family: "Poppins", sans-serif;
}

h1, .h1 {
  font-size: 60px;
}
@media (max-width: 400px) {
  h1, .h1 {
    font-size: 30px;
  }
}

h2, .h2 {
  font-size: 36px;
}

h3, .h3 {
  font-size: 30px;
}

h4, .h4 {
  font-size: 20px;
}

h5, .h5 {
  font-size: 18px;
}

h6, .h6 {
  font-size: 14px;
}

/* 1.3 Button style */
.btn {
  font-size: 14px;
  font-family: "Open Sans", sans-serif;
  text-transform: capitalize;
  padding: 16px 44px;
  border-radius: 5px;
  font-weight: 600;
  white-space: nowrap;
  border: 0;
  position: relative;
  z-index: 1;
  transition: 0.2s ease;
}
.btn:focus {
  outline: 0;
  box-shadow: none !important;
}
.btn:active {
  box-shadow: none;
}

.btn-primary {
  background: #e84444;
  color: #fff;
}
.btn-primary:active {
  background: #e84444 !important;
}
.btn-primary:hover {
  background: #ee7171;
}

.btn-secondary {
  background: #303032;
  color: #fff;
}
.btn-secondary:active {
  background: #e84444 !important;
}
.btn-secondary:hover {
  background: #e84444 !important;
  background: #ee7171;
}

.btn-light {
  background: #fff;
  color: #222;
  border: 2px solid #fff;
}
.btn-light:hover {
  background: transparent;
  border: 2px solid #fff;
  color: #fff;
}

.btn-outline {
  background: transparent;
  color: #222;
  border: 2px solid #303032;
}
.btn-outline:hover {
  background: #303032;
  color: #fff;
}

.btn-sm {
  padding: 13px 40px !important;
}

/* 1.2 common style */
body {
  background-color: #fff;
  overflow-x: hidden;
}

::-moz-selection {
  background: #ee7171;
  color: #fff;
}

::selection {
  background: #ee7171;
  color: #fff;
}

/* preloader */
.preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

ol,
ul {
  list-style-type: none;
  margin: 0px;
}

img {
  vertical-align: middle;
  border: 0;
}

a,
a:hover,
a:focus {
  text-decoration: none;
}

a {
  transition: 0.2s ease;
}
a:hover {
  color: #e84444;
}

a.text-dark:hover,
a.text-white:hover {
  color: #e84444 !important;
}

a,
button {
  cursor: pointer;
}

.outline-0 {
  outline: 0;
}

.d-unset {
  display: unset !important;
}

.slick-slide {
  outline: 0;
}

.centralized {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.hilighted {
  background: #303032;
  color: #919e4d;
  border-radius: 3px;
  padding: 2px 5px;
}

.section {
  padding: 100px 0;
}
@media (max-width: 575px) {
  .section {
    padding: 80px 0;
  }
}
.section-sm {
  padding: 80px 0;
}
.section-title {
  margin-bottom: 55px;
}

.section-title-sm {
  margin-bottom: 10px;
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  color: #666;
}

.overlay-zIndex-none::before {
  z-index: 0 !important;
}

.overlay {
  position: relative;
  isolation: isolate;
}
.overlay::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background: #000;
  opacity: 0.6;
  z-index: -10;
}
.overlay-dark {
  position: relative;
  isolation: isolate;
}
.overlay-dark::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background: #000;
  opacity: 0.8;
  z-index: -10;
}
.overlay-primary {
  position: relative;
  isolation: isolate;
}
.overlay-primary::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background: #e84444;
  opacity: 0.6;
  z-index: -10;
}
.overlay-white {
  position: relative;
  isolation: isolate;
}
.overlay-white::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background: #fff;
  opacity: 0.7;
  z-index: -10;
}
.overlay-rounded::before {
  border-radius: 5px;
}

.section-title-border {
  position: relative;
}
.section-title-border::before {
  position: absolute;
  content: "";
  height: 2px;
  width: 120px;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: #e84444;
}
.section-title-border::after {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #e84444;
  box-shadow: 0 0 0 5px #fff;
  bottom: -14px;
  left: 50%;
  transform: translateX(-50%);
}

.section-title-border-gray {
  position: relative;
}
.section-title-border-gray::before {
  position: absolute;
  content: "";
  height: 2px;
  width: 120px;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: #e84444;
}
.section-title-border-gray::after {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: #f5f5f5;
  border: 2px solid #e84444;
  box-shadow: 0 0 0 5px #f5f5f5;
  bottom: -14px;
  left: 50%;
  transform: translateX(-50%);
}

.section-title-border-half {
  position: relative;
}
.section-title-border-half::before {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: transparent;
  border: 2px solid #e84444;
  bottom: -14px;
  left: 0;
}
.section-title-border-half::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 50px;
  left: 15px;
  bottom: -10px;
  background: #e84444;
}
.section-title-border-half-white {
  position: relative;
}
.section-title-border-half-white::before {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: transparent;
  border: 2px solid #fff;
  bottom: -14px;
  left: 0;
}
.section-title-border-half-white::after {
  background: #fff;
  position: absolute;
  content: "";
  height: 2px;
  width: 50px;
  left: 15px;
  bottom: -10px;
}

/* 1.2.1 page title */
.page-title {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 160px 0 100px;
}

/* breadcrumb */
.breadcrumb {
  background-color: transparent !important;
  justify-content: center;
}
.breadcrumb li,
.breadcrumb a {
  color: #fff;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 12px;
  margin: 0 10px;
}
.breadcrumb a {
  position: relative;
}
.breadcrumb a::before {
  position: absolute;
  content: "/";
  right: -17px;
  top: 2px;
  height: 12px;
}

/* 1.2.2 404 page start */
.page-404 {
  padding: 600px 0 60px;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}
@media (max-width: 767px) {
  .page-404 {
    padding: 450px 0 50px;
  }
}
@media (max-width: 575px) {
  .page-404 {
    padding-top: 250px;
  }
}
@media (max-width: 400px) {
  .page-404 {
    padding-top: 150px;
  }
}
.page-404 h1 {
  font-size: 40px;
}

/* 404 page end */
/* play-icon */
.play-icon {
  width: 85px;
  height: 85px;
  border: 3px solid #fff;
  border-radius: 50%;
  display: block;
  text-align: center;
}
.play-icon:focus {
  outline: 0;
}
.play-icon i {
  line-height: 79px;
  display: block;
  font-size: 30px;
  color: #fff;
}

/* round icon */
.round-icon {
  height: 70px;
  min-width: 70px;
  max-width: 70px;
  border-radius: 50%;
  border: 1px solid #e5e5e5;
  background: #fff;
  text-align: center;
  line-height: 70px;
  font-size: 30px;
  color: #e84444;
  display: inline-block;
}

/* 18. squre icon */
.square-icon {
  height: 65px;
  width: 65px;
  background: #e84444;
  color: #fff;
  font-size: 35px;
  line-height: 65px;
  border-radius: 5px;
  text-align: center;
  display: inline-block;
}

/* team social icon */
.social-icon-lg {
  height: 50px;
  width: 50px;
  border-radius: 50%;
  line-height: 50px;
  text-align: center;
  color: #fff;
  font-size: 25px;
  display: inline-block;
}
.social-icon-lg i {
  margin: 0;
  color: #fff;
}

.box-shadow {
  box-shadow: 0px 10px 35px 0px rgba(0, 0, 0, 0.1);
}

.golden {
  color: #efaf27 !important;
}

.bg-gray {
  background-color: #f5f5f5;
}

.bg-primary {
  background-color: #e84444 !important;
}

.bg-secondary {
  background-color: #303032 !important;
}

.text-primary {
  color: #e84444 !important;
}

.bg-facebook {
  background-color: #4267b2;
}

.bg-twitter {
  background-color: #449de8;
}

.bg-linkedin {
  background-color: #2f6ea3;
}

.bg-google {
  background-color: #e62211;
}

.text-color {
  color: #666;
}

.text-dark {
  color: #222;
}

.text-underline {
  text-decoration: underline;
}
.text-underline:hover {
  text-decoration: underline;
}

.font-primary {
  font-family: "Poppins", sans-serif;
}

.font-secondary {
  font-family: "Open Sans", sans-serif;
}

.mb-10 {
  margin-bottom: 10px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-50 {
  margin-bottom: 50px;
}

@media (max-width: 991px) {
  .mb-md-50 {
    margin-bottom: 50px;
  }
}

.mb-60 {
  margin-bottom: 60px;
}

.mb-70 {
  margin-bottom: 70px;
}

.mb-80 {
  margin-bottom: 80px;
}

.mb-90 {
  margin-bottom: 90px;
}

.mb-100 {
  margin-bottom: 100px;
}

.py-10 {
  padding: 10px 0;
}

.py-50 {
  padding: 50px 0;
}

.py-100 {
  padding-top: 100px;
  padding-bottom: 100px;
}

.py-160 {
  padding: 160px 0;
}

.ms-65 {
  margin-left: 65px;
}

.pb-xl-200-lg-100 {
  padding-bottom: 200px;
}
@media (max-width: 1199px) {
  .pb-xl-200-lg-100 {
    padding-bottom: 100px;
  }
}

.mb-xl-150-lg-100 {
  margin-bottom: 150px;
}
@media (max-width: 1199px) {
  .mb-xl-150-lg-100 {
    margin-bottom: 100px;
  }
}

.translateY-25 {
  transform: translateY(25px);
}

.translateY-10 {
  transform: translateY(-10px);
}

.translateY-33 {
  transform: translateY(-33px);
}

/* 2. Navigation */
.top-header {
  background: #303032;
}

/* Professional Top Header Styles */
.top-header {
  background: linear-gradient(135deg, #1a1a1a, #2d2d2d);
  padding: 6px 0;
  border-bottom: 2px solid #e74c3c;
  /* box-shadow: 0 2px 8px rgba(0,0,0,0.2); */
}

/* Header Content Layout */
.header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 30px;
  flex-wrap: nowrap;
}

/* Contact Info Section */
.contact-info {
  display: flex;
  align-items: center;
  gap: 20px;
}

.contact-item {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 400;
  transition: color 0.3s ease;
}

.contact-item:hover {
  color: #e74c3c;
}

.contact-item i {
  color: #e74c3c;
  font-size: 16px;
}

/* Business Hours Section */
.business-hours {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 500;
  transition: color 0.3s ease;
}

.business-hours:hover {
  color: #e74c3c;
}

.business-hours i {
  color: #e74c3c;
  font-size: 16px;
}

/* Social Links Section */
.social-links {
  display: flex;
  align-items: center;
  gap: 8px;
}

.social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: rgba(255,255,255,0.1);
  border-radius: 50%;
  color: #ffffff;
  text-decoration: none;
  transition: all 0.3s ease;
}

.social-link:hover {
  background: #e74c3c;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(231, 76, 60, 0.3);
}

.social-link i {
  font-size: 14px;
  transition: all 0.3s ease;
}

.social-link:hover i {
  color: #ffffff;
  transform: scale(1.1);
}

/* Responsive Design */
@media (max-width: 992px) {
  .business-hours {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  .header-content {
    justify-content: space-between;
  }
}

@media (max-width: 768px) {
  .header-content {
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center;
    gap: 10px;
  }
  
  .contact-item {
    font-size: 13px;
  }
  
  .social-links {
    gap: 6px;
  }
  
  .social-link {
    width: 28px;
    height: 28px;
  }
}

@media (max-width: 576px) {
  .top-header {
    padding: 4px 0;
  }
  
  .header-content {
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center;
    gap: 8px;
  }
  
  .contact-item {
    font-size: 11px;
  }
  
  .contact-item i {
    font-size: 12px;
  }
  
  .social-links {
    gap: 4px;
  }
  
  .social-link {
    width: 24px;
    height: 24px;
  }
  
  .social-link i {
    font-size: 10px;
  }
  
  /* Mobile Logo Optimization */
  .navigation .navbar-brand {
    padding: 3px 8px !important;
  }
  
  .navigation .navbar-brand img {
    height: 32px !important;
    max-width: 120px !important;
  }
  
  .navigation .navbar {
    padding: 5px 0 !important;
  }
  
  /* Force smaller logo on mobile */
  .navbar-brand img {
    height: 32px !important;
    max-width: 120px !important;
  }
}
@media (max-width: 575px) {
  .top-header ul {
    text-align: center;
  }
  
  /* Extra Small Mobile Logo */
  .navigation .navbar-brand img {
    height: 28px !important;
    max-width: 100px !important;
  }
  
  .navigation .navbar-brand {
    padding: 2px 5px !important;
  }
  
  /* Force even smaller logo */
  .navbar-brand img {
    height: 28px !important;
    max-width: 100px !important;
  }
}
.top-header ul li {
  margin: 15px 0;
}
@media (max-width: 575px) {
  .top-header ul li {
    margin: 10px 0;
  }
}
.top-header ul li a {
  display: inline-block;
  padding: 0 20px;
  border-right: 1px solid #e5e5e5;
  color: #bcbcbd;
}
@media (max-width: 575px) {
  .top-header ul li a {
    border: 0;
  }
}
.top-header ul li a span {
  color: #e84444;
}
.top-header ul li:last-child a {
  padding-right: 0;
  border-right: 0;
}

.navigation .navbar {
  padding: 0;
  background: #fff !important;
  position: relative;
}
.navigation .navbar-brand {
  position: relative;
  left: 0;
  top: 0;
  height: auto;
  width: auto;
  /* background: #fff; */
  padding: 10px 20px;
  text-align: center;
  /* box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.1); */
  /* z-index: 9; */
}
@media (max-width: 991px) {
  .navigation .navbar-brand {
    position: relative !important;
    height: unset !important;
    width: unset !important;
    box-shadow: none !important;
    top: 0 !important;
    background: none !important;
    padding: 5px 10px !important;
  }
  .navigation .navbar-brand img {
    height: 40px !important;
    width: auto !important;
    max-width: 150px !important;
  }
}
.navigation .navbar-brand img {
  height: 80px;
  width: auto;
  max-width: 100%;
}

/* Footer logo styling */
footer img,
.bg-secondary img {
  height: 80px;
  width: auto;
  max-width: 100%;
  display: block;
}

@media (max-width: 768px) {
  footer img,
  .bg-secondary img {
    height: 50px;
    margin: 0 auto;
  }
}
.navigation .navbar .nav-item {
  padding: 28px 0;
}
@media (max-width: 991px) {
  .navigation .navbar .nav-item {
    padding: 0;
  }
}
.navigation .navbar .nav-item .nav-link {
  padding: 15px 10px;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  color: #222;
  text-transform: uppercase;
  transition: 0.2s ease;
  font-size: 14px;
}
@media (max-width: 1199px) {
  .navigation .navbar .nav-item .nav-link {
    font-size: 12px;
    padding: 15px 6px;
  }
}
@media (max-width: 991px) {
  .navigation .navbar .nav-item .nav-link {
    padding: 15px 0;
    font-size: 14px;
    text-align: center;
  }
}
.navigation .navbar .nav-item .nav-link:hover {
  color: #e84444;
}
.navigation .navbar .nav-item.nav-button {
  padding: 28px 0 28px 30px;
}
@media (max-width: 991px) {
  .navigation .navbar .nav-item.nav-button {
    padding: 0;
    margin-bottom: 20px;
  }
}
.navigation .navbar .nav-item.nav-button .nav-link {
  color: #fff;
}
.navigation .navbar .nav-item.nav-button .nav-link.pgactive {
  color: #e84444;
}
.navigation .navbar .nav-item.active .nav-link {
  color: #e84444;
}
.navigation .navbar .dropdown:hover .dropdown-menu {
  visibility: visible;
  opacity: 1;
  transform: scaleY(1);
}
.navigation .navbar .dropdown-menu {
  box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.12);
  padding: 40px 30px;
  border: 0;
  border-radius: 0;
  top: 80%;
  left: -20px;
  display: block;
  visibility: hidden;
  transition: 0.3s ease;
  opacity: 0;
  transform: scaleY(0);
  transform-origin: top;
}
@media (max-width: 991px) {
  .navigation .navbar .dropdown-menu {
    display: none;
    opacity: 1;
    visibility: visible;
    transform: scaleY(1);
    transform-origin: unset;
  }
}
.navigation .navbar .dropdown-menu.show {
  visibility: visible;
  opacity: 1;
  transform: scaleY(1);
}
@media (max-width: 991px) {
  .navigation .navbar .dropdown-menu.show {
    display: block;
  }
}
.navigation .navbar .dropdown-item {
  position: relative;
  color: #848484;
  transition: 0.2s ease;
}
.navigation .navbar .dropdown-item:not(:last-child) {
  margin-bottom: 20px;
}
.navigation .navbar .dropdown-item:hover {
  color: #e84444;
  text-decoration: underline;
  background: transparent;
}
.navigation .navbar .dropdown-item::before {
  position: absolute;
  content: "";
  left: 5px;
  top: 12px;
  height: 4px;
  width: 4px;
  border-radius: 50%;
  background: #848484;
  border: 1px solid #fff;
  display: inline-block;
  box-shadow: 0 0 0 2px #848484;
}
@media (max-width: 991px) {
  .navigation .navbar .dropdown-item {
    text-align: center;
  }
  .navigation .navbar .dropdown-item::before {
    display: none;
  }
}

/* 2.3. Search Form */
.search-form {
  padding: 230px 0;
  background: #303032;
  position: absolute;
  width: 100%;
  top: -800px;
  z-index: 10;
  transition: 0.3s ease-in;
}
.search-form .close {
  position: absolute;
  top: 30px;
  right: 30px;
  color: #fff;
}
.search-form .close i {
  transition: 0.3s ease;
  display: inline-block;
}
.search-form .close:hover i {
  transform: rotate(90deg);
}
.search-form.open {
  top: 0;
}
.search-form .form-control {
  background: transparent;
  border: 1px solid #e5e5e5;
  border-radius: 0;
  font-size: 20px;
  transition: 0.3s ease;
  position: relative;
  color: #fff;
  height: 130px;
  padding: 30px 40px;
}
.search-form h3 {
  font-size: 35px;
  color: #fff;
  margin-bottom: 35px;
}
.search-form .input-wrapper {
  position: relative;
}
.search-form .input-wrapper button {
  background: none;
  border: 0;
  position: absolute;
  font-size: 20px;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  cursor: pointer;
  padding: 20px;
}
.search-form .input-wrapper button i {
  color: #fff;
}

/* 3. hero area */
.hero-slider.slick-slider {
  margin-bottom: 80px;
}
.hero-slider [data-animation-in] {
  opacity: 0;
}
.hero-slider-item {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  outline: 0;
}
.hero-slider .prevArrow,
.hero-slider .nextArrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9;
  height: 60px;
  width: 60px;
  border-radius: 10%;
  background: rgba(48, 48, 50, 0.5);
  color: #fff;
  border: 0;
  font-size: 20px;
  line-height: 20px;
  opacity: 0;
  transition: all linear 0.2s;
}
@media (max-width: 575px) {
  .hero-slider .prevArrow,
  .hero-slider .nextArrow {
    display: none;
  }
}
.hero-slider .prevArrow:focus,
.hero-slider .nextArrow:focus {
  outline: 0;
}
.hero-slider .prevArrow:hover,
.hero-slider .nextArrow:hover {
  background: rgba(232, 68, 68, 0.5);
}
.hero-slider .prevArrow {
  left: 20px;
}
.hero-slider .nextArrow {
  right: 20px;
}
.hero-slider:hover .prevArrow,
.hero-slider:hover .nextArrow {
  opacity: 1;
}
.hero-slider .slick-dots {
  bottom: -81px;
  padding-left: 0;
  text-align: center;
  border-bottom: 1px solid #0c0b0b4f;
}
.hero-slider .slick-dots li {
  width: 295px;
  height: 80px;
  background: #fff;
  margin: 0;
  display: inline-block;
  position: relative;
  /* @include mobile-xs {
                  width: 50px;
              } */
}
@media (max-width: 1199px) {
  .hero-slider .slick-dots li {
    width: 230px;
  }
}
@media (max-width: 991px) {
  .hero-slider .slick-dots li {
    width: 180px;
  }
}
@media (max-width: 767px) {
  .hero-slider .slick-dots li {
    width: 120px;
  }
}
@media (max-width: 575px) {
  .hero-slider .slick-dots li {
    width: 25%;
  }
}
.hero-slider .slick-dots li::before {
  position: absolute;
  content: "";
  left: 50%;
  top: -12px;
  height: 25px;
  width: 25px;
  background: rgba(232, 68, 68, 0.6);
  transform: translateX(-50%) rotate(-45deg);
  opacity: 0;
}
.hero-slider .slick-dots li a {
  display: block;
  position: relative;
  text-align: center;
  transition: 0.3s ease;
  color: #303032;
}
.hero-slider .slick-dots li a i {
  display: inline-block;
  font-size: 30px;
  line-height: 80px;
  margin-right: 15px;
  vertical-align: middle;
}
@media (max-width: 991px) {
  .hero-slider .slick-dots li a i {
    font-size: 20px;
    margin-right: 5px;
  }
}
@media (max-width: 767px) {
  .hero-slider .slick-dots li a i {
    margin: 0;
  }
}
.hero-slider .slick-dots li a span {
  font-size: 18px;
  font-weight: 500;
  line-height: 80px;
}
@media (max-width: 991px) {
  .hero-slider .slick-dots li a span {
    font-size: 15px;
  }
}
@media (max-width: 767px) {
  .hero-slider .slick-dots li a span {
    display: none;
  }
}
.hero-slider .slick-dots li.slick-active {
  background: #303032;
}
.hero-slider .slick-dots li.slick-active a {
  color: #fff;
}
.hero-slider .slick-dots li.slick-active::before {
  opacity: 1;
}
.hero-content h4 {
  letter-spacing: 2px;
}

/*--------------------------------------------------------------
	swipwe slider
--------------------------------------------------------------*/
.swiper {
  /* slider dots */
  /* slider arrows */
}
.swiper-slider {
  width: 100%;
  min-height: calc(100vh - 150px);
  display: flex;
  position: relative;
  z-index: 0;
}
.swiper-container {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.swiper-slide {
  overflow: hidden;
}
.swiper-slide .slide-inner {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  background-size: cover;
  background-position: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  text-align: center;
  line-height: 12px;
  font-size: 12px;
  color: #000;
  opacity: 1;
  background: rgba(232, 68, 68, 0.2);
}
.swiper-pagination-bullet-active {
  color: #fff;
  background: #e84444;
  width: 15px;
  height: 15px;
  text-align: center;
  line-height: 15px;
}
.swiper-button-prev, .swiper-button-next {
  background: transparent;
  width: auto;
  height: auto;
  opacity: 0.3;
  text-align: center;
  transition: all 0.3s;
}
@media (max-width: 767px) {
  .swiper-button-prev, .swiper-button-next {
    display: none;
  }
}
.swiper-button-prev:hover, .swiper-button-next:hover {
  opacity: 1;
}
.swiper-button-prev {
  left: 25px;
}
.swiper-button-prev::before {
  font-family: "themify";
  content: "\e64a";
  font-size: 40px;
  color: #e84444;
}
.swiper-button-next {
  right: 25px;
}
.swiper-button-next::before {
  font-family: "themify";
  content: "\e649";
  font-size: 40px;
  color: #e84444;
}

/* 5. progrgess bar start */
.progressbar-title {
  font-size: 17px;
  font-family: "Open Sans", sans-serif;
  margin-bottom: 7px;
  color: #222 !important;
}

.progress {
  border-radius: 35px;
  overflow: visible;
  margin-bottom: 35px;
  /* 5.2 progressbar value */
}
.progress-bar {
  background-color: #303032;
  border-radius: 35px;
  position: relative;
}
.progress-bar-value {
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  color: #fff;
  background: #303032;
  padding: 5px 9px;
  position: absolute;
  top: -35px;
  right: -15px;
  border-radius: 5px;
}
.progress-bar-value::before {
  position: absolute;
  content: "";
  bottom: -5px;
  left: 50%;
  background: #303032;
  height: 10px;
  width: 10px;
  transform: translateX(-50%) rotate(-45deg);
}

/* progrgess bar End */
/* 6. mission section start */
.card-header:first-child {
  border-radius: 35px;
}

/* 7. promo video section start */
.promo-video {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  position: relative;
  overflow: hidden;
}

/* Simple parallax effect for promo video */
.promo-video {
  background-attachment: fixed;
}
.promo-video p {
  font-family: "Work Sans", sans-serif;
}

/* Reduce heading size for promo video */
.promo-video h1 {
  font-size: 2.5rem !important;
  line-height: 1.2;
}

@media (max-width: 768px) {
  .promo-video h1 {
    font-size: 2rem !important;
  }
}

/* promo video section end */
/* 8. testimonial section start */
.testimonial-slider {
  /* box-shadow: 0px 10px 35px 0px rgba(0, 0, 0, 0.1); */
  position: relative;
}
.testimonial-slider .prevArrow,
.testimonial-slider .nextArrow {
  position: absolute;
  top: 85px;
  border: 0;
  font-size: 20px;
  background: transparent;
  color: #e84444;
  z-index: 9;
}
.testimonial-slider .prevArrow:focus,
.testimonial-slider .nextArrow:focus {
  outline: 0;
}
.testimonial-slider .prevArrow {
  right: 90px;
}
.testimonial-slider .nextArrow {
  right: 50px;
}
.testimonial-slider .slick-disabled {
  color: #e5e5e5;
}
.testimonial-icon {
  height: 80px;
  width: 80px;
  border-radius: 50%;
  background: #f5f5f5;
  color: #e84444;
  font-size: 25px;
  line-height: 80px;
  display: inline-block;
  text-align: center;
  margin-bottom: 25px;
}

/* testimonial section end */
/* 10. client logo slider start */
.client-logo-slider .slick-track {
  display: flex;
  align-items: center;
}

/* client logo slider end */
/* 11. fun-facts section start */
.fun-facts {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}

/* fun-facts section end */
/* 12. consultation section start */
.consultation {
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* consultation section end */
/* 16. call to action start */
.cta {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* card */
.card-img-wrapper {
  position: relative;
}
.card-img-wrapper::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  background: #000;
  opacity: 0;
  top: 0;
  left: 0;
  transition: 0.2s;
}
.card-body-2 {
  position: relative;
  transition: 0.2s ease;
  border-radius: 0 0 5px 5px;
}
.card-body-2::before {
  position: absolute;
  content: "";
  height: 30px;
  width: 30px;
  background: #fff;
  top: -15px;
  left: 50%;
  transform: translateX(-50%) rotate(-45deg);
  transition: 0.2s ease;
}
.card:hover .card-img-wrapper::before {
  opacity: 0.4;
}
.card:hover .card-body-2 {
  background: #e84444;
}
.card:hover .card-body-2 h5,
.card:hover .card-body-2 h6,
.card:hover .card-body-2 a {
  color: #fff;
}
.card:hover .card-body-2::before {
  background: #e84444;
}

.overlay-rounded-top::before {
  border-radius: 5px 5px 0 0;
}

/* 13. about section */
.about {
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  /* 13.4 about video */
  /* 13.6 about slider */
}
.about-video {
  min-height: 300px;
}
.about-slider {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
}

/* About slider shadow effect */
.about-slider::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.6) 0%, rgba(232, 68, 68, 0.3) 100%);
  z-index: 1;
  pointer-events: none;
}

/* About image shadow effect */
.about-image-wrapper {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
}

.about-image-wrapper::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.6) 0%, rgba(232, 68, 68, 0.3) 100%);
  z-index: 1;
  pointer-events: none;
}
.about-slider .prevArrow,
.about-slider .nextArrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9;
  height: 55px;
  width: 55px;
  border-radius: 50%;
  border: 0;
  line-height: 55px;
  text-align: center;
  background: #fff;
  transition: 0.2s ease;
}
.about-slider .prevArrow:focus,
.about-slider .nextArrow:focus {
  outline: 0;
}
.about-slider .prevArrow:hover,
.about-slider .nextArrow:hover {
  background: #e84444;
  color: #fff;
}
.about-slider .prevArrow {
  left: 25px;
}
.about-slider .nextArrow {
  right: 25px;
}

/* 13.8 ceo section start */
.ceo-image {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 400px;
}

/* ceo section end */
/* 14.3 clients */
.clients {
  background-position: center right;
  background-size: 50%;
  background-repeat: no-repeat;
}
@media (max-width: 991px) {
  .clients {
    background-size: cover !important;
    background-position: center center;
    text-align: center;
  }
}
.clients ul li {
  height: 66px;
}
.clients ul li img {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  display: inline-block;
}

/* 14.4 process */
.process-item {
  width: 330px;
}
@media (max-width: 1199px) {
  .process-item {
    width: unset;
  }
}
.process-item-number {
  position: absolute;
  left: -35px;
  top: -35px;
  height: 70px;
  width: 70px;
  line-height: 70px;
  border-radius: 50%;
  text-align: center;
  background: #fff;
  box-shadow: -5px 0px 40px 0px rgba(0, 0, 0, 0.1);
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  font-size: 32px;
  color: #222;
}
@media (max-width: 1199px) {
  .process-item-number {
    top: -35px;
    left: 50%;
    transform: translateX(-50%);
  }
}
.process-item h5 {
  margin-bottom: 5px;
  color: #e84444;
}

img.arrow-top {
  position: absolute;
  top: 220px;
  right: 250px;
}
@media (max-width: 1199px) {
  img.arrow-top {
    display: none;
  }
}

img.arrow-bottom {
  position: absolute;
  bottom: 100px;
  left: 250px;
}
@media (max-width: 1199px) {
  img.arrow-bottom {
    display: none;
  }
}

/* service single start */
.service-menu li.active {
  position: relative;
}
.service-menu li.active a {
  background: #303032;
  color: #fff !important;
}
.service-menu li.active::before {
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background: #303032;
  top: 50%;
  right: -7px;
  transform: translateY(-50%) rotate(-45deg);
}
@media (max-width: 991px) {
  .service-menu li.active::before {
    display: none;
  }
}
.service-menu li:hover a {
  color: #fff !important;
  background: #303032;
}

/* service single end */
/* 15. work section */
.work {
  /* 15.1 work slider */
}
.work-slider {
  /* 15.2 slick dots */
}
.work-slider-image {
  position: relative;
}
.work-slider-image .image-overlay {
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.75);
  height: 100%;
  width: 100%;
  padding: 15px 25px;
  opacity: 0;
  transition: 0.2s;
}
.work-slider-image .image-overlay i {
  position: absolute;
  color: #fff;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: inline-block;
  font-size: 24px;
  transition: 0.2s ease;
  padding: 10px;
}
.work-slider-image .image-overlay i:hover {
  font-size: 30px;
}
.work-slider-image .image-overlay a.h4 {
  position: absolute;
  bottom: 50px;
  color: #fff;
  transition: 0.2s ease;
  transform: translateY(20px);
  opacity: 0;
}
.work-slider-image .image-overlay a.h4:hover {
  color: #e84444;
}
.work-slider-image .image-overlay p {
  position: absolute;
  bottom: 15px;
  color: #fff;
  transform: translateY(10px);
  opacity: 0;
  transition: 0.3s ease;
  transition-delay: 0.1s;
}
.work-slider-image:hover .image-overlay {
  opacity: 1;
}
.work-slider-image:hover a.h4,
.work-slider-image:hover p {
  transform: translateY(0);
  opacity: 1;
}
.work-slider .slick-dots {
  padding-left: 0;
  position: absolute;
  bottom: -60px;
  left: 50%;
  transform: translateX(-50%);
}
.work-slider .slick-dots li {
  margin: 0 14px;
}
@media (max-width: 400px) {
  .work-slider .slick-dots li {
    margin: 0 2px;
  }
}
.work-slider .slick-dots li:first-child {
  margin-left: 0;
}
.work-slider .slick-dots li button {
  height: 10px;
  width: 40px;
  border-radius: 25px;
  color: transparent;
  overflow: hidden;
  border: 0;
  border: 2px solid #e5e5e5;
  background: transparent;
  outline: 0;
  display: block;
}
.work-slider .slick-dots li button::before {
  display: none;
}
@media (max-width: 400px) {
  .work-slider .slick-dots li button {
    width: 10px;
  }
}
.work-slider .slick-dots li.slick-active button {
  border-color: #e84444;
}

/* 19. project section */
.project {
  /* 19.1 project menu */
  /* 19.2 project item */
}
.project-menu ul li {
  padding: 5px 20px;
  border-radius: 35px;
  color: #222;
  font-size: 16px;
  font-weight: 400;
  border: 1px solid #e5e5e5;
  cursor: pointer;
  background: #f5f5f5;
  margin: 0 10px 25px;
}
.project-menu ul li.active {
  background: #e84444;
  color: #fff;
}
.project-info {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.7);
  opacity: 0;
  transition: 0.2s ease;
}
.project-info a {
  color: #fff;
  position: absolute;
  left: 30px;
  bottom: 40px;
  transform: translateY(20px);
  opacity: 0;
}
.project-info a:hover {
  color: #e84444;
}
.project-info p {
  position: absolute;
  left: 25px;
  bottom: 0;
  color: #fff;
  transition: 0.2s ease;
  transform: translateY(20px);
  opacity: 0;
  transition-delay: 0.1s;
}
.project-info p i {
  margin-right: 5px;
}
.project-info:hover {
  opacity: 1;
}
.project-info:hover a {
  transform: translateY(0);
  opacity: 1;
}
.project-info:hover p {
  transform: translateY(0);
  opacity: 0.7;
}

/* 19.3 project single page start */
/* 19.4 nav tabs */
.nav-tabs {
  border: 0;
  margin-bottom: 30px;
}
@media (max-width: 991px) {
  .nav-tabs {
    justify-content: center;
  }
}
.nav-tabs .nav-item:not(:last-child) {
  margin-right: 10px;
}
@media (max-width: 575px) {
  .nav-tabs .nav-item {
    margin-bottom: 10px;
  }
}
.nav-tabs .nav-item .nav-link {
  padding: 10px 30px;
  border: 1px solid #e5e5e5;
  background: #f5f5f5;
  border-radius: 45px;
  text-align: center;
  vertical-align: middle;
  color: #222;
  transition: 0.2s ease;
  font-size: 16px;
  font-family: "Poppins", sans-serif;
}
.nav-tabs .nav-item .active {
  background: #fff;
  color: #e84444;
  border-color: #e84444;
}

/* 19.5 tab content */
.tab-content {
  padding: 40px;
  margin-bottom: 60px;
  border-radius: 5px;
  background: #fff;
  border: 1px solid #e5e5e5;
}
.tab-content-item {
  margin-left: 20px;
}
.tab-content-item:not(:last-child) {
  margin-bottom: 45px;
}
.tab-content-item h6 {
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  font-size: 14px;
  color: #222;
  margin-bottom: 25px;
  position: relative;
}
.tab-content-item h6::before {
  position: absolute;
  content: "\e65d";
  font-family: "themify";
  top: 0;
  left: -20px;
  color: #e84444;
}
.tab-content-item p {
  margin-bottom: 0;
}

/* project single page end */
/* 21.4.3 pagination */
.pagination .page-item .page-link {
  background: transparent;
  border: none;
  color: #000;
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  transition: 0.3s ease;
}
.pagination .page-item .page-link:hover {
  color: #e84444;
}
.pagination .page-item.active .page-link {
  color: #e84444;
}
.pagination .prev,
.pagination .next {
  border: 1px solid #e5e5e5;
  border-radius: 30px;
  padding: 5px 10px;
  transition: 0.3s ease;
}
.pagination .prev:hover,
.pagination .next:hover {
  border-color: #e84444;
}
.pagination .prev:hover .page-link,
.pagination .next:hover .page-link {
  color: #e84444;
}
.pagination .prev {
  margin-right: 30px;
}
.pagination .next {
  margin-left: 30px;
}

/* 21.4.1 post slider */
.post-slider {
  position: relative;
}
.post-slider .prevArrow,
.post-slider .nextArrow {
  position: absolute;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  line-height: 50px;
  top: 50%;
  border: 0;
  font-size: 20px;
  background: transparent;
  color: #e84444;
  z-index: 9;
  background: rgba(255, 255, 255, 0.8);
  transition: 0.3s ease;
}
.post-slider .prevArrow:focus,
.post-slider .nextArrow:focus {
  outline: 0;
}
.post-slider .prevArrow:hover,
.post-slider .nextArrow:hover {
  background: rgba(232, 68, 68, 0.25);
}
.post-slider .prevArrow {
  left: 40px;
}
.post-slider .nextArrow {
  right: 40px;
}
.post-slider .slick-disabled {
  color: #e5e5e5;
}

/* 21.4.4 sidebar */
.search-wrapper {
  position: relative;
}
.search-wrapper input {
  background: #f5f5f5;
  border-radius: 30px;
  font-weight: 400;
  height: 40px;
  line-height: 40px;
  padding: 0 25px;
  font-size: 13px;
}
.search-wrapper::before {
  content: "\e610";
  font-family: "themify";
  position: absolute;
  top: 50%;
  right: 20px;
  color: #666;
  transform: translateY(-50%);
}

ul.tag-list li {
  margin-bottom: 7px;
}
ul.tag-list li a {
  color: #666;
  padding: 10px 12px;
  display: block;
  border: 1px solid #e5e5e5;
  border-radius: 30px;
  font-size: 13px;
  transition: 0.3s ease;
}
ul.tag-list li a:hover {
  background: #e84444;
  border-color: #e84444;
  color: #fff;
}

.newsletter .form-control {
  font-weight: 400;
  padding: 0 20px;
  height: 40px;
  line-height: 40px;
  border-radius: 30px;
  font-size: 13px;
}

/* 21.5 blog single start */
/* share icon */
.share-icon {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
  display: inline-block;
}
.share-icon i {
  color: #fff;
}

/* 21.5.7 blog sidebar */
.sidebar-box-shadow {
  box-shadow: -3px 0px 3px 0px rgba(0, 0, 0, 0.06);
}

/* blog single end */
/* 22. contact section */
.form-control {
  border-radius: 5px;
  padding: 0 15px 2px;
  height: 40px;
  margin-bottom: 15px;
  border: 1px solid #e5e5e5;
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  font-size: 14px;
  color: #666;
}
.form-control:focus {
  border-color: #e84444;
  box-shadow: none !important;
}
.form-control::-moz-placeholder {
  color: #666;
}
.form-control::placeholder {
  color: #666;
}

/* 22.3 google map */
.map {
  position: relative;
}
.map #map_canvas {
  height: 450px;
}

/* 23.1 signup greetings */
.signup {
  border-radius: 5px;
  overflow: hidden;
  box-shadow: 0px 10px 35px 0px rgba(0, 0, 0, 0.1);
  /* 23.2 signup form */
}
.signup-greeting {
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 70px 0 140px;
  text-align: center;
}
@media (max-width: 1199px) {
  .signup-greeting {
    padding-bottom: 80px;
  }
}
@media (max-width: 767px) {
  .signup-greeting {
    padding-top: 200px;
  }
}
@media (max-width: 575px) {
  .signup-greeting {
    padding-top: 400px;
  }
}
.signup-greeting img {
  margin-bottom: 50px;
  position: relative;
  z-index: 9;
}
.signup-greeting h4 {
  color: #fff;
  margin-bottom: 20px;
  position: relative;
  z-index: 9;
}
.signup-greeting p {
  color: #fff;
  position: relative;
  z-index: 9;
  margin: 0 40px;
}
.signup-form {
  padding: 50px 50px 50px 35px;
}
@media (max-width: 1199px) {
  .signup-form {
    padding: 50px 15px 50px 0;
  }
}
@media (max-width: 767px) {
  .signup-form {
    padding: 50px;
  }
}
@media (max-width: 575px) {
  .signup-form {
    text-align: center;
  }
}
.signup-form h4 {
  float: left;
  font-size: 26px;
  margin-bottom: 35px;
}
@media (max-width: 575px) {
  .signup-form h4 {
    float: unset;
  }
}
.signup-form a {
  color: #e84444;
}
.signup-form .btn {
  margin-top: 30px;
}
.signup-form p.signup-with {
  display: inline-block;
  margin-top: 42px;
}
.signup-form ul {
  margin-top: 37px;
  display: inline-block;
}
.signup-form ul li a {
  height: 30px;
  width: 30px;
  line-height: 30px;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 24. comming soon */
.comming-soon {
  height: 100vh;
  background-size: cover;
  display: flex;
  align-items: center;
}
.comming-soon h1 {
  font-size: 50px;
  font-weight: 600;
}
@media (max-width: 575px) {
  .comming-soon h1 {
    font-size: 30px;
  }
}
.comming-soon .form-control {
  height: 45px;
  border-radius: 45px;
  position: relative;
  background: transparent;
  border: 1px solid #e5e5e5;
  color: #fff;
  margin-bottom: 40px;
}
.comming-soon .form-control::-moz-placeholder {
  color: #666;
}
.comming-soon .form-control::placeholder {
  color: #666;
}
.comming-soon .btn-email {
  position: absolute;
  top: 0;
  right: 10px;
  background: #fff;
  border: 0;
  color: #e84444;
  border-radius: 45px;
  height: 45px;
  padding: 0 50px;
}
@media (max-width: 575px) {
  .comming-soon .btn-email {
    padding: 0 10px;
  }
}
.comming-soon i {
  color: #5c5c5c;
  margin: 0 15px;
  transition: 0.2s ease;
  font-size: 24px;
}
.comming-soon i:hover {
  color: #e84444;
}

/* 24.1 syotimer */
.syotimer {
  text-align: center;
  margin: 0 auto 40px;
}
.syotimer-cell:last-child .syotimer-cell__value::before {
  opacity: 0;
}
.syotimer-cell {
  display: inline-block;
  margin: 0 25px;
}
@media (max-width: 1199px) {
  .syotimer-cell {
    margin: 0 20px;
  }
}
@media (max-width: 575px) {
  .syotimer-cell {
    margin: 0 10px;
  }
}
@media (max-width: 400px) {
  .syotimer-cell {
    margin: 0 5px;
  }
}
.syotimer-cell__value {
  font-size: 60px;
  font-weight: 600;
  color: #fff;
  position: relative;
}
@media (max-width: 1199px) {
  .syotimer-cell__value {
    font-size: 50px;
  }
}
@media (max-width: 575px) {
  .syotimer-cell__value {
    font-size: 30px;
  }
}
@media (max-width: 400px) {
  .syotimer-cell__value {
    font-size: 24px;
  }
}
.syotimer-cell__value::before {
  position: absolute;
  content: ":";
  height: 30px;
  color: #fff;
  right: -30px;
  top: 0;
}
@media (max-width: 575px) {
  .syotimer-cell__value::before {
    right: -20px;
  }
}
@media (max-width: 400px) {
  .syotimer-cell__value::before {
    right: -12px;
  }
}
.syotimer-cell__unit {
  text-transform: uppercase;
  font-weight: 600;
  font-size: 16px;
  color: #fff;
}

/* 25.1 social link */
.social-icon-outline {
  height: 40px;
  width: 40px;
  border-radius: 20%;
  background: transparent;
  border: 1px solid #fff;
  text-align: center;
  transition: 0.2s ease;
  display: inline-block;
}
.social-icon-outline i {
  line-height: 40px;
  color: #fff;
  font-size: 14px;
}
.social-icon-outline:hover {
  border-color: #e84444;
}

/* 25.2 footer link */
.footer-links {
  padding-left: 18px;
}
.footer-links li {
  margin-bottom: 20px;
  position: relative;
}
.footer-links li::before {
  position: absolute;
  font-family: "themify";
  content: "\e649";
  top: 0;
  left: -20px;
  height: 12px;
  width: auto;
  color: #fff;
}

/* Footer About Section - Mobile Only Card Styling */
@media (max-width: 768px) {
    footer .row .col-lg-4:first-child {
        background: rgba(255, 255, 255, 0.05) !important;
        border-radius: 12px !important;
        padding: 25px 20px !important;
        margin-bottom: 20px !important;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1) !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
    }
}

/* Get In Touch Section Card Styling - Mobile Only */
@media (max-width: 768px) {
    .get-in-touch {
        background: rgba(255, 255, 255, 0.05);
        border-radius: 12px;
        padding: 25px 20px !important;
        margin-bottom: 20px !important;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }
}

.get-in-touch h4 {
    font-size: 20px;
    text-align: left;
    color: #ffffff !important;
    font-weight: 700;
    border-bottom: 2px solid #e84444;
    padding-bottom: 10px;
    display: inline-block;
    margin-bottom: 20px;
}

/* Remove arrows from Get In Touch section only */
.get-in-touch .footer-links li::before {
  display: none;
}

/* Fix alignment for Get In Touch section */
.get-in-touch .footer-links {
  padding-left: 0;
}

.get-in-touch .footer-links li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 15px;
}

.get-in-touch .footer-links li i {
  margin-top: 4px;
  vertical-align: top;
}

/* Make arrows red in Quick Links section */
.quick-links .footer-links li::before {
  color: #e84444;
}

/* Remove arrows from Business Hours and add clock icons */
.business-hours .footer-links li::before {
  display: none;
}

/* Fix alignment for Business Hours section */
.business-hours .footer-links {
  padding-left: 0;
}

.business-hours .footer-links li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 15px;
}

.business-hours .footer-links li i {
  margin-top: 4px;
  vertical-align: top;
}

/* Business Hours Item Styling */
.business-hours-item {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.business-hours-item .day-name {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 2px;
}

.business-hours-item .time-slot {
  font-size: 13px;
  margin-left: 0;
  opacity: 0.9;
}

/* Address Text Styling */
.address-text {
  line-height: 1.4;
  font-size: 14px;
}

/* Input Group Subscribe Button - Connected */
.input-group {
  display: flex;
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  /* border: 1px solid #e0e0e0; */
}

.input-group .subscribe {
  border: none;
  border-radius: 0;
  background: #fff;
  color: #333;
  padding: 16px 20px;
  border-right: none;
  flex: 1;
  height: 55px;
  outline: none;
  font-size: 16px;
}

.input-group .subscribe::placeholder {
  color: #999;
  font-size: 16px;
}

.input-group .subscribe:focus {
  border-color: transparent;
  box-shadow: none;
  outline: none;
  background: #fff;
}

.subscribe-btn {
  background: #e84444;
  border: none;
  color: white;
  padding: 16px 20px;
  border-radius: 0;
  font-weight: 700;
  font-size: 16px;
  transition: all 0.3s ease;
  white-space: nowrap;
  height: 51px;
  margin-left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 140px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.subscribe-btn:hover {
  background: #c0392b;
  border-color: #c0392b;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
.footer-links li a {
  color: #fff;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  transition: 0.2s ease;
  display: block;
}
.footer-links li a:hover {
  text-decoration: underline;
  color: #e84444;
}

/* 25.3 subcription */
.form-control.subscribe {
  width: 100%;
  border-radius: 5px;
  border: 0;
  padding: 0 20px !important;
  height: 50px;
}

/* subscribe button */
.btn-subscribe {
  position: absolute;
  right: 5px;
  top: 5px;
  border: 0;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  color: #fff;
  background: #e84444;
  transition: all linear 0.2s;
}
.btn-subscribe:hover {
  padding-left: 15px;
}
.btn-subscribe:focus {
  outline: 0;
}

/* back to top button */
.back-to-top {
  position: absolute;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  color: #fff;
  background: #303032;
  top: -25px;
  right: 10px;
  border: 1px solid #454547;
  text-align: center;
  display: block;
  transition: 0.2s ease;
}
.back-to-top i {
  line-height: 50px;
}
.back-to-top:hover {
  border-color: #e84444;
}
.back-to-top:focus {
  outline: 0;
}

/* ===============================================
   COMPREHENSIVE HOVER EFFECTS & ANIMATIONS
   =============================================== */

/* Smooth Hover Effects */

/* Add smooth transitions to all elements */
.top-header .social-link,
.navbar-nav .nav-link,
.btn,
.card,
img,
.footer-links a,
.social-icon-outline {
    transition: all 0.3s ease;
}

/* Smooth Social Media Hover */
.top-header .social-link {
    display: inline-block;
    padding: 8px;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.top-header .social-link:hover {
    color: #e84444;
    transform: scale(1.1);
    background: rgba(232, 68, 68, 0.1);
}

/* Smooth Navigation Hover with Underline Effect */
.navbar-nav .nav-link {
    position: relative;
    transition: all 0.3s ease;
    font-weight: 500;
}

.navbar-nav .nav-link::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 50%;
    width: 0;
    height: 2px;
    background: #e84444;
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.navbar-nav .nav-link:hover {
    color: #e84444 !important;
    transform: translateY(-2px);
}

.navbar-nav .nav-link:hover::after {
    width: 100%;
}

/* Smooth Button Hover */
.btn {
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}

.btn:active {
    transform: translateY(-1px);
}

/* Smooth Card Hover */
.card {
    transition: all 0.3s ease;
    border: none;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
}

.card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.12);
}

/* Smooth Image Hover */
img {
    transition: all 0.3s ease;
}

img:hover {
    transform: scale(1.03);
}

/* Smooth Footer Link Hover */
.footer-links a {
    transition: all 0.3s ease;
    position: relative;
}

.footer-links a::before {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 1px;
    background: #e84444;
    transition: all 0.3s ease;
}

.footer-links a:hover {
    color: #e84444 !important;
    transform: translateX(3px);
}

.footer-links a:hover::before {
    width: 100%;
}

/* Smooth Social Icon Hover */
.social-icon-outline {
    transition: all 0.3s ease;
    display: inline-block;
    border-radius: 50%;
}

.social-icon-outline:hover {
    background: #e84444 !important;
    color: white !important;
    transform: translateY(-3px) scale(1.1);
    box-shadow: 0 5px 15px rgba(232, 68, 68, 0.3);
}

/* Simple Smooth Scrolling */
html {
    scroll-behavior: smooth;
}

/* Simple Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #e84444;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #d63384;
}

/* Enhanced Smooth Effects */

/* Service Cards with Smooth Hover */
#services .card {
    transition: all 0.3s ease;
    cursor: pointer;
}

#services .card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(232, 68, 68, 0.15);
}

#services .card:hover i {
    color: #e84444 !important;
    transform: scale(1.1);
}

#services .card:hover h4 {
    color: #e84444 !important;
}

/* Contact Cards Smooth Hover */
.contact-card {
    transition: all 0.3s ease;
    cursor: pointer;
}

.contact-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(232, 68, 68, 0.2);
}

.phone-icon {
    transition: all 0.3s ease;
}

.contact-card:hover .phone-icon {
    transform: scale(1.1);
    background: #e84444 !important;
}

/* Statistics Section Smooth Hover */
.fun-facts .col-lg-3 {
    transition: all 0.3s ease;
    cursor: pointer;
}

.fun-facts .col-lg-3:hover {
    transform: translateY(-5px);
}

.fun-facts .col-lg-3:hover .round-icon {
    transform: scale(1.1);
    background: #e84444 !important;
}

.fun-facts .col-lg-3:hover .count {
    color: #e84444 !important;
    transform: scale(1.05);
}

/* Testimonial Cards Smooth Hover */
.testimonial-card, .team-card {
    transition: all 0.3s ease;
    cursor: pointer;
}

.testimonial-card:hover, .team-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}

.testimonial-card:hover img, .team-card:hover img {
    transform: scale(1.05);
}

/* Client Logo Smooth Hover */
.client-logo-slider img {
    transition: all 0.3s ease;
    filter: grayscale(100%);
    opacity: 0.7;
}

.client-logo-slider img:hover {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.1);
}

/* Video Play Button Smooth Hover */
.play-icon {
    transition: all 0.3s ease;
}

.play-icon:hover {
    transform: scale(1.2);
    box-shadow: 0 10px 25px rgba(0,0,0,0.3);
}

/* Enhanced Form Focus States */
.form-control {
    transition: all 0.3s ease;
    border: 2px solid #e9ecef;
}

.form-control:focus {
    border-color: #e84444;
    box-shadow: 0 0 0 0.2rem rgba(232, 68, 68, 0.25);
    transform: translateY(-2px);
}

/* Enhanced Button Effects */
.btn-primary {
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(232, 68, 68, 0.3);
}

/* Logo Smooth Hover */
.navbar-brand {
    transition: all 0.3s ease;
}

.navbar-brand:hover {
    transform: scale(1.05);
}

.navbar-brand:hover img {
    transform: scale(1.05);
}

/* Back to Top Button Smooth Hover */
.back-to-top {
    transition: all 0.3s ease;
}

.back-to-top:hover {
    transform: translateY(-3px);
    background: #e84444 !important;
    box-shadow: 0 5px 15px rgba(232, 68, 68, 0.4);
}

/* Compact Footer Styling */
.footer {
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%) !important;
    position: relative;
    overflow: hidden;
}

.footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #e84444, #d63384, #e84444);
}

/* Compact Footer Section Headings */
.footer h4 {
    color: #ffffff !important;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 15px;
    position: relative;
    padding-bottom: 8px;
}

.footer h4::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 2px;
    background: #e84444;
    border-radius: 1px;
}

/* Compact Footer Links */
.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 8px;
    transition: all 0.3s ease;
}

.footer-links li:hover {
    transform: translateX(3px);
}

.footer-links a {
    color: #bdc3c7 !important;
    text-decoration: none;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    font-size: 14px;
}

.footer-links a:hover {
    color: #e84444 !important;
}

/* Compact Contact Info Icons */
.footer-links li i {
    color: #e84444 !important;
    font-size: 14px;
    margin-right: 10px;
    width: 16px;
    text-align: center;
}

/* Quick Link Exact Alignment */
.quick-links {
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.quick-links h4 {
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.quick-links .footer-links {
    padding-left: 0 !important;
    margin-left: 0 !important;
    list-style: none;
    text-align: left;
}

.quick-links .footer-links li {
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-indent: 0 !important;
    position: relative;
    display: block;
    text-align: left;
}

.quick-links .footer-links li::before {
    content: '>';
    color: #e84444;
    font-weight: bold;
    margin-right: 8px;
    font-size: 12px;
    position: absolute;
    left: 0;
    top: 0;
}

.quick-links .footer-links li a {
    padding-left: 20px !important;
    margin-left: 0 !important;
    text-indent: 0 !important;
    color: #bdc3c7 !important;
    text-decoration: none;
    transition: all 0.3s ease;
    display: block;
    text-align: left;
}

.quick-links .footer-links li a:hover {
    color: #e84444 !important;
    transform: translateX(3px);
}

/* Compact Business Hours Section */
.business-hours h4 {
    color: #ffffff !important;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 15px;
}

.business-hours .footer-links li {
    display: flex;
    align-items: flex-start;
    margin-bottom: 10px;
    padding: 5px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    transition: all 0.3s ease;
}

.business-hours .footer-links li:last-child {
    border-bottom: none;
}

.business-hours .footer-links li:hover {
    background: rgba(232, 68, 68, 0.1);
    border-radius: 4px;
    padding: 5px 8px;
    transform: translateX(3px);
}

.business-hours .footer-links li i {
    color: #e84444 !important;
    font-size: 14px;
    margin-right: 10px;
    margin-top: 2px;
    flex-shrink: 0;
}

.business-hours-item {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.day-name {
    font-weight: 600;
    font-size: 14px;
    color: #ffffff !important;
    margin-bottom: 3px;
    line-height: 1.2;
    display: block;
    white-space: nowrap;
}

.time-slot {
    font-size: 13px;
    color: #bdc3c7 !important;
    font-weight: 400;
    line-height: 1.2;
    display: block;
    margin-top: 1px;
    white-space: nowrap;
}

/* Compact Emergency Support */
.business-hours .footer-links li:last-child {
    background: rgba(232, 68, 68, 0.15);
    border-radius: 6px;
    padding: 10px;
    border-left: 3px solid #e84444;
    position: relative;
}

.business-hours .footer-links li:last-child:hover {
    background: rgba(232, 68, 68, 0.25);
    transform: translateX(5px);
    box-shadow: 0 3px 10px rgba(232, 68, 68, 0.2);
}

.business-hours .footer-links li:last-child .day-name {
    color: #e84444 !important;
    font-weight: 700;
    font-size: 14px;
}

.business-hours .footer-links li:last-child .time-slot {
    color: #ffffff !important;
    font-weight: 600;
    font-size: 13px;
}

/* Compact Social Media Icons */
.social-icon-outline {
    transition: all 0.3s ease;
    border: 2px solid #bdc3c7;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
}

.social-icon-outline:hover {
    background: #e84444 !important;
    border-color: #e84444 !important;
    color: white !important;
    transform: translateY(-2px) scale(1.05);
    box-shadow: 0 3px 10px rgba(232, 68, 68, 0.3);
}

/* Compact Newsletter Form */
.subscribe {
    background: rgba(255,255,255,0.1) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    color: white !important;
    border-radius: 6px !important;
    transition: all 0.3s ease;
    font-size: 14px !important;
    padding: 8px 12px !important;
}

.subscribe:focus {
    background: rgba(255,255,255,0.15) !important;
    border-color: #e84444 !important;
    box-shadow: 0 0 0 0.1rem rgba(232, 68, 68, 0.25) !important;
}

.subscribe::placeholder {
    color: #bdc3c7 !important;
    font-size: 13px !important;
}

.subscribe-btn {
    background: #e84444 !important;
    border: 1px solid #e84444 !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    padding: 8px 15px !important;
    transition: all 0.3s ease;
}

.subscribe-btn:hover {
    background: #d63384 !important;
    border-color: #d63384 !important;
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(232, 68, 68, 0.3);
}

/* Professional Mobile Footer Layout */
@media (max-width: 768px) {
    .footer {
        padding: 50px 0 !important;
        background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%) !important;
    }
    
    .footer .row {
        margin: 0 !important;
    }
    
    .footer .row > div {
        margin-bottom: 40px !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
        padding: 0 15px !important;
    }
    
    /* Professional Section Styling */
    .footer .col-lg-4 {
        background: rgba(255, 255, 255, 0.05);
        border-radius: 12px;
        padding: 25px 20px !important;
        margin-bottom: 20px !important;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    .footer h4 {
        font-size: 20px;
        margin-bottom: 20px;
        text-align: left;
        color: #ffffff !important;
        font-weight: 700;
        border-bottom: 2px solid #e84444;
        padding-bottom: 10px;
        display: inline-block;
    }
    
    /* Get In Touch Section */
    .get-in-touch .footer-links {
        text-align: left;
    }
    
    .get-in-touch .footer-links li {
        margin-bottom: 15px;
        text-align: left;
        display: flex;
        align-items: flex-start;
    }
    
    .get-in-touch .footer-links li i {
        margin-right: 12px;
        margin-top: 2px;
        flex-shrink: 0;
    }
    
    .get-in-touch .footer-links a {
        color: #bdc3c7 !important;
        text-decoration: none;
        line-height: 1.4;
    }
    
    .get-in-touch .footer-links a:hover {
        color: #e84444 !important;
    }
    
    /* Social Media Icons */
    .get-in-touch .list-inline {
        text-align: left;
        margin-top: 20px;
    }
    
    .social-icon-outline {
        width: 40px;
        height: 40px;
        margin-right: 10px;
        margin-bottom: 10px;
        border: 2px solid #bdc3c7;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s ease;
    }
    
    .social-icon-outline:hover {
        background: #e84444 !important;
        border-color: #e84444 !important;
        color: white !important;
        transform: translateY(-2px);
    }
    
    /* Quick Link Section */
    .quick-links {
        background: rgba(255, 255, 255, 0.05);
        border-radius: 12px;
        padding: 25px 20px !important;
        margin-bottom: 20px !important;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    .quick-links h4 {
        font-size: 20px;
        margin-bottom: 20px;
        text-align: left;
        color: #ffffff !important;
        font-weight: 700;
        border-bottom: 2px solid #e84444;
        padding-bottom: 10px;
        display: inline-block;
    }
    
    .quick-links .footer-links {
        text-align: left;
        padding-left: 0 !important;
    }
    
    .quick-links .footer-links li {
        margin-bottom: 12px;
        text-align: left;
        display: flex;
        align-items: center;
    }
    
    .quick-links .footer-links li::before {
        content: '>';
        color: #e84444;
        font-weight: bold;
        margin-right: 10px;
        font-size: 14px;
        position: static;
    }
    
    .quick-links .footer-links li a {
        color: #bdc3c7 !important;
        text-decoration: none;
        transition: all 0.3s ease;
        padding-left: 0 !important;
        text-align: left;
    }
    
    .quick-links .footer-links li a:hover {
        color: #e84444 !important;
        transform: translateX(5px);
    }
    
    /* Business Hours Section */
    .business-hours {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        background: rgba(255, 255, 255, 0.05);
        border-radius: 12px;
        padding: 25px 20px !important;
        margin-bottom: 20px !important;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    .business-hours h4 {
        font-size: 20px;
        text-align: left;
        color: #ffffff !important;
        font-weight: 700;
        border-bottom: 2px solid #e84444;
        padding-bottom: 10px;
        display: inline-block;
        margin-bottom: 20px;
    }
    
    .business-hours .footer-links {
        text-align: left;
    }
    
    .business-hours .footer-links li {
        justify-content: flex-start;
        text-align: left;
        margin-bottom: 15px;
    }
    
    .day-name {
        font-size: 15px;
        text-align: left;
        color: #ffffff !important;
        font-weight: 600;
    }
    
    .time-slot {
        font-size: 14px;
        text-align: left;
        color: #bdc3c7 !important;
    }
    
    /* Emergency Support */
    .business-hours .footer-links li:last-child {
        background: rgba(232, 68, 68, 0.15);
        border-radius: 8px;
        padding: 15px;
        border-left: 4px solid #e84444;
        margin-top: 10px;
    }
}

@media (max-width: 576px) {
    .footer {
        padding: 30px 0 !important;
    }
    
    .footer h4 {
        font-size: 16px;
        margin-bottom: 12px;
    }
    
    .day-name {
        font-size: 13px;
    }
    
    .time-slot {
        font-size: 12px;
    }
    
    .footer-links li {
        margin-bottom: 6px;
    }
    
    .social-icon-outline {
        width: 30px;
        height: 30px;
        margin-right: 6px;
    }
}

/* Professional Copyright Styling */
.pt-4.pb-3 {
    background: linear-gradient(135deg, #2c2c2c 0%, #3a3a3a 100%);
    border-top: 2px solid #e84444;
    position: relative;
    overflow: hidden;
    padding: 20px 0;
}

.pt-4.pb-3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, #e84444, transparent);
}

.pt-4.pb-3 .text-white {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.3px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.pt-4.pb-3 .text-primary {
    color: #e84444 !important;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-shadow: 0 1px 2px rgba(232, 68, 68, 0.2);
}

.pt-4.pb-3 a {
    text-decoration: none;
    color: #bdc3c7;
    font-size: 12px;
    font-weight: 400;
    transition: all 0.3s ease;
    position: relative;
    padding: 3px 8px;
    border-radius: 4px;
}

.pt-4.pb-3 a:hover {
    color: #e84444 !important;
    background: rgba(232, 68, 68, 0.1);
    transform: translateY(-2px);
}

.pt-4.pb-3 a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: #e84444;
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.pt-4.pb-3 a:hover::after {
    width: 80%;
}

.pt-4.pb-3 .text-muted {
    color: #7f8c8d !important;
    font-weight: 400;
    font-size: 14px;
}

.back-to-top {
    background: rgba(232, 68, 68, 0.6) !important;
    border: none !important;
    width: 50px !important;
    height: 50px !important;
    border-radius: 15% !important;
    color: white !important;
    font-size: 18px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    position: absolute !important;
    right: 30px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(232, 68, 68, 0.3);
}

.back-to-top:hover {
    background: linear-gradient(135deg, #c0392b, #a93226) !important;
    transform: translateY(-50%) translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(232, 68, 68, 0.4);
}

/* Tablet Responsive */
@media (max-width: 992px) {
    .pt-4.pb-3 {
        padding: 18px 0;
    }
    
    .pt-4.pb-3 .text-white {
        font-size: 13px;
    }
    
    .pt-4.pb-3 .text-primary {
        font-size: 13px;
    }
    
    .pt-4.pb-3 a {
        font-size: 11px;
        padding: 2px 6px;
    }
    
    .back-to-top {
        right: 25px !important;
        width: 42px !important;
        height: 42px !important;
        font-size: 15px !important;
    }
}

/* Mobile Responsive - Force Stack */
@media (max-width: 768px) {
    .pt-4.pb-3 {
        padding: 15px 0 !important;
    }
    
    .pt-4.pb-3 .container .row {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }
    
    .pt-4.pb-3 .container .row > div {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 15px !important;
        text-align: center !important;
    }
    
    .pt-4.pb-3 .container .row > div:last-child {
        margin-bottom: 0 !important;
    }
    
    .pt-4.pb-3 .text-white {
        font-size: 12px !important;
        text-align: center !important;
        margin-bottom: 10px !important;
    }
    
    .pt-4.pb-3 .text-primary {
        font-size: 12px !important;
    }
    
    .pt-4.pb-3 a {
        font-size: 10px !important;
        padding: 2px 4px !important;
        margin: 0 2px !important;
    }
    
    .back-to-top {
        right: 20px !important;
        width: 40px !important;
        height: 40px !important;
        font-size: 14px !important;
    }
}

/* Small Mobile Responsive - Force Stack */
@media (max-width: 576px) {
    .pt-4.pb-3 {
        padding: 12px 0 !important;
    }
    
    .pt-4.pb-3 .container .row {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }
    
    .pt-4.pb-3 .container .row > div {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 12px !important;
        text-align: center !important;
    }
    
    .pt-4.pb-3 .container .row > div:last-child {
        margin-bottom: 0 !important;
    }
    
    .pt-4.pb-3 .text-white {
        font-size: 11px !important;
        text-align: center !important;
        margin-bottom: 8px !important;
    }
    
    .pt-4.pb-3 .text-primary {
        font-size: 11px !important;
    }
    
    .pt-4.pb-3 a {
        font-size: 9px !important;
        padding: 1px 3px !important;
        margin: 0 1px !important;
    }
    
    .back-to-top {
        right: 15px !important;
        width: 35px !important;
        height: 35px !important;
        font-size: 12px !important;
    }
}

/* Mobile Responsive Smooth Effects */
@media (max-width: 768px) {
    .card:hover {
        transform: translateY(-5px);
    }
    
    .btn:hover {
        transform: translateY(-2px);
    }
    
    .social-link:hover {
        transform: scale(1.1);
    }
}

/* ===============================================
   ANIMATED BORDER CIRCLES - TEKUNEVERSE STYLE
   =============================================== */

/* Animate existing circles */
.section-title-border::after {
  animation: slideCircle 6s ease-in-out infinite;
}

.section-title-border-gray::after {
  animation: slideCircle 6s ease-in-out infinite;
}

.section-title-border-half::before {
  animation: slideCircle 6s ease-in-out infinite;
}

@keyframes slideCircle {
  0% {
    left: 45%;
    transform: translateX(-50%);
  }
  50% {
    left: 55%;
    transform: translateX(-50%);
  }
  100% {
    left: 45%;
    transform: translateX(-50%);
  }
}

/* ===============================================
   ANIMATED BORDER CIRCLES - TEKUNEVERSE STYLE
   =============================================== */

/* Animate existing circles */
.section-title-border::after {
  animation: slideCircle 6s ease-in-out infinite;
}

.section-title-border-gray::after {
  animation: slideCircle 6s ease-in-out infinite;
}

.section-title-border-half::before {
  animation: slideCircle 6s ease-in-out infinite;
}

@keyframes slideCircle {
  0% {
    left: 46%;
    transform: translateX(-50%);
  }
  50% {
    left: 54%;
    transform: translateX(-50%);
  }
  100% {
    left: 46%;
    transform: translateX(-50%);
  }
}

/* Fix for About Space3 section - specific animation */
.about-section .section-title-border-half::before {
  animation: slideCircleAbout 6s ease-in-out infinite;
}

@keyframes slideCircleAbout {
  0% {
    left: 2%;
    transform: translateX(-50%);
  }
  50% {
    left: 7%;
    transform: translateX(-50%);
  }
  100% {
    left: 2%;
    transform: translateX(-50%);
  }
}

/* Testimonial cards circles animation - only circle moves on static border */
.testimonial-slider .card-title::before {
  animation: slideCircleTestimonial 6s ease-in-out infinite;
}

@keyframes slideCircleTestimonial {
  0% {
    left: 25%;
    transform: translateX(-50%);
  }
  50% {
    left: 65%;
    transform: translateX(-50%);
  }
  100% {
    left: 25%;
    transform: translateX(-50%);
  }
}

/* Counter section icons hover color white */
.round-icon:hover {
  color: #fff !important;
  background: #e84444 !important;
}

/* Years Experience section hover */
.col-lg-3:hover .round-icon {
  color: #fff !important;
  background: #e84444 !important;
}

/* Client logos hover color red */
/* Client logos permanent red color */
.client-logo-slider a img {
  filter: brightness(0) saturate(100%) invert(20%) sepia(100%) saturate(2000%) hue-rotate(0deg) brightness(0.9) contrast(1.2);
  transition: all 0.3s ease;
}

/* Client logos hover effect - dark red */
.client-logo-slider a:hover img {
  filter: brightness(0) saturate(100%) invert(20%) sepia(100%) saturate(3000%) hue-rotate(0deg) brightness(0.7) contrast(1.4);
  transform: scale(1.05);
}

/* Alternative approach for logos */
.client-logo-slider a:hover {
  color: #e84444 !important;
}

/* Contact icons hover effects */
.phone-icon:hover {
  background: #e84444 !important;
  transform: scale(1.1);
  transition: all 0.3s ease;
}

.phone-icon:hover span {
  color: #fff !important;
}

/* Contact section icons hover */
.col-lg-4:hover [style*="background-color: #e84444"] {
  background-color: #e84444 !important;
  transform: scale(1.1);
  transition: all 0.3s ease;
}

.col-lg-4:hover [style*="background-color: #e84444"] span {
  color: #fff !important;
}

/* Subscribe form styling - make button smaller and connected */
.subscribe {
  border-radius: 5px 0 0 5px !important;
  border-right: none !important;
}

.subscribe-btn {
  border-radius: 0 5px 5px 0 !important;
  padding: 12px 20px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  min-width: 100px !important;
}

.input-group {
  border-radius: 5px !important;
  overflow: hidden !important;
}

/* Project menu icons animation on hover */
ul.slick-dots li:hover i {
  transform: rotate(15deg) scale(1.1);
  transition: all 0.3s ease;
}

/* Phone icon animation */
.phone-icon {
  animation: phonePulse 2s ease-in-out infinite;
}

@keyframes phonePulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(232, 68, 68, 0.4);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 0 0 8px rgba(232, 68, 68, 0.1);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(232, 68, 68, 0.4);
  }
}

/* Checkmark icons hover animation */
.fa-check:hover {
  transform: scale(1.2) rotate(5deg);
  color: #ff6b6b !important;
  transition: all 0.3s ease;
}

/* Alternative selector for checkmark icons */
[class*="check"]:hover,
[class*="tick"]:hover {
  transform: scale(1.2) rotate(5deg);
  color: #ff6b6b !important;
  transition: all 0.3s ease;
}

/* Slick dots icons hover effect */
.slick-dots li:hover i {
  color: #e84444 !important;
  transform: scale(1.1);
  transition: all 0.3s ease;
}

/* Top header social links hover effect */
.social-links .social-link:hover i {
  color: #e84444 !important;
  transform: scale(1.2) rotate(10deg) !important;
  transition: all 0.3s ease !important;
  animation: socialBounce 0.6s ease-in-out !important;
}

/* More specific selector for social links */
.social-links a:hover i {
  color: #e84444 !important;
  transform: scale(1.2) rotate(10deg) !important;
  transition: all 0.3s ease !important;
  animation: socialBounce 0.6s ease-in-out !important;
}

@keyframes socialBounce {
  0% { transform: scale(1) rotate(0deg); }
  50% { transform: scale(1.3) rotate(15deg); }
  100% { transform: scale(1.2) rotate(10deg); }
}

/* Copyright section visibility */
.copyright-section {
  background-color: #2c2c2c !important;
  border-top: 1px solid #454547 !important;
  color: white !important;
}

.copyright-section p {
  color: white !important;
}

.copyright-section a {
  color: white !important;
}

/* Fun facts section parallax effect */
.fun-facts {
  background-attachment: fixed !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  position: relative;
  overflow: hidden;
}

.fun-facts::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(45deg, rgba(0,0,0,0.3) 25%, transparent 25%), 
             linear-gradient(-45deg, rgba(0,0,0,0.3) 25%, transparent 25%), 
             linear-gradient(45deg, transparent 75%, rgba(0,0,0,0.3) 75%), 
             linear-gradient(-45deg, transparent 75%, rgba(0,0,0,0.3) 75%);
  background-size: 30px 30px;
  background-position: 0 0, 0 15px, 15px -15px, -15px 0px;
  animation: parallaxMove 25s linear infinite;
  z-index: 1;
  pointer-events: none;
  opacity: 0.2;
}

.fun-facts::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1;
}

.fun-facts .container {
  position: relative;
  z-index: 2;
}

@keyframes parallaxMove {
  0% { transform: translateX(0) translateY(0); }
  25% { transform: translateX(-8px) translateY(-4px); }
  50% { transform: translateX(-15px) translateY(-8px); }
  75% { transform: translateX(-8px) translateY(-4px); }
  100% { transform: translateX(0) translateY(0); }
}

/* Hero slider dark overlay shadow */
.hero-slider-item {
  position: relative;
}

.hero-slider-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.6) 0%, rgba(232, 68, 68, 0.3) 100%);
  z-index: 1;
  pointer-events: none;
}

.hero-slider-item .container {
  position: relative;
  z-index: 2;
}

/* Enhanced Slider Text Styling with Balanced Transparent Effect */
.hero-content h4 {
  color: rgba(255, 255, 255, 0.75) !important;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
  font-weight: 600;
  letter-spacing: 2px;
  transition: all 0.3s ease;
  backdrop-filter: blur(1px);
}

.hero-content h4:hover {
  color: rgba(255, 255, 255, 0.95) !important;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
  transform: translateY(-2px);
  backdrop-filter: blur(2px);
}

.hero-content h1 {
  color: rgba(255, 255, 255, 0.8) !important;
  text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.9);
  font-weight: 700;
  transition: all 0.3s ease;
  backdrop-filter: blur(1px);
}

.hero-content h1:hover {
  color: rgba(255, 255, 255, 0.95) !important;
  text-shadow: 3px 3px 10px rgba(0, 0, 0, 0.9);
  transform: translateY(-3px);
  backdrop-filter: blur(2px);
}

.hero-content p {
  color: rgba(248, 249, 250, 0.7) !important;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
  font-weight: 400;
  line-height: 1.6;
  transition: all 0.3s ease;
  backdrop-filter: blur(1px);
}

.hero-content p:hover {
  color: rgba(255, 255, 255, 0.85) !important;
  text-shadow: 1px 1px 5px rgba(232, 68, 68, 0.5);
  transform: translateY(-1px);
  backdrop-filter: blur(2px);
}

/* Enhanced Button Styling with Transparent Effect */
.hero-content .btn-outline {
  background: rgba(0, 0, 0, 0.2) !important;
  border: 2px solid rgba(232, 68, 68, 0.8) !important;
  color: rgba(255, 255, 255, 0.9) !important;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
  font-weight: 600;
  padding: 12px 30px;
  border-radius: 5px;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(2px);
}

.hero-content .btn-outline:hover {
  background: rgba(232, 68, 68, 0.9) !important;
  color: rgba(255, 255, 255, 0.95) !important;
  border-color: rgba(255, 255, 255, 0.8) !important;
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(232, 68, 68, 0.4);
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(3px);
}

.hero-content .btn-outline:focus {
  box-shadow: 0 0 0 3px rgba(232, 68, 68, 0.3);
}

/* Slider Navigation Arrows Enhancement */
.hero-slider .prevArrow,
.hero-slider .nextArrow {
  background: rgba(232, 68, 68, 0.6) !important;
  border: 1px solid #ffffff;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
  transition: all 0.3s ease;
}

.hero-slider .prevArrow:hover,
.hero-slider .nextArrow:hover {
  background: #e84444 !important;
  transform: translateY(-50%) scale(1.1);
  box-shadow: 0 6px 20px rgba(232, 68, 68, 0.5);
}

/* Slider Dots Enhancement */
.hero-slider .slick-dots li {
  background: rgba(255, 255, 255, 0.9) !important;
  border: 1px solid #e84444;
  transition: all 0.3s ease;
}

.hero-slider .slick-dots li:hover {
  background: rgba(232, 68, 68, 0.1) !important;
  transform: translateY(-2px);
}

.hero-slider .slick-dots li.slick-active:hover {
  background: #c0392b !important;
}

.hero-slider .slick-dots li.slick-active:hover a {
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.8) !important;
  transform: scale(1.1) !important;
}

.hero-slider .slick-dots li.slick-active {
  background: #e84444 !important;
  border-color: #ffffff;
  box-shadow: 0 4px 15px rgba(232, 68, 68, 0.4);
}

.hero-slider .slick-dots li.slick-active a {
  color: #ffffff !important;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

.hero-slider .slick-dots li.slick-active a i {
  color: #ffffff !important;
}

/*# sourceMappingURL=style.css.map */