@import url("https://fonts.googleapis.com/css2?family=Baloo+2&family=Raleway&family=Rubik&display=swap");
/* SASS Template */
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Baloo+2&family=Inter:wght@400;600;700&family=Raleway&family=Rubik&display=swap");
* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  scroll-behavior: smooth;
}

@font-face {
  font-family: Neogrotesk Ess Alt;
  src: url("./../assets/font/NeogroteskEssAlt-Regular.woff") format("woff");
}

@font-face {
  font-family: Boston-SemiBold;
  src: url("./../assets/font/Boston-SemiBold.woff") format("woff");
}

@font-face {
  font-family: Neogrotesk Ess Alt Bold;
  src: url("./../assets/font/NeogroteskEssAlt-Bold.woff") format("woff");
}

@font-face {
  font-family: Boston-Regular;
  src: url("./../assets/font/Boston-Regular.woff") format("woff");
}

@font-face {
  font-family: Neogrotesk Ess Alt Light;
  src: url("./../assets/font/NeogroteskEssAlt-Light.woff") format("woff");
}

@font-face {
  font-family: Boston-Bold;
  src: url("./../assets/font/Boston-Bold.woff");
}

/* Variables */
.btnPrimary, .btnSecondary {
  background-color: #FFE194;
  border: none;
  width: 150px;
  height: 48px;
  font-size: 14px;
  text-transform: uppercase;
  font-family: Boston-SemiBold;
  border-radius: 5px;
  color: #022859;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.btnPrimary:hover, .btnSecondary:hover {
  background-color: transparent;
  border: 3px solid #FFE194;
}

.btnPrimary:hover a, .btnSecondary:hover a {
  color: #FFE194 !important;
}

.btnHeader {
  background-color: #022859;
  border-radius: 10px;
  border: 2px solid white;
  /* border: white; */
  width: 150px;
  height: 48px;
  font-size: 14px;
  text-transform: uppercase;
  font-family: Boston-SemiBold;
  /* border-radius: 5px; */
  color: #022859;
}

@media only screen and (max-width: 820px) {
  .btnHeader {
    width: 100%;
    height: 100%;
    padding: 0.5rem 0.8rem;
  }
}

.btnSecondary {
  background-color: #F2D229;
}

.btnSecondary a {
  color: #fff;
  text-decoration: none;
}

/* .btnSecondary:hover {
  background-color: transparent;
  border: 2px solid #022859;
} */

/* .btnSecondary:hover a {
  color: #022859;
} */

.scrolled {
  background-color: #022859;
}

.scrolled #menuIcon div {
  background-color: #fff !important;
}

.scrolled li:not(.btn) a {
  color: white !important;
}

.scrolled li {
  color: #fff !important;
}

button {
  text-decoration: none;
}

button a {
  color: black;
}

button a:hover {
  text-decoration: none;
  color: black;
}

.otherScrolled {
  background-color: #022859;
}

.otherScrolled #menuIcon div {
  background-color: #fff !important;
}

.otherScrolled li:not(.btn) a {
  color: white !important;
}

.openMenu {
  display: block;
}

.closeMenu {
  display: none;
}

.btnThird {
  border: 2px solid #f96e46;
  text-transform: uppercase;
  border-radius: 5px;
  font-size: 12px;
  font-family: Boston-SemiBold;
  background-color: transparent;
  padding: 1.5rem 2.5rem;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.btnThird:hover {
  background-color: #f96e46;
}

.grid21 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
}

/* Typography classes */
.fontNeoLight {
  font-family: Neogrotesk Ess Alt Light;
}

.fontNeo {
  font-family: Neogrotesk Ess Alt;
}

.fontNeoBold {
  font-family: Neogrotesk Ess Alt Bold;
}

.fontBoston {
  font-family: Boston-Regular;
}

.fontBostonSemi {
  font-family: Boston-SemiBold;
}

.fontBostonBold {
  font-family: Boston-Bold;
}

.fontSize12 {
  font-size: 12px;
}

.fontSize14 {
  font-size: 14px;
}

.fontSize16 {
  font-size: 16px;
}

.fontSize18 {
  font-size: 16px;
}

.fontSize20 {
  font-size: 20px;
}

.fontSize36 {
  font-size: 36px;
}

/* Color Template */
.colorPrimary {
  color: #022859;
}

.colorPrimaryBg {
  background: #022859;
}

.colorSecondary {
  color: #F2D229;
}

.colorSecondaryBg {
  background: #F2D229;
}

.colorLighter {
  color: #FDF8DF;
}

.colorLighterBg {
  background: #FDF8DF;
}

.colorDarker {
  color: #FEEAE1;
}

.colorDarkerBg {
  background: #FEEAE1;
}

/* Page Templates */
.header {
  height: 126px;
  position: fixed;
 
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  z-index: 10001;
}

.hidden{
  visibility: hidden;
}

@media only screen and (max-width: 800px) {
  .header {
    height: auto;
  }
}

.header .leftHeader {
  background-color: #022859;
  width: 145px;
  height: 126px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 0 0 5px 0;
  z-index: 99;
}

.header .leftHeader img {
  -webkit-transform: scale(0.85);
          transform: scale(0.85);
}

@media only screen and (max-width: 800px) {
  .header .leftHeader {
    height: auto;
    width: auto;
  }
}

.header .rightHeader {
  justify-self: flex-end;
  width: 90%;
}

.header .rightHeader ul {
  list-style-type: none;
}

.header .rightHeader .outerList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 100%;
}

.header .rightHeader .outerList .superMenu {
  position: relative;
  color: #022859;
  cursor: pointer;
}

@media only screen and (max-width: 800px) {
  .header .rightHeader .outerList {
    height: auto;
    margin-bottom: 0;
  }
}

.header .rightHeader .outerList li {
  padding: 1rem 2rem;
  text-transform: uppercase;
  font-size: 12px;
  font-family: Boston-SemiBold;
}

@media only screen and (max-width: 1000px) {
  .header .rightHeader .outerList li {
    padding: 1rem 1rem;
  }
  
}

@media only screen and (max-width: 890px) {
  .header .rightHeader .outerList li {
    padding: 1rem 0.8rem;
  }
}
@media only screen and (max-width:1150px)
{
  .outerList li 
  {
    padding: 1rem 1.4rem !important;
  }
  .outerList li 
  {
    font-size: 12px !important;
  }
}

@media only screen and (max-width: 700px) {
  .header .rightHeader .outerList li {
    padding: 1rem 0.4rem;
  }
}

.header .rightHeader .outerList li:not(.btn):hover {
  background-color: #022859;
  border-radius: 10px;
  color: #fff;
}

.header .rightHeader .outerList li:not(.btn):hover a {
  color: white;
}

.header .rightHeader .outerList li a {
  color: #022859;
  text-decoration: none;
}

.header .rightHeader .outerList li nav {
  position: absolute;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
  max-width: 715px;
  height: 436px;
  background-color: #022859;
  padding: 4rem;
  border-radius: 10px;
  top: 85%;
  left: -100%;
  display: none;
}

.header .rightHeader .outerList li nav div {
  width: 250px;
}

.header .rightHeader .outerList li nav div .menuHeading {
  width: 60%;
  text-transform: uppercase;
  border-bottom: 1px solid white;
}

.header .rightHeader .outerList li nav div .menuHeading p {
  color: white;
  font-size: 12px;
  width: 120%;
}

.header .rightHeader .outerList li nav div .domainMenu {
  padding-top: 1rem;
}

.header .rightHeader .outerList li nav div .domainMenu li {
  text-transform: none;
  padding: 0.8rem 0;
}

.header .rightHeader .outerList li nav div .domainMenu li:hover {
  background-color: transparent;
}

.header .rightHeader .outerList li nav div .domainMenu li a {
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  color: white;
}

.header .rightHeader .outerList li nav div .domainMenu li a img {
  padding-right: 0.8rem;
}

.header .rightHeader .outerList li nav div .domainMenu li a p {
  margin: 0;
}

.header .rightHeader .outerList li nav .rightNav::after {
  content: "";
  position: absolute;
  top: 10%;
  left: 42%;
  height: 80%;
  width: 1px;
  z-index: 1000;
  background-color: white;
  -webkit-transition: all 1s;
  transition: all 1s;
}

.header .rightHeader .outerList .superMenu:hover nav {
  display: -ms-grid !important;
  display: grid !important;
}

.header #menuIcon {
  display: none;
}

/* This is the start of the section one file template */

/* #mobile2 {
  display: none !important;
} */

.sectionOne {
  position: relative;
  overflow: hidden;
}

.sectionOne h1 {
  font-size: 25px;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  color: #022859;
}

.sectionOne h1 span {
  font-weight: 600;
}

.sectionOne .headingLeft {
  border-left: 10px solid #F2D229;
  position: absolute;
  top: 20%;
  left: 5%;
}

.sectionOne .headingLeft h1 {
  padding-left: 1.5rem;
}

.sectionOne .headingRight {
  position: absolute;
  bottom: 20%;
  right: 5%;
}

.sectionOne #maskGroup12jpg {
  width: 100vw;
}

.sectionOne .featureContainer {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
  grid-gap: 80px;
  margin: auto;
  position: absolute;
  top: 24%;
  right: 9.5%;
}

.sectionOne .featureContainer p {
  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 400;
}

.sectionOne #onboarding {
  right: 43.5%;
  top: 25%;
}

.sectionOne #onboarding p {
  margin-left: -9.5rem;
}

.sectionOne #planning {
  top: 8%;
  right: 25%;
}

.sectionOne #planning p {
  margin-left: -6.5rem;
}

.sectionOne #execution {
  right: 7%;
  top: 25%;
}

.sectionOne #execution p {
  margin-left: -7.5rem;
}

.sectionOne #cost {
  top: 56%;
  left: 10%;
}

.sectionOne #cost p {
  margin-left: 2.4rem;
}

.sectionOne #transparency {
  top: 72.5%;
  left: 28.5%;
}

.sectionOne #transparency p {
  margin-left: 2.4rem;
}

.sectionOne #efficiency {
  top: 56%;
  left: 46%;
}

.sectionOne #efficiency p {
  margin-left: 2.4rem;
}

.sectionTwo {
  height: 800px;
  background: -webkit-gradient(linear, left top, right top, from(#154168), color-stop(#022859), to(#022859));
  background: linear-gradient(to right, #154168, #022859, #022859);
  margin-bottom: 3rem;
  overflow: hidden;
}

.sectionTwo .headingContainer {
  margin: auto;
  text-align: center;
}

.sectionTwo .headingContainer h1 {
  padding-top: 3rem;
  color: #fff;
  font-size: 41px;
  font-family: Neogrotesk Ess Alt Bold;
}

.sectionTwo .paraContainer {
  margin: auto;
  text-align: center;
}

.sectionTwo .paraContainer p {
  padding-top: 2rem;
  font-size: 13px;
  font-family: Boston-SemiBold;
  color: #fff;
  text-transform: uppercase;
}

.sectionTwo .containerInner {
  max-width: 1460px;
  margin: auto;
  height: 800px;
  position: relative;
}

.sectionTwo .containerInner svg {
  position: absolute;
}

.sectionTwo .containerInner svg path {
  stroke: white;
  fill: none;
}

.sectionTwo .containerInner .imgContainer {
  height: 171px;
  width: 171px;
  background-color: white;
  border-radius: 50%;
  -webkit-box-shadow: 0px 0px 5px 10px #fff;
          box-shadow: 0px 0px 5px 10px #fff;
  position: absolute;
  left: 575px;
  top: 250px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.sectionTwo .containerInner ul {
  position: relative;
  list-style-type: none;
  width: 100%;
}

.sectionTwo .containerInner ul li {
  position: absolute;
  top: 130px;
  width: 100%;
}

.sectionTwo .containerInner ul li a {
  color: white;
  text-decoration: none;
}

.sectionTwo .containerInner ul li a .imgContainer {
  position: absolute;
  top: -10px;
  left: 120px;
  height: 50px;
  width: 50px;
  border: 1px solid white;
  background-color: transparent;
  border-radius: 50%;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.sectionTwo .containerInner ul li a p {
  font-size: 18px;
  font-family: Boston-SemiBold;
}

.sectionTwo .containerInner ul .left {
  left: 250px;
}

.sectionTwo .containerInner ul .right {
  right: 200px;
}

.sectionTwo .containerInner ul .right1 {
  right: 200px;
}

.sectionTwo .containerInner ul #linkOne {
  left: 210px;
}

.sectionTwo .containerInner ul #linkOne .imgContainer {
  left: 160px;
}

.sectionTwo .containerInner ul #linkTwo {
  top: 300px;
  left: 220px;
}

.sectionTwo .containerInner ul #linkTwo .imgContainer {
  left: 145px;
}

.sectionTwo .containerInner ul #linkThree {
  left: 220px;
  top: 410px;
}

.sectionTwo .containerInner ul #linkThree .imgContainer {
  top: -12px;
  left: 150px;
}

.sectionTwo .containerInner ul #linkFour {
  left: 1150px;
  top: 110px;
}

.sectionTwo .containerInner ul #linkFour .imgContainer {
  left: -60px;
}

.sectionTwo .containerInner ul #linkFive {
  left: 950px;
  top: 180px;
}

.sectionTwo .containerInner ul #linkFive .imgContainer {
  left: -60px;
}

.sectionTwo .containerInner ul #linkSix {
  top: 250px;
  left: 1150px;
}

.sectionTwo .containerInner ul #linkSix .imgContainer {
  left: -60px;
}

.sectionTwo .containerInner ul #linkSeven {
  left: 950px;
  top: 290px;
}

.sectionTwo .containerInner ul #linkSeven .imgContainer {
  left: -60px;
}

.sectionTwo .containerInner ul #linkEight {
  top: 335px;
  left: 1150px;
}

.sectionTwo .containerInner ul #linkEight .imgContainer {
  left: -60px;
}

.sectionTwo .containerInner ul #linkNine {
  left: 950px;
  top: 385px;
}

.sectionTwo .containerInner ul #linkNine .imgContainer {
  left: -60px;
}

.sectionTwo .containerInner ul #linkTen {
  top: 425px;
  left: 1150px;
}

.sectionTwo .containerInner ul #linkTen .imgContainer {
  left: -60px;
}

section.hero {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  margin: auto;
  padding-top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding-top: 120px;
  background-image: -webkit-gradient(linear, left bottom, right top, from(#ffe194), color-stop(#fff), color-stop(#fff), color-stop(#fff), color-stop(#fff), color-stop(#fff), to(#79b3f4)); 
  background-image: linear-gradient(to right top, #ffe194, #fff, #fff, #fff, #fff, #fff, #79b3f4);
   /* background-color: #022859; */
}

@media only screen and (max-width: 700px) {
  section.hero {
    padding-top: 40px;
  }
}

@media only screen and (max-width: 500px) {
  section.hero {
    padding-top: 60px;
  }
}

section.hero .containerHero {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
  margin: auto;
}

section.hero .leftDiv {
  padding-left: 17%;
  z-index: 2;
  margin: auto;
  margin-top: 40px;
}

section.hero .leftDiv h1 {
  font-size: 40px;
  color: #022859;
  margin-bottom: 1rem;
  line-height: 1.3;
  font-family: "Inter", sans-serif;
  font-weight: 700;
}

section.hero .leftDiv h1 span {
  color: #F2D229;
}

/* @media only screen and (max-width: 900px) {
  section.hero .leftDiv h1 {
    font-size: 30px;
  }
} */

section.hero .leftDiv p {
  font-size: 20px;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  margin: 0rem auto;
  max-width: 20rem;
  
}

@media screen and (min-width:700px) {
  section.hero .leftDiv p {
    max-width: 28rem;
  }
}

@media only screen and (max-width:500px)
{
  section.hero .text{
    /* margin-left: 50px; */
  }
}

section.hero .leftDiv button {
  font-size: 17px;
  margin-top: 1.5rem;
}

section.hero .rightDiv {
  /* margin-left: 100px; */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  z-index: 1;
}

section.hero .rightDiv img {
  width: 100%;

}

@media only screen and (max-width: 900px) {
  section.hero .rightDiv img {
    width: 110%;
  }
}

/* @media only screen and (max-width:500px)
{
  section.hero.text{
    margin-left: 30px;
  }
} */

.learnMore {
  position: absolute;
  bottom: 20px;
  width: 200px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.learnMore a {
  font-family: Boston-SemiBold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-decoration: none;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #022859;
}

.learnMore a img {
  width: 20px;
  -ms-grid-column-align: center;
      justify-self: center;
}

#blogHero {
  padding-top: 200px;
}

/* START OF CIRCLE FILE TEMPLATE */
.circle {
  /* background-color: #F2D229; */
  height: 50px;
  width: 50px;
  border-radius: 50%;
  position: absolute;
  right: 10%;
  top: 96vh;
}

.rectangle {
  /* border: 3px solid #F2D229; */
  height: 25px;
  width: 100px;
  border-radius: 50px;
  position: absolute;
  left: 10%;
  top: 196vh;
}

.center {
  position: inherit;
  margin: auto;
  margin-bottom: 3rem;
}

/* START OF SECTIONS FILE TEMPLATE */
.mainSection {
  background-color: #FFFEF8;
  overflow: hidden;
}

.mainSection .homeSection {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
  grid-gap: 3rem;
  width: 80%;
  margin: auto;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 3rem 0;
  margin-bottom: 3rem;
}

.mainSection .homeSection .imgContainer {
  margin: auto;
}

.mainSection .homeSection .imgContainer img {
  margin: auto;
  width: 100%;
  margin-top: -3rem;
}

.mainSection .homeSection .headingContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.mainSection .homeSection .headingContainer .heading {
  max-width: 550px;
  position: relative;
  margin-bottom: 2rem;
  min-height: 150px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.mainSection .homeSection .headingContainer .heading h1 {
  color: #022859;
  font-size: 36px;
  font-family: "Inter", sans-serif;
  font-weight: 400;
}
.mainSection .homeSection .headingContainer .heading h1 span.bold {
  font-weight: 700;
}

.mainSection .homeSection .headingContainer .heading h1 span.stroking {
  position: absolute;
  left: -91px;
  top: -20px;
  font-weight: 700;
  font-size: 156px;
  letter-spacing: 7.8px;
  opacity: 0.2;
  color: #23022E;
  -webkit-text-fill-color: transparent;
  /* Will override color (regardless of order) */
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #23022E;
}

.mainSection .homeSection .paraContainer {
  background-color: #FDF8DF;
  padding: 3rem 0rem;
  border-radius: 17px;
}

.mainSection .homeSection .paraContainer p {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 20px;
  width: 70%;
  margin: auto;
}

.mainSection .homeSection .darkerColor {
  background-color: #FEEAE1;
}

.mainSection #two {
  top: -20%;
  left: -12%;
}

.mainSection #three {
  top: -75%;
  left: -12%;
}

/*------------------------- VIDEO SECTION STARTS -------------------------------*/
.video-section {
  width: 70%;
  padding-bottom: 4rem;
  margin: auto;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
  grid-gap: 2rem;
}

.video-content {
  margin: auto;
  font-size: 36px;
  color: #0d4162;
  font-family: Neogrotesk Ess Alt Light;
}

iframe {
  z-index: 999;
}

.caps {
  font-weight: 800;
}

.video {
  margin: auto;
  position: relative;
  z-index: 1;
}

.video img {
  position: absolute;
  bottom: -4%;
  left: -10%;
  z-index: -1;
}

iframe.inner {
  width: 534px;
  height: 377px;
  border-radius: 30px;
  margin-top: 56px;
}

.frame {
  width: 100%;
  height: 100%;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 560%;
  height: 315px;
  cursor: pointer;
}

/*------------------------- VIDEO SECTION ENDS -------------------------------*/
/* THIS IS THE START OF THE CARD SECTION */
.cardSection {
  width: 80%;
  margin: 3rem auto;
  text-align: center;
}

.cardSection .cardContainer {
  padding: 2rem;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr 1fr;
      grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 4rem;
  margin: auto;
}

.cardSection .cardContainer .card {
  width: 320px;
  text-align: left;
  margin: 2rem 0;
  padding: 1rem;
}

.cardSection .cardContainer .card .imgContainer {
  margin: 0;
  padding: 0;
  height: 100px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
}

.cardSection .cardContainer .card .imgContainer img {
  height: 100%;
}

.cardSection .cardContainer .card .content h1 {
  font-size: 28px;
  font-family: Neogrotesk Ess Alt;
  color: #0d4162;
}

.cardSection .cardContainer .card .content p {
  font-size: 18px;
  line-height: 1.2;
  font-family: Boston-Regular;
}

/*------------------------- SLIDER SECTION STARTS -----------------------*/
@-webkit-keyframes slideComputer {
  0% {
    -webkit-transform: translateX(-300px);
            transform: translateX(-300px);
  }
  10% {
    -webkit-transform: translateX(-200px);
            transform: translateX(-200px);
  }
  20% {
    -webkit-transform: translateX(300px);
            transform: translateX(300px);
  }
  30% {
    -webkit-transform: translateX(1000px);
            transform: translateX(1000px);
  }
  40% {
    -webkit-transform: translateX(-300px);
            transform: translateX(-300px);
  }
  50% {
    -webkit-transform: translateX(-300px);
            transform: translateX(-300px);
  }
  60% {
    -webkit-transform: translateX(-2000px);
            transform: translateX(-2000px);
  }
  70% {
    -webkit-transform: translateX(-2000px);
            transform: translateX(-2000px);
  }
  80% {
    -webkit-transform: translateX(-1300px);
            transform: translateX(-1300px);
  }
  90% {
    -webkit-transform: translateX(300px);
            transform: translateX(300px);
  }
  100% {
    -webkit-transform: translateX(-300px);
            transform: translateX(-300px);
  }
}

@-webkit-keyframes slideMob {
  0% {
    -webkit-transform: translateX(-250px);
            transform: translateX(-250px);
  }
  10% {
    -webkit-transform: translateX(-250px);
            transform: translateX(-250px);
  }
  20% {
    -webkit-transform: translateX(250px);
            transform: translateX(250px);
  }
  30% {
    -webkit-transform: translateX(750px);
            transform: translateX(750px);
  }
  40% {
    -webkit-transform: translateX(-250px);
            transform: translateX(-250px);
  }
  50% {
    -webkit-transform: translateX(-250px);
            transform: translateX(-250px);
  }
  60% {
    -webkit-transform: translateX(-1250px);
            transform: translateX(-1250px);
  }
  70% {
    -webkit-transform: translateX(-750px);
            transform: translateX(-750px);
  }
  80% {
    -webkit-transform: translateX(250px);
            transform: translateX(250px);
  }
  90% {
    -webkit-transform: translateX(250px);
            transform: translateX(250px);
  }
  100% {
    -webkit-transform: translateX(-250px);
            transform: translateX(-250px);
  }
}

.sliderSection .quotes {
  height: 200px;
  width: 200px;
}

.sliderSection .quotes img {
  width: 100%;
}

.sliderSection #upperQuote {
  margin-bottom: -80px;
  margin-left: 5%;
}

.sliderSection #lowerQuote {
  margin-top: -40px;
  margin-left: 80%;
}

.sliderSection .slideContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 2100px;
  -webkit-transform: translateX(-600px);
          transform: translateX(-600px);
  -webkit-animation-name: slideComputer;
  -webkit-animation-duration: 20s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-play-state: running;
  -webkit-animation-direction: alternate;
}

.sliderSection .slideCard {
  min-width: 580px;
  max-width: 650px;
  margin: 0 100px;
  padding: 1rem;
  border-radius: 10px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.sliderSection .slideCard:hover {
  -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}

.slideCard .upperCard {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 2fr;
      grid-template-columns: 1fr 2fr;
  padding: 1rem;
}

.slideCard .upperCard .imgContainer {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 5px solid #ffe194;
}

.slideCard .upperCard img {
  width: 100%;
}

.slideCard .upperCard .namePosition {
  margin: auto 0;
  text-align: left;
  color: #0d4162;
  font-family: Boston-SemiBold;
}

.slideCard .upperCard .namePosition h2 {
  font-size: 1.4rem;
}

.slideCard .lowerCard {
  padding: 1rem;
}

.slideCard .lowerCard p {
  font-family: Boston-Regular;
  font-size: 20px;
}

.appostrophe {
  width: 179px;
  height: 122px;
}

#upper-comma {
  margin-left: 100px;
  margin-bottom: -100px;
  margin-top: 120px;
}

#lower-comma {
  margin-left: 1200px;
  margin-top: -50px;
}

.appostrophe img {
  width: 100%;
  height: 100%;
}

/*------------------------- SLIDER SECTION ENDS -----------------------*/
/* START OF JOIN US SECTION TEMPLATE */
.joinUs {
  max-width: 1200px;
  padding: 5rem 0;
}

.joinUs .joinUsContainer {
  width: 80%;
  margin: auto;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
  grid-gap: 2rem;
}

.joinUs .joinUsContainer .imgContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 50%;
  max-height: 500px;
  max-width: 500px;
  border: 10px solid #FFE194;
}

.joinUs .joinUsContainer .imgContainer img {
  width: 100%;
}

.joinUs .joinUsContainer .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: left;
      -ms-flex-align: left;
          align-items: left;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.joinUs .joinUsContainer .content h1 {
  color: #022859;
  max-width: 400px;
  line-height: 1.3;
  margin-bottom: 2rem;
  font-family: Neogrotesk Ess Alt Bold;
  font-size: 41px;
}

.joinUs .joinUsContainer .content p {
  margin-bottom: 1rem;
  max-width: 500px;
  font-size: 24px;
  font-family: Boston-Regular;
}

.joinUs .joinUsContainer .content .buttonContainer {
  margin-top: 2rem;
}

.joinUs .joinUsContainer .content .buttonContainer button {
  width: 150px;
  height: 50px;
  margin: 1rem;
}

.joinUs .joinUsContainer .content .buttonContainer button a {
  color: black;
  text-decoration: none;
  text-transform: uppercase;
}

.joinUs .joinUsContainer .content .buttonContainer .btnOne {
  background-color: #FFE194;
  border: 2px solid #FFE194;
}

.joinUs .joinUsContainer .content .buttonContainer .btnTwo {
  background-color: white;
  border: 2px solid #FFE194;
}

@media screen and (min-width: 2700px) {
  /*VIDEO SECTION STARTS*/
  .video-section {
    width: 50%;
    margin: auto;
  }
  /*VIDEO SECTION ENDS*/
  /*SLIDER SECTION STARTS*/
  #upper-comma {
    margin-left: 15%;
  }
  #lower-comma {
    margin-left: 72%;
  }
  /*SLIDER SECTION ENDS*/
}

@media screen and (max-width: 1047px) {
  /*VIDEO SECTION STARTS*/
  .video-content {
    font-size: 1.2rem;
  }
  .video-content .video iframe.inner {
    max-width: 350px;
  }
  .video-content span {
    font-size: 1.6rem;
  }
  .video {
    min-width: 400px;
  }
  .video iframe.inner {
    width: 100%;
  }
  /*VIDEO SECTION ENDS*/
}

@media screen and (min-width: 1047px) and (max-width: 1420px) {
  /*VIDEO SECTION STARTS*/
  .video-content {
    font-size: 1.9rem;
  }
  .video-content .video iframe.inner {
    max-width: 350px;
  }
  .video-content span {
    font-size: 2.3rem;
  }
  .video {
    min-width: 400px;
  }
  .video iframe.inner {
    width: 100%;
  }
  /*VIDEO SECTION ENDS*/
}

@media screen and (min-width:1000px) {
  .hero .rightDiv {
    margin-left: 100px !important;
  }
}

@media screen and (max-width: 1150px) {
  /*SLIDER SECTION STARTS*/
  .sliderSection .quotes {
    height: 150px;
    width: 150px;
  }
  .sliderSection .slideContainer {
    width: 1800px;
  }
 
  #indeximg
  {
    width: 500px;
  }

  /*SLIDER SECTION ENDS*/
}

@media screen and (max-width: 950px) {
  /*SLIDER SECTION STARTS*/
  .sliderSection .quotes {
    height: 100px;
    width: 100px;
  }
  .sliderSection .slideContainer {
    width: 1500px;
  }
  .slideCard .lowerCard p {
    font-size: 18px;
  }
  /*SLIDER SECTION ENDS*/
}

@media screen and (max-width: 775px) {
  /*SLIDER SECTION STARTS*/
  .sliderSection .quotes {
    display: none;
  }
  .sliderSection .slideContainer {
    width: 1300px;
  }
  .sliderSection .slideContainer .slideCard {
    max-width: 400px;
    min-width: 400px;
  }
  .slideCard .lowerCard p {
    font-size: 16px;
  }
  /*SLIDER SECTION ENDS*/
  /*SLIDER SECTION STARTS*/
  .appostrophe {
    display: none;
  }
  /*SLIDER SECTION ENDS*/
}

@media screen and (max-width: 769px) {
  /*VIDEO SECTION STARTS*/
  .video-section {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    margin-top: 3rem;
    text-align: left;
    width: 100%;
  }
  .video-section img {
    position: absolute;
    top: 135%;
    left: 80%;
    z-index: -1;
  }
  .video-content {
    margin-top: -3rem;
    font-size: 21px;
  }
  .video {
    -ms-grid-row: 1;
    grid-row: 1;
    margin-top: 5rem;
    margin-left: auto;
    margin-right: auto;
    width: 96%;
    height: 248px;
  }
  iframe.inner {
    width: 278px;
    height: 248px;
    margin-top: -100px;
  }
  .caps {
    font-size: 29px;
  }
  .line1, .line2, .line3 {
    margin: 5px 19px;
  }
  .rect-img {
    display: none;
  }
  /*VIDEO SECTION ENDS*/
}

@media screen and (max-width: 550px) {
  /*SLIDER SECTION STARTS*/
  .sliderSection .slideContainer {
    width: 1050px;
  }
  .sliderSection .slideContainer .slideCard {
    max-width: 400px;
    min-width: 400px;
  }
  /*SLIDER SECTION ENDS*/
}

@media screen and (max-width: 428px) {
  /*VIDEO SECTION STARTS*/
  .video-section {
    width: 100%;
    padding: 4rem 0;
  }
  .video {
    min-width: 300px;
  }
  .video-content p, .video-content span {
    font-size: 22px;
  }
  /*VIDEO SECTION ENDS*/
  /*SLIDER SECTION STARTS*/
  .sliderSection .slideContainer {
    -webkit-animation-name: slideMob;
    width: 900px;
  }
  .sliderSection .slideCard .upperCard h1 {
    font-size: 1.4rem;
  }
  .sliderSection .slideCard .upperCard h2 {
    font-size: 1.2rem;
  }
  .sliderSection .slideContainer .slideCard {
    max-width: 300px;
    min-width: 300px;
  }
  /*SLIDER SECTION ENDS*/
}

@media screen and (max-width: 1300px) {
  /*SLIDER SECTION STARTS*/
  .slider-frame .slide-cards .card-content {
    font-size: 1rem;
  }
  /*SLIDER SECTION ENDS*/
}

.demoSection {
  margin: auto;
}

.demoSection #mobile {
  display: none;
}

.demoSection .demo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: auto;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 48px;
  color: #022859;
  font-family: "Inter", sans-serif;
  font-weight: 700;
}

.demoSection .demo p {
  padding-left: 2rem;
  margin-right: 4rem;
  border-left: 10px solid #F2D229;
}

.demoSection button {
  width: 250px;
  font-size: 24px;
  height: 91px;
}

.demoSection button a {
  text-decoration: none;
  color: #022859;
}

.demoSection .imgContainer {
  display: block;
  text-align: center;
  margin-top: 3rem;
}

.demoSection .imgContainer img {
  max-width: 1000px;
}

#aboutDemo {
  margin-top: -90vh;
}

.largeContainer {
  height: 90vh;
  max-width: 1050px;
  margin: 2rem auto;
  position: relative;
}

.largeContainer img {
  width: 100%;
}

.laptopContainer {
  position: absolute;
  top: 0;
}

.largeContainer .innerContainer {
  position: absolute;
  top: 20vh;
  left: 300px;
  text-align: center;
}

.innerContainer h1 {
  font-size: 36px;
  color: white;
  font-family: Neogrotesk Ess Alt Bold;
  margin: 1rem auto;
}

.innerContainer h2 {
  color: white;
  font-size: 2rem;
  font-family: Neogrotesk Ess Alt Bold;
}

.largeContainer .innerContainer form {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
  grid-gap: 1rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: auto;
}

.largeContainer form input {
  width: 230px;
  height: 40px;
  border: none;
  border-radius: 5px;
  margin-bottom: 20px;
  padding-left: 10px;
}

.largeContainer form button {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1/3;
  padding: 1rem 3rem;
  background-color: #ffe194;
  color: #000;
  font-size: 12px;
  border-radius: 5px;
  border: none;
  margin: 0 auto;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  cursor: pointer;
}

.largeContainer form button:hover {
  background-color: #f96e46;
  color: white;
}

/*MEDIA QUERIES*/
@media screen and (max-width: 1047px) {
  .largeContainer .innerContainer {
    top: 15vh;
    left: 200px;
  }
  .innerContainer h1 {
    font-size: 1.8rem;
  }
  .innerContainer h2 {
    font-size: 1.5rem;
  }
}

@media screen and (max-width: 900px) {
  .largeContainer {
    width: 100%;
    height: 100%;
  }
  .largeContainer .innerContainer {
    position: initial;
    padding: 5rem 0;
  }
  .largeContainer .innerContainer form {
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .innerContainer form input {
    margin: 0.5rem auto;
    border: 1px solid rgba(0, 0, 0, 0.2);
  }
  .innerContainer h1 {
    color: black;
  }
  .innerContainer h2 {
    color: black;
  }
}

@media screen and (max-width: 769px) {
  .largeContainer .innerContainer form {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
  }
  #nam {
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
  }
  #compan {
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
  }
  #phon {
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
  }
  #emai {
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
  }
}

.footer {
  background-color: #022859;
  background-position: bottom right;
  color: white;
  display: -ms-grid;
  display: grid;
  width: 100%;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
  padding: 2rem 0;
  position: relative;
}

.footer .backgroundImage {
  position: absolute;
  bottom: 0;
  right: 0;
  -webkit-mask-image: -webkit-gradient(linear, right bottom, left top, from(black), color-stop(80%, rgba(0, 0, 0, 0)));
  -webkit-mask-image: linear-gradient(to top left, black, rgba(0, 0, 0, 0) 80%);
          mask-image: -webkit-gradient(linear, right bottom, left top, from(black), color-stop(80%, rgba(0, 0, 0, 0)));
          mask-image: linear-gradient(to top left, black, rgba(0, 0, 0, 0) 80%);
}

.footer .backgroundImage img {
  width: 100%;
}

.footer li, .footer a {
  z-index: 100;
}

.footer .footerContainer {
  z-index: 100;
  width: 80%;
  margin: auto;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
  grid-gap: 3rem;
}

.footer .footerContainer .footerGrid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1.5fr;
      grid-template-columns: 1fr 1.5fr;
  grid-gap: 2rem;
}

.footer .footerContainer ul {
  list-style-type: none;
}

.footer .footerContainer ul a {
  color: #fff;
  text-decoration: none;
  font-family: Boston-Regular;
}

.footer .footerContainer .levelOne .leftLevel .footerLogo img {
  -webkit-transform: scale(0.7);
          transform: scale(0.7);
}

.footer .footerContainer .levelOne .leftLevel .email {
  margin-top: 3rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 1rem;
}

.footer .footerContainer .levelOne .leftLevel .email i {
  font-size: 25px;
  padding-right: 1rem;
}

.footer .footerContainer .levelOne .leftLevel .email a {
  text-decoration: none;
  color: #fff;
  font-family: Boston-Regular;
}

.footer .footerContainer .levelOne .leftLevel .email a p {
  font-size: 20px;
}

.footer .footerContainer .levelOne .rightLevel nav ul {
  z-index: 99;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.footer .footerContainer .levelOne .rightLevel nav ul li {
  padding: 0 1rem;
  font-size: 14px;
}

.footer .footerContainer .levelOne .rightLevel nav ul li a {
  border-top: 2px solid #fff;
}

.footer .footerContainer .levelOne .rightLevel nav ul li.superMenu ul.subMenu {
  margin-top: 5rem;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 85px;
}

.footer .footerContainer .levelOne .rightLevel nav ul li.superMenu ul.subMenu li {
  padding: 5px 0;
  font-size: 12px;
  display: block;
}

.footer .footerContainer .levelOne .rightLevel nav ul li.superMenu ul.subMenu li a {
  border-top: none;
}

.footer .footerContainer .levelTwo .leftLevel p {
  font-family: Boston-Regular;
  font-size: 36px;
}

.footer .footerContainer .levelTwo .rightLevel a {
  color: #fff;
  font-size: 60px;
  padding: 0 1rem;
  text-decoration: none;
}

.footer .footerContainer .levelThree .leftLevel p {
  font-family: Boston-Regular;
  font-size: 36px;
}

.footer .footerContainer .levelThree .rightLevel form input {
  width: 50%;
  border: none;
  padding: 1rem 2rem;
  border-radius: 5px;
}

.footer .footerContainer .levelThree .rightLevel form button {
  width: 30%;
}

.footer .footerContainer .levelFour .leftLevel p {
  font-family: Boston-Regular;
}

.footer .footerContainer .levelFour .leftLevel p a {
  color: #F2D229;
  text-decoration: none;
}

.footer .footerContainer .levelFour .rightLevel nav ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.footer .footerContainer .levelFour .rightLevel nav ul li {
  padding: 0 1rem;
}

/* MOBILE TEMPLATES */
@media screen and (max-width: 1000px) {
  .scrolled {
    height: 90px;
  }
  /* HEADER SECTION */
  .header .leftHeader {
    width: 104px;
    height: 90px;
  }
  .header .leftHeader img {
    -webkit-transform: scale(0.6);
            transform: scale(0.6);
  }
  .header .rightHeader {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
    -webkit-transition: 0.1s ease-in;
    transition: 0.1s ease-in;
    min-height: 100vh;
    position: absolute;
    width: 100%;
    background-color: #022859;
    overflow: scroll;
  }
  .header .rightHeader .outerList {
    padding-top: 100px;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin-left: 1rem;
  }
  .header .rightHeader .outerList li {
    padding: 1rem 0;
  }
  .header .rightHeader .outerList .superMenu {
    width: 100%;
    color: white;
  }
  .header .rightHeader .outerList .superMenu nav {
    margin-left: -1rem;
    display: none;
    position: static;
    background-color: white;
    width: 100%;
    padding: 1rem;
    border-radius: 0;
    height: 200px;
    overflow: scroll;
    width: 100%;
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
  }
  .header .rightHeader .outerList .superMenu nav div {
    width: 100%;
  }
  .header .rightHeader .outerList .superMenu nav div .menuHeading {
    border-bottom: 1px solid #F2D229;
  }
  .header .rightHeader .outerList .superMenu nav div .menuHeading p {
    color: #F2D229;
  }
  .header .rightHeader .outerList .superMenu nav div .domainMenu li a {
    color: #022859 !important;
  }
  .header .rightHeader .outerList .superMenu nav .rightNav::after {
    display: none;
  }
  .header .rightHeader .outerList li:not(.btn) a {
    color: #fff;
  }
  .header #solutionsMenu li a img {
    -webkit-filter: invert(80%) sepia(41%) saturate(1803%) hue-rotate(183deg) brightness(93%) contrast(99%);
            filter: invert(80%) sepia(41%) saturate(1803%) hue-rotate(183deg) brightness(93%) contrast(99%);
  }
  .header #menuIcon {
    display: block;
    z-index: 10000;
    margin-top: 2rem;
    margin-right: 2rem;
  }
  .header #menuIcon div {
    z-index: 999;
    width: 35px;
    height: 5px;
    background-color: white;
    display: block;
    margin: 8px 0;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    border-radius: 5px;
  }
  .header #menuIcon .lineTwo {
    -webkit-transform: translateX(10px);
            transform: translateX(10px);
  }
  .header #menuIcon .lineThree {
    width: 20px;
    -webkit-transform: translateX(10px);
            transform: translateX(10px);
  }
  .header .showMenu {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  .header #menuIcon.menuActive div {
    background-color: white;
  }
  .header #menuIcon.menuActive .lineOne {
    -webkit-transform: translateY(13px) rotate(45deg);
    transform: translateY(13px) rotate(45deg);
  }
  .header #menuIcon.menuActive .lineTwo {
    -webkit-transform: translateY(0) rotate(-45deg);
    transform: translateY(0) rotate(-45deg);
  }
  .header #menuIcon.menuActive .lineThree {
    opacity: 0;
  }
  /* HEADER SECTION */
  /* HERO SECTION */
  #blogHero {
    padding-top: 100px;
  }
  section.hero {
   background-color:#022859;
    height: auto;
  }
  section.hero .containerHero {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
  }
  section.hero .containerHero .leftDiv {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  section.hero .containerHero .rightDiv {
   

            -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 1;
  }
  section.hero .containerHero .rightDiv img {
    width: 100%;
    margin: auto;
  }
  section.hero .leftDiv {
    padding: 4px;
    padding-bottom: 20px;
    width: 90%;
    margin: 0 auto;
    text-align: center;
  }
  section.hero .leftDiv h1 {
    font-size: 26px;
    text-align: left;
  }

  .gridtext2
  {
    font-size: 40px !important;
  }
}

@media only screen and (max-width: 1000px) and (max-width: 500px) {
  section.hero .leftDiv h1 {
    font-size: 23px;
  }
}

@media screen and (max-width: 1500px) {
  section.hero .leftDiv #homeHeading {
    text-align: center;
  }
  section.hero .leftDiv p {
    font-size: 14px;
    width: 100%;
    text-align: left;
  }
  section.hero .rightDiv {
    position: static;
    margin-top: 0rem;
  }
  /* HERO SECTION */
  /* LEARN MORE SECTION */
  .learnMore {
    display: none;
  }
  /* LEARN MORE SECTION */
  /* SECTIONONE HOME PAGE */
  #desktop1,
  #desktop2 {
    display: none !important;
  }
  
  #mobile2 {
    padding: 2rem 0;
    /* display: block !important; */
  }
  #mobile1 h1,
  #mobile2 h1 {
    padding: 1rem;
    margin: 2rem auto;
    font-family: "Inter", sans-serif;
    text-align: center;
    font-size: 24px;
    width: 80%;
  }
  #mobile1 .borderUp,
  #mobile2 .borderUp {
    position: relative;
  }
  #mobile1 .borderUp::before,
  #mobile2 .borderUp::before {
    content: "";
    position: absolute;
    top: -8px;
    left: 20px;
    height: 5px;
    width: 90px;
    z-index: 1;
    background-color: #F2D229;
    -webkit-transition: all 1s;
    transition: all 1s;
  }
  #mobile1 .containerSectionOne,
  #mobile2 .containerSectionOne {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
  }
  #mobile1 .containerSectionOne .contentContainer,
  #mobile2 .containerSectionOne .contentContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 0 1rem;
  }
  #mobile1 .containerSectionOne .contentContainer p,
  #mobile2 .containerSectionOne .contentContainer p {
    font-family: "Inter", sans-serif;
    font-size: 18px;
  }
}

@media only screen and (max-width: 1500px) and (max-width: 420px) {
  #mobile1 .containerSectionOne .contentContainer p,
  #mobile2 .containerSectionOne .contentContainer p {
    font-size: 15px;
  }
}

@media screen and (max-width: 1500px) {
  #mobile1 .containerSectionOne .contentContainer .contentContainer1,
  #mobile2 .containerSectionOne .contentContainer .contentContainer1 {
    margin-top: 40px;
  }
}

@media only screen and (max-width: 1500px) and (max-width: 960px) {
  #mobile1 .containerSectionOne .contentContainer .contentContainer1,
  #mobile2 .containerSectionOne .contentContainer .contentContainer1 {
    margin-top: 20px;
  }
}

@media screen and (max-width: 1500px) {
  #mobile1 .containerSectionOne .contentContainer .contentContainer2,
  #mobile2 .containerSectionOne .contentContainer .contentContainer2 {
    margin-top: 32px;
  
  }
}
@media screen and (min-width:300px) and (max-width:430px)
{
  .contentContainer2
  {
    margin-top: -1px !important;
  }
  .contentContainer3
  {
    margin-top: 13px !important;
  }
}


@media screen and (min-width:430px) and (max-width:600px)
{
  .contentContainer2
  {
    margin-top: 1px !important;
  }
  .contentContainer3
  {
    margin-top: 45px !important;
  }
}

@media screen and (min-width:550px) and (max-width:700px)
{
  .contentContainer2
  {
    margin-top: 49px !important;
  }
  .contentContainer3
  {
    margin-top: 52px !important;
  }
}


@media only screen and (max-width: 1500px) and (max-width: 420px) {
  #mobile1 .containerSectionOne .contentContainer .contentContainer2,
  #mobile2 .containerSectionOne .contentContainer .contentContainer2 {
    margin-top: 75px;
  }
}

@media screen and (max-width: 1500px) {
  #mobile1 .containerSectionOne .contentContainer .contentContainer3,
  #mobile2 .containerSectionOne .contentContainer .contentContainer3 {
    margin-top: 87px;
  }
}

@media only screen and (max-width: 1500px) and (max-width: 420px) {
  #mobile1 .containerSectionOne .contentContainer .contentContainer3,
  #mobile2 .containerSectionOne .contentContainer .contentContainer3 {
    margin-top: 75px;
  }
}

@media screen and (max-width: 800px) {
  /* SECTIONONE HOME PAGE */
  /* SECTION TWO HOME PAGE */
  .sectionTwo {
    padding: 4rem 0;
    height: 100%;
    text-align: left;
  }
  .sectionTwo h1 {
    font-size: 24px;
    color: #fff;
    text-align: left !important;
    font-family: "Inter", sans-serif;
    margin-right: 2rem;
  }
  .sectionTwo nav {
    padding: 1rem;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    grid-gap: 3rem;
    padding: 3rem;
  }
  .sectionTwo nav div .menuHeading p {
    color: #F2D229;
    text-decoration: underline;
    font-size: 12px;
    font-family: Boston-SemiBold;
  }
  .sectionTwo nav div .domainMenu {
    list-style-type: none;
    margin: auto;
    padding: 0 3rem;
  }
  .sectionTwo nav div .domainMenu li {
    padding: 1rem;
  }
  .sectionTwo nav div .domainMenu li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #fff;
    text-decoration: none;
  }



  .sectionTwo nav div .domainMenu li a .imgContainer {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid white;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-right: 1rem;
  }
  .sectionTwo nav div .domainMenu li a .imgContainer p {
    font-size: 18px;
    font-family: Boston-SemiBold;
  }
  /* SECTION TWO HOME PAGE */
  /* CIRCLE SECTION */
  .circle {
    display: none;
  }
  /* CIRCLE SECTION */
  /* SECTIONS SECTION */
  .mainSection .homeSection {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    grid-gap: 1rem;
    width: 100%;
  }
  .mainSection .homeSection .imgContainer {
    margin-top: 2rem;
  }
  .mainSection .homeSection .headingContainer {
    width: 100%;
    margin: auto;
  }
  .mainSection .homeSection .headingContainer .heading {
    min-width: 350px;
    padding: 1rem 2rem;
    margin: 0;
  }
  .mainSection .homeSection .headingContainer .heading h1 {
    width: 90%;
    margin: auto;
    font-size: 28px;
  }
  .mainSection .homeSection .headingContainer .heading h1 span.stroking {
    font-size: 136px;
    left: 0;
    top: 0;
  }
  .mainSection .homeSection .headingContainer .imgContainer img {
    width: 100%;
  }
  .mainSection .homeSection .headingContainer .paraContainer {
    width: 85%;
  }
  .mainSection .homeSection .paraContainer {
    margin: auto;
    padding: 1rem 0;
    width: 85%;
  }
  .mainSection .homeSection .paraContainer p {
    width: 85%;
  }
  .rectangle {
    display: none;
  }
  /* SECTIONS SECTION */
  /* CARD SECTION */
  .cardSection {
    padding: 2rem 0;
  }
  .cardSection .cardContainer {
    padding: 2rem 0;
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .cardSection .cardContainer .content h1 {
    font-size: 21px;
  }
  .cardSection .cardContainer .content br {
    display: none;
  }
  /* CARD SECTION */
  /* JOIN US SECTION */
  .joinUs .joinUsContainer {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
  }
  .joinUs .joinUsContainer .content h1 {
    font-size: 28px;
  }
  .joinUs .joinUsContainer .content p {
    font-size: 18px;
  }
  .joinUs .joinUsContainer .buttonContainer {
    text-align: center;
  }
  /* JOIN US SECTION */
  /* DEMO SECTION */
  #aboutDemo {
    margin-top: 3rem;
  }
  .demoSection {
    padding-bottom: 3rem;
  }
  .demoSection .demo {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    font-size: 28px;
  }
  .demoSection .demo p {
    padding-left: 1rem;
    margin-right: 0;
    border-left: none;
    margin-bottom: 2rem;
  }
  .demoSection .imgContainer {
    margin-top: 0;
  }
  .demoSection .imgContainer img {
    width: 100%;
  }
  .demoSection #comp {
    display: none;
  }
  .demoSection #mobile {
    display: block;
    width: 150px;
    font-size: 16px;
    height: 60px;
    margin: auto;
  }
  /* DEMO SECTION */
  /* FOOTER SECTION */
  .footer {
    overflow: hidden;
    padding: 2rem 0;
  }
  .footer .footerContainer {
    width: 100%;
    grid-gap: 2rem;
  }
  .footer .footerContainer .footerGrid {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    grid-gap: 1rem;
  }
  .footer .footerContainer .levelOne .leftLevel .footerLogo img {
    -webkit-transform: scale(0.6);
            transform: scale(0.6);
  }
  .footer .footerContainer .levelOne .leftLevel .email {
    margin-top: 1rem;
  }
  .footer .footerContainer .levelOne .leftLevel .email i {
    font-size: 1rem;
    padding-right: 0.5rem;
  }
  .footer .footerContainer .levelOne .leftLevel .email a p {
    font-size: 14px;
  }
  .footer .footerContainer .levelOne .rightLevel {
    padding-top: 3rem;
  }
  .footer .footerContainer .levelOne .rightLevel nav ul {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .footer .footerContainer .levelOne .rightLevel nav ul li {
    font-size: 12px;
    width: 40%;
    padding: 4px;
  }
  .footer .footerContainer .levelOne .rightLevel nav ul li.superMenu ul.subMenu {
    margin-top: 1rem;
  }
  .footer .footerContainer .levelOne .rightLevel nav ul li.superMenu ul.subMenu li {
    font-size: 10px;
  }
  .footer .footerContainer .levelTwo .leftLevel p {
    font-size: 24px;
    margin-left: 0.5rem;
  }
  .footer .footerContainer .levelTwo .rightLevel {
    margin: auto;
  }
  .footer .footerContainer .levelTwo .rightLevel a {
    font-size: 30px;
    padding: 0 0.5rem;
  }
  .footer .footerContainer .levelThree .leftLevel p {
    font-size: 24px;
    margin-left: 0.5rem;
  }
  .footer .footerContainer .levelThree .rightLevel form input {
    width: 100%;
    text-align: center;
  }
  .footer .footerContainer .levelThree .rightLevel form button {
    margin-top: 1rem;
    width: 100%;
  }
  .footer .footerContainer .levelFour .leftLevel p {
    font-size: 9px;
  }
  .footer .footerContainer .levelFour .rightLevel {
    margin: auto;
  }
  .footer .footerContainer .levelFour .rightLevel a {
    font-size: 9px;
  }
  /* FOOTER SECTION */
  /* GLOBAL STUFF */
  .grid21 {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
  }
}
/*# sourceMappingURL=style.css.map */

.card{
  background-color: #FFFEF8;
  border: 0 solid #FFFEF8;
}
.new-heading{
  margin-top: 7rem;
  text-align: center;
  color: white;
}

@media only screen and (max-width: 1000px) {
  .my-img-home {
    filter: invert(80%) sepia(41%) saturate(1803%) hue-rotate(183deg) brightness(93%) contrast(99%);
  }
}

.containerHero{
  padding: 0 7rem 0 7rem;
}

@media only screen and (min-width: 700px) {
  .big-font{
    font-size: 2.2rem;

  }
  /* .btn-1-div
  {
    width: 180px;
  }
  .btn-2-div
  {
    width: 180px;
  } */
  .static-txt
  {
    margin-top: 9px;
  }
  
  .my-div{
    display: inline;
    font-size: 2.6rem; 
  }
 
}

.img-blog{
  padding: 1rem;
}

.header .rightHeader .outerList li{
  font-size: 14px;
}

.header .rightHeader .outerList li nav{
  height: 480px;
}


/* feature page custom css */

.container{
  padding: 2rem;
}

.feature-h1{
  font-family: Inter, SemiBold;
  color: #022859;
  font-weight: 700;
  font-size: 2rem;
}

.feature-img{
  max-width: fit-content;
  max-height: fit-content;
  margin: 2rem -2rem;
}

.feature-h3{
  font-size: 1.3rem;
  font-family: Inter, Medium;
  color: #0D4162;
  font-weight: 600;
  padding-left: 0.5rem;
}

.feature-p{
  color: #000;
  font-size: 1rem;
  padding: 0 1rem 2rem 0.5rem;
}

@media only screen and (max-width: 700px) {
  .feature-h1{
    text-align: center;
  }
  .feature-img-outerdiv{
    text-align: center;
    padding-left: 2rem;
  }
  .inner-row{
    padding-left: 32px;
  }
  .containerHero
  {
    margin-top: 100px !important;
  }
}

.btnTertiary{
  color: white;
  background-color: #022859;
  overflow: hidden;
  /* border: 2px solid #022859; */
  width: 150px;
  height: 48px;
  font-size: 14px;
  text-transform: uppercase;
  font-family: Boston-SemiBold;
  border-radius: 5px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  border: none;
}
.btnTertiary:hover{
  background-color: #022859;
  color: white;
  transition: 0.3s;
}

@media only screen and (min-width: 700px) {
  .btnTertiary{
    margin-left: 0px;
  }
}

/* custom CSS for About Us Page */

.aboutus-h2{
  color: #022859;
  font-size: 3rem;
}

.aboutus-span{
  font-weight: bolder;
}

.aboutus-h3{
  font-size: 1.5rem;
  color: #022859;
  text-align: left;
}

.first-letter{
  font-size: 2rem;
  font-weight: bolder;
}

.aboutus-p{
  padding: 0.5rem 0 2rem 0;
  text-align: left;
  font-size: 1rem;
  font-weight: 600;
}

@media only screen and (max-width: 700px) {
  .aboutus_container{
    padding-top: 5rem;
  }
  .img-div{
    margin-bottom: 2rem;
  }
}

@media only screen and (max-width: 999px) {
  .mid-layer-2{
    display: none;
  }
}

@media only screen and (min-width: 1000px) {
  .top-img{
    display: none;
  }
}

@media only screen and (min-width: 990px) {
  .mid-layer-1{
    margin: 0 3rem 0 -3rem;
  }
  .mid-layer-2{
    margin-top: -7rem;
  }
  .mid-layer-3{
    margin: 0 -3rem 0 5rem;
  }
  .bottom-layer-1{
    margin-top: -3rem;
  }
  .bottom-layer-2{
    margin-top: 1rem;
  }
  .bottom-layer-3{
    margin-top: -3rem;
  }
}

@media only screen and (max-width: 1300px) {
  .mid-layer-2{
    margin-left: -3rem;
  }
}

@media only screen and (min-width: 990px) {
  .mid-layer-2{
    margin-left: -3rem;
  }
}

/* Custom CSS for Team Page */

.team-h1{
  font-family: Inter;
  color: #022859;
  font-size: 3rem;
  font-weight: bolder;
}
.team-span{
  font-family: Inter;
  color: #F2D229;
}
.team-p{
  font-family: Inter;
  font-size: 1.2rem;
  margin-top: 1rem;
}

.team-container{
  position: relative;
  text-align: center;
}

.img_icon{
  position: absolute;
  top: 4rem;
}

.text_head{
  position: absolute;
  top: 15rem;
  left: 20rem;
  text-align: left;
}

.text_head h2{
  font-family: Inter, Light;
  font-size: 2.5rem;
  color: #0d4162;
  font-weight: bolder;
}

.text_head p{
  font-family: Inter, Light;
  font-size: 2rem;
  color: #0d4162;
}

.text_main{
  position: absolute;
  top: 23em;
  left: 20rem;
  right: 25rem;
  text-align: left;
  font-weight: bold;
  font-size: 1rem;
} 

.text_bottom{
  position: absolute;
  bottom: 25rem;
  left: 20rem;
}

.text_bottom h2{
  font-family: Inter, Light;
  font-size: 2.5rem;
  color: #0d4162;
  font-weight: bolder;
}

.container_two{
  margin-bottom: 5rem;
  background-color: white;
  box-shadow: 15px 13px 30px 10px rgba(229,233,233,1);
}

@media only screen and (max-width: 1400px) {
  .div-for-wider-view{
    display: none;
  }
  .layer-2{
    margin-top: 10rem;
  }
  .co-founder-data{
    margin-top: 7rem;
  }
}

@media only screen and (max-width: 1199px) {
  .co-founder-data{
    text-align: center;
  }
}

@media only screen and (min-width: 1400px) {
  .co-founder-data{
    margin-top: 9rem;
  }
 
}

@media screen and (min-width:1400px)
{
  .medium-font {
    width: 637px !important;
}
.hero .leftDiv p {
  max-width: 39rem !important;
}
}

@media only screen and (max-width: 999px) {
  .co-founder-data{
    margin-top: 0rem;
  }
}

@media only screen and (max-width: 700px) {
  .team-h1{
    font-size: 2rem;
  }
  .co-founder{
    font-size: 1rem;
  }
  .upper-div{
    text-align: center;
  }
}

@media only screen and (min-width: 1400px) {
  .div-for-narrow-view{
    display: none;
  }
}



/* Custom CSS For About us Nav Item*/

.about-us-nav{
  left: 100%;
  padding: 0rem;
  height: 132px;
}

.icon-color{
  filter: invert(100%) sepia(1%) saturate(0%) hue-rotate(266deg) brightness(112%) contrast(101%);
}

@media only screen and (max-width: 1000px) {
  .icon-color {
    filter: invert(12%) sepia(30%) saturate(5330%) hue-rotate(201deg) brightness(90%) contrast(99%);
  }
}

/* CSS for Animation(s) on Home Screen */

.wrapper{
  display: flex;
}

.wrapper .static-txt{
  position: relative;
}

.wrapper .dynamic-txt{
  margin-left: 1rem;
  line-height: 4.5rem;
  height: 5.5rem;
  overflow: hidden;
}

@media only screen and (max-width: 700px) {
  .wrapper .dynamic-txt{
    line-height: 3rem;
    height: 3rem;
  }
}

.dynamic-txt li{
  list-style-type: none;
  position: relative;
  /* top: 0; */
  /* animation: slide 9s steps(3) infinite; */
  animation: spin_words 6s infinite;
}

@keyframes slide {
  100%{
    top: -270px;
  }
}

.dynamic-txt li::after{
  content: "";
  position: absolute;
  /* left: 0; */
  /* background-color: #FFF; */
  /* height: 90%; */
  /* width: 100%; */
  /* border-left: 3px solid #022859; */
  /* animation: typing 3s steps(9) infinite; */
}

@keyframes typing {
  40%, 60% {
    left: calc(100% + 30px);
  }
  100% {
    left: 0;
  }
}
.banner1
{
  height: 130px;
  /* justify-content:; */
  /* align-items: center; */
  text-align: center;
  /* width: 100%; */
  background-color: #022859;
  
}

.overall_container{
  position: relative;

}

.container12{
  position: absolute;
  left:15%;
  right:15%;
  top:20%;
  width:70%;
}
@media screen and (max-width:678px)
{
  #headding
  {
    font-size:25px;
  }

  /* .relative {
    margin-top: 60px !important;
  } */
}
@media screen and (max-width:537px)
{
  #headding
  {
    font-size:15px;
  }
}
@media only screen and (max-width: 700px) {
  .visibility-for-wider-screens{
    display: none;
  }
}
@media only screen and (max-width:798px)
{
  .sectionOne
  {
    margin-top: 50px !important;
  }
}


@media only screen and (min-width: 700px) {
  .visibility-for-narrow-screens{
    display: none;
  }
}

/* CSS for Animations of Buttons & IMG  */

@keyframes moveInLeft {
  0% {
      opacity: 0;
      transform: translate(-10rem);
  }
  80% {
      transform: translateX(2rem);
  }
  100% {
      opacity: 1;
      transform: translate(0);
  }    
}

@keyframes moveInRight {
  0% {
      opacity: 0;
      transform: translate(10rem);
  }
  80% {
      transform: translateX(-2rem);
  }
  100% {
      opacity: 1;
      transform: translate(0);
  }    
}

@keyframes moveInBottom {
  0% {
      opacity: 0;
      transform: translateY(3rem);
  }
  100% {
      opacity: 1;
      transform: translate(0);
  }    
}

/* .home-right-img{
  animation: moveInRight 3s ease-out;
} */


/* New Rotating Text CSS Animation */

@keyframes spin_words {
  
  10%{
    transform: translateY(0%);
  }
  25%{
    transform: translateY(-100%);
  }
  35%{
    transform: translateY(-100%);
  }
  50%{
    transform: translateY(-200%);
  }
  60%{
    transform: translateY(-200%);
  }
  75%{
    transform: translateY(-100%);
  }
  85%{
    transform: translateY(-100%);
  }
  100%{
    transform: translateY(0%);
  }
}


/* Homepage CSS */


/* Homepage CSS for Section 1 */

@media screen and (max-width: 1199px){
  .alignment-s1{
    text-align: center;
  }
}

@media screen and (min-width: 1000px){
  .alignment-s1{
    text-align: left;
  }
}

.btn-1-div{
  height: 60px;
  width: 180px;
}

.btn-2-div{
  height: 60px;
  width: 180px;
  margin-left: 10px;
}
/* 
@media screen and (min-width: 0px) and (max-width: 650px) {
  .img-size{
    width: 250px;
    padding-top: 20px;
  } */
}
/* 
@media only screen and (max-width:400)
        {
          .whatsapp_float{
            position: fixed;
            bottom: 100px;
            right: 2px;
        }
        } */

@media screen and (min-width: 660px) and (max-width: 1150px) {
  .img-size{
    width: 500px;
  }
}
@media screen and (min-width:0px) and (max-width:600px) {
  #indeximg{
    width: 100% !important;
  }
  .medium-font
  {
    width: 300px !important;
  }
}
@media screen and (max-width:1180px)
{
  #indeximg
  {
    width: 600px;
  }
  .medium-font
  {
      width: 309px;
  }
  .sliderSection .slideCard {
    min-width: 520px;
  }
  
}

@media screen and (min-width: 1150px) and (max-width: 1400px) {
  .img-size{
    width: 527px;
  }
}

@media screen and (min-width: 1400px) {
  .img-size{
    width: 800px;
    
  }
}


@media screen and (min-width: 1400px) {
 #indeximg{
  margin-left: 200px;
 }
 .img-size{
  width: 750px;
 }
 section.hero .containerHero 
 {
  margin-right: 200px;
 }
}


/* Homepage CSS for Section 2 */
.container_mid{
  position: relative;
  margin: 5rem 0;
}

.div_1, .div_2{
  position: absolute;
  color: #022859;
  font-family: Inter, SemiBold;
}
.div_1 span, .div_2 span{
  font-weight: bold;
}

@media only screen and (min-width: 1400px) {
  
  .div_1{
    top: 10rem;
    left: 10.5rem;
    padding-left: 2rem;
    border-left: 10px solid #f2d229;
  }
  .div_2{
    bottom: 11rem;
    right: 7rem;
    padding-right: 2rem;
    border-right: 10px solid #f2d229;
    text-align: right;
  }
}

@media only screen and (min-width: 1000px) and (max-width: 1400px) {
  
  .div_1{
    top: 9rem;
    left: 5rem;
    padding-left: 2rem;
    border-left: 10px solid #f2d229;
  }
  .div_2{
    bottom: 7rem;
    right: 3rem;
    padding-right: 1rem;
    border-right: 10px solid #f2d229;
    text-align: right;
  }
}

@media only screen and (min-width: 799px) and (max-width: 1000px) {
  .div_1{
    top: 5rem;
    left: 2rem;
    padding-left: 0.5rem;
    border-left: 10px solid #f2d229;
  }
  .div_2{
    bottom: 4rem;
    right: 1rem;
    padding-right: 0.5rem;
    border-right: 10px solid #f2d229;
    text-align: right;
  }
}

@media only screen and (min-width: 0px) and (max-width: 799px) {
  .nonvisibility-for-narrower-screens{
    display: none;
  }
}

@media only screen and (min-width: 800px) {
  .nonvisibility-for-wider-screens{
    display: none;
  }
}

/* Homepage CSS for Section 3 */

@media only screen and (min-width: 1501px) {
  
  .visibility-for-medium-screens{
    display: none;
  }
}

.section_three_container{
  position: relative;
  text-align: center;
}

.div_1_s3{
  position: absolute;
  display: inline-block;
  margin-top: 4rem;
  margin-left: auto;
  margin-right: auto;
  font-weight: bold;
  font-family: inter, Semibold;
  color: white;
}

@media only screen and (min-width: 800px) and (max-width: 900px) {
  .div_1_s3{
    margin-left: 8rem;
    font-size: 1.8rem;
  }
}

@media only screen and (min-width: 900px) and (max-width: 1050px) {
  .div_1_s3{
    margin-left: 9rem;
    font-size: 2.2rem;
  }
}

@media only screen and (min-width: 1050px) and (max-width: 1000px) {
  .div_1_s3{
    margin-left: 11rem;
    font-size: 2.2rem;
  }
}

@media only screen and (min-width: 1000px) and (max-width: 1350px) {
  .div_1_s3{
    margin-left: 15rem;
    font-size: 2.5rem;
  }
}

@media only screen and (min-width: 1350px) and (max-width: 1500px) {
  .div_1_s3{
    margin-left: 15rem;
    font-size: 3rem;
  }

}

@media screen and (min-width:600px) and (max-width:700px) {
  .text p{
      /* margin: 0 0 !important; */
       margin-right: 0 !important;
       margin-left: 2.5rem !important;
  }
}



@media only screen and (max-width: 799px) {
  .visibility-for-medium-screens{
    display: none;
  }
}

/* Homepage CSS for Section 5 */

.card_div{
  padding: 1rem;
}

.imgContainer_div{
  margin-left: -1rem;
}

.img_div{
  width: 40%;
}

.h1_div{
  color: #022859; 
  font-size: 1.8rem; 
  font-family: Neogrotesk Ess Alt;
}

.p_div{
  font-family: Neogrotesk Ess Alt; 
  font-size: 1.1rem; 
  padding-right: 3rem; 
  text-align: left;
}

/* Homepage CSS for Last Section */

.ls-container{
  margin-bottom: 4rem;
}

.img_ls_div{
  max-width: 100%; 
  width: auto; 
  height: auto; 
  border: 10px solid #FFF4D8; 
  background-color: #FFF4D8; 
  border-radius: 100%;
  margin-bottom: 2rem;
}

.h1_ls_div{
  color: #022859;
  font-weight: bolder;
  padding-bottom: 2rem;
}

.p_ls_div{
  font-size: 1.2rem;
}

.btncontainer_ls_div{
  margin-top: 3rem;
}

@media screen and (max-width: 900px) {
  .btncontainer_ls_div{
    text-align: center;
  }
}

.btnOne_ls_div{
  border: 2px solid #ffe194;
  font-weight: bold;
  background-color: #FFE194;
  padding: 10px 60px;
  margin: 1rem 2rem 1rem 0;
}

.btnOne_ls_div:hover{
  background-color: #fff;
  transition: all 0.5s;
}

.btnTwo_ls_div{
  border: 2px solid #ffe194;
  font-weight: bold;
  background-color: #fff;
  padding: 10px 40px;
  margin: 1rem 2rem 1rem 0;
}

.btnTwo_ls_div:hover{
  background-color: #ffe194;
  transition: all 0.5s;
}
@media only screen and (min-width: 1400px)
{
.big-font {
    font-size: 3.2rem;
    
}
.wrapper.static-txt
{
  margin-top: 0px !important;
}
}

@media only screen and (min-width:1400px)
{
  .wrapper.static-txt
  {
    margin-top: 11px;
  }
  section.hero .leftDiv {
    padding-left: 32%;
    z-index: 2;
    margin: auto;
    margin-top: 75px;
}
}
@media screen and (min-width:1400px) {
  #blogsbtn
  {
    font-size: 2.9rem;
  }
  
}
#blogsbtn{
  font-size: 2.3rem;
}


/* //////////////////////////////////////////// */
/* ICONS SLIDER */
/* ////////////////////////////////////////////// */
/* body{
  min-height: 100vh;
  display: grid;
  place-items: center;
} */

.relative
{
    display: flex;
    padding: 30px;
    background-color: rgb(253, 253, 253);
    box-shadow: 2px 2px 2px 2px grey;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
    overflow: hidden;
}
.flex
{
    display: flex;
   
}
.contain
{
    margin: 0px 40px 0px 40px;
}
h1
{
    display: inline;
}

.scroll
{
    width: 100%;
    height: 100%;
}
.main-class
{
    animation: scroll 20s linear infinite;
}

@keyframes scroll{
    0%
    {
        transform: translatex(0px);
    }
    100%
    {
        transform: translateX(calc(-250px*3));
    }
}

.second-container
{
  width: 80%;
  margin: auto;
  /* margin-top: 2rem; */
  display:-ms-grid;
  display: grid;
  -ms-grid-columns: 2fr 2fr;
  padding-bottom: 4rem;
      grid-template-columns: 1fr 1fr;
      grid-gap: 2rem;
    /* margin-top: 40px; */
    order: 2;
}
.item-grid
{
  width: 490px;
  height: 500px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.item-grid2
{
  width: 490px;
  height: 500px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.item-grid .item1
{
  width:140px ;
  height: 200px;

  border: solid #F2D229 2px;
  border-radius: 25px;
}
.item-grid2 .item1
{
  width:140px ;
  height: 200px;

  border: solid #F2D229 2px;
  border-radius: 25px;
}
.text-grid
{
  display: grid;
  /* vertical-align: middle; */
  align-content: center;
}
.item-grid .item2
{
  width:150px ;
  height: 235px;
  background-color: #022859;
  border-radius: 25px;
}
.item-grid2 .item2
{
  width:150px ;
  height: 235px;
  background-color: #022859;
  border-radius: 25px;
}
.tr1img
{
  display: flex;
  justify-content: center;
  margin: 0px 10px 0px 10px;
  align-items: center;
}

@media screen and (max-width:820px) {
  .tr1img{
    display: flex;
    justify-content: center;
    margin: 0px 10px 0px 10px;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 3rem;
  }
}

.itr1
{
  margin: 0px 10px 0px 10px;
  border-radius: 20px;
  overflow: hidden;
}
.trioimg
{
width: 119px;
height: 100%;
}
.trio{
  display: flex;
  justify-content:center;
  align-items: center;
}



.gridtext2
{
  font-size: 60px;
  font-weight: bold;
}



@media screen and (max-width:600px)
{

  .grid2{
    order:1;
  }

  .item-grid2{
    order:2
  }

  .second-container
{
  width: 80%;
  margin: auto;
  /* margin-top: 2rem; */
  display:-ms-grid;
  display: grid;
  -ms-grid-columns: 2fr 2fr;
  padding-bottom: 4rem;
      grid-template-columns:1fr;
      grid-gap: 2rem;
    /* margin-top: 40px; */
}
.item-grid {
  width: 100%;
  height: 851px;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.item-grid .item2 {
  width: 100%;
  height: 195px;
  background-color: #022859;
  border-radius: 25px;
}
.item-grid2 {
  width: 323px;
    height: 602px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    justify-content: center;
    align-items: center;
    text-align: center;
    row-gap: 14px;
}
.hidden
{
  display: none;
}
}


@media screen and (min-width:601px) and (max-width:880px)
{
  .second-container
  {
    width: 80%;
    margin: auto;
    /* margin-top: 2rem; */
    display:-ms-grid;
    display: grid;
    -ms-grid-columns: 2fr 2fr;
    padding-bottom: 4rem;
        grid-template-columns:1fr;
        grid-gap: 2rem;
      /* margin-top: 40px; */
    text-align: center;
  }
  .text-gridp{
    width: 100% !important;
  }

  .grid2{
    order:1;
  }

  .item-grid2{
    order:2
  }
}

.text-gridp
{
  width: 50%;
}
 @media only screen and (min-width:1400px)
{
  .header .leftHeader {
    margin-left: 97px;
    }
  .rightHeader{
    margin-right: 120px;
  }
}
@media only screen and (min-width:1500px)
{
  .header .leftHeader {
    margin-left: 140px;
    }
  .rightHeader{
    margin-right: 10%;
  }
}

@media only screen and (min-width:1600px)
{
  .header .leftHeader {
    margin-left: 172px;
    }
  .rightHeader{
    margin-right: 12%;
  }
}
#wbutton
{
 color: #022859; 
}
@media only screen and (min-width:1400px) {
  .trioimgs
  {
    width: 150px;
  }
  .trioimg {
    width: 183px;
    height: 100%;
}
}
.trioimgs
  {
    margin: 0px 10px 0px 10px;
  }

@media screen and (min-width:1400px) {
  .hiddentrio
  {
    display: block !important;
  
  }
  .disptrio
  {
    display: none;
  }
}
.hiddentrio
{
  display: none;
}