/*-----------------------------------------------------------------------------------

    Theme Name: StartaTech - IT Solutions & Digital Agency Startup HTML5 Template
    Author: AyshaTech
    Description: StartaTech - IT Solutions & Digital Agency Startup HTML5 Template
    Version: 1.0

-----------------------------------------------------------------------------------

/************ TABLE OF CONTENTS ***************

    01. THEME DEFAULT CSS
    02. HEADER CSS
    03. MEAN MENU CSS
    04. Hero CSS
    05. ABOUT CSS
    06. SLIDER CSS
    07. TEAM CSS
    08. SERVICES CSS
    09. PORTFOLIO CSS
    10. PRICE CSS
    11. TESTIMONIAL CSS
    12. PROGRESS CSS
    13. COUNTER CSS
    14. FAQ CSS
    15. CONTACT CSS
    16. BLOG CSS
    17. FOOTER CSS

**********************************************/
/*----------------------------------------*/
/*  01. THEME DEFAULT CSS START
/*----------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Epilogue:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400&family=Inter:wght@300;400;500;600;700;800&display=swap");
:root {
  /**
  @font family declaration
  */
  --body-font-family: 'Inter', sans-serif;
  --heading-font-family: 'Epilogue', sans-serif;
  /**
  @color declaration
  */
  --primary-color: #2E85F7;
  --primary-hover-color: #0063E6;
  --heading-color: #04121F;
  --white-color: #ffffff;
  --off-white: #F3F7FB;
  --bg-white: #ffffff;
  --bg-primary-dark: #04121F;
  --bg-grey: #F3F7FB;
  --body-font-color: #59626C;
  --footer-bg: #04121F;
  --border-color: #E9ECEE;
  --orange-color: #FBBF37;
  --green-color: #42BF6E;
  --red-color: #FF3D3D;
  --black-color: #000000;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/*---------------------------------
	typography css start 
---------------------------------*/
body {
  font-size: 16px;
  font-weight: normal;
  font-family: var(--body-font-family);
  color: var(--body-font-color);
  line-height: 26px;
  overflow-x: hidden;
}

a {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--heading-font-family);
  font-weight: 600;
  margin: 0;
  color: var(--heading-color);
}

h1 {
  font-size: 68px;
  line-height: 130%;
  font-weight: 700;
}

h2 {
  font-size: 48px;
  line-height: 130%;
}

h3 {
  font-size: 40px;
  line-height: 130%;
}

h4 {
  font-size: 32px;
  line-height: 130%;
}

h5 {
  font-size: 24px;
  line-height: 130%;
  font-weight: 500;
}

h6 {
  font-size: 20px;
  line-height: 130%;
  font-weight: 500;
}

p {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 160%;
  color: var(--body-font-color);
}

figure {
  margin: 0 0 0;
}

ul {
  margin: 0px;
  padding: 0px;
}

a,
button,
p,
input,
select,
textarea,
li,
.transition-3,
h1,
h2,
h3,
h4,
h5,
h6 {
  transition: all 0.3s ease-out 0s;
}

a:focus,
.button:focus {
  text-decoration: none;
  outline: none;
}

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

a,
button {
  color: inherit;
  outline: none;
  border: none;
  background: transparent;
}

button:hover {
  cursor: pointer;
}

button:focus {
  outline: 0;
}

input {
  outline: none;
}

/*---------------------------------
    common classes css start 
---------------------------------*/
.w-img img {
  width: 100%;
}

.m-img img {
  max-width: 100%;
}

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

.z-index-1 {
  z-index: 1;
}

.z-index-11 {
  z-index: 11;
}

.overflow-y-visible {
  overflow-x: hidden;
  overflow-y: visible;
}

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

.include-bg {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.font-medium {
  font-weight: 500;
}

/*----------------------------------------
    Body Overlay 
-----------------------------------------*/
.body-overlay {
  background-color: var(--black-color);
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 99;
  left: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-out 0s;
}
.body-overlay:hover {
  cursor: url(../img/icons/cross-out.png), pointer;
}

.body-overlay.opened {
  opacity: 0.5;
  visibility: visible;
}

/*----------------------------------------
    Progress Wrap
-----------------------------------------*/
@media (max-width: 575px) {
  .progress-wrap {
    right: 15px;
    bottom: 15px;
  }
}

.nice-select::after {
  border: none;
  background-color: transparent;
  transform: translateY(-50%);
  margin-top: 0;
  right: 0;
  content: "\f107";
  font-family: "Font Awesome 6 pro";
  transform-origin: center;
  font-weight: 500;
  height: auto;
  width: auto;
}
.nice-select.open::after {
  transform: translateY(-50%) rotate(-180deg);
}

/*--
    - Spacing
-----------------------------------------*/
/*----------------------------------------*/
/*  ALL CSS START
/*----------------------------------------*/
/* theme btn */
.theme-btn, .theme-sm-btn, .green-btn, .theme-btn-2, .theme-btn-red, .black-btn, .white-btn, .submit-btn {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  outline: none;
  z-index: 99;
  padding: 15px 30px;
  /* font-size: 14px!important; */
  justify-content: center;
  border-radius: 4px;
  font-weight: 600 !important;
  /* height: 44px; */
  background-color: var(--primary-color);
  color: var(--white-color);
}

.theme-btn:hover, .green-btn:hover {
  background-color: var(--primary-hover-color) !important;
  color: var(--white-color) !important;
}

.theme-sm-btn {
  padding: 12px 30px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .theme-sm-btn {
    padding: 12px 23px;
  }
}

.theme-sm-btn:hover {
  background-color: var(--primary-hover-color);
  color: var(--white-color);
}

.theme-btn-2, .blue-btn {
  background-color: var(--secondary-color) !important;
  color: var(--white-color) !important;
}

.theme-btn-2:hover, .blue-btn:hover {
  background-color: var(--secondary-hover-color) !important;
}

.theme-btn-red {
  background-color: var(--color-red);
}

.theme-btn-red:hover {
  background-color: var(--color-red-hover) !important;
}

.black-btn {
  background-color: var(--bg-primary-dark);
}
.black-btn:hover {
  background-color: var(--primary-color);
  color: var(--white-color);
}

.white-btn {
  background-color: var(--white-color);
  color: var(--primary-color);
}
.white-btn:hover {
  opacity: 0.9;
  color: var(--primary-color);
}

.white-border-btn {
  height: 64px;
  line-height: 62px;
  padding-left: 25px;
  padding-right: 25px;
  display: inline-block;
  border: 1px solid var(--primary-color);
  border-radius: 4px;
  color: var(--primary-color);
}

.submit-btn {
  color: var(--primary-color);
}
.submit-btn:hover {
  background-color: var(--off-white);
}

.read-more-btn {
  padding: 12px 30px;
  background-color: var(--white-color);
  display: inline-block;
  border-radius: 4px;
  font-weight: 600;
  color: var(--heading-color);
}
.read-more-btn:hover {
  background-color: var(--off-white);
  color: var(--heading-color);
}

.read-more-btn-2 {
  font-size: 16px;
  font-weight: 500;
  color: var(--primary-color);
}
.read-more-btn-2:hover {
  color: var(--primary-hover-color);
}

.video-play-btn {
  display: inline-block;
  width: 100px;
  height: 100px;
  line-height: 100px;
  border-radius: 50%;
  text-align: center;
  position: relative;
  z-index: 1;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .video-play-btn {
    width: 50px;
    height: 50px;
    line-height: 46px;
  }
}
.video-play-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: inline-block;
  background-color: var(--white-color);
  opacity: 0.5;
  z-index: -1;
  transform: scale(1.2);
  animation: pulse 2s infinite;
}
.video-play-btn svg {
  width: 45px;
  height: 45px;
}

.header-nav-btn {
  margin-left: 30px;
  height: 50px;
  width: 50px;
  border: 2px solid var(--border-color);
  display: inline-block;
  border-radius: 4px;
}
.header-nav-btn svg {
  font-size: 35px;
}

/* pulse effect animation */
@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  }
  70% {
    box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
@keyframes rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*----------------------------------------*/
/*  PRELOADER CSS START
/*----------------------------------------*/
#loading {
  background-color: #fff;
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 999999;
  margin-top: 0px;
  top: 0px;
}

#loading-center {
  width: 100%;
  height: 100%;
  position: relative;
}

#loading-center-absolute {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  #loading-center-absolute {
    width: 40%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  #loading-center-absolute {
    width: 40%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  #loading-center-absolute {
    width: 45%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  #loading-center-absolute {
    width: 50%;
  }
}
@media (max-width: 575px) {
  #loading-center-absolute {
    width: 60%;
  }
}
#loading {
  background-color: #fff;
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 999999;
  margin-top: 0px;
  top: 0px;
}

#loading-center {
  width: 100%;
  height: 100%;
  position: relative;
}

#loading-center-absolute {
  text-align: center;
}

.startatech-preloader {
  display: inline-block;
  position: relative;
}
.startatech-preloader::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 5px solid var(--primary-color);
  border-radius: 50%;
  border-bottom: 0;
  border-left: 0;
  animation: rotate 3s infinite;
}
.startatech-preloader img {
  width: 150px;
  height: 150px;
  padding: 30px;
}
@media (max-width: 575px) {
  .startatech-preloader img {
    width: 100px;
    height: 100px;
    padding: 30px;
  }
}

/*--- 
 ---  theme color classes
---*/
.color-heading {
  color: var(--heading-color);
}

.color-hover {
  color: var(--primary-color);
}

.primary-color {
  color: var(--primary-color) !important;
}

.bg-off-white {
  background-color: var(--off-white);
}

.bg-grey {
  background-color: var(--bg-grey);
}

.bg-primary-color {
  background-color: var(--primary-color);
}

.bg-primary-dark {
  background-color: var(--bg-primary-dark);
}

.bg-primary-hover-color {
  background-color: var(--primary-hover-color);
}

.default-border {
  border: 1px solid var(--border-color);
}

.border-bottom {
  border-bottom: 1px solid var(--border-color) !important;
}

.border-top {
  border-top: 1px solid var(--border-color) !important;
}

.border-color {
  color: var(--border-color);
}

.color-orange {
  color: var(--orange-color);
}

.bg-orange {
  background-color: var(--orange-color);
}

.bg-light {
  background-color: var(--bg-white) !important;
}

.bg-dark {
  background-color: var(--bg-primary-dark) !important;
}

/* tp range slider css */
.bd-range-slider .inside-slider {
  padding-left: 7px;
  padding-right: 17px;
}
.bd-range-slider .noUi-target {
  background-color: #191C3C;
  border-radius: 12px;
  border: 0;
  box-shadow: none;
}
.bd-range-slider .noUi-connect {
  background-color: var(--bd-theme-1);
}
.bd-range-slider .noUi-horizontal {
  height: 6px;
}
.bd-range-slider .noUi-handle {
  height: 24px;
  width: 24px;
  background-color: var(--bd-theme-1);
  border-radius: 50%;
  border: 4px solid var(--bd-common-white);
  box-shadow: 0px 4px 10px rgba(5, 9, 43, 0.3);
  top: -9px;
}
.bd-range-slider .noUi-handle:hover {
  cursor: pointer;
}
.bd-range-slider .noUi-handle::before, .bd-range-slider .noUi-handle::after {
  display: none;
}
.bd-range-slider-dark .noUi-handle {
  border: 4px solid #2D314B;
}

/* tp swiper slider dot */
.bd-swiper-dot .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  background-color: var(--bd-grey-1);
  opacity: 1;
  margin: 0 9px;
  position: relative;
}
.bd-swiper-dot .swiper-pagination-bullet::after {
  position: absolute;
  content: "";
  left: 50%;
  top: 50%;
  width: calc(100% + 16px);
  height: calc(100% + 16px);
  background-color: transparent;
  border: 2px solid transparent;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
}
.bd-swiper-dot .swiper-pagination-bullet button {
  font-size: 0;
}
.bd-swiper-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: var(--bd-theme-1);
}
.bd-swiper-dot .swiper-pagination-bullet.swiper-pagination-bullet-active::after {
  border-color: var(--bd-theme-1);
  transform: translate(-50%, -50%) scale(1);
}

.bd-swiper-arrow {
  width: 80px;
  height: 80px;
  line-height: 80px;
  font-size: 20px;
  text-align: center;
  background-color: var(--bd-common-white);
  color: var(--bd-common-black);
}
.bd-swiper-arrow:hover {
  background-color: var(--bd-common-black);
  color: var(--bd-common-white);
}

/* tp slick arrow */
/*----------------------------------------*/
/*  OFFCANVAS CSS START
/*----------------------------------------*/
.offcanvas__area {
  position: fixed;
  right: -490px;
  top: 0;
  width: 450px;
  height: 100%;
  box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
  transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-duration: 1s;
  z-index: 9999;
  scrollbar-width: none; /* for Firefox */
  overflow-y: scroll;
}
.offcanvas__area.offcanvas-opened {
  right: 0px;
}
@media (max-width: 575px) {
  .offcanvas__area {
    width: 290px;
  }
}
.offcanvas__wrapper {
  position: relative;
  padding: 45px;
  background-color: var(--white-color);
  overflow: auto;
}
@media (max-width: 575px) {
  .offcanvas__wrapper {
    padding: 20px;
  }
}
.offcanvas__close-btn {
  display: inline-block;
  font-size: 16px;
  height: 40px;
  width: 40px;
  line-height: 36px;
  background: var(--black-color);
  color: #fff;
}
.offcanvas__close-btn:hover {
  background: var(--red-color);
}
.offcanvas__top {
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border-color);
}
.offcanvas__text p {
  margin-bottom: 25px;
}
.offcanvas__contact h4 {
  font-size: 22px;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.offcanvas__contact ul li:not(:last-child) {
  margin-bottom: 20px;
}
.offcanvas__contact ul li:hover i {
  background: var(--bd-theme-1);
  color: var(--bd-common-white);
  border-color: var(--bd-theme-1);
}
.offcanvas__contact ul li:hover a {
  color: var(--bd-theme-1);
}
.offcanvas__contact-icon i {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border: 1px solid var(--border-color);
  border-radius: 4px;
  transition: all 0.3s ease-out 0s;
}
.offcanvas__contact-text a {
  font-size: 18px;
  font-weight: 500;
  color: var(--bd-text-1);
}
.offcanvas__contact-text a:hover {
  color: var(--bd-theme-1);
}
.offcanvas__map iframe {
  width: 100%;
  height: 200px;
  border: none;
}
.offcanvas__social ul li {
  display: inline-block;
}
.offcanvas__social ul li:not(:last-child) {
  margin-right: 5px;
}
.offcanvas__social ul li a {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 42px;
  text-align: center;
  background: var(--primary-color);
  color: var(--white-color);
  border-radius: 4px;
}
.offcanvas__social ul li a:hover {
  background: var(--primary-hover-color);
  color: var(--white-color);
}
.offcanvas__notification-icon a {
  font-size: 14px;
  color: var(--bd-common-black);
  position: relative;
}
.offcanvas__notification-icon a .notification-count {
  position: absolute;
  top: -4px;
  right: -13px;
  display: inline-block;
  width: 20px;
  height: 20px;
  line-height: 22px;
  font-size: 12px;
  font-weight: 600;
  background-color: var(--bd-theme-1);
  border-radius: 50%;
  color: var(--bd-common-white);
  text-align: center;
}
.offcanvas__notification-text p {
  margin-bottom: 0;
  font-weight: 500;
  color: var(--bd-common-black);
  font-size: 14px;
}
.offcanvas__notification-text p .notification-number {
  color: var(--bd-theme-1);
}
.offcanvas__notification-text p a {
  color: var(--bd-theme-1);
}
.offcanvas__btn a {
  margin-bottom: 20px;
}

/*----------------------------------------*/
/*  BREADCRUMB CSS START
/*----------------------------------------*/
.breadcrumb-area {
  background-color: #04121F;
}
.breadcrumb-shape-left {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
}
.breadcrumb-shape-right {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
}
.breadcrumb-list span {
  font-size: 16px;
  color: var(--white-color);
  padding-right: 3px;
  margin-right: 3px;
  text-transform: capitalize;
}
.breadcrumb-list span.dvdr svg {
  height: 16px;
  width: 16px;
  margin-top: 2px;
}
.breadcrumb-list span svg {
  width: 20px;
  height: 20px;
  line-height: 1;
  margin-top: -5px;
}
.breadcrumb-list span a.home {
  color: var(--border-color);
}
.breadcrumb-list span a:hover {
  color: var(--bd-theme-1);
}
.breadcrumb-list-2 span {
  font-size: 14px;
  color: var(--bd-text-11);
  font-weight: 500;
  padding-right: 3px;
  margin-right: 3px;
  text-transform: capitalize;
}
.breadcrumb-list-2 span a:hover {
  color: var(--bd-theme-1);
}
.breadcrumb__overlay {
  position: relative;
}
.breadcrumb__overlay::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 3, 32, 0.6);
}

/*----------------------------------------*/
/*  ACCORDION CSS START
/*----------------------------------------*/
.it-accordion .accordion-item {
  margin-bottom: 20px;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  background-color: #fff;
  overflow: hidden;
}
.it-accordion .accordion-header {
  line-height: 1;
}
.it-accordion .accordion-button {
  padding-top: 25px;
  padding-bottom: 25px;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--heading-color);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .it-accordion .accordion-button {
    padding-right: 30px;
  }
}
.it-accordion .accordion-button:focus {
  box-shadow: none;
}
.it-accordion .accordion-button:not(.collapsed) {
  color: var(--heading-color);
  box-shadow: none;
  border: transparent;
  background-color: transparent;
}
.it-accordion .accordion-body {
  padding-top: 0;
}

/*----------------------------------------*/
/*  NAV TAB CSS START
/*----------------------------------------*/
.bd-tab .nav-tabs {
  padding: 0;
  margin: 0;
  border: 0;
}
.bd-tab .nav-tabs .nav-link {
  padding: 0;
  margin: 0;
  border: 0;
}

/*----------------------------------------*/
/*  MODAL CSS START
/*----------------------------------------*/
/*----------------------------------------*/
/*  SECTION TITLE CSS START
/*----------------------------------------*/
.section-subtitle {
  font-size: 24px;
  font-weight: 500;
  line-height: 130%;
  margin-bottom: 20px;
  display: inline-block;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .section-subtitle {
    font-size: 20px;
    font-weight: 500;
    line-height: 100%;
  }
}
.section-subtitle-sm {
  font-size: 20px;
  margin-bottom: 10px;
}

.section-title {
  font-size: 48px;
  line-height: 130%;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-title {
    font-size: 35px;
    line-height: 120%;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-title br {
    display: none;
  }
}
.section-title-sm {
  font-size: 40px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-title-sm {
    font-size: 35px;
    line-height: 120%;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-title-sm br {
    display: none;
  }
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title-wrapper p br {
    display: none;
  }
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title-style-2 p {
    padding-left: 0;
  }
}

/*----------------------------------------*/
/*  02. HEADER CSS START
/*----------------------------------------*/
.header-main.header-sticky {
  position: fixed;
  top: 0;
  width: 100%;
  background: var(--white-color);
  z-index: 12;
  animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
  box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.09);
}

.header-container {
  padding-left: 135px;
  padding-right: 135px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .header-container {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .header-container {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-container {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .header-container {
    padding-left: 0;
    padding-right: 0;
  }
}

.header-main.has-b-border {
  border-bottom: 1px solid var(--border-color);
}

.offcanvas-btn-wrapper {
  padding: 15px 0;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .offcanvas-btn-wrapper {
    padding: 15px 0;
  }
}

/* Navbar Left End */
/* header Right Side Start */
.header-chatInfo {
  padding-left: 25px;
  margin-left: 25px;
  border-left: 1px solid var(--border-color);
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .header-chatInfo {
    padding-left: 10px;
    margin-left: 10px;
  }
}

/* main menu css */
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .main-menu {
    margin-right: 0px;
    margin-left: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu {
    margin-right: 0px;
    margin-left: 30px;
  }
}
.main-menu ul li {
  position: relative;
  list-style: none;
  display: inline-block;
  margin-right: 25px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu ul li {
    margin-right: 18px;
  }
}
.main-menu ul li a {
  display: inline-block;
  font-size: 16px;
  color: var(--body-font-color);
  padding: 28px 0;
}
.main-menu ul li a.active {
  color: var(--heading-color);
}
.main-menu ul li.has-dropdown > a {
  position: relative;
}
.main-menu ul li.has-dropdown > a::after {
  content: "\f107";
  transform: translateY(1px);
  font-size: 14px;
  font-family: "Font Awesome 6 Pro";
  font-weight: 400;
  margin-left: 5px;
  display: inline-block;
  transition: all 0.3s ease-out 0s;
}
.main-menu ul li .submenu {
  padding-top: 15px;
  padding-bottom: 15px;
  position: absolute;
  top: 120%;
  left: 0;
  width: 250px;
  background: var(--white-color);
  z-index: 99;
  transition: all 0.3s ease-out 0s;
  visibility: hidden;
  opacity: 0;
  text-align: start;
  border-top: 3px solid var(--primary-color);
  box-shadow: 0px 30px 70px 0px rgba(11, 6, 70, 0.08);
}
.main-menu ul li .submenu li {
  display: block;
  width: 100%;
  margin: 0;
}
.main-menu ul li .submenu li.has-dropdown > a::after {
  position: absolute;
  top: 50%;
  right: 25px;
  transform: translateY(-50%) rotate(-90deg);
}
.main-menu ul li .submenu li a {
  padding: 5px 25px;
  font-size: 16px;
  position: relative;
  z-index: 1;
  width: 100%;
}
.main-menu ul li .submenu li a::before {
  position: absolute;
  content: "";
  top: 0;
  left: auto;
  right: 0;
  width: 0;
  height: 100%;
  z-index: -1;
}
.main-menu ul li .submenu li a.active {
  color: var(--heading-color);
}
.main-menu ul li .submenu li .submenu {
  left: 120%;
  top: 0;
  visibility: hidden;
  opacity: 0;
}
.main-menu ul li .submenu li:hover > a {
  color: var(--heading-color);
}
.main-menu ul li .submenu li:hover > a::after {
  color: var(--heading-color);
}
.main-menu ul li .submenu li:hover > a::before {
  left: 0;
  right: auto;
  width: 100%;
}
.main-menu ul li .submenu li:hover > .submenu {
  left: 100%;
  visibility: visible;
  opacity: 1;
}
.main-menu ul li:hover > a {
  color: var(--heading-color);
}
.main-menu ul li:hover > a::after {
  color: var(--heading-color);
  transform: rotate(180deg);
}
.main-menu ul li:hover > .submenu {
  top: 100%;
  visibility: visible;
  opacity: 1;
}

/*----------------------------------------*/
/*  03. MEAN MENU CSS START
/*----------------------------------------*/
/* mean menu customize */
.mean-container a.meanmenu-reveal {
  display: none;
}

.mean-container .mean-nav {
  background: none;
  margin-top: 0;
}

.mean-container .mean-bar {
  padding: 0;
  min-height: auto;
  background: none;
}

.mean-container .mean-nav > ul {
  padding: 0;
  margin: 0;
  width: 100%;
  list-style-type: none;
  display: block !important;
}

.mean-container a.meanmenu-reveal {
  display: none !important;
}

.mean-container .mean-nav ul li a {
  width: 100%;
  padding: 10px 0;
  color: var(--body-font-color);
  border-top: 1px solid var(--border-color);
  font-size: 14px;
  line-height: 1.5;
  font-weight: 700;
}
.mean-container .mean-nav ul li a:hover {
  color: var(--heading-color);
}

.mean-container .mean-nav ul li a.mean-expand {
  margin-top: 5px;
  padding: 0 !important;
  line-height: 14px;
  border: 1px solid var(--border-color) !important;
  height: 30px;
  width: 30px;
  line-height: 30px;
  color: var(--black-color);
  line-height: 30px;
  top: 0;
  font-weight: 400;
}
.mean-container .mean-nav ul li a.mean-expand:hover {
  background: var(--heading-color);
  color: var(--white-color);
  border-color: var(--heading-color);
}

.mean-container .mean-nav ul li > a > i {
  display: none;
}

.mean-container .mean-nav ul li > a.mean-expand i {
  display: inline-block;
}

.mean-container .mean-nav > ul > li:first-child > a {
  border-top: 0;
}

.mean-container .mean-nav ul li a.mean-expand.mean-clicked {
  color: var(--white-color);
  background-color: var(--heading-color);
}

.mean-container .mean-nav ul li a.mean-expand.mean-clicked i {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  color: var(--white-color);
}

/*----------------------------------------*/
/*  04. Hero CSS
/*----------------------------------------*/
@media (max-width: 575px) {
  .hero-title {
    font-size: 45px;
  }
  .hero-title br {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero-title {
    font-size: 60px;
  }
  .hero-title br {
    display: none;
  }
}

.hero-section-v1 {
  padding-top: 200px;
  padding-bottom: 200px;
}
.hero-section-v2 {
  padding-top: 270px;
  padding-bottom: 200px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .hero-section-v2 {
    padding-top: 200px;
    padding-bottom: 190px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .hero-section-v2 {
    padding-top: 0;
    padding-bottom: 0;
  }
}
@media (max-width: 575px) {
  .hero-section-v3 {
    padding-top: 30px;
  }
}

.hero-section-1 {
  padding-top: 170px;
  padding-bottom: 170px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .hero-section-1 {
    padding-top: 138px;
    padding-bottom: 138px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
  .hero-section-1 {
    padding-top: 60px;
    padding-bottom: 60px;
    background-color: var(--bg-primary-dark);
  }
}
.hero-section-1::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 100%;
  display: inline-block;
  background-color: var(--bg-primary-dark);
  z-index: 1;
  opacity: 0.83;
}

.hero-bg-image {
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  z-index: -1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
  .hero-bg-image {
    position: absolute;
    z-index: 1;
    margin-bottom: 60px;
  }
  .hero-bg-image img {
    width: 100%;
    height: 600px;
    -o-object-fit: cover;
       object-fit: cover;
  }
}

.hero-content {
  position: relative;
  z-index: 2;
}
.hero-content p {
  color: var(--white-color);
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .hero-content h1.hero-title {
    font-size: 57px;
    line-height: 116%;
  }
}

.hero-pattern-1 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.hero-pattern-2 {
  position: absolute;
  bottom: 0;
  right: 0%;
  z-index: 2;
}

.hero-2-pattern-1 {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}
.hero-2-pattern-2 {
  position: absolute;
  top: 0;
  left: 31%;
  bottom: 0;
  right: 0;
  display: inline-block;
  background-color: var(--bg-primary-dark);
  clip-path: polygon(31% 0%, 100% 0%, 100% 100%, 0% 100%);
  z-index: -2;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .hero-2-pattern-2 {
    left: 33%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .hero-2-pattern-2 {
    display: none;
  }
}
.hero-2-pattern-2-1 {
  position: absolute;
  bottom: 0;
  left: -45px;
  z-index: 1;
}
.hero-2-pattern-3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 200px;
  height: 450px;
  z-index: 1;
  display: inline-block;
  background-color: var(--bg-primary-dark);
  clip-path: polygon(0 0, 100% 0, 0 100%);
  z-index: -1;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .hero-2-pattern-3 {
    width: 100px;
    height: 200px;
  }
}
.hero-2-pattern-4 {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .hero-2-pattern-4 {
    top: auto;
    bottom: 0;
    right: 0;
  }
  .hero-2-pattern-4 img {
    width: 80%;
  }
}

.hero-2-line-1 {
  position: absolute;
  top: -1.5%;
  left: 4%;
  z-index: -1;
}
@media only screen and (min-width: 1500px) and (max-width: 1800px) {
  .hero-2-line-1 {
    top: 0;
    left: 5%;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .hero-2-line-1 {
    top: 0;
    left: 5%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .hero-2-line-1 {
    top: 0;
    left: 6%;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero-2-line-1 {
    display: none;
  }
}
.hero-2-line-1 svg path {
  color: var(--primary-color);
}
.hero-2-line-2 {
  position: absolute;
  bottom: 0;
  left: 20%;
  z-index: -1;
}
@media only screen and (min-width: 1500px) and (max-width: 1800px) {
  .hero-2-line-2 {
    left: 18%;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .hero-2-line-2 {
    left: 18%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .hero-2-line-2 {
    left: 12%;
    transform: rotate(-7deg) translateY(13px);
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero-2-line-2 {
    display: none;
  }
}
.hero-2-line-2 svg path {
  color: var(--primary-color);
}
.hero-2-line-3 {
  position: absolute;
  top: 0;
  left: 41%;
  z-index: -1;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .hero-2-line-3 {
    left: 40%;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1600px) {
  .hero-2-line-3 {
    left: 42%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .hero-2-line-3 {
    left: 39%;
    transform: rotate(-5deg);
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero-2-line-3 {
    position: absolute;
    top: 0;
    left: 8px;
    z-index: -1;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .hero-2-line-3 {
    display: none;
  }
}
.hero-2-line-3 svg path {
  color: var(--primary-color);
}

@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .hero-content-home-2 {
    padding-top: 100px;
    padding-bottom: 100px;
    background-color: var(--bg-primary-dark);
  }
}

.hero-2-bg-image {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -3;
  width: 59%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .hero-2-bg-image {
    width: 100%;
  }
}

.hero-shape-1 {
  position: absolute;
  top: 0px;
  width: 100%;
  height: 100%;
  bottom: 0;
  z-index: -1;
}
.hero-shape-1 svg {
  width: 100%;
  height: 100%;
}

.hero-main-shape-1 {
  color: var(--bg-primary-dark);
}

.hero-shape-primary-1 {
  color: var(--primary-color);
}

.hero-section-v3-bg {
  position: absolute;
  left: 0;
  bottom: -10px;
}
.hero-section-v3-bg svg {
  color: var(--primary-color);
  width: 100%;
  height: 100%;
}

.hero-section-v3 .hero-content p {
  color: var(--body-font-color);
}

.hero-img-graph {
  position: absolute;
  bottom: 100px;
  left: 0;
}
@media (max-width: 575px) {
  .hero-img-graph {
    bottom: 50px;
  }
}

.hero-img-card {
  position: absolute;
  top: 100px;
  right: 0;
  box-shadow: 0px 4.08197px 8.16393px rgba(143, 149, 178, 0.15);
}

.hero-section-4 {
  padding-top: 175px;
  padding-bottom: 175px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .hero-section-4 {
    padding-top: 138px;
    padding-bottom: 138px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .hero-section-4 {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
.hero-section-4 p {
  color: var(--body-font-color);
}

.hero-4-line-shape {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
@media (max-width: 575px) {
  .hero-4-line-shape img {
    width: 80%;
  }
}

.hero-section-4-img {
  position: absolute;
  right: -72px;
  top: 0;
  right: -100px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .hero-section-4-img {
    right: -200px;
  }
  .hero-section-4-img img {
    width: 100%;
    height: 100%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .hero-section-4-img {
    right: -340px;
  }
  .hero-section-4-img img {
    width: 85%;
    height: 100%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .hero-section-4-img img {
    display: none;
  }
}

/*----------------------------------------*/
/*  05. ABOUT CSS
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-section {
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .about-section {
    padding-bottom: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-img {
    margin-bottom: 30px;
  }
}

/* who we are css start */
.who-we-are:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 55%;
  height: 100%;
  background-color: var(--primary-color);
  display: inline-block;
  z-index: -1;
  border-radius: 0 10px 10px 0;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .who-we-are:after {
    width: 100%;
  }
}

.flex-shrink-0 {
  margin-top: -4px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399.98px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .who-we-are-left {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}

.who-we-are-v1-right {
  margin-right: -150px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399.98px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .who-we-are-v1-right {
    margin-right: 0;
  }
}
.who-we-are-v1-right img {
  border-radius: 10px;
}

/* who we are css end */
.who-we-are-2-imgs > img {
  border-radius: 10px;
}
@media (max-width: 575px) {
  .who-we-are-2-imgs > img {
    max-width: 100%;
  }
}

.who-we-are-2-img-sm {
  position: absolute;
  top: 40%;
  right: 0;
  border-top: 10px outset var(--white-color);
  border-left: 10px outset var(--white-color);
  border-radius: 10px;
  background-color: var(--white-color);
}
.who-we-are-2-img-sm img {
  border-radius: 10px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .who-we-are-2-img-sm {
    padding-top: 30px;
    position: relative;
    border: 0;
  }
  .who-we-are-2-img-sm img {
    max-width: 100%;
  }
}

.icon-box-2-icon img {
  margin-right: 10px;
}

@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .report-img {
    margin-left: 0;
  }
}

.report-avata-img img {
  border-radius: 10px;
}

.report-autor-box {
  padding: 25px;
  border-radius: 10px;
  margin-right: -50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .report-autor-box {
    margin-right: 0;
    margin-bottom: 30px;
  }
}

/*----------------------------------------*/
/*   06. SLIDER CSS
/*----------------------------------------*/
@media (max-width: 575px) {
  .slider-item {
    text-align: center;
  }
}

/*----------------------------------------*/
/*   07. TEAM CSS
/*----------------------------------------*/
.team-member {
  border-radius: 10px;
}
.team-member-name a:hover {
  color: var(--primary-color);
}
.team-member-box {
  padding: 50px 0;
  background-color: var(--white-color);
  border-radius: 10px;
}
.team-avata img {
  border-radius: 50%;
  max-height: 100px;
  max-width: 100px;
  -o-object-fit: cover;
     object-fit: cover;
}

.join-member-box {
  padding: 40px 0;
  border-radius: 10px;
}

.team-2-member {
  border: 1px solid #182F44;
  border-radius: 10px;
}
.team-2-member:hover .team-2-avata img {
  transform: scale(1.05);
}
.team-2-member-name a:hover {
  color: var(--primary-color);
}
.team-2-member-box {
  background-color: #081928;
  border-radius: 10px;
}
.team-2-avata {
  border-bottom: 1px solid #182F44;
  border-radius: 10px;
  overflow: hidden;
}
.team-2-avata img {
  transition: all 0.3s ease-out 0s;
}
.team-2-avata.has-border-radius {
  margin-right: 10px;
  margin-left: 10px;
  margin-top: 10px;
  padding-top: 0;
}
.team-2-avata.has-border-radius img {
  border-radius: 10px;
}

.team-social ul li {
  display: inline-block;
  margin-right: 15px;
}
.team-social ul li:last-child {
  margin-right: 15px;
}
.team-social ul li a {
  width: 26px;
  height: 26px;
  line-height: 24px;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  background-color: var(--white-color);
}
.team-social ul li a:hover svg {
  color: var(--black-color);
}
.team-social ul li a svg {
  color: var(--primary-color);
  transition: all 0.3s ease-out 0s;
}

/*----------------------------------------*/
/* 08. SERVICES CSS
/*----------------------------------------*/
.service-item-v1 {
  position: relative;
}

.service-item-v1-title {
  color: var(--heading-color);
}
.service-item-v1-title:hover {
  color: var(--primary-color);
}

.service-item-v1-inner {
  border: 1px solid var(--border-color);
  box-shadow: 0px 0px 24px rgba(216, 216, 228, 0.3);
  border-radius: 10px;
  padding: 30px;
  margin: 0 0px;
  z-index: 9;
  position: relative;
  background-color: var(--white-color);
  top: 0;
  transition: ease all 0.5s;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service-item-v1-inner {
    margin: 0 15px;
    padding: 30px 15px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .service-item-v1-inner {
    margin: 0 15px;
  }
}
.service-item-v1-inner:hover {
  box-shadow: 0px 0px 24px rgba(216, 216, 228, 0.5);
  border: 1px solid var(--primary-color);
}

.service-2-item {
  border: 1px solid var(--border-color);
  box-shadow: 0px 0px 24px rgba(216, 216, 228, 0.25);
  border-radius: 10px;
  padding: 30px;
}
.service-2-content {
  border-bottom: 1px solid var(--border-color);
  padding-bottom: 20px;
  margin-bottom: 30px;
}
@media (max-width: 575px) {
  .service-2-content {
    display: flex;
    flex-direction: column-reverse;
    justify-content: start;
    align-items: flex-start !important;
  }
  .service-2-content img {
    margin-bottom: 20px;
  }
}
.service-2-title a:hover {
  color: var(--primary-color);
}

.service-4-item {
  background-color: var(--border-color);
  overflow: hidden;
  border-radius: 20px;
  margin-bottom: 25px;
  transition: all 0.3s ease-out 0s;
}
.service-4-item:hover {
  background-color: var(--primary-color);
}
.service-4-title a:hover {
  color: var(--primary-color);
}
.service-4-content {
  margin: 15px;
  background-color: var(--white-color);
  padding: 55px 25px;
  border-radius: 20px;
}
.service-4-content img {
  margin-bottom: 30px;
}

.inner-page-list ul li {
  list-style: none;
  margin-bottom: 10px;
}
.inner-page-list ul li svg {
  color: var(--heading-color);
  margin-top: -5px;
  font-size: 20px;
}

.service-tab-btn {
  padding: 30px 20px;
  border-radius: 10px;
}
.service-tab-btn .nav-link {
  text-align: left;
  height: 54px;
  color: var(--body-font-color);
  background-color: var(--white-color);
  margin-bottom: 10px;
}

.service-tab-img {
  border-radius: 10px;
  overflow: hidden;
}

.search-fluid input {
  width: 100%;
  height: 56px;
  padding: 0 20px;
  border: 1px solid var(--border-color);
  border-radius: 6px;
}
.search-fluid input::-moz-placeholder {
  color: #98A0A8;
}
.search-fluid input::placeholder {
  color: #98A0A8;
}

.select-fluid .nice-select {
  width: 100%;
  height: 56px;
  line-height: 56px;
}
.select-fluid .nice-select .current {
  color: var(--black-color);
}
.select-fluid .nice-select::after {
  right: 25px;
  font-size: 20px;
  color: var(--black-color);
}

/*----------------------------------------*/
/*  09. PORTFOLIO CSS
/*----------------------------------------*/
/*----------------------------------------*/
/*  10. PRICE CSS
/*----------------------------------------*/
.price-table {
  border: 1px solid var(--border-color);
  border-radius: 10px;
  box-shadow: 0px 0px 20px rgba(232, 236, 240, 0.25);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .price-table {
    padding-top: 60px;
  }
}
.price-table.featured {
  position: relative;
}
.price-table.featured::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 130px;
  height: 130px;
  padding: 20px;
  border-top-left-radius: 10px;
  z-index: -1;
  clip-path: polygon(100% 0, 0 0, 0 100%);
  content: url("../img/icons/stars.svg");
  background-color: var(--primary-color);
}
.price-table.featured .black-btn {
  background-color: var(--primary-color);
}
.price-table.featured .black-btn:hover {
  background-color: var(--primary-hover-color);
}
.price-package {
  display: block;
  font-size: 24px;
  font-weight: 500;
}
.price-value span {
  font-size: 20px;
  font-weight: 500;
  line-height: 120%;
}
.price-feature-list {
  padding: 30px 0;
  margin: 0 25px;
}
.price-feature-list.has-tb-border {
  border-top: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
}
.price-feature-list ul {
  list-style: none;
}
.price-feature-list ul li {
  margin-bottom: 20px;
  color: var(--heading-color);
}
.price-feature-list ul li:last-child {
  margin-bottom: 0;
}
.price-feature-list ul li.disable {
  color: var(--body-font-color);
}
.price-feature-list ul li.disable span,
.price-feature-list ul li.disable svg,
.price-feature-list ul li.disable i {
  color: var(--red-color);
}
.price-feature-list ul li span,
.price-feature-list ul li svg,
.price-feature-list ul li i {
  margin-right: 13px;
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  color: var(--primary-color);
}
.price-switcher-btns .nav,
.price-switcher-btns .nav-tabs {
  border-radius: 4px;
}
.price-switcher-btns .nav .active,
.price-switcher-btns .nav-tabs .active {
  border-color: transparent;
}
.price-switcher-btns .nav:hover, .price-switcher-btns .nav:focus,
.price-switcher-btns .nav-tabs:hover,
.price-switcher-btns .nav-tabs:focus {
  border-color: transparent;
}
.price-switcher-btns .switcher-btn {
  background-color: var(--off-white);
  color: var(--body-font-color);
  padding: 15px 30px !important;
  font-weight: 600 !important;
  border-color: transparent;
}
.price-switcher-btns .switcher-btn.active {
  background-color: var(--primary-color);
  border-radius: 4px;
  color: var(--white-color);
}
.price-switcher-btns .switcher-btn:hover, .price-switcher-btns .switcher-btn:focus {
  border-color: transparent;
}

.price-2-table {
  border: 1px solid var(--border-color);
  border-radius: 10px;
  border: 1px solid #182F44;
  background-color: #081928;
  padding: 30px 20px;
}
@media (max-width: 575px) {
  .price-2-table {
    padding: 30px 10px;
  }
}
.price-2-table.featured {
  border-color: var(--primary-color);
}
.price-2-package {
  display: block;
  font-size: 24px;
  font-weight: 500;
}
.price-2-value.has-t-border {
  border-top: 1px solid #182F44;
}
.price-2-value span {
  font-size: 20px;
  font-weight: 500;
  line-height: 120%;
}
.price-2-feature-list {
  padding: 25px;
  background-color: #162D42;
  border-radius: 10px;
}
@media (max-width: 575px) {
  .price-2-feature-list {
    padding: 25px 10px;
  }
}
.price-2-feature-list ul {
  list-style: none;
}
.price-2-feature-list ul li {
  margin-bottom: 20px;
  color: var(--white-color);
}
.price-2-feature-list ul li:last-child {
  margin-bottom: 0;
}
.price-2-feature-list ul li.disable {
  color: var(--white-color);
}
.price-2-feature-list ul li.disable span,
.price-2-feature-list ul li.disable svg,
.price-2-feature-list ul li.disable i {
  color: var(--red-color);
}
.price-2-feature-list ul li span,
.price-2-feature-list ul li svg,
.price-2-feature-list ul li i {
  margin-right: 13px;
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  color: var(--primary-color);
}
.price-2-switcher-btns .nav,
.price-2-switcher-btns .nav-tabs {
  border: 0;
}
.price-2-switcher-btns .nav .active,
.price-2-switcher-btns .nav-tabs .active {
  border-color: transparent;
}
.price-2-switcher-btns .nav:hover, .price-2-switcher-btns .nav:focus,
.price-2-switcher-btns .nav-tabs:hover,
.price-2-switcher-btns .nav-tabs:focus {
  border-color: transparent;
}
.price-2-switcher-btns .switcher-btn-1 {
  padding: 0;
  color: var(--heading-color);
  font-weight: 600 !important;
  border-color: transparent;
  position: relative;
  background-color: var(--white-color);
  padding: 15px 30px;
  border-radius: 5px;
}
.price-2-switcher-btns .switcher-btn-1.active {
  background-color: var(--primary-color);
  color: var(--white-color);
}
.price-2-switcher-btns .switcher-btn-1:hover, .price-2-switcher-btns .switcher-btn-1:focus {
  border-color: transparent;
}
.price-2-switcher-btns .switcher-btn-2 {
  padding: 0;
  color: var(--heading-color);
  font-weight: 600 !important;
  border-color: transparent;
  background-color: var(--white-color);
  padding: 15px 30px;
  border-radius: 5px;
}
.price-2-switcher-btns .switcher-btn-2.active {
  background-color: var(--primary-color);
  color: var(--white-color);
}
.price-2-switcher-btns .switcher-btn-2:hover, .price-2-switcher-btns .switcher-btn-2:focus {
  border-color: transparent;
}

.price-3-table {
  border-radius: 10px;
  padding: 30px 20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .price-3-table {
    padding: 30px 10px;
  }
}
.price-3-table.featured {
  border-color: var(--primary-color);
}
.price-3-package {
  display: block;
  font-size: 24px;
  font-weight: 500;
}
.price-3-value {
  background-color: rgba(46, 133, 247, 0.15);
  padding: 15px 0;
  border-radius: 10px;
  line-height: 1;
}
.price-3-value.has-t-border {
  border-top: 1px solid #182F44;
}
.price-3-value span {
  padding-left: 10px;
  font-size: 20px;
  font-weight: 500;
  transform: translateY(-5px);
}
.price-3-feature-list {
  padding: 30px 0;
  margin: 0 25px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .price-3-feature-list {
    margin: 0 10px;
  }
}
@media (max-width: 575px) {
  .price-3-feature-list {
    margin: 0;
  }
}
.price-3-feature-list.has-tb-border {
  border-top: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
}
.price-3-feature-list ul {
  list-style: none;
}
.price-3-feature-list ul li {
  margin-bottom: 20px;
  color: var(--heading-color);
}
.price-3-feature-list ul li:last-child {
  margin-bottom: 0;
}
.price-3-feature-list ul li.disable {
  color: var(--body-font-color);
}
.price-3-feature-list ul li.disable span,
.price-3-feature-list ul li.disable svg,
.price-3-feature-list ul li.disable i {
  color: var(--red-color);
}
.price-3-feature-list ul li span,
.price-3-feature-list ul li svg,
.price-3-feature-list ul li i {
  margin-right: 13px;
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  color: var(--primary-color);
}
.price-3-switcher-btns .nav,
.price-3-switcher-btns .nav-tabs {
  border: 0;
}
.price-3-switcher-btns .nav .active,
.price-3-switcher-btns .nav-tabs .active {
  border-color: transparent;
}
.price-3-switcher-btns .nav:hover, .price-3-switcher-btns .nav:focus,
.price-3-switcher-btns .nav-tabs:hover,
.price-3-switcher-btns .nav-tabs:focus {
  border-color: transparent;
}
.price-3-switcher-btns .switcher-btn-1 {
  padding: 0;
  color: var(--white-color);
  font-weight: 600 !important;
  border-color: transparent;
  position: relative;
  background-color: var(--heading-color);
  padding: 15px 30px;
  border-radius: 5px;
}
.price-3-switcher-btns .switcher-btn-1.active {
  background-color: var(--primary-color);
  color: var(--white-color);
}
.price-3-switcher-btns .switcher-btn-1:hover, .price-3-switcher-btns .switcher-btn-1:focus {
  border-color: transparent;
  color: var(--white-color);
}
.price-3-switcher-btns .switcher-btn-2 {
  padding: 0;
  color: var(--white-color);
  font-weight: 600 !important;
  border-color: transparent;
  background-color: var(--heading-color);
  padding: 15px 30px;
  border-radius: 5px;
}
.price-3-switcher-btns .switcher-btn-2.active {
  background-color: var(--primary-color);
  color: var(--white-color);
}
.price-3-switcher-btns .switcher-btn-2:hover, .price-3-switcher-btns .switcher-btn-2:focus {
  border-color: transparent;
  color: var(--white-color);
}

/*----------------------------------------*/
/* 11. TESTIMONIAL CSS
/*----------------------------------------*/
.testimonial-item {
  padding: 30px;
  border: 1px solid var(--border-color);
  box-shadow: 0px 0px 20px rgba(232, 236, 240, 0.25);
  border-radius: 10px;
  align-items: center;
}
.testimonial-avata img {
  margin-right: 20px;
  border-radius: 10px;
  max-width: 80px;
  min-height: 80px;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-avata img {
    margin-bottom: 30px;
  }
}
.testimonial-ratting span {
  color: #FBBF37;
}

@media (max-width: 575px) {
  .testimonial-navigation {
    margin-top: 30px;
    display: flex;
    justify-content: center;
  }
}

.testimonial-button-prev,
.testimonial-button-next {
  position: absolute;
  top: 50%;
  left: -150px;
  z-index: 1;
  display: inline-block;
  width: 66px;
  height: 66px;
  border: 2px solid var(--border-color);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  transform: translateY(-50%);
  transition: ease all 0.5s;
}
.testimonial-button-prev span,
.testimonial-button-next span {
  line-height: 1;
}
.testimonial-button-prev:hover,
.testimonial-button-next:hover {
  border: 2px solid var(--primary-color);
  background-color: var(--primary-color);
  color: var(--white-color);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .testimonial-button-prev,
  .testimonial-button-next {
    left: 0;
    transform: translateX(-50%) translateY(-50%);
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-button-prev,
  .testimonial-button-next {
    left: 0;
    transform: translateX(-50%) translateY(-50%);
    width: 50px;
    height: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-button-prev,
  .testimonial-button-next {
    left: 0;
    transform: translateX(-50%) translateY(-50%);
    width: 50px;
    height: 50px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-button-prev,
  .testimonial-button-next {
    position: relative;
    transform: translateX(0) translateY(0);
    left: 0;
    width: 50px;
    height: 50px;
  }
}

.testimonial-button-next {
  left: auto;
  right: -180px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399.98px) {
  .testimonial-button-next {
    right: 0;
    transform: translateX(50%) translateY(-50%);
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-button-next {
    right: 0;
    transform: translateX(50%) translateY(-50%);
    width: 50px;
    height: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-button-next {
    right: 0;
    transform: translateX(50%) translateY(-50%);
    width: 50px;
    height: 50px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-button-next {
    right: 0;
    margin-left: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .testimonial-2-content {
    padding-left: 0;
  }
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-2-review p {
    margin-right: 0;
  }
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-2-img {
    padding-right: 0;
    margin-bottom: 30px;
  }
  .testimonial-2-img img {
    max-width: 100%;
  }
}

.testimonial-2-button-prev span,
.testimonial-2-button-next span {
  width: 40px;
  height: 40px;
  line-height: 35px;
  border: 1px solid var(--border-color);
  text-align: center;
  border-radius: 4px;
  display: inline-block;
  transition: ease all 0.5s;
}
.testimonial-2-button-prev:hover span,
.testimonial-2-button-next:hover span {
  border: 1px solid var(--primary-color);
  background-color: var(--primary-color);
  color: var(--white-color);
}

.testimonial-2-button-prev {
  margin-right: 12px;
}

.testimonial-2-ratting span {
  color: #FBBF37;
}

.testimonial-3-item {
  padding: 30px;
  border-radius: 10px;
}

.testimonial-3-shape-tl {
  position: absolute;
  left: 0;
  top: 0;
}
.testimonial-3-shape-tr {
  position: absolute;
  right: 0;
  top: 0;
}
.testimonial-3-shape-bl {
  position: absolute;
  left: 0;
  bottom: 0;
}
.testimonial-3-shape-br {
  position: absolute;
  right: 0;
  bottom: 0;
}

.testimonial-3-pagination {
  text-align: center;
}
.testimonial-3-pagination .swiper-pagination-bullet {
  width: 50px;
  height: 4px;
  border-radius: 30px;
  margin-right: 10px;
  margin-left: 10px;
  background-color: var(--border-color);
}
.testimonial-3-pagination .swiper-pagination-bullet-active {
  background-color: var(--white-color);
}

.testimonial-4-item {
  padding: 60px 120px;
  border-radius: 20px;
}
@media (max-width: 575px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-4-item {
    padding: 60px 25px;
  }
}
.testimonial-4-review p {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 25px;
  line-height: 130%;
  color: var(--heading-color);
  font-style: italic;
}
@media (max-width: 575px) {
  .testimonial-4-review p {
    font-size: 25px;
  }
}

.testimonial-4-button-prev, .testimonial-4-button-next {
  width: 50px;
  height: 50px;
  line-height: 45px;
  text-align: center;
  border-radius: 50%;
  border: 1px solid var(--border-color);
  transition: ease all 0.5s;
}
.testimonial-4-button-prev:hover, .testimonial-4-button-next:hover {
  background-color: var(--primary-color);
  border-color: transparent;
  color: var(--border-color);
}
.testimonial-4-button-prev svg, .testimonial-4-button-next svg {
  font-size: 24px;
}
.testimonial-4-button-prev {
  margin-right: 20px;
}

/*----------------------------------------*/
/*  12. PROGRESS CSS
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .progress-item {
    height: 100%;
  }
}
.progress-item-title {
  font-size: 24px;
  margin-bottom: 5px;
  line-height: 130%;
  font-weight: 500;
}
.progress-item-content {
  background-color: var(--white-color);
  padding: 30px;
  position: relative;
}

.progress-pattern-1 {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}
.progress-pattern-2 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.progress-2-item {
  border-radius: 10px;
}
.progress-2-item-title {
  font-size: 24px;
  margin-bottom: 10px;
  line-height: 130%;
  font-weight: 500;
}
.progress-2-item-content {
  padding-top: 45px;
  padding-bottom: 45px;
  padding-left: 30px;
  padding-right: 40px;
  height: 100%;
  position: relative;
  z-index: 1;
}
@media (max-width: 575px) {
  .progress-2-item-content {
    padding-right: 20px;
  }
}
.progress-2-item-content:after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  z-index: -1;
  width: 100%;
  height: 100%;
  display: inline-block;
  background-color: var(--primary-color);
  border-radius: 10px;
}

.progress-4-item {
  padding-top: 40px;
  padding-bottom: 40px;
  padding-left: 50px;
  padding-right: 25px;
  background-color: #081928;
  border: 1px solid #182F44;
  border-radius: 20px;
  position: relative;
  margin-left: 30px;
}
.progress-4-item-number {
  position: absolute;
  top: 25px;
  left: 0;
  transform: translateX(-50%);
}
.progress-4-item-count {
  width: 60px;
  height: 60px;
  background-color: var(--primary-color);
  text-align: center;
  line-height: 64px;
  border-radius: 10px;
}

/*----------------------------------------*/
/*  00. CTA CSS START
/*----------------------------------------*/
.fan-fact-video {
  padding-bottom: 340px;
  margin-bottom: -340px;
  z-index: 1;
}
.fan-fact-shape-1 {
  position: absolute;
  left: 0;
  bottom: 10px;
  z-index: -1;
}
.fan-fact-shape-2 {
  position: absolute;
  right: 0;
  bottom: 10px;
  z-index: -1;
}

.video-img {
  border-radius: 10px;
}
.video-img img {
  border-radius: 10px;
}
.video-img-overlay {
  position: relative;
}
.video-img-overlay::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  background-color: var(--black-color);
  opacity: 0.2;
}

.video-play-btn-wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .newsletter-form-section {
    padding-top: 100px;
    padding-bottom: 60px;
  }
}

.newsetter-imgs-wrapper {
  transform: rotate(18.35deg);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .newsetter-imgs-wrapper img {
    max-width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .newsetter-imgs-wrapper {
    transform: rotate(0deg);
    margin-top: 30px;
  }
}

.newsletter-imgs-row-1 {
  margin-bottom: 20px;
}

.newsletter-img-1,
.newsletter-img-3 {
  margin-right: 20px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .newsletter-img-1,
  .newsletter-img-3 {
    margin-bottom: 30px;
  }
}

.newsletter-img-1 img, .newsletter-img-2 img, .newsletter-img-3 img, .newsletter-img-4 img {
  border-radius: 16px;
}

.newsletter-form {
  margin-right: 100px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .newsletter-form {
    margin-right: 0;
  }
}
.newsletter-form form {
  position: relative;
}
.newsletter-form form input {
  height: 64px;
  width: 100%;
  border-radius: 6px;
  padding-left: 25px;
  padding-right: 180px;
  border: 0;
}
.newsletter-form form button {
  position: absolute;
  height: 50px;
  line-height: 50px;
  top: 50%;
  right: 7px;
  transform: translateY(-50%);
}

.newsletter-shape-1 {
  position: absolute;
  left: 0;
  top: -120px;
}
.newsletter-shape-2 {
  position: absolute;
  right: -50px;
  top: -50px;
}

/*----------------------------------------*/
/*  00. FEATURE CSS START
/*----------------------------------------*/
.feature-man-box {
  background: linear-gradient(180.89deg, var(--primary-color) 29.49%, rgba(107, 171, 255, 0) 99.26%);
  border-radius: 10px;
  position: relative;
  padding: 30px 40px;
  overflow: hidden;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .feature-man-box {
    height: 500px !important;
  }
}
.feature-man-box::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: inline-block;
  background: linear-gradient(180.89deg, var(--primary-color) 29.49%, rgba(107, 171, 255, 0) 99.26%);
  transform: rotate(-180deg);
  z-index: 1;
}

.feature-man-img {
  position: absolute;
  bottom: 50px;
}
@media (max-width: 575px) {
  .feature-man-img {
    bottom: auto;
  }
}

.feature-icon-box-bt {
  position: absolute;
  bottom: 30px;
  z-index: 2;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .feature-icon-box-bt {
    left: 30px;
    right: 30px;
  }
}

.feature-img-1 {
  border-radius: 10px;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .feature-img-1 {
    margin-right: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .feature-img-1 img {
    max-width: 100%;
  }
}
.feature-img-1 img {
  border-radius: 10px;
}
.feature-img-1::before {
  content: "";
  position: absolute;
  left: -20px;
  top: -20px;
  border-radius: 10px;
  background-color: var(--primary-color);
  z-index: -1;
  width: 100%;
  height: 100%;
}

.feature-box-wrapper {
  padding: 60px 30px 40px 60px;
  border-radius: 10px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .feature-box-wrapper {
    padding: 40px 30px;
  }
}

.feature-icon-box {
  padding: 40px;
  border-radius: 10px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .feature-icon-box {
    padding-right: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .feature-icon-box.no-space {
    padding: 30px 0;
  }
}

.feature-right-bottom {
  border-radius: 10px;
}

.feature-top-shape {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.feature-bottom-shape {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .analytics-img {
    margin-right: 20px;
  }
}

.benefit-box {
  padding: 30px;
  padding-bottom: 50px;
  border-radius: 20px;
}

.benefit-icon {
  width: 80px;
  height: 80px;
  background-color: #F1F2F6;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
}

.career-list-item {
  padding-bottom: 15px;
}
.career-list-item a :hover {
  color: var(--primary-hover-color);
}
@media (max-width: 575px) {
  .career-list-item h4 {
    margin-bottom: 30px;
  }
}

.inner-benefit-theme-bg {
  position: absolute;
  top: 0;
  width: 100%;
  height: 80%;
  display: inline-block;
  z-index: -1;
}

/*----------------------------------------*/
/* 13. COUNTER CSS
/*----------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .counter-2-wrapper {
    padding: 30px 0;
  }
}

.counter-shape-1 {
  position: absolute;
  left: 0;
  top: 0;
}

.counter-shape-2 {
  position: absolute;
  right: 0;
  bottom: 0;
}

.counter-2-item.has-border {
  position: relative;
}
.counter-2-item.has-border::after {
  content: "";
  position: absolute;
  left: 50px;
  right: 50px;
  bottom: -100%;
  height: 1px;
  display: inline-block;
  background-color: #84B1EB;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .counter-2-item.has-border::after {
    bottom: -50%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .counter-2-item.has-border::after {
    display: none;
  }
}

/*----------------------------------------*/
/*  14. FAQ CSS
/*----------------------------------------*/
.faq-thumbnail {
  border-radius: 10px;
  overflow: hidden;
}

@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .faq-content {
    padding-left: 0;
  }
}

/*----------------------------------------*/
/*  15. CONTACT CSS
/*----------------------------------------*/
.contact-box {
  margin-right: 50px;
  padding: 35px 50px;
  border-radius: 10px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-box {
    margin-right: 0;
    padding: 35px 20px;
  }
}
.contact-box form input, .contact-box form textarea {
  width: 100%;
  height: 54px;
  padding: 15px;
  padding-left: 25px;
  padding-right: 25px;
  border: 1px solid var(--border-color);
  border-radius: 4px;
  margin-bottom: 15px;
  transition: all 0.3s ease-out 0s;
}
.contact-box form input:focus, .contact-box form textarea:focus {
  outline: 0;
  border-color: var(--primary-color);
}
.contact-box form label {
  margin-bottom: 5px;
  color: #000;
}
.contact-box form textarea {
  height: 174px;
  padding-top: 20px;
  padding-bottom: 20px;
  resize: none;
}
.contact-box form textarea:focus {
  outline: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399.98px), only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-box-info {
    padding-left: 0;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-box-info {
    padding: 30px 20px;
    background-color: var(--white-color);
    border-radius: 10px;
  }
}

.call-to-action-box {
  padding: 20px;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  margin-right: 50px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .call-to-action-box {
    margin-right: 0;
  }
}

.contact-section-bg {
  position: absolute;
  width: 55%;
  height: 100%;
  top: 0;
  left: 0;
  display: inline-block;
  background-color: var(--primary-color);
  z-index: -1;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-section-bg {
    width: 100%;
  }
}

.contact-box-shape {
  position: absolute;
  left: -100px;
  z-index: -1;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-box-info {
    background-color: var(--white-color);
    padding-top: 30px;
    padding-bottom: 30px;
    padding-left: 50px;
    padding-right: 30px;
    border-radius: 10px;
  }
}

.main-contact-form {
  padding: 50px;
}
.main-contact-form .input-item input {
  width: 100%;
  padding: 15px;
  padding-left: 25px;
  padding-right: 25px;
  background-color: var(--off-white);
  border: 0;
  border-radius: 4px;
}
.main-contact-form .input-item input:focus {
  outline: 0;
}
.main-contact-form .input-item textarea {
  width: 100%;
  height: 145px;
  padding: 15px;
  padding-left: 25px;
  padding-right: 25px;
  resize: none;
  border: 0;
  background-color: var(--off-white);
  border-radius: 4px;
}
.main-contact-form .input-item textarea:focus {
  outline: 0;
}

.e-check-input {
  display: inline-block;
  padding: 8px;
}

/*----------------------------------------*/
/*  16. BLOG CSS
/*----------------------------------------*/
.blog-item {
  border: 1px solid var(--border-color);
  box-shadow: 0px 0px 20px rgba(232, 236, 240, 0.25);
  border-radius: 10px;
  background-color: var(--white-color);
}
.blog-item:hover .blog-img img {
  transform: scale(1.1) rotate(-1deg);
}
.blog-img {
  border-radius: 6px 6px 0 0;
}
.blog-img img {
  border-radius: 6px 6px 0 0;
  transition: all 0.3s ease-out 0s;
}
.blog-tag {
  position: absolute;
  top: 20px;
  right: 20px;
}
.blog-tag a {
  font-size: 16px;
  font-weight: 500;
  line-height: 130%;
  background-color: var(--white-color);
  padding: 10px 20px;
  display: inline-block;
  color: var(--heading-color);
  border-radius: 4px;
}
.blog-content {
  padding: 30px 25px;
}
.blog-title:hover {
  color: var(--primary-color);
}
.blog-date {
  font-weight: 500;
}

.blog-2-tag a {
  padding: 10px 20px;
  background-color: rgba(46, 133, 247, 0.15);
  border-radius: 4px;
  color: var(--primary-color);
  display: inline-block;
}
.blog-2-date {
  font-weight: 500;
}

.more-btn {
  width: 35px;
  height: 35px;
  line-height: 33px;
  text-align: center;
  background-color: var(--primary-color);
  display: inline-block;
  color: var(--white-color);
  border-radius: 4px;
}
.more-btn:hover {
  color: var(--white-color);
  background-color: var(--primary-hover-color);
}
.more-btn svg {
  width: 24px;
  height: 24px;
  display: inline-block;
}

.blog-tab-menu .nav-tabs .nav-link.active {
  color: var(--primary-color);
  border-color: transparent;
  border-bottom: 1px solid var(--primary-color);
}
.blog-tab-menu .nav-tabs .nav-link {
  padding-left: 30px;
  padding-right: 30px;
  color: var(--body-font-color);
  transition: all 0.3s ease-out 0s;
}
.blog-tab-menu .nav-tabs .nav-link:hover {
  color: var(--primary-color);
  border-color: transparent transparent var(--primary-color) transparent;
}

.sidebar-wrapper {
  padding: 30px;
  border-radius: 4px;
}
@media (max-width: 575px) {
  .sidebar-wrapper {
    padding: 30px 10px;
  }
}
.sidebar-widget {
  padding: 30px 20px;
  background: var(--white-color);
  border-radius: 4px;
}
.sidebar-widget.has-b-border {
  border-bottom: 1px solid var(--border-color);
  margin-right: 20px;
  margin-left: 20px;
}
.sidebar-widget-title {
  position: relative;
  display: block;
  margin-bottom: 15px;
  border-bottom: 1px solid var(--border-color);
  padding-bottom: 15px;
}
.sidebar-widget-title.no-border {
  border: 0;
}
.sidebar-widget .sidebar-cat li {
  list-style: none;
  padding-left: 19px;
  margin-bottom: 25px;
  line-height: 1;
}
.sidebar-widget .sidebar-cat li:last-child {
  margin-bottom: 0;
}
.sidebar-widget .sidebar-cat li a {
  font-size: 16px;
  color: var(--bd-text-1);
  position: relative;
  padding-left: 10px;
}
.sidebar-widget .sidebar-cat li a::after {
  position: absolute;
  content: "";
  left: -19px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 1.5px;
  display: inline-block;
  background-color: var(--primary-color);
  transition: all 0.3s ease-out 0s;
}
.sidebar-widget .sidebar-cat li a:hover {
  color: var(--black-color);
}
.sidebar-widget .sidebar-cat li a:hover::after {
  color: var(--black-color);
  left: -14px;
}
.sidebar-widget .sidebar-cat li ul {
  padding-left: 25px;
  padding-top: 20px;
}
.sidebar-search {
  position: relative;
}
.sidebar-search input {
  font-size: 16px;
  width: 100%;
  height: 64px;
  line-height: 60px;
  background: var(--white-color);
  padding: 0 25px;
  text-transform: capitalize;
  border: 0;
  border-radius: 4px;
  outline: none;
  padding-right: 80px;
}
.sidebar-search input::-moz-placeholder {
  color: #909CAA;
}
.sidebar-search input::placeholder {
  color: #909CAA;
}
.sidebar-search button {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  padding: 0 24px;
  line-height: 64px;
}
.sidebar-search button svg {
  width: 22px;
  height: 22px;
}

.sidebar-newsletter {
  position: relative;
}
.sidebar-newsletter input {
  font-size: 16px;
  width: 100%;
  height: 50px;
  line-height: 50px;
  background: var(--off-white);
  padding: 0 25px;
  border: 0;
  border-radius: 4px;
  outline: none;
  padding-right: 150px;
}
.sidebar-newsletter input::-moz-placeholder {
  color: #909CAA;
}
.sidebar-newsletter input::placeholder {
  color: #909CAA;
}
.sidebar-newsletter button {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  padding: 0 24px;
  line-height: 64px;
}
.sidebar-newsletter button svg {
  width: 22px;
  height: 22px;
}

.tag-cloud a {
  background: var(--border-color);
  display: inline-block;
  line-height: 1;
  padding: 12px 21px;
  margin-bottom: 8px;
  margin-right: 10px;
  border-radius: 4px;
}
.tag-cloud a:hover {
  background: var(--primary-color);
  color: var(--white-color);
}

blockquote {
  background: var(--off-white);
  padding: 35px 50px;
  margin-bottom: 35px;
}
@media (max-width: 575px) {
  blockquote {
    padding-left: 15px;
    padding-right: 15px;
  }
}
blockquote p {
  line-height: 1.5;
  font-size: 20px;
  color: #57565e;
  font-weight: 400;
}
blockquote cite {
  font-size: 18px;
  display: block;
  margin-top: 10px;
  color: #070337;
  font-style: inherit;
  font-weight: 600;
  position: relative;
}
blockquote cite::before {
  content: "";
  font-size: 28px;
  color: var(--primary-color);
  padding-bottom: 0px;
  display: inline-block;
  background: var(--primary-color);
  height: 2px;
  width: 40px;
  font-weight: 400;
  text-align: center;
  top: -4px;
  margin-right: 10px;
  position: relative;
}

.basic-pagination ul li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 30px;
}
.basic-pagination ul li a {
  height: 50px;
  line-height: 48px;
  border: 1px solid var(--border-color);
  padding: 0 25px;
  display: inline-block;
  font-size: 18px;
  border-radius: 4px;
  transition: all 0.3s ease-out 0s;
}
.basic-pagination ul li a:hover {
  background-color: var(--primary-color);
  color: var(--white-color);
  border-color: transparent;
}
.basic-pagination ul li a.current {
  background-color: var(--primary-color);
  color: var(--white-color);
  border-color: transparent;
}

.ineer-page-wrapper .has-border-button {
  border-bottom: 1px solid var(--border-color);
  padding-bottom: 25px;
}

.inner-page-sidebar {
  padding: 30px;
}

.inner-page-social {
  padding: 20px 0;
  border-top: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
}
.inner-page-social.no-border {
  padding: 0;
  border: 0;
}
.inner-page-social li {
  list-style: none;
  display: inline-block;
  margin-right: 5px;
}
.inner-page-social li a {
  color: var(--heading-color);
  width: 35px;
  height: 35px;
  text-align: center;
  line-height: 35px;
  border-radius: 50%;
  background-color: var(--border-color);
  display: inline-block;
}
.inner-page-social li a:hover {
  color: var(--white-color);
  background-color: var(--primary-color);
}
.inner-page-social li a svg {
  width: 15px;
  height: 15px;
}

.inner-page-sidebar-title {
  padding-bottom: 15px;
}
.inner-page-sidebar-title.has-border {
  border-bottom: 1px solid var(--border-color);
}
.inner-page-sidebar-title svg {
  margin-top: -5px;
}

.inner-page-ft p {
  margin-bottom: 20px;
}
.inner-page-ft p svg {
  margin-right: 10px;
  width: 22px;
  height: 22px;
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .inner-page-text-wrapper {
    padding-right: 0;
  }
}

.blog-social-share li {
  list-style: none;
  display: inline-block;
  margin-right: 5px;
}
.blog-social-share li a {
  color: var(--heading-color);
  width: 26px;
  height: 26px;
  text-align: center;
  line-height: 24px;
  border-radius: 50%;
  background-color: var(--border-color);
  display: inline-block;
}
.blog-social-share li a:hover {
  color: var(--white-color);
  background-color: var(--primary-color);
}
.blog-social-share li a svg {
  width: 15px;
  height: 15px;
}

.postbox-comment ul li {
  margin-bottom: 10px;
  list-style: none;
}
.postbox-comment ul li.children {
  margin-left: 100px;
}
@media (max-width: 575px) {
  .postbox-comment ul li.children {
    margin-left: 15px;
  }
}
.postbox-comment-form {
  margin-bottom: 20px;
  padding: 40px 30px;
  box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.09);
  background: var(--white-color);
}
.postbox-comment-form-title {
  font-size: 26px;
  font-weight: 600;
  margin-bottom: 40px;
}
.postbox-comment-input {
  position: relative;
  margin-bottom: 20px;
}
.postbox-comment-input span {
  font-weight: 600;
  color: var(--black-color);
  margin-bottom: 12px;
  display: block;
}
.postbox-comment-input input, .postbox-comment-input textarea {
  height: 55px;
  padding: 0 20px;
  width: 100%;
  font-size: 14px;
  color: var(--black-color);
  outline: none;
  border: 1px solid transparent;
  border-radius: 4px;
  background: #f7f7f7;
}
.postbox-comment-input textarea {
  height: 175px;
  resize: none;
  padding-top: 20px;
  padding-bottom: 20px;
}
.postbox-comment-title {
  font-size: 26px;
  font-weight: 600;
  margin-bottom: 20px;
}
.postbox-comment-box {
  padding: 30px;
  padding-right: 40px;
  padding-top: 25px;
  background-color: var(--off-white);
  border-radius: 10px;
  margin-bottom: 25px;
}
.postbox-comment-avater img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}
.postbox-comment-name {
  margin-bottom: 5px;
}
.postbox-comment-name h5 {
  font-size: 16px;
  line-height: 1;
  margin-bottom: 0;
}
.postbox-comment-name span {
  font-size: 14px;
}
@media (max-width: 575px) {
  .postbox-comment-text {
    margin-left: 0;
    margin-top: 15px;
  }
}
.postbox-comment-text p {
  font-size: 16px;
  margin-bottom: 15px;
}
.postbox-comment-reply {
  margin-top: 10px;
}
.postbox-comment-reply a {
  display: inline-block;
  color: var(--primary-color);
  background: rgba(61, 108, 231, 0.1);
  height: 22px;
  line-height: 22px;
  padding: 0 10px;
  font-weight: 500;
  font-size: 14px;
  border-radius: 4px;
}
.postbox-comment-reply a:hover {
  color: var(--white-color);
  background: var(--primary-color);
}
.postbox-comment-agree {
  padding-left: 5px;
}
.postbox-comment-agree input {
  margin: 0;
  margin-top: 2px;
  -webkit-appearance: none;
          appearance: none;
  -moz-appearance: none;
  display: block;
  width: 14px;
  height: 14px;
  background: var(--white-color);
  border: 1px solid #b9bac1;
  outline: none;
  border-radius: 4px;
  flex: 0 0 auto;
  transform: translateY(-1px);
}
.postbox-comment-agree input:checked {
  position: relative;
  background-color: var(--primary-color);
  border-color: transparent;
}
.postbox-comment-agree input:checked::after {
  box-sizing: border-box;
  content: "\f00c";
  position: absolute;
  font-family: "Font Awesome 6 Pro";
  font-size: 10px;
  color: var(--white-color);
  top: 46%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.postbox-comment-agree input:hover {
  cursor: pointer;
}
.postbox-comment-agree label {
  padding-left: 8px;
  color: var(--bd-text-1);
  line-height: 1;
}
.postbox-comment-agree label a {
  color: var(--black-color);
  font-weight: 600;
  padding-left: 4px;
}
.postbox-comment-agree label a:hover {
  color: var(--primary-color);
}
.postbox-comment-agree label:hover {
  cursor: pointer;
}

.post-comment-form textarea {
  width: 100%;
  height: 270px;
  resize: none;
  border: 0;
  background-color: var(--off-white);
  padding: 15px 25px;
  border-radius: 10px;
  margin-bottom: 25px;
}
.post-comment-form textarea:focus {
  outline: 0;
}
.post-comment-form input {
  width: 100%;
  padding: 15px 25px;
  background-color: var(--off-white);
  border: 0;
  border-radius: 10px;
  margin-bottom: 25px;
}
.post-comment-form input:focus {
  outline: 0;
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .team-single-info {
    padding-left: 0;
  }
}

/*----------------------------------------*/
/*  17. FOOTER CSS
/*----------------------------------------*/
.footer-widget p {
  color: var(--bd-text-1);
  font-size: 16px;
  margin-bottom: 20px;
}
.footer-widget-title {
  font-size: 20px;
  font-weight: 500;
  line-height: 130%;
  margin-bottom: 30px;
  color: var(--white-color);
}
.footer-social ul li {
  display: inline-block;
  margin-right: 15px;
}
.footer-social ul li:last-child {
  margin-right: 15px;
}
.footer-social ul li a {
  width: 30px;
  height: 30px;
  line-height: 28px;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  background-color: var(--white-color);
}
.footer-social ul li a:hover svg {
  color: var(--primary-color);
}
.footer-social ul li a svg {
  color: var(--black-color);
  transition: all 0.3s ease-out 0s;
}
.footer-menu-list ul li {
  margin-bottom: 25px;
  list-style: none;
}
.footer-menu-list ul li:last-child {
  margin-right: 0;
}
.footer-menu-list ul li a {
  color: var(--white-color);
  position: relative;
  display: inline-block;
}
.footer-menu-list ul li a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: var(--white-color);
  display: inline-block;
  transition: all 0.3s ease-out 0s;
}
.footer-menu-list ul li a:hover::after {
  left: 0;
  right: auto;
  width: 100%;
}
.footer-menu-list ul li {
  margin-bottom: 25px;
  list-style: none;
}
.footer-menu-list ul li:last-child {
  margin-right: 0;
}
.footer-menu-list ul li a {
  color: var(--white-color);
  position: relative;
  display: inline-block;
}
.footer-menu-list ul li a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: var(--white-color);
  display: inline-block;
  transition: all 0.3s ease-out 0s;
}
.footer-menu-list ul li a:hover::after {
  left: 0;
  right: auto;
  width: 100%;
}
.footer-contact p {
  color: var(--bd-text-1);
  font-size: 16px;
  margin-bottom: 20px;
}
.footer-contact iframe {
  width: 100%;
  height: 110px;
  filter: grayscale(100%);
}
.footer-subscribe-content {
  padding: 30px;
  border-radius: 10px;
}
@media (max-width: 575px) {
  .footer-subscribe-content {
    padding: 30px 15px;
  }
}
.footer-subscribe-content input {
  width: 100%;
  padding-right: 20px;
  padding-left: 20px;
  height: 54px;
  border: 1px solid;
  border-color: #ABCFFF;
  color: var(--white-color);
  border-radius: 4px;
  outline: 0;
}
.footer-subscribe-content input::-moz-placeholder {
  color: #B0D6EF;
}
.footer-subscribe-content input::placeholder {
  color: #B0D6EF;
}
.footer-bottom {
  border-top: 1px solid #59626C;
  padding-top: 25px;
  padding-bottom: 25px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-copyright {
    margin-bottom: 30px;
  }
}
.footer-copyright p {
  color: var(--white-color);
}
.footer-copyright a {
  font-weight: 600;
  position: relative;
}
.footer-copyright a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: var(--white-color);
  display: inline-block;
  transition: all 0.3s ease-out 0s;
}
.footer-copyright a:hover::after {
  left: 0;
  right: auto;
  width: 100%;
}
.footer-copyright-nav ul li {
  list-style: none;
  display: inline-block;
}
.footer-copyright-nav ul li:not(:last-child) {
  margin-right: 30px;
}
.footer-copyright-nav ul li a {
  color: var(--white-color);
  position: relative;
}
.footer-copyright-nav ul li a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: var(--white-color);
  display: inline-block;
  transition: all 0.3s ease-out 0s;
}
.footer-copyright-nav ul li a:hover::after {
  left: 0;
  right: auto;
  width: 100%;
}

.footer-subscribe-title {
  font-size: 24px;
  font-weight: 500;
  line-height: 130%;
  color: var(--white-color);
}

/* footer col design for home 1 */
.footer-col-1 {
  padding-right: 100px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-col-1 {
    padding-right: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-col-1 {
    padding-right: 0;
  }
}
.footer-col-3 {
  margin-left: -30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .footer-col-3 {
    margin-left: 0;
  }
}/*# sourceMappingURL=main.css.map */