:root {
  font-family: 'Montserrat', sans-serif;
  font-size: calc(16px + 4 * ((100vw - 350px) / 418));
  line-height: 1.5;
  color: #3b3a3a;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

a {
  text-decoration: none;
  color: #393939;
}
/* * {
  border: red 1px solid !important;
} */

body {
  margin: 0;
  padding: 0;
  display: grid;
  row-gap: 13vh;
  overflow-x: hidden;
}

.P1 {
  display: grid;
  position: relative;
}

.logo {
  display: flex;
  font-weight: 300;
  align-items: center;
  font-size: 1rem;
  letter-spacing: 0.188rem;
  margin: 30px 0 0 30px; /**/
}

.logo img {
  width: 11.73vw;
  height: auto;
  max-width: 50px;
}

.P1-content {
  margin: 80px 0 0 12vw; /**/
  width: 76vw;
  max-width: 550px;
}

.P1-content h1 {
  font-weight: 700;
  font-size: 2.25rem;
  line-height: 2.438rem;
  margin: 0;
}

.P1-content p {
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.375rem;
  margin: 15px 0 0 0; /**/
}

.P1-img {
  overflow-x: hidden;
  margin: 9.85vh 0 0 0; /**/
}

.P1-img img {
  position: relative;
  left: -7.8vw;
  width: 114vw;
  height: auto;
}

.P1-bg {
  position: absolute;
  z-index: -2;
  width: 100%;
  top: 32.5vh;
  overflow-x: hidden;
}

.P1-bg img {
  position: relative;
  left: -70vw;
  width: 170vw;
  height: auto;
}

.P2 {
  display: grid;
  position: relative;
  grid-template-columns: auto;
  grid-template-rows: auto auto;
}

.P2-content {
  /*Combine with P1-ontent?*/
  grid-area: 1/1/2/2;
  margin: 0 0 0 12vw; /**/
  width: 76vw;
  max-width: 550px;
}

.P2-content h2 {
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.625rem;
  margin: 0 0 0 0;
}

.P2-content p {
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.188rem;
  margin: 12px 0 0 0;
}

.P2-icon-grid {
  grid-area: 2/1/3/2;

  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  align-items: start;
  justify-items: center;
  row-gap: 34px; /**/
  column-gap: 3.95vw;

  margin: auto;
  margin-top: 5.54vh;
}

.ig-item {
  display: grid;
  grid-template-rows: 14.13vw auto;
  align-items: start;
  justify-items: center;
  text-align: center;
}

.ig-item p {
  font-weight: 500;
  font-size: 0.813rem;
  line-height: 0.813rem;
  width: 32vw;
  margin: 7px 0 0 0; /**/
}

.ig-item img {
  height: 14.13vw;
  max-height: 75px;
}

.P2-img {
  overflow-x: hidden;
  grid-area: 3/1/4/2;
  margin: 8vh 0 0 0; /**/
}

.P2-img img {
  width: 127.73vw;
  position: relative;
  left: -11.38vw;
}

.P2-bg {
  position: absolute;
  z-index: -2;
  width: 100%;
  top: 46vh;
  overflow-x: hidden;
}

.P2-bg img {
  position: relative;
  width: 170vw;
  height: auto;
}

.P3 {
  display: grid;
  position: relative;
  grid-template-columns: auto;
  grid-template-rows: auto auto auto;
}

.P3-content {
  grid-area: 1/1/2/2;
  margin: 0 0 0 12vw; /**/
  width: 76vw;
  max-width: 550px;
}

.P3-content h2 {
  font-weight: 700;
  font-size: 1.46rem; /*1.5rem*/
  line-height: 1.625rem;
  margin: 0 0 0 0;
}

.P3-content p {
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.188rem;
  margin: 12px 0 0 0;
}

.P3-icon-grid {
  grid-area: 2/1/3/2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  align-items: start;
  justify-items: center;
  column-gap: 9.8vw;

  margin: auto;
  margin-top: 4.98vh;
}

.ig2-item {
  display: grid;
  grid-template-rows: 14.46vw auto;
  align-items: start;
  justify-items: center;
  text-align: center;
}

.ig2-item p {
  font-weight: 500;
  font-size: 0.813rem;
  line-height: 0.813rem;
  width: 32vw;
  margin: 10.3px 0 0 0; /**/
}

.ig2-item img {
  height: 14.46vw;
  max-height: 75px;
}

.P3-img {
  overflow-x: hidden;
  grid-area: 3/1/4/2;
  margin: auto;
  margin-top: 8.5vh; /*7.73vh*/
}

.P3-img img {
  width: 86.4vw;
  position: relative;
}

.P3-bg {
  position: absolute;
  z-index: -2;
  width: 100%;
  top: 18vh;
  overflow-x: hidden;
}

.P3-bg img {
  position: relative;
  left: -27.73vw;
  width: 127.73vw;
  height: auto;
}

.P4-heading {
  font-size: 1rem;
  line-height: 1rem;
  font-weight: 400;
  text-align: center;
}

.swiper-container {
  width: 79.2vw;
  height: 58.37vh;
  min-height: 475px;
  background-color: #dbe1f4;
  border-radius: 21px;
  box-shadow: 0px 99px 99px 0 rgba(0, 0, 0, 0.16);
}

.swiper-slide {
  display: grid;
  width: 79.2vw;
}

.s1-img {
  grid-area: 2/1/3/2;
  align-self: end;
  display: grid;
}

.s1-img img {
  width: 73.06vw;
  align-self: end;
  padding-left: 5.87vw;
}

.s2-img {
  grid-area: 2/1/3/2;
  /* align-self: end; */
  display: grid;
  margin-bottom: 2.68vh;
}

.s2-img img {
  align-self: end;
  width: 70vw; /*75.2vw*/
  padding-left: 3.73vw;
  /* margin-bottom: 2.69vh; */
}

.s3-img {
  grid-area: 2/1/3/2;
  /* align-self: end; */
  display: grid;
  margin-bottom: 2.68vh;
}

.s3-img img {
  align-self: end;
  width: 68.53vw;
  padding-left: 5.33vw;
}

.s1-content {
  grid-area: 1/1/2/2;
  padding: 9.73vw 0 0 9.73vw;
}

.s1-content h3 {
  font-size: 1.48rem; /*1.5rem*/
  line-height: 1.875rem;
  font-weight: 700;
  width: 59.73vw;
  margin: 0;
}

.s1-content p {
  font-size: 1rem;
  line-height: 1.188rem;
  font-weight: 400;
  width: 59.73vw;
  margin: 17px 0 0 0; /**/
}

.swiper-pagination {
  left: 44.4vw;
  margin-top: 0.4vh; /**/
  z-index: 999;
}

.swiper-pagination-bullet,
.swiper-pagination-bullet-active {
  opacity: 1 !important;
  height: 2.4vw !important;
  width: 2.4vw !important;
  background-color: #5e5e5e !important;
  margin-right: 1.33vw; /**/
}

.swiper-pagination-bullet-active {
  background-color: #393939 !important;
}

.swiper-pagination-bullet:focus {
  outline-width: 0px !important;
}

.future-container {
  position: relative;
}

.P4-bg {
  position: absolute;
  z-index: -2;
  width: 100%;
  top: 3vh;
  overflow-x: hidden;
  height: 130%;
}

.P4-bg img {
  position: relative;
  width: 127.73vw;
  height: auto;
}

footer {
  display: grid;
  background-color: #dbe1f4;
}

.footer-content {
  display: grid;
  margin: 46px 0 0 10.4vw; /**/
}

.foot-heading {
  font-size: 1.5rem;
  font-weight: 700;
}

.about-us {
  grid-area: 2/1/3/2;
  margin-top: 57px; /**/
}

.about-us p {
  font-size: 0.875rem;
  line-height: 1.125rem;
  font-weight: 300;
  margin: 6px 0 0 0; /**/
  width: 78.93vw;
}

.get-notified {
  grid-area: 1/1/2/2;
}

.get-notified p {
  font-size: 1rem;
  line-height: 1.188rem;
  margin: 6px 0 0 0; /**/
  font-weight: 300;
  width: 78.93vw;
}

#EmailSub {
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  margin-top: 15px;
  width: 78.93vw;
}

#email {
  width: 65.33vw;
  height: 48px;
  border-radius: 9px;
  border: none;
  padding: 0 3vw;
  font-weight: 300;
  grid-area: 1/1/2/2;
  justify-self: start;
}

input:focus {
  outline: none;
}

#emailicon {
  grid-area: 1/1/2/2;
  align-self: center;
  justify-self: end;
  background-color: #b2c1e0;
  height: 48px;
  width: 18.133vw;
  border-radius: 9px;
  display: grid;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

#emailicon img {
  width: 7.59vw;
}

.copyright {
  text-align: center;
  font-size: 0.688rem;
  line-height: 0.875rem;
  font-weight: 300;
  width: 78.93vw;
  margin: auto;
  margin-top: 54px;
  margin-bottom: 20px;
}

.error-msg {
  padding: 20px;
  background-color: #ff9994;
  color: #393939;
  border-radius: 10px;
  margin-bottom: 15px;
  margin-top: 15px;
  font-size: 1rem;
  width: 76%;
}

.success-msg {
  padding: 20px;
  background-color: #a0e7a0;
  color: #393939;
  border-radius: 10px;
  margin-top: 15px;
  margin-bottom: 15px;
  font-size: 1rem;
  width: 76%;
}

@media only screen and (min-width: 769px) {
  :root {
    font-size: calc(7px + 7 * ((100vw - 769px) / 1151));
  }

  body {
    row-gap: 27vh;
  }

  .P1 {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
  }

  .logo {
    grid-area: 1/1/2/3;
    font-size: 1.813rem;
    margin: 2.6vw 0 0 2.6vw;
  }

  .logo img {
    width: 3.96vw;
    max-width: unset;
  }

  .P1-content {
    grid-area: 2/1/3/2;
    margin: 22.87vh 0 0 8.96vw; /**/
    width: 29vw;
    max-width: unset;
  }

  .P1-content h1 {
    font-size: 4.5rem;
    line-height: 4.875rem;
  }

  .P1-content p {
    font-size: 1.938rem;
    line-height: 2.375rem;
    margin: 10px 0 0 0; /**/
  }

  .P1-img {
    grid-area: 2/2/3/3;
    margin: 7.4vh 0 0 0; /**/
  }

  .P1-img img {
    left: 0vw;
    margin-left: 13vw; /*7vw*/
    width: 45vw; /*48.49vw*/
  }

  .P1-bg {
    top: 1.5vh;
  }

  .P1-bg img {
    left: 35vw;
    width: 65vw;
  }

  .P2 {
    grid-template-columns: auto auto;
    grid-template-rows: min-content;
  }

  .P2-content {
    grid-area: 1/2/2/3;
    margin: 0 0 0 0; /**/
    width: 32.6vw;
    max-width: unset;
  }

  .P2-content h2 {
    font-size: 3.313rem;
    line-height: 3.688rem;
    margin: 10.69vh 0 0 0;
  }

  .P2-content p {
    font-size: 1.813rem;
    line-height: 2.188rem;
    margin: 30px 0 0 0;
  }

  .P2-icon-grid {
    grid-area: 2/2/3/3;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    row-gap: 0px;
    column-gap: 2vw; /*3.47vw*/
    margin: unset;
    margin-top: 5.1vh;
    width: 28.39vw;
  }

  .ig-item {
    grid-template-rows: 3.85vw auto;
  }

  .ig-item p {
    font-size: 0.938rem;
    line-height: 0.938rem;
    width: 6vw;
    margin: 9px 0 0 0; /**/
  }
  .ig-item img {
    height: 3.85vw;
    max-height: unset;
  }

  .P2-img {
    grid-area: 1/1/3/2;
    margin: 0 0 0 1.56vw; /*@@@*/
  }

  .P2-img img {
    width: 55.42vw;
    position: relative;
    left: 0;
  }

  .P2-bg {
    width: 100%;
    top: -19vh;
    overflow-x: hidden;
  }

  .P2-bg img {
    position: relative;
    width: 57.4vw;
    height: auto;
  }

  .P3 {
    grid-template-columns: auto auto;
    grid-template-rows: min-content;
  }

  .P3-content {
    grid-area: 1/1/2/2;
    margin: 0 0 0 7.8125vw; /**/
    width: 33.07vw;
    max-width: unset;
  }

  .P3-content h2 {
    font-size: 3.313rem;
    line-height: 3.688rem;
    margin: 0 0 0 0;
  }

  .P3-content p {
    font-size: 1.813rem;
    line-height: 2.188rem;
    margin: 30px 0 0 0;
  }

  .P3-icon-grid {
    display: grid;
    grid-template-columns: min-content min-content;
    grid-template-rows: 1fr;

    column-gap: 3.4375vw;

    margin: auto;
    margin-top: 7.6vh; /*8.8vh*/
  }

  .ig2-item {
    grid-template-rows: 3.85vw auto;
  }

  .ig2-item p {
    font-size: 0.938rem;
    line-height: 0.938rem;
    width: 8vw; /*7.08vw*/
    margin: 10.3px 0 0 0; /**/
  }

  .ig2-item img {
    height: 3.85vw;
    max-height: unset;
  }

  .P3-img {
    grid-area: 1/2/2/3;
    margin: 0; /*7.73vh*/
  }

  .P3-img img {
    width: 47.4vw;
  }

  .P3-bg {
    width: 100%;
    top: -25.5vh;
  }

  .P3-bg img {
    left: 42.6vw;
    width: 57.4vw;
  }

  .P4-heading {
    font-size: 2.375rem;
    line-height: 3.125rem;
    margin: 0;
    margin-bottom: 22px;
  }

  .swiper-container {
    width: 79.6875vw;
    height: 40.10625vw; /*71.3vh*/
  }

  .swiper-slide {
    display: grid;
    width: 79.6875vw;
    grid-template-columns: auto auto;
  }

  .s1-img {
    grid-area: 1/1/2/2;
    width: 47;
  }

  .s1-img img {
    width: 43.125vw;
    padding-left: 3.07vw;
  }

  .s2-img {
    grid-area: 1/1/2/2;
    width: 47;
    margin-bottom: 4.7vh;
  }

  .s2-img img {
    width: 42.55vw;
    padding-left: 3.02vw;
  }

  .s3-img {
    grid-area: 1/1/2/2;
    width: 40.47vw;
    margin-bottom: 6.48vh;
  }

  .s3-img img {
    width: 40.47vw;
    padding-left: 3.9vw;
  }

  .s1-content {
    grid-area: 1/2/2/3;
    padding: 0;
    align-self: center;
  }

  .s1-content h3 {
    font-size: 3.125rem;
    line-height: 3.75rem;
    width: 25vw;
    margin: 0;
  }

  .s1-content p {
    font-size: 1.813rem;
    line-height: 2.188rem;
    width: 25vw;
    margin: 17px 0 0 0; /**/
  }

  .swiper-pagination {
    left: 47.8vw;
    margin-top: 2vh; /**/
    z-index: 999;
  }

  .swiper-pagination-bullet,
  .swiper-pagination-bullet-active {
    height: 0.78vw !important;
    width: 0.78vw !important;
    margin-right: 0.42vw; /**/
  }

  .P4-bg {
    top: -11.38vh;
    height: 170%;
    overflow-y: hidden;
  }

  .P4-bg img {
    width: 57.4vw;
  }

  /*______*/
  .footer-content {
    margin: 94px 7.97vw 0 7.97vw; /**/
    grid-template-rows: auto;
    grid-template-columns: auto auto;
    justify-content: space-between;
  }

  .foot-heading {
    font-size: 2.688rem;
  }

  .about-us {
    grid-area: 1/1/2/2;
    margin-top: 0; /**/
  }

  .about-us p {
    font-size: 1.375rem;
    line-height: 1.688rem;
    /* margin: 6px 0 0 0;  */
    width: 27.08vw;
  }

  .get-notified {
    grid-area: 1/2/2/3;
  }

  .get-notified p {
    font-size: 1.375rem;
    line-height: 1.688rem;
    /* margin: 6px 0 0 0;  */
    width: 22.4vw;
  }

  #EmailSub {
    /* margin-top: 15px; */
    width: 22.4vw;
  }

  #email {
    width: 18.22vw;
    font-size: 1.063m;
    height: 72px;
    height: 6.67vh;
    padding: 0 0.59vw;
  }

  #emailicon {
    height: 72px;
    height: 6.67vh;
    width: 5.41vw;
    transition: 0.5s;
  }

  #emailicon:hover {
    color: #393939;
  }

  #emailicon img {
    width: 2.266vw;
  }

  .copyright {
    font-size: 1.063rem;
    line-height: 1.25rem;
    width: 80vw;
    margin-top: 75px;
  }

  .error-msg {
    width: unset;
  }

  .success-msg {
    width: unset;
  }
}
