/*!
 * fullPage 3.1.2
 * https://github.com/alvarotrigo/fullPage.js
 *
 * @license GPLv3 for open source use only
 * or Fullpage Commercial License for commercial use
 * http://alvarotrigo.com/fullPage/pricing/
 *
 * Copyright (C) 2section018 http://alvarotrigo.com/fullPage - A project by Alvaro Trigo
 */
/* @import url('https://fonts.googleapis.com/css2?family=Sora:wght@500&display=swap'); */


/* @import must be at top of file, otherwise CSS will not work */
/*@import url("//hello.myfonts.net/count/3909a7");*/


/*@font-face {font-family: 'UniversLTPro-Ex';src: url('webfonts/3909A7_0_0.eot');src: url('webfonts/3909A7_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3909A7_0_0.woff2') format('woff2'),url('webfonts/3909A7_0_0.woff') format('woff'),url('webfonts/3909A7_0_0.ttf') format('truetype');}*/

   @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap');
a {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

:root {
  --hover: #525252;
  --white: #ffffff;
  --purple: #6f00ff;
  --black: #080808;
  --complementry: #f9bd41;
  --font: 'Oswald', sans-serif;
  
}

::selection {
    background: #6f00ff; /* Background color for the selected text */
    color: #ffffff; /* Text color for the selected text */
}



.home-heading {
  text-align: left;
  width: 65%;
  font-family: var(--font);
  font-size: 105px;
  font-weight: 600;
  color: #fff;
  /* margin: 0; */
  /* padding: 40px 0 0 0; */
  position: fixed;
  left: 50%;
  top: 35%;
  transform: translate(-70%, -25%);
}

.home-content {
  width: 63%;
  font-size: 19px;
  z-index: 11000;
  display: none;
  transition: 0.25s ease-in;
  position: fixed;
  left: 50%;
  top: 85%;
  transform: translate(-50%, -50%);
  color: #fff;
}

.home-covid-links-content {
  font-family: var(--font);
  z-index: 11000;
  display: none;
  transition: 0.25s ease-in;
  position: fixed;
  left: 5%;
  top: 75%;
  /* transform: translate(-50%, -50%); */
  color: #fff;
  /* padding: 55px 0px;
  width: 75%; */
  animation: myfadeIn .25s ease-in forwards;
}

.covid-headings {
    display: none;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #fb3b4c;
    /*z-index: 11000;*/
    position: fixed;
}
.main-headings {
    display: none;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #000000;
    /*z-index: 11000;*/
    position: fixed;
}
.main-headingsA {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #000000;
    /*z-index: 11000;*/
    position: fixed;
}
/*.main-heading {*/
/*  font-family: var(--font);*/
/*  transition: 0.25s ease-in;*/
/*  position: fixed;*/
/*  left: 5%;*/
/*  top: 25%;*/
/*  color: #fff;*/
/*  text-align: left;*/
/*  animation: myfadeIn .25s ease-in forwards;*/
/*}*/
.covid-heading {
  font-family: var(--font);
  transition: 0.25s ease-in;
  position: fixed;
  left: 5%;
  top: 25%;
  color: #fff;
  text-align: left;
  animation: myfadeIn .25s ease-in forwards;
}

.covid-logo {
  font-family: var(--font);
  color: #fff;
  font-size: 70px;
  font-weight: bolder;
}
.m-scroll {
  display: flex;
  position: relative;
  width: 100%;
  height: 130px;
  margin: 0px 0px;
  overflow: hidden;
  z-index: 1;
}

.m-scroll2 {
  display: flex;
  position: relative;
  width: 100%;
  height: 130px;
  margin: 0px 0px;
  overflow: hidden;
  z-index: 1;
}
.m-scroll__title2 {
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  height: 100%;
  white-space: nowrap;
  transform: scale(2);
  transition: all 1s ease;
}
.m-scroll__title2 > div {
  display: flex;
  -webkit-animation: scrollText2 15s infinite linear;
          animation: scrollText2 15s infinite linear;
}
.m-scroll__title2 h1 {
  margin: 0;
  font-size: 40px;
  color: #7d7d7d;
  transition: all 2s ease;
}
.m-scroll__title2 a {
  text-decoration: none;
  pointer-events: none;
  color: #7d7d7d;
  font-family: var(--font);
    font-weight: 300;
}
.m-scroll__title2 a::before {
    content: "";
    background-color: #7d7d7d;
    height: 0.5px;
    width: 30px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
}
.m-scroll__title2 a:hover {
  -webkit-text-stroke: 1px #7d7d7d;
  color: transparent;
}


.m-scroll__title {
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  height: 100%;
  white-space: nowrap;
  transform: scale(2);
  transition: all 1s ease;
}
.m-scroll__title > div {
  display: flex;
  -webkit-animation: scrollText 15s infinite linear;
          animation: scrollText 15s infinite linear;
}
.m-scroll__title h1 {
  margin: 0;
  font-size: 40px;
  color: #7d7d7d;
  transition: all 2s ease;
}
.m-scroll__title a {
    pointer-events: none;
  text-decoration: none;
  color: #7d7d7d;
  font-family: var(--font);
    font-weight: 300;
}
.m-scroll__title a::before {
  content: "";
  background-color: #7d7d7d;
  height: 0.5px;
  width: 30px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
}
.m-scroll__title a:hover {
  -webkit-text-stroke: 1px #7d7d7d;
  color: transparent;
}
.covid-content {
  font-family: var(--font);
  font-size: 45px;
  width: 58%;
}

.link-dot::after {
  content: "•";
  display: inline-block;
  margin-left: 0.5em;
}

.covid-goto {
  font-family: var(--font);
  font-size: 18px;
  z-index: 11000;
  /* display: none; */
  transition: 0.25s ease-in;
  /* position: fixed;
    left: 50%;
    top: 95%;
    transform: translate(-58%, -50%); */
  color: #fff;
}

.covid-link {
  font-family: var(--font);
  margin-right: 5px;
  color: #fff;
  list-style: none;
}

/* .covid-link:hover{
  text-decoration: none;
  color: rgb(226, 226, 226);
} */
.covid-web {
  display: flex;
  padding: 0 !important;
  /* margin: 0px 0px 0px !important;
  padding: 0px 0px 0px 12px !important; */
}

#heading1 {
  font-size: 80px !important;
}
.team-right-sec{
    padding-left: 500px;
}

.home-staffhound-links-content {
  font-family: var(--font);
  z-index: 12000;
  display: none;
  /* transition: 0.25s ease-in; */
  position: fixed;
  left: 5%;
  top: 75%;
  animation: myfadeIn .25s ease-in forwards;
  /* transform: translate(-50%, -50%); */
  color: #fff;
  /* padding: 55px 0px;
  width: 75%; */
}
.contact-footer-btn{
  color: #fff;
  padding: 2px 35px;
  margin-top: 15px;
  background: #4e03af;
}
.contact-footer-btn:hover{
  color: #fff;
  background: #31036c;
}
.services-footer-btn{
  color: #fff;
  padding: 2px 35px;
  margin-top: 15px;
  background: #4e03af;
}
.services-footer-btn:hover{
  color: #fff;
  background: #31036c;
}
.home-footer-btn{
  color: #fff;
  padding: 2px 35px;
  margin-top: 15px;
  background: #4e03af;
  position: absolute;
  left: 0%;
  top: 50%;
}
.home-footer-btn:hover{
  color: #fff;
  background: #31036c;
}
.team-link{
  color: #fff !important;
  font-weight: 600;
  text-decoration: none;
}
.team-link:hover{
  color: #31036c !important;
  text-decoration: none;
}
.whatsapp-icon{
  font-size: 32px;
  vertical-align: middle;
  margin-right: 5px;
}
.home-footer-head1{
  color: #09e6f1 !important;
}
.staffhound-goto {
  font-family: var(--font);
  font-size: 18px;
  z-index: 11000;
  /* display: none; */
  transition: 0.25s ease-in;
  /* position: fixed;
    left: 50%;
    top: 95%;
    transform: translate(-58%, -50%); */
  color: #fff;
}

.staffhound-link {
  font-family: var(--font);
  list-style: none;
  color: #fff;
  margin-right: 5px;
}
.staffhound-heading{
    font-family: var(--font);
      transition: 0.25s ease-in;
      position: fixed;
      left: 5%;
      top: 25%;
      color: #fff;
      text-align: left;
      animation: myfadeIn .25s ease-in forwards;
}

.staffhound-headings {
  display: none;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #f9bd41;

    position: fixed;
}

.staffhound-logo {
  font-family: var(--font);
  color: #fff;
  font-size: 70px;
  font-weight: bolder;
}

.staffhound-content {
  font-family: var(--font);
  font-size: 40px;
  width: 70%;
}

/* .staffhound-link:hover{
  text-decoration: none;
  color: rgb(226, 226, 226);
} */
.staffhound-web {
  display: flex;
  padding: 0 !important;
  /* margin: 0px 0px 0px !important;
  padding: 0px 0px 0px 12px !important; */
}

#heading2 {
  font-size: 95px !important;
}

.home-washbutler-links-content {
    text-align: left;
  font-family: var(--font);
  z-index: 12000;
  display: none;
  transition: 0.25s ease-in;
  position: fixed;
  left: 5%;
  top: 75%;
  /* transform: translate(-50%, -50%); */
  color: #fff;
  /* padding: 55px 0px;
  width: 75%; */
  animation: myfadeIn .25s ease-in forwards;
}

.washbutler-goto {
  font-family: var(--font);
  font-size: 18px;
  z-index: 11000;
  /* display: none; */
  transition: 0.25s ease-in;
  /* position: fixed;
    left: 50%;
    top: 95%;
    transform: translate(-58%, -50%); */
  color: #fff;
}

.washbutler-link {
  font-family: var(--font);
  list-style: none;
  color: #fff;
  margin-right: 5px;
}


.washbutler-heading{
    font-family: var(--font);
      transition: 0.25s ease-in;
      position: fixed;
      left: 5%;
      top: 25%;
      color: #fff;
      text-align: left;
      animation: myfadeIn .25s ease-in forwards;
}

.washbutler-headings {
  display: none;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #00a2e1;

    position: fixed;
}
.washbutler-logo {
  font-family: var(--font);
  color: #fff;
  font-size: 70px;
  font-weight: bolder;
}

.washbutler-content {
  font-family: var(--font);
  font-size: 40px;
  width: 73%;
}

.washbutler-web {
  display: flex;
  padding: 0 !important;
  /* margin: 0px 0px 0px !important;
  padding: 0px 0px 0px 12px !important; */
}

#heading3 {
  font-size: 95px;
}

.testimonials-sec {
  margin-top: 130px;
}

.testimonials-head {
  margin-top: 1em;
  font-family: var(--font);
  font-weight: 600;
  text-align: center;
  color: #fff;
  font-size: 60px;
  /* transform: translate(-50%, -50%); */
}

.home-qoute-content {
  padding: 0 !important;
  color: #fff;
  margin-top: 10px;
  font-family: var(--font);
  font-size: 40px;
  width: 80%;
  text-align: left;
  margin-left: 80px;
}

.test-portfolio {
  margin-top: 2rem;
  display: flex;
  align-items: center;
  margin-left: 80px;
}

.portfolio-content {
  margin-left: 20px;
}

.portfolio-img {
  border-radius: 50%;
  width: 90%;
}

.portfolio-head {
  color: #fff;
  text-align: left;
  font-weight: 600;
  font-family: var(--font);
  font-size: 23px;
}

.portfolio-pos {
  padding: 0 !important;
  /* font-family: var(--font); */
  font-size: 15px;
}

.home-services-content {
  width: 70%;
  font-size: 18px;
  z-index: 13000;
  display: none;
  transition: 0.25s ease-in;
  position: fixed;
  left: 50%;
  top: 90%;
  transform: translate(-50%, -50%);
  color: #fff;
}

.homeSireStarters {
  width: 80%;
  font-size: 18px;
  z-index: 12000;
  display: none;
  transition: 0.25s ease-in;
  position: fixed;
  left: 55%;
  top: 85%;
  transform: translate(-58%, -60%);
  color: #fff;
  animation: myfadeIn .25s ease-in forwards;
}

#about-head {
  font-size: 61px;
  width: 85%;
}

#heading5 {
  font-size: 90px;
  width: 95%;
}

.home-btn {
  font-family: var(--font);
  transition: 0.25s ease;
  border: 3px solid var(--white);
  text-decoration: none;
  color: var(--white);
  /* margin-left: 35px; */
  padding: 10px 27px;
  font-weight: 600;
  background: transparent;
  margin-top: 25px;
}

.home-btn:hover {
  font-family: var(--font);
  transition: 0.25s ease;
  text-decoration: none;
  background: var(--white);
  color: var(--black);
}

.intro {
  min-height: 100vh;
  padding: 0 0;
}

.intro p {
  color: #fff;
  padding: 40px 0 0 0;
}

/* .preloader {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: fixed;
  z-index: 9999999;
  background-color: #000;
  animation: myfadeOut 2s ease-in forwards;
  animation-delay: 1s;
} */

.preloader-img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99999999;
  width: 2400px;
  animation: mymove 1s ease-in forwards;
  animation-delay: 1s;
}

html.fp-enabled,
.fp-enabled body {
  margin: 0;
  padding: 0;
  overflow: hidden;

  /*Avoid flicker on slides transitions for mobile phones #336 */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.fp-section {
  position: relative;
  -webkit-box-sizing: border-box;
  /* Safari<=5 Android<=3 */
  -moz-box-sizing: border-box;
  /* <=28 */
  box-sizing: border-box;
}

.fp-slide {
  float: left;
}

.fp-slide,
.fp-slidesContainer {
  height: 100%;
  display: block;
}

.fp-slides {
  z-index: 1;
  height: 100%;
  overflow: hidden;
  position: relative;
  -webkit-transition: all 0.3s ease-out;
  /* Safari<=6 Android<=4.3 */
  transition: all 0.3s ease-out;
}

.fp-section.fp-table,
.fp-slide.fp-table {
  display: table;
  table-layout: fixed;
  width: 100%;
}

.fp-tableCell {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  height: 100%;
}

.fp-slidesContainer {
  float: left;
  position: relative;
}

.fp-controlArrow {
  /* -webkit-user-select: none; webkit (safari, chrome) browsers */
  /* -moz-user-select: none; /* mozilla browsers */
  /* -khtml-user-select: none; webkit (konqueror) browsers */
  /* -ms-user-select: none; IE10+ */
  position: absolute;
  z-index: 4;
  top: 50%;
  cursor: pointer;
  width: 0;
  height: 0;
  border-style: solid;
  margin-top: -38px;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.fp-controlArrow.fp-prev {
  left: 15px;
  width: 0;
  border-width: 38.5px 34px 38.5px 0;
  border-color: transparent #fff transparent transparent;
}

.fp-controlArrow.fp-next {
  right: 15px;
  border-width: 38.5px 0 38.5px 34px;
  border-color: transparent transparent transparent #fff;
}

.fp-scrollable {
  overflow: hidden;
  position: relative;
}

.fp-scroller {
  overflow: hidden;
}

.iScrollIndicator {
  border: 0 !important;
}

.fp-notransition {
  -webkit-transition: none !important;
  transition: none !important;
}

#fp-nav {
  position: fixed;
  z-index: 100;
  top: 50%;
  opacity: 1;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translate3d(0, -50%, 0);
}

#fp-nav.fp-right {
  right: 17px;
}

#fp-nav.fp-left {
  left: 17px;
}

.fp-slidesNav {
  position: absolute;
  z-index: 4;
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  left: 0 !important;
  right: 0;
  margin: 0 auto !important;
}

.fp-slidesNav.fp-bottom {
  bottom: 17px;
}

.fp-slidesNav.fp-top {
  top: 17px;
}

/* #fp-nav ul,
.fp-slidesNav ul {
  margin: 0;
  padding: 0;
}
#fp-nav ul li,
.fp-slidesNav ul li {
    display: block;
    width: 14px;
    height: 13px;
    margin: 7px;
    position:relative;
}
.fp-slidesNav ul li {
    display: inline-block;
}
#fp-nav ul li a,
.fp-slidesNav ul li a {
    display: block;
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    cursor: pointer;
    text-decoration: none;
}
#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span{
    height: 12px;
    width: 12px;
    margin: -6px 0 0 -6px;
    border-radius: 100%;
 } */
/* #fp-nav ul li a span,
.fp-slidesNav ul li a span {
    border-radius: 50%;
    position: absolute;
    z-index: 1;
    height: 4px;
    width: 4px;
    border: 0;
    background: #333;
    left: 50%;
    top: 50%;
    margin: -2px 0 0 -2px;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
} */
/* #fp-nav ul li:hover a span,
.fp-slidesNav ul li:hover a span{
    width: 10px;
    height: 10px;
    margin: -5px 0px 0px -5px;
} */
/* #fp-nav ul li .fp-tooltip {
    position: absolute;
    top: -2px;
    color: #fff;
    font-size: 14px;
    font-family: sans-serif;
    white-space: nowrap;
    max-width: 220px;
    overflow: hidden;
    display: block;
    opacity: 0;
    width: 0;
    cursor: pointer;
} */
/* #fp-nav ul li:hover .fp-tooltip,
#fp-nav.fp-show-active a.active + .fp-tooltip {
    -webkit-transition: opacity 0.2s ease-in;
    transition: opacity 0.2s ease-in;
    width: auto;
    opacity: 1;
}
#fp-nav ul li .fp-tooltip.fp-right {
    right: 20px;
}
#fp-nav ul li .fp-tooltip.fp-left {
    left: 20px;
} */
.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell {
  height: auto !important;
}

.fp-responsive .fp-auto-height-responsive.fp-section,
.fp-responsive .fp-auto-height-responsive .fp-slide,
.fp-responsive .fp-auto-height-responsive .fp-tableCell {
  height: auto !important;
}

/*Only display content to screen readers*/
.fp-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* --- Navbar --- */

.header {
  position: fixed;
  top: 0;
  z-index: 999999;
}

.brand {
  width: 100px;
}
.brand2 {
  width: 80px;
}
.brand1 {
  width: 100px;
}
.navbar-inactive {
  display: flex;
  position: fixed;
  right: 80px;
  top: 25px;
  list-style: none;
  padding: 15px;
  transition: 0.25s ease-in;
}

.logo-inactive {
  position: absolute;
  top: 25px;
  text-decoration: none;
  color: #fff;
  margin-left: 20px;
  padding: 20px;
  font-size: 20px;
  transition: 0.25s ease-in;
}

.logo-inactive:hover {
  text-decoration: none;
  color: #fff;
}

#link {
  margin-right: 25px;
  text-decoration: none;
  color: #fff;
  font-size: 18px;
}

#link:hover {
  text-decoration: none;
  color: rgb(214, 214, 214);
}

.logo-scroll-active {
  margin-left: 15px;
  padding: 0px;
  transition: 0.25s ease-in;
}

.navbar-scroll-active {
  position: fixed;
  right: 0px;
  /* top: 11x; */
  padding: 0;
  transition: 0.25s ease-in;
}

.toggler {
  transform: rotate(90deg);
  position: fixed;
  top: 20px;
  right: 44px;
  z-index: 2;
}

.toggle-icon {
  background-color: #4900a7;
  display: inline-flex;
  width: 3px;
  margin-left: 3px;
}

/* --- sections --- */

/* .fp-completely { animation: fadeIn 5s;
    -webkit-animation: fadeIn 5s;
    -moz-animation: fadeIn 5s;
    -o-animation: fadeIn 5s;
    -ms-animation: fadeIn 5s;
} */
.active {
  animation: fadeIn 0.5s;
  -webkit-animation: fadeIn 0.5s;
  -moz-animation: fadeIn 0.5s;
  -o-animation: fadeIn 0.5s;
  -ms-animation: fadeIn 0.5s;
}

@keyframes fadeIn {
  0% {
    opacity: 0.75;
  }

  100% {
    opacity: 1;
  }
}

.covid-home-img {
  z-index: 100;
  transition: 0.5s ease-in;
  transition-delay: 5s;
  display: none;
  width: 735px;
  position: fixed;
  top: 55%;
  left: 68%;
  transform: translate(-50%, -50%);
  animation: myfadeIn .25s ease-in forwards;
}

/* .staffhound-home-phone{
    z-index: 110;
    transition: 0.5s ease-in;
    transition-delay: 5s;
    display: none;
    width: 750px;
    position: fixed;
    top: 55%;
    left: 68%;
    transform: translate(-50% , -50%);
} */
.staffhound-home-img {
  z-index: 100;
  transition: 0.5s ease-in;
  transition-delay: 5s;
  display: none;
  width: 750px;
  position: fixed;
  top: 55%;
  left: 68%;
  transform: translate(-50%, -50%);
  animation: myfadeIn .15s ease-in forwards;
}

.washbutler-home-img {
  z-index: 100;
  transition: 0.5s ease-in;
  transition-delay: 5s;
  display: none;
  width: 320px;
  position: fixed;
  top: 55%;
  left: 79%;
  transform: translate(-50%, -50%);
  animation: myfadeIn .15s ease-in forwards;
}

.washbutler-home-img2 {
  z-index: 1;
  transition: 0.5s ease-in;
  transition-delay: 5s;
  display: none;
  position: fixed;
  transform: translate(-50%, -50%);
  left: 68%;
  width: 350px;
  top: 55%;
  animation: myfadeIn .15s ease-in forwards;
}

.images {
  z-index: 100;
  transition: 0.5s ease-in;
  transition-delay: 5s;
  display: none;
  width: 470px;
  position: fixed;
  top: 50%;
  left: 80%;
  transform: translate(-50%, -50%);
}

.heading0 {
  z-index: 10000;
  font-size: 87px;
   animation: myfadeIn .25s ease-in forwards; 
  /* animation-delay: 2s;
  animation-name: fadeInText;
  animation-duration: 1s ; */
}

#img0 {
  width: 470px;
  z-index: -1;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#img4 {
  width: 350px;
}

.data-active-img {
  display: block;
  opacity: 0;
  animation: myfadeIn 0.5s ease-in forwards;
  animation-delay: 3s;
}

.data-active-heading {
  display: block;
  opacity: 0;
  animation: myfadeIn 1s ease-in forwards;
  animation-delay: 2s;
}

.data-active-content {
  display: block;
  opacity: 0;
  animation: myfadeIn 1s ease-in forwards;
  animation-delay: 2s;
}

#heading1,
#heading2,
#heading3,
#heading5,
#heading6 {
  display: none;
  z-index: 9999;
  animation: myfadeIn .25s ease-in forwards;
}

#heading3 {
  color: #2b343e;
}

#heading6 {
  color: #485083;
}

.section {
  text-align: center;
}

.purple-head {
  font-family: 'Sora', sans-serif;
  color: #37017c;
  font-size: 75px;
}

.purple-head2 {
  line-height: 50px;
  font-size: 100px;
  font-family: sans-serif;
  color: #37017c;
}

#banner {
  padding: 0 !important;
  min-height: 100vh !important;
}

#home-footer {
  padding: 0;
  min-height: 100vh;
}
#home-testimonials{
  padding: 0;
  max-height: 100vh;
}
.home-footer-heading {
  font-size: 60px;
  font-family: var(--font);
  /* line-height: 80vh; */
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  width: 100%;
  display: block;
  text-align: left;
  position: absolute;
  display: block;
  left: 50%;
  top: 28%;
  transform: translate(-50%, -50%);
}

.home-footer-heading:hover {
  color: #fff;
}
/* .home-footer-heading:hover + .home-footer-arrow {
  display: block !important;
  color: green;
  font-size: 25px;
} */
.home-footer-arrow{
  color: #fff;
  font-size: 40px;
  /* display: none !important; */
}
/* .home-footer-arrow-reveal{
  display: block !important;
} */
.image-right-annimate {
  /* transition: ; */
  width: 400px;
}

.image-left-annimate {
  width: 27%;
}

/* #section1{
  background: linear-gradient(170deg ,#a4c8db 10%,#e6e9ef 40%,#9faad3) !important; 
} */



.about-us-headings{
    background: #000;
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    display: none;
}
.centered-headings {
  width: 100%;
  font-family: var(--font);
  font-size: 90px;
  font-weight: 600;
  color: #fff;
  /* margin: 0; */
  /* padding: 40px 0 0 0; */
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
/* #section3:hover{
    -webkit-filter: blur(4px); Chrome, Safari, Opera
    filter: blur(4px);
} */
/* #section4{
  background-image: url(../img/flame-bg.jpg) !important;
  background-size: cover !important;
  background-position: 50% !important;
} */
/* #section5{
  background: linear-gradient(to bottom right,#e62542,#c8102e 40%,#950b38) !important; 
} */
/* #section6{
  background: linear-gradient(170deg ,#a4c8db 10%,#e6e9ef 40%,#9faad3) !important; 
} */
#section6 {
  background: var(--purple) !important;
}

/* .carousel-1{
  background-color: #a9803b !important;
} */
.slide1-heading {
  color: #fff;
  text-align: left;
  font-family: var(--font);
  font-size: 40px;
}

.slide2-heading {
  color: #fff;
  text-align: left;
  font-family: fantasy;
  font-size: 40px;
}

.slide3-heading {
  color: #fff;
  text-align: left;
  font-family: fantasy;
  font-size: 40px;
}

.carousel-content {
  font-weight: 300;
  width: 85%;
  font-family: var(--font);
  font-size: 30px !important;
  text-align: left;
  font-style: italic;
  color: #fff;
}

/* --- SERVICES --- */

body {
  -ms-overflow-style: none;
  /* for Internet Explorer, Edge */
  scrollbar-width: none;
  /* for Firefox */
  overflow-y: scroll;
}

body::-webkit-scrollbar {
  display: none;
  /* for Chrome, Safari, and Opera */
}

body,
html {
  margin: 0;
  padding: 0;
  background-color: var(--white);
}

/* --- Navbar --- */

.services-header-inactive {
  transition: 0.25s ease;
  position: fixed;
  top: 0;
  z-index: 999999;
  
  width: 100%;
  padding: 35px;
}

.services-header-active {
  transition: 0.25s ease;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 999999;
  background: #fff;
  padding: 35px;
}



.services-header-inactive .brand-active{
  display: none;
}
.services-header-inactive.services-header-active .brand-active{
  display: block;
}
.services-header-inactive.services-header-active .projects-nav-link{
  color: #000;
}
.services-header-inactive.services-header-active .projects-toggle-icon{
    background-color: var(--purple);
}
.services-header-inactive.services-header-active .brand-inactive{
  display: none;
}

.services-header-inactive .brand-inactive{
  display: block;
}




.logo-inactive .home-brand-active{
  display: none;
}
.logo-inactive.logo-scroll-active .home-brand-active{
  display: block;
}
.logo-inactive.logo-scroll-active .home-brand-inactive{
  display: none;
}

.logo-inactive .home-brand-inactive{
  display: block;
}





.services-navbar-inactive {
  position: absolute;
  right: 80px;
  top: 15px;
  list-style: none;
  padding: 15px;
  transition: 0.25s ease-in;
}
.logo-inactive {
  position: absolute;
  top: 25px;
  text-decoration: none;
  color: #fff;
  margin-left: 20px;
  padding: 20px;
  font-size: 20px;
  transition: 0.25s ease-in;
}
.services-logo-inactive {
  position: absolute;
  top: 20px;
  text-decoration: none;
  color: #000;
  margin-left: 20px;
  padding: 20px;
  font-size: 20px;
  transition: 0.25s ease-in;
}
.services-logo-active {
  margin-left: 0px;
  padding: 0px;
  transition: 0.25s ease-in;
}


.brand {
  width: 80px;
}
.services-navbar-active {
  position: fixed;
  right: 0;
  padding: 0;
  transition: 0.25s ease-in;
}

.service-link {
  text-decoration: none;
  color: #000;
  font-size: 18px;
  margin-right: 10px;
}

.service-link:hover {
  text-decoration: none;
  color: var(--hover);
}

.projects-nav-link {
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  margin-right: 10px;
}

.projects-nav-link:hover {
  text-decoration: none;
  color: var(--hover);
}
.services-toggler {
  transform: rotate(90deg);
  position: fixed;
  top: 20px;
  right: 44px;
  z-index: 1;
}

.services-toggler-active {
  transform: rotate(180deg);
}

.services-toggle-icon {
  background-color: var(--purple);
  display: inline-flex;
  width: 3px;
  margin-left: 3px;
}
.projects-toggle-icon{
  background-color: #fff;
  display: inline-flex;
  width: 3px;
  margin-left: 3px;
}
.projects-toggle-icon-active{
  background-color: var(--purple);
}

#right-img1 {
  display: flex;
  justify-content: right;
  vertical-align: middle;
  position: relative;
   height: 510px; 
  z-index: 4;
  /* text-align: right; */
}
#right-img2 {
  display: flex;
  justify-content: right;
  vertical-align: middle;
  position: relative;
  height: 455px;
  z-index: 4;
  /* text-align: right; */
}
#right-img3 {
  display: flex;
  justify-content: right;
  vertical-align: middle;
  position: relative;
  height: 500px;
  z-index: 4;
  /* text-align: right; */
}
#right-img4 {
  display: flex;
  justify-content: right;
  vertical-align: middle;
  position: relative;
    height: 535px;
  z-index: 4;
  /* text-align: right; */
}


#svg-1{
  width: 80%;
  animation: dance 1s infinite alternate;
}
#svg-2{
  width: 75%;
  animation: dance 1s infinite alternate;
}
#svg-3{
  width: 78%;
  animation: dance 1s infinite alternate;
}
#svg-4{
  width: 80%;
  animation: dance 1s infinite alternate;
}
.services-li{
  list-style: none;
}
.services-li::before{
  content: "";
    display: inline-block;
    background-color: #fff;
    width: 2px;
    height: 15px;
    margin-left: 10px;
    margin-right: 20px;
    transform: rotate(90deg);
}
/* .right-image svg {
    max-width: 100%;
  z-index: 10;
  position: absolute;
  -webkit-animation: mover 2s infinite alternate;
  animation: mover 2s infinite alternate;
} */

/* --- Active Page --- */

/* .active{
        background-color: #ae0000;
        color: #000;
      } */

/* --- section - 1 --- */

.services-section-1 {
  z-index: 2;
  position: relative;
  margin-top: 150px;
  padding-bottom: 100px;
  background: #ffff;
}

.services-content {
  margin-top: 20px;
  font-size: 20px;
  font-weight: 600;
}

.main-heading {
  font-weight: 600;
  font-size: 75px;
  font-family: var(--font);
  color: #161616;
}

.service-list {
  padding: 0;
  /* list-style: none; */
  margin-top: 40px;
}

/* .service-list li{
        list-style: none;
        
      } */
.services-chat-btn {
  transition: 0.25s ease;
  border: 3px solid var(--purple);
  text-decoration: none;
  color: var(--purple);
  /* margin-left: 35px; */
  padding: 22px 42px;
  font-weight: 500;
  background: var(--white);
  margin-top: 25px;
}

.services-chat-btn:hover {
  transition: 0.25s ease;
  text-decoration: none;
  background: var(--purple);
  color: white;
}

/* --- Purple section --- */

.transform-section-red {
  z-index: 3;
  padding: 50px 0;
  position: relative;
}

.transform-section-red::before {
  content: "";
  position: absolute;
  top: -80px;
  background: var(--purple);
  height: 300px;
  width: 100%;
  transform: skewY(-4deg);
  z-index: 0;
}

.transform-section-red::after {
  content: "";
  position: absolute;
  bottom: -160px;
  background: var(--purple);
  height: 300px;
  width: 100%;
  transform: skewY(4deg);
}

.red-section {
  z-index: 2;
  background: var(--purple);
  color: #fff;
  padding-bottom: 80px;
  position: relative;
}
.red-section::after {
  content: "";
  z-index: 1;
  height: 100px;
  background: var(--purple);
  position: absolute;
  left: 0;
  width: 100%;
  bottom: -60px;
}

.bottom-content {
  margin-top: 40px;
  font-size: 20px;
  font-weight: 600;
}

.bottom-headings {
  padding-top: 15px;
  font-size: 55px;
  font-family: var(--font);
  
}
#small-svg-1{
  width: 60px;
}
#small-svg-2{
  width: 60px;
}
#small-svg-3{
  width: 60px;
}
#small-svg-4{
  width: 60px;
}
/* --- Black section --- */

.grey-section {
  position: relative;
  z-index:2;
  background: var(--black);
  color: #fff;
  padding-bottom: 80px;
}
.grey-section::after{
  content: "";
  z-index: 2;
  background: var(--black);
  height: 125px;
  position: absolute;
  left: 0;
  width: 100%;
  bottom: -60px;
}

.transform-section-grey {
  z-index: 3;
  padding: 50px 0;
  position: relative;
}

.transform-section-grey::before {
  content: "";
  position: absolute;
  top: -62px;
  background: var(--black);
  height: 300px;
  width: 100%;
  transform: skewY(4deg);
}

.transform-section-grey::after {
  content: "";
  position: absolute;
  bottom: 0px;
  background: var(--black);
  height: 130px;
  width: 100%;
  transform: skewY(-4deg);
}

.development-process {
  min-height: 100vh;
  background-color: var(--complementry);
  z-index: 5;
  position: relative;
  padding-top: 55px;
}

.transform-development-section {
  z-index: 3;
  padding: 50px 0;
  position: relative;
}

.transform-development-section::before {
  content: "";
  position: absolute;
  top: -25px;
  background: var(--complementry);
  height: 300px;
  width: 100%;
  transform: skewY(4deg);
}

.transform-development-section::after {
  content: "";
  position: absolute;
  bottom: -1px;
  background: var(--complementry);
  height: 52px;
  width: 100%;
  transform: skewY(0deg);
}

.development-process-imgs {
  margin-top: 200px;
}

.development-head {
  color: #fff;
  font-family: var(--font);
  font-size: 50px;
  text-align: center;
  margin: 50px 0px 20px 0px;
}

.development-process-content {
  /*font-family: var(--font);*/
  /*font-weight: 300;*/
  font-size: 22px;
  color: #fff;
  margin-top: 100px;
  text-align: center;
}

.process-img {
  width: 100px;
  text-align: center;
}

.process-img2 {
  width: 70%;
}

.process-img3 {
  width: 70%;
}

.process-img4 {
  margin: 10px 0px;
  width: 70%;
}

.process-img5 {
  margin: 16px 3px;
  width: 70%;
}

.process-img6 {
  width: 70%;
  margin-left: 23px;
}

.process-images {
  margin-top: 80px;
  text-align: center;
}

.development-sub-head {
  font-weight: 300;
  margin-top: 35px;
  color: #fff;
  font-size: 25px;
  font-family: var(--font);
  text-align: center;
}

/* --- Services Footer --- */

.services-footer {
  background: var(--purple);
  min-height: 100vh;
}

.services-footer  .footer-inner {
    min-height: 100vh;
    position: relative;
}

.footer-inner .footer-form {
    /* position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); */
    padding-top: 100px;
}

.services-footer-head-link {
  font-size: 20px;
  font-family: var(--font);

  font-weight: 500;
  color: #fff;
  text-decoration: none;
}
.services-footer-heading:hover{
  color: #fff;
}
.services-footer-heading .services-footer-arrow{
  color: #fff;
  font-size: 55px;
  
}
/* .services-footer-heading:hover .services-footer-arrow{
  display: inline ;
} */
.services-footer-active {
  background: #000;
}

.services-footer-heading {
  font-size: 65px;
  font-family: var(--font);
  
  font-weight: 500;
  color: #fff;
  text-decoration: none;
}
.pages-footer-head1{
  color: #09e6f1 !important;
  font-size: 60px;
}
.services-footer-list {
  padding: 0;
  list-style: none;
  display: flex;
  position: absolute;
  bottom: 40px;
  left: 0;
}

.home-services-footer-list {
  padding: 0;
  list-style: none;
  display: flex;
  position: absolute;
  bottom: 30px;
  left: 0;
}

.home-footer-link {
  color: white;
  font-weight: 600;
  margin-right: 25px;
  font-size: 15px;
}
.home-footer-icon{
  color: white;
  font-size: 23px;
  font-weight: 600;
  margin-right: 25px;
}
.home-footer-icon:hover{
  color: white;
}
.home-footer-link:hover {
  text-decoration: none;
  color: var(--hover);
}

.home-services-footer-list2 li:last-child a {
  margin-right: 0;
}

.services-footer-link {
  /* text-decoration: none;   */
  color: white;
  font-size: 17px;
  font-weight: 600;
  margin-right: 20px;
}

.services-footer-icon {
  /* text-decoration: none;   */
  color: white;
  font-size: 23px;
  font-weight: 600;
  margin-right: 25px;
}

.services-footer-link:hover {
  text-decoration: none;
  color: var(--hover);
}

.services-footer-icon:hover {
  text-decoration: none;
  color: var(--hover);
}

.services-footer-list2 {
  padding: 0;
  list-style: none;
  display: flex;
  position: absolute;
  bottom: 30px;
  right: 0;

}

.home-services-footer-list2 {
  right: 0;
  padding: 0;
  list-style: none;
  display: flex;
  font-size: 24px;
  position: absolute;
  bottom: 30px;
}

/* .service-list li::before{
        content: " ";
        width: 5px;
        background: var(--purple);
        height: 2px;
        margin-top: 1px;
      } */
/* --- Active Page --- */
#active-page {
  background-color: var(--purple);
   border-radius:15px; 
  color: #fff;
}
#projects-page {
  background-color: var(--purple);
  /* border-radius: 5%; */
  color: #000;
}
.home-copyright{
    position: absolute;
    bottom: 10px;
    width: 100%;
    text-align: right;
    padding: 0 !important;
}
.copyright {
  color: #fff;
  width: 100%;
  position: absolute;
  bottom: 0;
  /* right: 0; */
  text-align: right;
}
.contact-copyright {
  color: #fff;
  width: 100%;
  text-align: right;
  
}
@keyframes mymove {
  from {
    width: 2400px;
  }

  to {
    width: 0px;
    z-index: -100;
    
  }
}

@keyframes myfadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes myfadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* --- Projects --- */

/* .projects-left-heading{
  position: absolute;
  left: 10px;
} */

.projects-section-1 {
      min-height: 100vh;
      /* padding-bottom: 130px; */
      padding-top: 115px;
      /* padding-bottom: 85px; */
      z-index: 4;
      position: relative;
      background: var(--purple);
}
.section-new{
  height: 100vh;
}
.projects-content {
  margin-top: 20px;
  font-size: 20px;
  font-weight: 600;
}

.project-link {
  font-weight: 600;
  font-family: var(--font);
  text-decoration: none;
  margin-bottom: 50px;
  padding: 20px 10px;
  color: #fff;
}

.project-1 {
  z-index: 2;
  transition: 0.25s ease-in;
  position: relative;
  background: #f9bd41;
  height: 700px;
}

.project-1:hover {
  transition: 0.25s ease-in;
  background: #fcb528;
}

.first-img-left {
  transition: 0.25s ease-in;
  width: 210px;
  border-radius: 20px;
  position: absolute;
  top: 160px;
  left: 30px;
}

.first-img-right {
  transition: 0.25s ease-in;
  width: 210px;
  border-radius: 20px;
  position: absolute;
  top: 110px;
  right: 40px;
}

.second-img-left {
  transition: 0.25s ease-in;
  width: 440px;
  border-radius: 20px;
  position: absolute;
  top: 20%;
  left: 10%;
}

.second-img-right {
  transition: 0.25s ease-in;
  width: 440px;
  border-radius: 20px;
  position: absolute;
  top: 40%;
  left: 35%;
}
.fourth-img-left {
  transition: 0.25s ease-in;
  width: 440px;
  border-radius: 20px;
  position: absolute;
  top: 20%;
  left: 10%;
}

.fourth-img-right {
  transition: 0.25s ease-in;
  width: 440px;
  border-radius: 20px;
  position: absolute;
  top: 40%;
  left: 35%;
}
.fourth-img-left-active {
  transition: 0.25s ease-in;
  left: 35%;
}

.fourth-img-right-active {
  transition: 0.25s ease-in;
  left: 10%;
}



.sixth-img-left {
  transition: 0.25s ease-in;
  width: 440px;
  border-radius: 20px;
  position: absolute;
  top: 20%;
  left: 10%;
}

.sixth-img-right {
  transition: 0.25s ease-in;
  width: 440px;
  border-radius: 20px;
  position: absolute;
  top: 40%;
  left: 35%;
}
.sixth-img-left-active {
  transition: 0.25s ease-in;
  left: 35%;
}

.sixth-img-right-active {
  transition: 0.25s ease-in;
  left: 10%;
}
.project-2 {
  z-index: 3;
  transition: 0.25s ease-in;
  position: relative;
  background: #fb3b4c;
  height: 700px;
  overflow: hidden;
}

.project-2:hover {
  transition: 0.25s ease-in;
  background: #fd5361;
}

#animated-img2 {
  display: flex;
  justify-content: center;
}

.project-3 {
  z-index: 5;
  transition: 0.25s ease-in;
  position: relative;
  background: #00a2e1;
  height: 700px;
}

.project-3:hover {
  transition: 0.25s ease-in;
  background: #30c4ff;
}

.third-img-left {
  transition: 0.25s ease-in;
  width: 210px;
  border-radius: 20px;
  position: absolute;
  top: 160px;
  left: 30px;
}

.third-img-right {
  transition: 0.25s ease-in;
  width: 210px;
  border-radius: 20px;
  position: absolute;
  top: 110px;
  right: 40px;
}

.project-4 {
  z-index: 6;
  transition: 0.25s ease-in;
  position: relative;
  background: linear-gradient(180deg, #4d1c4b 16%, #dd44d8);
  height: 700px;
  overflow: hidden;
}

/* .fourth-img-left {
  transition: 0.25s all ease-in;
  width: 700px;
  border-radius: 20px;
  position: absolute;
  top: 200px;
  left: 30px;
}

.fourth-img-right {
  transition: 0.25s all ease-in;
  width: 700px;
  border-radius: 20px;
  position: absolute;
  top: 100px;
  left: 40%;
} */

.project-5 {
  z-index: 7;
  position: relative;
  background: linear-gradient(180deg, #fbc919 16%, #ffd43e);
  height: 700px;
  overflow: hidden;
}

.fifth-img-left {
  transition: 0.25s all ease-in;
  width: 210px;
  border-radius: 20px;
  position: absolute;
  top: 150px;
  left: 30px;
}

.fifth-img-right {
  transition: 0.25s all ease-in;
  width: 220px;
  border-radius: 20px;
  position: absolute;
  top: 100px;
  right: 40px;
}

.project-6 {
  z-index: 8;
  position: relative;
  background: linear-gradient(180deg, #f55f00 16%, #ff873b);;
  height: 700px;
  overflow: hidden;
  transition: all 0.5s ease-in;
}

/* .sixth-img-left {
  transition: 0.25s all ease-in;
  width: 210px;
  border-radius: 20px;
  position: absolute;
  top: 150px;
  left: 30px;
}

.sixth-img-right {
  transition: 0.25s all ease-in;
  width: 220px;
  border-radius: 20px;
  position: absolute;
  top: 100px;
  right: 40px;
} */

.hidden-content {
  transition: 0.25s ease-in;
  color: #ffffff;
  opacity: 0;
}

.carousel {
  width: 100% !important;
}

.projects-testimonials {
  overflow: hidden;
  background: var(--black);
  position: relative;
  min-height: 110vh;
  width: 100%;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.annimated-text{
  width: 100%;
  color: #fff;
  font-size: 30px;
}
.scroll-text{
  display: flex;
}
.scroll-text li{
  /* list-style: none; */
  margin-left: 40px;
}
#annimation{
  position: absolute;
  top: 0;
  animation: slide infinite;
  /* animation: linear infinite ; */
  animation-name: textleft;
  animation-duration: 1s;
}
#annimation2{
  top: 30%;
  position: absolute;
  animation: linear infinite ;
  animation-name: textright;
  animation-duration: 9s;
}
.slides {
  margin-left: 55px;
}

.clickable {
  position: relative;
  padding-top: 10px;
}

.projects-name {
  color: #fff;
  padding: 15px;
  font-family: var(--font);
}

.reveal-btn {
  transition: 0.25s ease-in;
  position: absolute;
  right: 10px;
  top: 35px;
  color: #fff;
  font-size: 25px;
}

.transform-projects {
  position: relative;
}

.transform-projects::before {
  content: " ";
  width: 100%;
  transform: skewY(-4deg);
}
.projects-main-heading1{
  font-size: 75px;
  font-family: var(--font);
  color: #fff;
}
.projects-main-heading2{
  font-size: 75px;
  font-family: var(--font);
  color: #fff;
  position: absolute;
  right: 10%;
}


/* --- Active Classes --- */

.reveal-content {
  opacity: 1;
}

.half-revealed-content {
  transition: 0.25s ease-in;
  opacity: 0.5;
}

.revealed-content {
  transition: 0.25s ease-in;
  opacity: 1;
}

.half-reveal-content {
  opacity: 1;
}

.reveal-btn-active {
  transition: 0.25s ease-in;
  transform: rotate(180deg);
}

.first-img-left-active {
  transition: 0.25s ease-in;
  top: 210px;
}

.first-img-right-active {
  transition: 0.25s ease-in;
  top: 90px;
}

.second-img-left-active {
  transition: 0.25s ease-in;
  left: 35%;
}

.second-img-right-active {
  transition: 0.25s ease-in;
  left: 10%;
}

.third-img-left-active {
  transition: 0.25s ease-in;
  top: 210px;
}

.third-img-right-active {
  transition: 0.25s ease-in;
  top: 90px;
}

.fourth-left-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 550px !important;
  left: 30px !important;
}

.fourth-right-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 450px !important;
  right: 40px !important;
}

/* .fourth-img-left-half-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 250px;
  left: 30px;
}

.fourth-img-right-half-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 150px;
  right: 40px;
} */

.fifth-left-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 550px !important;
  left: 30px !important;
}

.fifth-right-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 500px !important;
  right: 40px !important;
}

.fifth-img-left-half-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 200px;
  left: 30px;
}

.fifth-img-right-half-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 150px;
  right: 40px;
}

.sixth-left-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 550px !important;
  left: 30px !important;
}

.sixth-right-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 500px !important;
  right: 40px !important;
}

/* .sixth-img-left-half-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 200px;
  left: 30px;
}

.sixth-img-right-half-active {
  transition: 0.25s all ease-in;
  position: absolute;
  top: 150px;
  right: 40px;
} */

/* --- Team --- */
.team-main {
  padding-bottom: 185px;
  position: relative;
  background: var(--white);
  z-index: 2;
  padding-top: 160px;
}

.team-banner-content {
  width: 60%;
  font-size: 18px;
  margin-top: 30px;
}

.team-btn {
  /* font-family: var(--font); */
  transition: 0.25s ease;
  border: 3px solid var(--purple);
  text-decoration: none;
  color: var(--purple);
  /* margin-left: 35px; */
  padding: 15px 50px;
  font-weight: 600;
  background: transparent;
  margin-top: 25px;
}

.team-btn:hover {
  /* font-family: var(--font); */
  transition: 0.25s ease;
  text-decoration: none;
  background: var(--purple);
  color: var(--white);
}

.team-details {
  margin-bottom: 70px;
}

.team-about-us {
  min-height: 90vh;
  position: relative;
  background: var(--purple);
  z-index: 3;
}

.team-main-heading {
    
  text-align: left;
  font-size: 80px;
  font-family: var(--font);
}

.team-sub-heading {
  font-family: var(--font);
}

.team-banner {
  position: relative;
  /* text-align: center; */
  position: absolute;
  top: 35%;
  left: 25%;
  transform: translate(-50%, -50%);
}

.team-section2 {
  width: 100%;
  position: relative;
  z-index: 2;
  background: var(--black);
}

.transform-team-section-black {
  z-index: 3;
  position: relative;
}

.transform-team-section-black::before {
  content: "";
  position: absolute;
  top: -80px;
  background: var(--black);
  height: 300px;
  width: 100%;
  transform: skewY(-4deg);
  z-index: 0;
}
.transform-team-section-black::after{
    content: "";
  position: absolute;
  bottom: -60px;
  background: var(--black);
  height: 150px;
  width: 100%;
}
.transform-team-section-purple {
  z-index: 3;
  position: relative;
  padding-bottom: 35px;
}

.transform-team-section-purple::before {
  content: "";
  position: absolute;
  top: -80px;
  background: var(--purple);
  height: 300px;
  width: 100%;
  transform: skewY(-4deg);
  z-index: 0;
}

.transform-team-section-purple::after {
  content: "";
  position: absolute;
  bottom: -160px;
  background: var(--purple);
  height: 300px;
  width: 100%;
  transform: skewY(-4deg);
  z-index: 0;
}

.about-heading-thin {
  font-size: 55px;
  color: var(--white);
  font-family: var(--font);
  margin-top: 100px;
}

.about-heading-thick {
  font-size: 55px;
  color: var(--white);
  font-family: var(--font);
  font-weight: 600;
}

.about-us-content {
  margin-top: 25px;
  color: #fff;
}

.team-images {
  padding: 40px 40px 40px 55px;
}

.team-images::after {
  background-color: #007aaa;
}

.team-img {
  width: 90%;
  border-radius: 50%;
}

.employee-name {
  font-size: 44px;
  text-align: center;
  color: #fff;
  font-family: var(--font);
}

.employee-position {
  text-align: center;
  color: #fff;
  font-family: var(--font);
}

.team-leadership {
  text-align: center;
  border-bottom: 0.5px solid #fff;
  padding-bottom: 50px;
  padding-top: 50px;
  z-index: 4;
  /*background: black;*/
  position: relative;
  /* height: 110vh; */
}

.leader-picture {
  width: 70%;
  border-radius: 50%;
}

.ceo-name {
  margin-top: 15px;
  font-size: 50px;
  color: #fff;
  font-family: var(--font);
}

.ceo-of-tekX {
  /* text-align: center; */
  color: #fff;
  font-family: var(--font);
}

.ceo-content {
  text-align: left;
  color: #fff;
  font-size: 30px;
  margin-top: 85px;
}

.core-values-main {
  padding: 100px 0px 110px 0px;
  position: relative;
  z-index: 5;
  background: var(--complementry);
}

.core-head {
  text-align: center;
  color: #fff;
  font-size: 60px;
  margin-bottom: 40px;
  font-family: var(--font);
}

.core-values {
  color: #fff;
}

.values-border {
  padding: 40px 15px;
  /*border-top: 1px solid #fff;*/
}

.core-sections {
  border-left: 1px solid #fff;
  margin: 32px 0px;
}

.home-footer-list-content {
  color: #fff;
  font-size: 17px;
  padding: 10px 0 0 0 !important;
}

/* --- Contact --- */
.contact-banner {
  margin-top: 200px;
  /* min-height: 100vh; */
  padding-bottom: 100px;
}

.contact-main-head {
  font-size: 90px;
  font-family: var(--font);
}

.contact-banner-content {
  font-size: 25px;
  margin-top: 35px;
}

.transform-contact-banner {
  background: var(--purple);
}

.transform-contact-banner2 {
  background: var(--black);
}

/* .contact-form {
  min-width: 480px;
  float: right;
} */

.contact-input {
  font-size: 18px;
  width: 100%;
  padding: 12px;
  border: 0px;
  border-bottom: 2px solid #7a7a7a;
  margin-top: 15px;
  margin-bottom: 15px;
  resize: vertical;
}

.contact-input-select {
  width: 100%;
  font-size: 18px;
  padding: 12px;
  border: 0px;
  border-bottom: 3px solid var(--purple);
  margin-top: 15px;
  margin-bottom: 15px;
  resize: vertical;
}

.contact-submit-btn {
  font-size: 20px;
  background-color: var(--purple);
  color: white;
  padding: 18px 40px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  float: right;
  margin-top: 25px;
  font-family: var(--font);

}

.contact-submit-btn:hover {
  background-color: #2e006a;
}

.contact-footer {
    padding-bottom: 50px;
   /*min-height: 95vh; */
  text-align: center;
  background: var(--purple);
}

/* .home-footer-heading{
  font-weight: 600;
  padding-top: 250px;
  font-family: var(--font) !important;
  text-align: left;
  font-size: 70px;
  color: #fff;
}
.home-footer-heading:hover{
  color: #fff;
} */
.contact-footer-head {
  font-weight: 500;
  padding-top: 150px;
  font-family: var(--font);
  text-align: left;
  font-size: 60px;
  color: #fff;

}

.contact-tekX {
  margin-top: 25px;
  text-align: left;
  color: #fff;
  font-size: 25px;
}

.contact-link {
  font-size: 25px;
  color: #fff;
  text-decoration: none;
}

.contact-link:hover {
  color: #fff;
  text-decoration: none;
}

.contact-icons-list {
  list-style: none;
  padding: 0px 15px;
}

.contact-footer-main {
  margin-bottom: 90px;
}

/*.contact-footer-icon-list {*/
/*  margin-top: 70px;*/
/*}*/

.contact-icon {
  color: #fff;
  font-size: 25px;
}

.contact-email:hover {
  text-decoration: none;
  color: #fff;
}

.contact-email {
  color: #fff;
  font-size: 22px;
  font-family: var(--font);
  margin-bottom: 10px;
}

.contact-icon:hover {
  color: #fff;
}

.contact-address-head {
  color: #fff;
  font-family: var(--font);
  font-size: 25px;
}
.home_footer_link{
    padding: 10px 0px 0px 0px !important;
    max-width: 70%;
}
.home-footer-address-head {
  color: #fff;
  font-weight: 600;
  /* margin-top:165px; */
  font-family: var(--font);
  font-size: 25px;
}

.contact-list-content {
  color: #fff;
  font-size: 17px;
  width: 70%;
}

.contact-address {
  text-align: left;

}

.home-contact-address {
  text-align: left;
  margin-top: 175px;
}

.transform-contact-banner-left {
  background-color: #00a2e1;
  width: 50%;
}
.con-email{
  text-align: left;
 display: flex;
 justify-content: end;
}
.con-icons{
  padding: 0 !important;
  text-align: left;
  display: flex;
  justify-content: end;
}
.design-ui{
  z-index: 4;
}


      /* The Staffhound  */


/* SECTION 1 */

.stf-main{
  z-index: 2;
  /* min-height: 100vh; */
  /* padding-bottom: 130px; */
  padding-top: 90px;
  padding-bottom: 335px;
  position: relative;
  background: #f9bd41;
}

.stf-sec1{
  margin-top: 150px;
}
.stf-m-head{
  color: white;
  font-size: 50px;
  font-family: var(--font);
}
.stf-m-content{
  color: #fff;
  font-size: 22px;
  font-weight: 600;
  margin-top: 1em;
  padding-right: 20px;
}
.stf-img1{
  text-align: center;
}
.stf-img1 img{
  border-radius: 20px;
  width: 360px;
  /* margin-left: 60px; */
}




/* SECTION 2 */

.yellow-section {
  z-index: 3;
  background: #092340;
  color: #fff;
  /* padding-top: 100px; */
  min-height: 570px;
  position: relative;
}
.stf-img2{
  top: -350px;
    left: 0;
  position: absolute;
  text-align: center;
}
.stf-img2 img {
  width: 610px;
  /* transform: rotate(-5deg); */
}
.yellow-section::after {
  content: "";
  z-index: 1;
  height: 100px;
  background: #092340;
  position: absolute;
  left: 0;
  width: 100%;
  bottom: -60px;
}
.transform-section-yellow {
  z-index: 3;
  padding: 50px 0;
  position: relative;
}

.transform-section-yellow::before {
  content: "";
  position: absolute;
  top: -140px;
  background: #092340;
  height: 340px;
  width: 100%;
  transform: skewY(8deg);
  z-index: 0;
}

.transform-section-yellow::after {
  content: "";
  position: absolute;
  bottom: -160px;
  background: #092340;
  height: 300px;
  width: 100%;
  transform: skewY(-8deg);
}
.stf-section2 {
  margin-top: 125px;
}
.stf-section2 h1{
  font-weight: 500;
  font-size: 30px;
  color: white;
}

.stf-section2 p{
  font-weight: 500;
  max-width: 45em;
}



/* SECTION 3 */


.transform-section-white {
  z-index: 3;
  padding-top: 50px;
  position: relative;
}

.transform-section-white::before {
  content: "";
  position: absolute;
  top: -90px;
  background: #fdf5f2;
  height: 300px;
  width: 100%;
  transform: skewY(-8deg);
  z-index: 0;
}

.transform-section-white::after {
  content: "";
  position: absolute;
  bottom: -155px;
  background: #fdf5f2;
  height: 300px;
  width: 100%;
  /* transform: skewY(8deg); */
}
.stf-section3{
  text-align: center;
  padding: 50px 245px;
}
.stf-section3 h1{
  font-weight: 500;
  font-size: 22px;
  /* color: white; */
  font-size: 23px;
}

.stf-section3 p{
  display: block;
  font-weight: 500;
  margin-top: 20px;
  font-size: 16px;
}

.white-section {
  position: relative;
  z-index:2;
  background: #fdf5f2;
  color: #2b343e;
  height: 1000px;
  padding-bottom: 20px;
  padding-top: 150px;
}
.stf-img3{
  top: -280px;
    left: 0;
  position: absolute;
  text-align: center;
}
.stf-img3 img {
  width: 610px;
  transform: rotate(8deg);
}
.stf-sec3-img{
  text-align: center;
  overflow: hidden;
}
.stf-sec3-img img{ 
  width: 500px;
}


/* SECTION 4 */

.black-section {
  position: relative;
  z-index:2;
  background: #2b343e;
  color: #fff;
  min-height: 350px;
  padding-bottom: 20px;
  /* padding-top: 150px; */
}
.transform-section-black {
  z-index: 3;
  /* padding-bottom: 50px; */
  position: relative;
}

.transform-section-black::before {
  content: "";
  position: absolute;
  top: -60px;
  background: #2b343e;
  height: 300px;
  width: 100%;
  /* transform: skewY(-8deg); */
  z-index: 0;
}

/* .transform-section-black::after {
  content: "";
  position: absolute;
  bottom: -155px;
  background: #fff;
  height: 300px;
  width: 100%;
  transform: skewY(8deg);
} */
.stf-section4{
  text-align: center;
  padding: 50px 245px;
}
.stf-section4 h1{
  font-weight: 500;
  font-size: 22px;
  /* color: white; */
  font-size: 23px;
}

.stf-section4 p{
  display: block;
  font-weight: 500;
  margin-top: 20px;
  font-size: 16px;
}

.stf-sec5{
  display: flex;
  z-index: 3;
  padding: 0;

  position: relative;
  min-height: 80vh;
  background-color: #00a2e1;
}
.stf-previous{
  min-height: 100vh;
  background: #ff873b;
}
.stf-previous:hover{
  background: #ff873b;
  color: #fff;
}

.stf-next{
  min-height: 100vh;
  background: #fb3b4c;
}
.stf-next:hover{
  background: #fb3b4c;
  color: #fff;
}

.page-change{
  padding: 5.8823529412vw 5.8823529412vw 2.9411764706vw;
  font-weight: 600;
  width: 50%;
  /* min-height: 46.875vw; */
  font-size: 1.3125rem;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  color: #fff;
}
/* .page-change:hover{
  color: rgb(212, 211, 211);
} */

.linkssss{
  list-style: none;
  margin: 0px;
  padding: 0px;
  display: flex;

}
.linkssss li{
  text-align: center;
}
.btnLogo{
  width: 400px;
}
#next-project{
  text-align: right;
}


  /* WSAHBUTLER  */



.wsb-main{
    z-index: 2;
    /* min-height: 100vh; */
    /* padding-bottom: 130px; */
    padding-top: 90px;
    padding-bottom: 335px;
    position: relative;
    background: #00a0dc;
}
.wsb-previous{
  min-height: 100vh;
  background: #fb3b4c;
}
.wsb-previous:hover{
  background: #fb3b4c;
  color: #fff;
}


.wsb-next{
  min-height: 100vh;
  background: #9a3a99;
}
.wsb-next:hover{
  background: #893388;
  color: #fff;
}
.wsb-img1{
  text-align: center;
}
.wsb-img1 img{
  border-radius: 20px;
  width: 360px;
  /* margin-left: 60px; */
}

/* SECTION 2 */

.wsb-sec2 {
  z-index: 3;
  background: #2b343e;
  color: #fff;
  /* padding-top: 100px; */
  height: 100vh;
  position: relative;
  overflow: hidden;
}
/* .wsb-sec2::after {
  content: "";
  z-index: 1;
  height: 100px;
  background: #092340;
  position: absolute;
  left: 0;
  width: 100%;
  bottom: -60px;
} */
.transform-section-wsb1 {
  z-index: 3;
  padding: 50px 0;
  position: relative;
}

.transform-section-wsb1::before {
  content: "";
  position: absolute;
  top: -140px;
  background: #2b343e;
  height: 340px;
  width: 100%;
  transform: skewY(-4deg);
  z-index: 0;
}

.transform-section-wsb1::after {
  content: "";
  position: absolute;
  bottom: -160px;
  background: #2b343e;
  height: 370px;
  width: 100%;
  transform: skewY(4deg);
}
/* .wsb-img2{
  top: -350px;
    left: 0;
  position: absolute;
  text-align: center;
} */
.wsb-img2 img {
  width: 360px;
}

/* SECTION 3  */

.wsb-sec3 {
  position: relative;
  z-index:2;
  background: #ecf1ff;
  color: #2b343e;
  height: 1000px;
  padding-bottom: 20px;
  /* padding-top: 150px; */
}
.transform-section-wsb2 {
  z-index: 3;
  padding-top: 50px;
  position: relative;
}

.transform-section-wsb2::before {
  content: "";
  position: absolute;
  top: -90px;
  background: #ecf1ff;
  height: 300px;
  width: 100%;
  transform: skewY(4deg);
  z-index: 0;
}

.transform-section-wsb2::after {
  content: "";
  position: absolute;
  bottom: -155px;
  background: #ecf1ff;
  height: 300px;
  width: 100%;
  transform: skewY(-4deg);
}
.wsb-img3{
  top: -280px;
    left: 0;
  position: absolute;
  text-align: center;
}
.wsb-img3 img {
  width: 610px;
  transform: rotate(8deg);
}
.wsb-sec3-img{
  text-align: center;
  overflow: hidden;
}
.wsb-sec3-img img{ 
  width: 695px;
}





 /* STREAM COVID  */

 .str-main{
  z-index: 2;
  /* min-height: 100vh; */
  /* padding-bottom: 130px; */
  padding-top: 90px;
  padding-bottom: 15px;
  position: relative;
  background: #f51f2c;
  overflow: hidden;
}

/* SECTION 1 */
.pink-section {
  z-index: 3;
  background: #fff;
  /* color: #fff; */
  min-height: 460px;
  position: relative;
}

.transform-section-pink {
  z-index: 3;
  position: relative;
}

.transform-section-pink::before {
  content: "";
  position: absolute;
  top: -60px;
  background: #fff;
  height: 300px;
  width: 100%;
  transform: skewY(-4deg);
  z-index: 0;
}


/* SECTION 2 */

.str-section2 {
  margin-top: 125px;
}
.str-section2 h1{
  font-family: var(--font);
  font-weight: 400;
    font-size: 43px;
    color: var(--purple);
    text-transform: uppercase;
    font-style: italic;
}
.blockquote{
  color: #646464;
}
.blockquote::before{
  content: "-";
  color: #646464;
  font-size: 25px;
}






 /* SECTION 3  */

.str-section3{
  padding: 200px 0px
}
.str-section3 h1{
  font-weight: 500;
  font-size: 22px;
  color: #fff;
}
.str-section3 p{
  color: #fff;
  max-width: 75%;
  margin-top: 20px;
  font-weight: 500;
}
.blue-section {
  position: relative;
    z-index: 2;
    background: var(--purple);
    color: #2b343e;
    padding-bottom: 50px;
    padding-top: 50px;
    overflow: hidden;
}
.str-previous{
min-height: 100vh;
background: #f9bd41;
}
.str-previous:hover{
  background: #f9bd41;
color: #fff;
}

.str-next{
min-height: 100vh;

background: #00a0dc;
}
.str-next:hover{

background: #0085ba;
color: #fff;
}

.str-img1{
  text-align: left;
}

.str-img1 img{
  width: 880px;
}


/* Section 4 */
.strgrey-section {
  /* min-height: 80vh; */
  position: relative;
    z-index: 2;
    background: #2b343e;
    color: #fff;
    padding-bottom: 120px;
    padding-top: 130px;
    overflow: hidden;
}
/* .grey-section {
  position: relative;
  z-index:2;


  min-height: 350px;
  padding-bottom: 20px;
  padding-top: 150px;
} */
.str-section4{
  text-align: left;
  /* padding: 50px 245px; */
}
.str-section4 h1{
  font-weight: 500;
  font-size: 22px;
  /* color: white; */
  font-size: 23px;
}

.str-section4 p{
  display: block;
  font-weight: 500;
  margin-top: 20px;
  font-size: 16px;
}
.str-img3 img{
  width: 340px;
}

/* SECTION 5 */
.str-triple{
  background: #3b60dd;
}
.str-trip{

  overflow: hidden;
    max-height: 70vh;
    text-align: center;
    padding-top: 65px;
}
.str-trip img{
  width: 1000px;
}

/* SECTION 6  */
.str-sec6{
  background: #ecf1ff;
  padding: 120px;
}
.str-trip-head{
  text-align: right;
}
.str-trip-head h1{
  font-size: 1.625rem;
}
.str-trip-cont{
  font-size: 1.125rem;
  font-weight: 500;
}

/* BUSINESS CLASS FOR LESS  */
.bcl-main{
  z-index: 2;

  padding-top: 90px;
  padding-bottom: 15px;
  position: relative;
  background: #712a70;
  overflow: hidden;
}
.bcl-next{
  min-height: 100vh;
  background: #ff873b;
  }
.bcl-next:hover{
  background: #ff873b;
  color: #fff;
}
.bcl-previous{
  min-height: 100vh;
  background: #00a0dc;
  }
  .bcl-previous:hover{
  background: #0085ba;
  color: #fff;
  }
/* SUFI TRAVELS  */
.sft-main{
  z-index: 2;
  padding-top: 90px;
  padding-bottom: 15px;
  position: relative;
  background: #ff873b;
  overflow: hidden;
}
.sft-previous{
  min-height: 100vh;
  background: #893388;
  }
.sft-previous:hover{
  background: #893388;
  color: #fff;
}
.sft-next{
  min-height: 100vh;
  background: #f9bd41;
  }
.sft-next:hover{
  background: #f9bd41;
  color: #fff;
}
@media only screen and (min-width: 90em){
  .btnLogo{
    width: 500px;
  }
  .str-section3 h1 {
    font-size: 25px;
  }
  .str-section3 p {
    max-width: 95%;
    font-size: 18px;
  }
  .transform-section-pink::before {
    top: -70px;
  }
  .stf-section3 p {
    font-size: 20px;
  }
  .stf-section3 h1 {
    font-weight: 500;
    font-size: 22px;
    /* color: white; */
    font-size: 25px;
  }
  .stf-section4 p {
    font-size: 19px;
  }
  .stf-section4 h1 {
    font-size: 25px;
  }
  .stf-section2 p {
    font-size: 20px;
    margin-top: 20px;
  }
  .str-section3 h1 {
    font-size: 25px;
  }
  .str-section3 p {
    max-width: 85%;
    font-size: 20px;
  }
  .str-section4 p {
    font-size: 18px;
  }
  .str-section4 h1 {
    font-size: 25px;
  }
  .stf-img1 img {
    width: 425px;
  }
  .wsb-img1 img {
    width: 425px;
  }
  .stf-img2 {
    top: -380px;
  }
  .stf-img2 img {
    width: 700px;
  }
  /* .wsb-img2 img {
    width: 700px;
  } */
  .stf-img3 img {
    width: 700px;
  }
  /* .wsb-img3 img {
    width: 700px;
  } */
  .stf-img3 {
    top: -330px;
}
  .stf-section3 {
    padding: 0px 245px;
  }
  .stf-sec3-img img {
    width: 600px;
  }
  .str-img1 img {
    width: 910px;
  }
  .str-trip img {
    width: 1100px;
  }
  .yellow-section {
    min-height: 600px;
  }
}

@media (max-width: 768px) and (min-width: 416px) {
  .heading0 {
    font-size: 132px;
    top: 40%;
}
.home-footer-heading {
    font-size: 55px;

}
  #about-head {
    font-size: 66px;
    width: 85%;
    top: 40%;
}
.team-right-sec{
    padding-left: 0;
}
  #heading5 {
    font-size: 45px;
    width: 95%;
  }

  .home-content {
    width: 80%;
    font-size: 25px;
    top: 85%;
}
  .team-about-us{
    min-height: 90vh;
    padding-bottom: 135px;
  }
  .projects-section-1{
    padding-top: 115px;
  }
  .covid-goto {
  font-size: 30px;
}
.covid-content {
    text-align: center;
    font-family: var(--font);
    font-size: 50px;
    width: 100%;
}
.covid-logo {
    font-family: var(--font);
    color: #fff;
    font-size: 60px;
    font-weight: bolder;
}
.covid-heading {
    position: fixed;
    left: 50%;
    top: 25%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 65%;
}
.covid-home-img {
  width: 450px;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.home-covid-links-content {
  left: 50%;
  top: 80%;
  transform: translate(-50%, -50%);
}
.staffhound-heading{
  position: fixed;
  left: 50%;
  top: 25%;
  transform: translate(-50%, -50%);
  text-align: center;
  width: 90%;
}
.staffhound-home-img{
  width: 450px;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.staffhound-content {
    text-align: center;
    font-family: var(--font);
    font-size: 45px;
    width: 100%;
}
.staffhound-logo {
    font-family: var(--font);
    color: #fff;
    font-size: 65px;
    font-weight: bolder;
}
.home-staffhound-links-content{
  left: 50%;
  top: 80%;
  transform: translate(-50%, -50%);
}
.staffhound-goto{
  font-size: 35px;
}



.washbutler-heading{
  position: fixed;
  left: 50%;
  top: 23%;
  transform: translate(-50%, -50%);
  text-align: center;
  width: 85%;
}
.washbutler-home-img {
    width: 260px;
    top: 55%;
    left: 40%;
    transform: translate(-50%, -50%);
}
.washbutler-home-img2 {
    left: 60%;
    width: 280px;
}
.washbutler-content {
    text-align: center;
    font-family: var(--font);
    font-size: 40px;
    width: 100%;
}
.washbutler-logo {
    font-family: var(--font);
    color: #fff;
    font-size: 60px;
    font-weight: bolder;
}
.home-washbutler-links-content{
    text-align: center;
  left: 50%;
  top: 83%;
  transform: translate(-50%, -50%);
}
.washbutler-goto{
  font-size: 26px;
}

  .home-btn {
    border: 2px solid var(--white);
    padding: 10px 25px;
    font-weight: 300;
        font-size: 25px;
  }

  /*.staffhound-home-img {*/
  /*  width: 360px;*/
  /*  top: 50%;*/
  /*  left: 70%;*/
  /*}*/

  
  .homeSireStarters {
    font-size: 25px;
  }
    .home-footer-btn {
    padding: 5px 39px;
    margin-top: 20px;
    top: 40%;
    font-size: 20px;
}
.home-services-footer-list {
    bottom: 135px;
}
.home-footer-link {
    font-size: 25px;
}
  .home-services-content {
    font-size: 12px;
  }
.home-services-footer-list2 {
    left: 0;
    bottom: 60px;
}
  .home-footer-icon {
    font-size: 30px;
}
  .services-footer-list2 {
    float: none;
  }

  .bottom-headings {
    font-size: 45px;
    padding-top: 30px;
  }
  .design-ui{
    padding-top: 85px;
  }
  .bottom-content {
    font-size: 20px;
    font-weight: 300;
  }

  .services-content {
    font-size: 21px;
  }
  #svg-1 {
    width: 100%;
  }
  #svg-2 {
    width: 100%;
  }
  #svg-3 {
    width: 100%;
  }
  #svg-4 {
    width: 100%;
  }
  .main-heading {
    font-size: 100px;
  }
  .services-chat-btn {
    font-size: 20px;
    border: 2px solid var(--purple);
    padding: 15px 14px;
    font-size: 24px;
  }
  .home-copyright {
    font-size: 25px;
    padding: 0 !important;
    text-align: left;
    left: 0;
    }
  .red-section {
    padding-bottom: 0px;
  }

  .grey-section {
    padding-bottom: 0px;
  }
  .services-footer-link{
    font-size: 25px;
  }
  .team-main-heading {
    font-size: 100px;
  }
  .transform-section-red{
    padding-bottom: 80px;
    padding-top: 35px;
  }
  .transform-section-grey{
    padding-bottom: 80px;
    padding-top: 35px;
  }
  .team-banner-content {
    width: 85%;
    font-size: 30px;
  }
  #right-img1 {
    /* height: 515px; */
    text-align: right;
  }
  #right-img2 {
    /* height: 515px; */
    text-align: right;
  }
  #right-img3 {
    /* height: 515px; */
    text-align: right;
  }
  #right-img4 {
    height: 500px;
    text-align: right;
  }
  .team-btn {
    font-size: 25px;
    border: 2px solid var(--purple);
    padding: 15px 25px;
  }

  .about-heading-thin {
    font-size: 65px;
  }
  .projects-main-heading2 {
    font-size: 100px;

  }
  .about-heading-thick {
    font-size: 60px;
    margin-top: 15px;
  }

  .about-us-content {
    font-size: 25px;
  }

  .ceo-content {
    font-size: 35px;
  }

  .core-head {
    font-size: 80px;
  }
  .services-footer-list{
    bottom: 90px;
  }
  .services-footer-heading {
    font-size: 70px;
  }
  .pages-footer-head1 {
    font-size: 60px;
  }
  .contact-main-head {
    font-size: 100px;
  }
  .contact-banner-content {
    font-size: 25px;
    margin-top: 35px;
  }
  .contact-banner {
    margin-top: 150px;
  }
  .services-footer-list2{
    left: 0;
    bottom: 40px;
  }
  .contact-address-head {
    font-size: 40px;
  }
  .contact-footer-head {
    padding-top: 100px;
    font-size: 90px;
  }
  .contact-footer-main {
    margin-bottom: 60px;
  }
  .contact-submit-btn {
    font-size: 23px;
    padding: 10px 35px;
  }
  .contact-tekX{
    font-size: 35px;
  }
  .whatsapp-icon{
    font-size: 55px;
  }
  .contact-footer-btn{
    margin-top: 30px;
    font-size: 30px;
  }
  .services-footer-btn{
    margin-top: 30px;
    font-size: 27px;
  }
  .contact-list-content{
    font-size: 27px;
  }
  .contact-email{
    font-size: 35px;
  }
  .contact-icon{
    font-size: 38px;
  }
  .copyright{
    text-align: left;
    font-size: 25px;
  }
  /* .services-navbar-active {
    background: var(--white);
    top: 70px;
    transition: 0.25s ease-in;

  }
  .services-navbar-inactive {
    position: fixed;
    right: 0px;
    top: 70px;
    list-style: none;
    padding: 15px;
    transition: 0.25s ease-in;
    background: var(--white);
    width: 50%;
    height: 88%;
    border-radius: 0px 0px 0px 200px;
  }
  .navbar-scroll-active{
    background: var(--white);
    top: 70px;
    transition: 0.25s ease-in;
    transition: 0.25s ease-in;
  }
  .navbar-inactive{
    position: fixed;
    right: 0px;
    top: 70px;
    list-style: none;
    padding: 15px;
    transition: 0.25s ease-in;
    background: var(--white);
    width: 50%;
    height: 88%;
    border-radius: 0px 0px 0px 200px;
  } */
  /* .service-link{
    color: #fff;
  } */
  /* .service-link {
    padding: 15px 0px;
    font-size: 20px;
    
} */
  /* #link{
    padding: 15px 0px;
    font-size: 20px;
    color: black;
} */
  /* .projects-left-heading {
    position: absolute;
    left: -32px;
    top: 30px;
  } */
  .projects-right-heading {
    text-align: left;
    /* position: absolute;
    right: -145px;
    top: 30%; */
  }

  .washbutler-web {
    display: flex;
    margin: 0px 0px 0px !important;
    padding: 0px 0px 0px 12px !important;
  }

  /*.staffhound-web {*/
  /*  display: flex;*/
  /*  margin: 0px 0px 0px !important;*/
  /*  padding: 0px 0px 0px 12px !important;*/
  /*}*/

  .covid-web {
    display: flex;
    margin: 0px 0px 0px !important;
    padding: 0px 0px 0px 12px !important;
  }

  .testimonials-head {
    margin-top: 0em;
    font-size: 65px;
  }

  .home-qoute-content {
    margin-top: 55px;
    font-size: 35px;
    width: 95%;
    margin-left: 30px;
  }

  .test-portfolio {
    margin-left: 25px;
    margin-top: 4rem;
  }
  .portfolio-img{
      width: 100%;
  }
  .portfolio-pos {
    font-size: 24px;
    }
    .portfolio-head {
    font-size: 36px;
    }
    .portfolio-content {
    margin-left: 25px;
    }
  .con-email{
    justify-content: start;
  }
  .con-icons{
    justify-content: start;
  }
  .contact-copyright{
    text-align: left;
    font-size: 25px;
  }
  .footer-inner .footer-form{
      padding-top: 250px;
  }
  .services-footer-icon {
    font-size: 28px;
  }
  .core-values {
    font-size: 20px;
  }
  .projects-main-heading1 {
    font-size: 100px;
  }
  .development-head{
    font-size: 65px;
  }
  .process-img{
    width: 135px;
  }
  .development-process-content{
    font-size: 30px;
  }
  .logo-inactive{
    top: 5px;
    margin-left: 0px;
    }
    .navbar-inactive {
    position: fixed;
    right: 0px;
    top: 0px;
    list-style: none;
    padding: 19px;
    transition: 0.25s ease-in;
    background: #161616;
    width: 55%;
    height: 100%;
    text-align: left;
    }
    #link {
    margin-right: 30px;
    font-size: 45px;
    }
    #first-link{
      margin-top: 70px;
    }
    
}



@media only screen and (max-width: 415px) {
  .str-section3 p {
    color: #fff;
    max-width: 100%;
    margin-top: 20px;
    font-weight: 500;
}
  .stf-sec1 {
    margin-top: 50px;
  }
  .blockquote {
    color: #646464;
    font-size: 15px;
  }
  .str-section2 {
    margin-top: 50px;
  }
  .pink-section {
    min-height: 375px;
  }
  .str-section3 {
    padding: 100px 0px;
  }
  .str-section4 h1 {
    font-size: 25px;
    margin-top: 55px;
  }
  .str-trip img {
    width: 320px;
  }
  .str-trip-head {
    text-align: center;
    margin-top: 50px;
}
.str-sec6 {
  background: #ecf1ff;
  padding: 0px;
}
.str-trip-cont {
  font-size: 1.125rem;
  font-weight: 500;
  margin: 20px 0px;
  text-align: center;
}
.black-section {
    position: relative;
    z-index: 2;
    background: #2b343e;
    color: #fff;
    min-height: 235px;
    padding-bottom: 20px;
    /* padding-top: 150px; */
}
  .str-section2 h1 {
  font-size: 25px;
  } 
  .stf-img2 {
    top: -280px;
  }
  .stf-img2 img {
    width: 325px;
  }
  .stf-img3 img {
    width: 325px;
  }
  .wsb-img1 img {
    /* border-radius: 20px; */
    width: 255px;
    margin-top: 50px;
  }
  .stf-img1 img {
    /* border-radius: 20px; */
    width: 255px;
    margin-top: 50px;
  }
  .wsb-img2 img {
    /* border-radius: 20px; */
    width: 255px;
    margin-top: 50px;
  }
  .wsb-img2{
    text-align: center;
  }
  .stf-section2 {
    margin-top: 50px;
  }
  .stf-section3 {
    text-align: center;
    padding: 0px 20px;
  }
  .stf-section3 h1 {
    font-size: 27px;
  }
  .stf-section3 p {
    display: block;
    font-size: 18px;
  }
  .wsb-sec3-img img {
    width: 350px;
    margin-top: 50px;
  }
  .stf-section4 {
    text-align: center;
    padding: 0px 10px;
  }
  .stf-sec5 {
    display: block;
  }
  .page-change {
    padding: 5.8823529412vw 5.8823529412vw 2.9411764706vw;
    font-weight: 600;
    width: 100%;
  }
  .wsb-previous {
    min-height: 50vh;
  }
  .wsb-next {
    min-height: 50vh;
  }
  .btnLogo {
    width: 330px;
  }
  .str-previous {
    min-height: 50vh;
  }
  .str-next {
    min-height: 50vh;
  }
  .stf-previous {
    min-height: 50vh;
  }
  .stf-next {
    min-height: 50vh;
  }
  .stf-img3 {
    top: -230px;
  }
  .white-section {
    height: 100vh;
    padding-top: 0px;
  }
  .stf-sec3-img img {
    width: 300px;
  }
  .wsb-sec3 {
    height: 100vh;
  }
  



  .services-content {
    font-size: 26px;
  }
  .team-right-sec{
    padding-left: 0;
    }
  /* .home-content {
    width: 95%;
    font-size: 35px;
  } */
  #svg-1 {
    width: 80%;
  }
  #svg-2 {
    width: 80%;
  }
  #svg-3 {
    width: 80%;
  }
  #svg-4 {
    width: 80%;
  }
  #small-svg-1{
    width: 52px;
  }
  #small-svg-2{
    width: 52px;
  }
  #small-svg-3{
    width: 52px;
  }
  #small-svg-4{
    width: 52px;
  }
#link {
  font-size: 35px;
}

.logo-inactive {
  position: absolute;
  top: 25px;
  text-decoration: none;
  color: #fff;
  margin-left: 0px;
  padding: 0px;
  font-size: 0px;
  transition: 0.25s ease-in;
}
  /* Home Page new querry */

  .heading0 {
    font-size: 65px;
}
.centered-headings {
  top: 45%;
}
.home-content {
  width: 90%;
    font-size: 17px;
    top: 85%;
}
.home-covid-links-content {
  left: 50%;
  top: 80%;
  transform: translate(-50%, -50%);
}
.covid-goto {
  font-size: 18px;
}
.covid-content {
  text-align: center;
  font-family: var(--font);
  font-size: 29px;
  width: 100%;
}
.covid-logo {
  font-family: var(--font);
  color: #fff;
  font-size: 50px;
  font-weight: bolder;
}
.covid-heading {
  position: fixed;
  left: 50%;
  top: 30%;
  transform: translate(-50%, -50%);
  text-align: center;
  width: 90%;
}
.covid-home-img {
  width: 320px;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.staffhound-heading{
  position: fixed;
  left: 50%;
  top: 30%;
  transform: translate(-50%, -50%);
  text-align: center;
  width: 90%;
}
.staffhound-home-img{
  width: 320px;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.staffhound-content{
  text-align: center;
  font-family: var(--font);
  font-size: 25px;
  width: 100%;
}
.staffhound-logo{
  font-family: var(--font);
  color: #fff;
  font-size: 50px;
  font-weight: bolder;
}
.home-staffhound-links-content{
  left: 50%;
  top: 80%;
  transform: translate(-50%, -50%);
}
.staffhound-goto{
    font-size: 20px;
}



.washbutler-heading{
  position: fixed;
  left: 50%;
  top: 25%;
  transform: translate(-50%, -50%);
  text-align: center;
  width: 85%;
}
.washbutler-home-img{
  width: 220px;
  top: 55%;
  left: 40%;
  transform: translate(-50%, -50%);
}
.washbutler-home-img2 {
  left: 60%;
  width: 245px;
}
.washbutler-content{
  text-align: center;
  font-family: var(--font);
  font-size: 25px;
  width: 100%;
}
.washbutler-logo{
  font-family: var(--font);
  color: #fff;
  font-size: 50px;
  font-weight: bolder;
}
.home-washbutler-links-content{
  left: 50%;
  top: 83%;
  transform: translate(-50%, -50%);
}
.washbutler-goto{
  font-size: 12px;
}
#about-head {
  font-size: 44px;
  width: 85%;
  top: 35%;
}
.homeSireStarters {
  width: 78%;
  font-size: 18px;
  left: 50%;
  top: 74%;
  transform: translate(-50%, -50%);
}
.testimonials-head {
  margin-top: 0px;
  font-size: 36px;
}
.purple-head {
  font-family: 'Sora', sans-serif;
  color: #37017c;
  font-size: 60px;
}
.purple-head2 {
  line-height: 16px;
  font-size: 75px;
  font-family: sans-serif;
  color: #37017c;
}
.home-qoute-content {
  margin-top: 25px;
  font-size: 26px;
  width: 90%;
  text-align: center;
  margin-left: 20px;
}
.portfolio-pos {
  font-size: 17px;
}
.portfolio-head {
  color: #fff;
  text-align: left;
  font-weight: 600;
  font-family: var(--font);
  font-size: 31px;
}
.home-qoute-content {
  margin-top: 25px;
  font-size: 27px;
  width: 90%;
  text-align: center;
  margin-left: 20px;
}
.test-portfolio {
    margin-top: 2rem;
    margin-left: 20px;
}
.home-footer-heading {
  font-size: 28px;
  left: 55%;
  top: 25%;
}
#arrowBtn{
  font-size: 30px;
}
.home-footer-btn {
  left: 5%;
  top: 40%;
}
.home-services-footer-list {
  bottom: 120px;
  left: 5%;
}
.home-footer-link {
  font-size: 16px;
}
.home-services-footer-list2 {
  left: 5%;
  bottom: 55px;
}
.home-copyright {
  bottom: 20px;
  text-align: left;
}
  
  .services-chat-btn {
    padding: 20px 40px;
  }
  .bottom-content {
    font-size: 22px;
  }
  #right-img1 {
    margin-top: 35px;
    height: 321px;
    justify-content: center;
  }
  #right-img2 {
    margin-top: 35px;
    height: 321px;
    justify-content: center;
  }
  #right-img3 {
    margin-top: 35px;
    height: 321px;
    justify-content: center;
  }
  #right-img4 {
    margin-top: 35px;
    height: 321px;
    justify-content: center;
  }
  .red-section {
    padding-bottom: 30px;
  }
  .grey-section {
    padding-bottom: 30px;
  }
  .development-process {
    padding-top: 0px;
  }
  .development-process-content {
    font-size: 21px;
    text-align: center;
  }
  .development-head {
    font-size: 45px;
    margin: 0px;
  }
  .process-img {
    width: 49%;
    text-align: center;
  }
  .development-sub-head {
    font-size: 40px;
  }
  .core-head{
      font-size: 45px;
  }
  .services-footer-list {
    bottom: 100px;
  }
  .services-footer-list2 {
    bottom: 40px;
    left: 0;
  }
  .pages-footer-head1 {
    font-size: 30px;
    }
    .services-footer-heading {
    font-size: 30px;
    }
    .services-footer-heading .services-footer-arrow {
    font-size: 35px;
    }
  .copyright {
    color: #fff;
    width: 100%;
    position: absolute;
    bottom: 0;
    text-align: left;
    font-size: 20px;
  }
   .services-footer-link {
    font-size: 14px;
  } 
  .services-footer-icon {
    font-size: 25px;
  }
  .footer-inner .footer-form {
    padding-top: 150px;
  }
  .projects-main-heading2 {
    font-size: 70px;
    margin-top: 22px;
    left: 15px;
  }
  .projects-main-heading1 {
    font-size: 70px;
  }
  .projects-section-1 {
    position: relative;
    padding-bottom: 0px;
    min-height: 100vh;
    padding-top: 55px;
  }
  .m-scroll__title h1{
       font-size: 30px;
  }
  .m-scroll__title2 h1 {
    font-size: 30px;
}
  .team-main-heading {
    font-size: 75px;
  }
  .team-banner-content {
    width: 100%;
    font-size: 23px;
  }
  .team-main {
    padding-bottom: 185px;
    padding-top: 115px;
  }
  .about-heading-thin {
    font-size: 42px;
    margin-top: 0px;
  }
  .services-section-1 {
    margin-top: 130px;
    padding-bottom: 80px;
  }
  .about-heading-thick{
    font-size: 50px;
  }
  .team-btn {
    padding: 17px 53px;
    font-size: 22px;
  }

  .about-us-content {
    font-size: 21px;
  }
  .core-sections {
    margin: 34px 43px;
  }
  .core-values-main {
    padding: 0;
  }
  .core-values {
    font-size: 20px;
  }
  .contact-footer-head {
    padding-top: 100px;
    font-size: 50px;
  }
  .contact-tekX {
    font-size: 19px;
    margin-top: 30px;
  }
  .contact-footer-btn {
    margin-top: 50px;
    font-size: 15px;
  }
  .services-footer-btn {
    margin-top: 50px;
    font-size: 15px;
  }
  .contact-banner {
    margin-top: 130px;
    padding-bottom: 80px;
  }
  .services-logo-inactive {
    position: absolute;
    top: 0px;
     margin-left: 0px; 
     padding: 20px; 
    }
  .whatsapp-icon {
    font-size: 45px;
  }
  .contact-address-head {
    font-size: 35px;
  }
  .contact-list-content {
    font-size: 25px;
    width: 100%;
  }
  .con-email {
    justify-content: start;
  }
  .contact-email {
    font-size: 23px;
  }
  .ceo-content {
    margin-top: 25px;
}
  .con-icons {
    justify-content: start;
  }
  .contact-icon {
    font-size: 35px;
  }
  .contact-icons-list {
    padding-right: 35px;
  }
  .contact-copyright {
    text-align: left;
    font-size: 20px;
  }
  .slides {
    margin-left: 35px;
  }
  .services-navbar-active {
    background: var(--white);
    top: 70px;
    transition: 0.25s ease-in;

  }
  .services-navbar-inactive {
    position: fixed;
    right: 0px;
    top: 0px;
    list-style: none;
    padding: 19px;
    transition: 0.25s ease-in;
    background: #161616;
    width: 70%;
    height: 100%;
    /* border-radius: 0px 0px 0px 200px; */
}
.navbar-inactive{
  position: fixed;
    right: 0px;
    top: 0px;
    list-style: none;
    padding: 19px;
    transition: 0.25s ease-in;
    background: #161616;
    width: 70%;
    height: 100%;
    text-align: left;
}
  
  #active-page {
    background-color: transparent;
    border-left: 6px solid var(--purple);
    color: #fff;
    
  }
  .firstLink{
      margin-top: 70px;
  }
  #projects-page{
      background-color: transparent;
    border-left: 6px solid var(--purple);
    color: #fff;
  }
  .service-link {
    color: #fff;
    font-size: 40px;
  }
  .projects-nav-link{
     color: #fff !important;
    font-size: 40px;
    
  }
  #first-link{
      margin-top: 70px;
  }
  /*.projects-toggle-icon{*/
  /*    background-color: var(--purple);*/
  /*}*/
}
.transform-team-section-purple {
    padding-bottom: 75px;
  }
  #section1{
      min-height: 100vh;
        padding: 0;
      
  }

@media only screen and (max-width: 375px){

  .wsb-main {

    padding-bottom: 245px;
}

.transform-team-section-purple {
    padding-bottom: 100px;
  }
  .transform-section-wsb1 {
    z-index: 3;
    padding: 0 0;
    position: relative;
}
.wsb-sec2 {
  z-index: 3;
  background: #2b343e;
  color: #fff;
  /* padding-top: 100px; */
  min-height: 130vh;
  position: relative;
  overflow: hidden;
}
.wsb-sec3 {
  height: 110vh;
}
.wsb-img2 img {
  /* border-radius: 20px; */
  width: 255px;
  margin-top: 0px;
}
.transform-section-wsb2 {
  z-index: 3;
  padding-top: 0px;
  position: relative;
}

  .centered-headings{
    top: 40%;
  }
  .heading0 {
    font-size: 60px;
  }
  .home-content {
    width: 90%;
    font-size: 14px;
    top: 83%;
  }
  .covid-home-img {
    width: 250px;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .covid-heading {
    position: fixed;
    left: 50%;
    top: 25%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 90%;
  }
  .covid-content {
    text-align: center;
    font-family: var(--font);
    font-size: 26px;
    width: 97%;
  }
  .covid-logo {
    font-family: var(--font);
    color: #fff;
    font-size: 45px;
    font-weight: bolder;
  }
  .home-covid-links-content {
    left: 50%;
    top: 82%;
    transform: translate(-50%, -50%);
  }
  .covid-goto {
    font-size: 17px;
  }
  .home-btn {
    margin-top: 10px;
  }


  .home-staffhound-links-content {
    left: 50%;
    top: 82%;
    transform: translate(-50%, -50%);
  }
  .staffhound-goto {
    font-size: 20px;
  }
  .staffhound-home-img {
    width: 250px;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .staffhound-logo {
    font-family: var(--font);
    color: #fff;
    font-size: 45px;
    font-weight: bolder;
  }
  .staffhound-content {
    text-align: center;
    font-family: var(--font);
    font-size: 23px;
    width: 100%;
  }
  .staffhound-heading {
    position: fixed;
    left: 50%;
    top: 28%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 90%;
  }
  .washbutler-home-img {
    width: 160px;
    top: 57%;
    left: 40%;
    transform: translate(-50%, -50%);
  }
  .washbutler-home-img2 {
    left: 60%;
    width: 180px;
  }
  .home-washbutler-links-content {
    left: 50%;
    top: 86%;
    transform: translate(-50%, -50%);
  }
  #about-head {
    font-size: 35px;
    width: 80%;
    top: 37%;
  }
  .homeSireStarters {
    width: 77%;
    font-size: 15px;
    left: 50%;
    top: 76%;
    transform: translate(-50%, -50%);
  }
  #arrowBtn {
    font-size: 15px;
  }
  .team-link {
    font-size: 20px;
  }
  .testimonials-head {
    margin-top: 0px;
    font-size: 30px;
  }
  .purple-head2 {
    line-height: 23px;
    font-size: 50px;
  }
  .home-qoute-content {
    margin-top: 25px;
    font-size: 22px;
    width: 90%;
    text-align: center;
    margin-left: 20px;
  }
  .purple-head {
    font-family: 'Sora', sans-serif;
    color: #37017c;
    font-size: 60px;
  }
  .test-portfolio {
    margin-top: 5rem;
    margin-left: 20px;
  }
  .portfolio-head {
    font-size: 27px;
  }
  .portfolio-pos {
    font-size: 16px;
  }
  .home-services-footer-list {
    bottom: 135px;
    left: 5%;
  }
  .home-footer-link {
    font-size: 15px;
  }
  .home-services-footer-list2 {
    left: 5%;
    bottom: 65px;
  }
  .home-services-footer-list {
    bottom: 135px;
    left: 5%;
  }
  #arrowBtn {
    font-size: 20px;
  }



  .projects-main-heading1 {
    font-size: 55px;

  }
  .projects-main-heading2 {
    font-size: 55px;

  }
  .team-main-heading {
    font-size: 66px;
  }
  .contact-main-head {
    font-size: 80px;
  }
  .contact-banner-content {
    font-size: 23px;
  }
  .services-content {
    font-size: 22px;
  }
}






svg#freepik_stories-developer-activity:not(.animated) .animable {
  opacity: 0;
}

svg#freepik_stories-developer-activity.animated #freepik--Shadow--inject-52 {
  animation: 1.5s Infinite linear heartbeat;
  animation-delay: 0s;
}

svg#freepik_stories-developer-activity.animated #freepik--Graphics--inject-52 {
  animation: 1.5s Infinite linear floating;
  animation-delay: 0s;
}

@keyframes heartbeat {
  0% {
    transform: scale(1);
  }

  10% {
    transform: scale(1.1);
  }

  30% {
    transform: scale(1);
  }

  40% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.1);
  }

  60% {
    transform: scale(1);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes floating {
  0% {
    opacity: 1;
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-10px);
  }

  100% {
    opacity: 1;
    transform: translateY(0px);
  }
  
}








.animator-hidden {
  display: none;
}

@-webkit-keyframes mover {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-20px);
  }
}

@keyframes mover {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-20px);
  }
}




/*div:hover {
  animation-play-state: paused;
}*/




@-webkit-keyframes scrollText {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-50%);
  }
}
@keyframes scrollText {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-50%);
  }
}



/*div:hover {
  animation-play-state: paused;
}*/




@-webkit-keyframes scrollText2 {
  from {
    transform: translateX(-50%);
  }
  to {
    transform: translateX(0%);
  }
}
@keyframes scrollText2 {
  from {
    transform: translateX(-50%);
  }
  to {
    transform: translateX(0%);
  }
}

@keyframes fadeInText {
  0%{
    top: 50%;
  }
  50%{
    top: 45%;
  }
  100%{
    top: 50%;
  }
}

@keyframes dance {
  0%   {transform: translateY(0)}
  100%  {transform: translateY(25px)}
  /* 100% {transform: translateY(0)} */
}
