/*
0 - 600px:      Phone
600 - 900px:    Tablet portrait
900 - 1200px:   Tablet landscape
[1200 - 1800] is where our normal styles apply
1800px + :      Big desktop

$breakpoint arguement choices:
- phone
- tab-port
- tab-land
- big-desktop

ORDER: Base + typography > general layout + grid > page layout > components

1em = 16px
*/
/********** Color **********/
/********** fonts **********/
/********** Box-Shadow **********/
*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: inherit; }

html {
  font-size: 62.5%;
  transition: all .5s ease-out; }
  @media only screen and (max-width: 75em) {
    html {
      font-size: 51.25%;
      transition: all .5s ease-out; } }
  @media only screen and (max-width: 56.25em) {
    html {
      font-size: 45%;
      transition: all .5s ease-out; } }
  @media only screen and (min-width: 112.5em) {
    html {
      font-size: 70%;
      transition: all .5s ease-out; } }

body {
  box-sizing: border-box;
  background-color: #fff;
  width: 100%;
  height: 100%; }
  @media only screen and (max-width: 56.25em) {
    body {
      padding: 0; } }

*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: inherit; }

html {
  font-size: 62.5%;
  transition: all .5s ease-out; }
  @media only screen and (max-width: 75em) {
    html {
      font-size: 51.25%;
      transition: all .5s ease-out; } }
  @media only screen and (max-width: 56.25em) {
    html {
      font-size: 45%;
      transition: all .5s ease-out; } }
  @media only screen and (min-width: 112.5em) {
    html {
      font-size: 70%;
      transition: all .5s ease-out; } }

body {
  box-sizing: border-box;
  background-color: #fff;
  width: 100%;
  height: 100%; }
  @media only screen and (max-width: 56.25em) {
    body {
      padding: 0; } }

/********** Utilities **********/
.u-display-none {
  display: none !important; }

.u-display-block {
  display: block !important; }

.u-link {
  text-decoration: none !important; }

.u-blur {
  filter: blur(5px) !important; }

.u-align-center {
  align-items: center !important;
  text-align: center; }

.u-rotate-down {
  transform: rotate(180deg);
  transition: all ease-out .3s; }

.u-rotate-right {
  transform: rotate(90deg);
  transition: all ease-out .3s; }

.u-rotate-left {
  transform: rotate(270deg);
  transition: all ease-out .3s; }

/********** button **********/
.btn {
  border: none;
  background-color: transparent;
  cursor: pointer; }

.btn-nav {
  width: 18.9rem;
  height: 5.8rem;
  border-radius: 78px;
  background-color: #00CBE0;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem; }
  .btn-nav-img {
    width: 2.7rem;
    height: 3.5rem; }
  .btn-nav .btn {
    color: #fff;
    font-family: "Quicksand", sans-serif;
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal; }
  .btn-nav:hover {
    box-shadow: 10px 10px 32px -4px rgba(24, 39, 75, 0.15), 0px 6px 14px -6px rgba(24, 39, 75, 0.17);
    transition: all .5s ease-out; }

/********** Form Box **********/
.form-box {
  width: 100%;
  height: auto;
  padding: 3rem 5rem;
  border-radius: 2rem;
  background: #00CBE0;
  box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  justify-self: center; }
  .form-box:hover {
    transform: translateY(-5px);
    transition: all ease-out .3s; }
  .form-box-download {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2rem; }
    .form-box-download-btn {
      color: #fff;
      text-align: center;
      font-family: "Quicksand", sans-serif;
      font-size: 1.6rem;
      font-style: normal;
      font-weight: 700;
      line-height: normal;
      border: 1px solid #fff;
      border-radius: .5rem;
      padding: 0.5rem 5rem; }
      .form-box-download-btn:hover {
        background-color: #fff;
        color: #00CBE0;
        transition: all ease-out .3s; }
  .form-box-para {
    color: #fff;
    font-family: "Quicksand", sans-serif;
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-align: center; }

/********** Header **********/
.header {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: .4rem; }
  @media only screen and (max-width: 56.25em) {
    .header {
      align-items: center; } }
  .header-top {
    color: #00CBE0;
    font-family: "Roboto", sans-serif;
    font-size: 2.4rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal; }
    @media only screen and (max-width: 56.25em) {
      .header-top {
        text-align: center; } }
  .header-bottom {
    color: #002D5D;
    font-family: "Quicksand", sans-serif;
    font-size: 3.6rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal; }
    @media only screen and (max-width: 56.25em) {
      .header-bottom {
        text-align: center; } }

/********** Nav **********/

.nav {
  width: 100%;
  height: 12.5rem;
  background-color: #fff;
  box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
  padding: 0 4rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 2.5rem;
  position: relative;
  z-index: 99999; }
  .nav-logo-img {
    width: 19.9rem;
    height: 6.9rem; }
  .nav-links {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2.5rem;
    margin-left: auto; }
  .nav-link {
    color: #002D5D;
    font-family: "Quicksand", sans-serif;
    font-size: 1.6rem;
    font-style: normal;
    font-weight: 700; }
    .nav-link:hover {
      transform: translateY(-2px);
      color: #00CBE0;
      transition: all .5s ease-out;}


.mob-nav {
  display: none; }

@media only screen and (max-width: 56.25em) {
  .nav {
    display: none; }
  .mob-nav {
    display: flex; }
    .mob-nav .menu-img, .mob-nav .close-img {
      width: 2.4rem;
      height: 2.4rem;
      margin-left: auto; }
    .mob-nav-links {
      width: 40%;
      height: auto;
      padding: 2rem;
      background-color: #fff;
      box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 2rem;
      position: absolute;
      top: 12.5rem;
      right: 0; }
    .mob-nav-link {
      color: #002D5D;
      font-family: "Quicksand", sans-serif;
      font-size: 1.6rem;
      font-style: normal;
      font-weight: 700; }
      .mob-nav-link:hover {
        transform: translateY(-2px);
        color: #00CBE0;
        transition: all .5s ease-out; }
    .mob-nav .btn-nav {
      width: 13.9rem;
      height: 5.8rem; }
      .mob-nav .btn-nav-img {
        width: 1.7rem;
        height: 2.5rem; }
      .mob-nav .btn-nav .btn {
        color: #fff;
        font-family: "Quicksand", sans-serif;
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 700;
        line-height: normal; } }

.opacity0-mob-nav {
  display: none;
  width: 0px;
  height: 0px;
  opacity: 0;
  transform: translateX(365px);
  transition: all ease-out .3s; }

.opacity1-mob-nav {
  opacity: 1;
  transform: translateX(0px);
  transition: all ease-out .3s; }

/********** Title **********/
.title {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 5rem;
  margin: 1rem 0; }
  .title-box {
    color: #002D5D;
    text-align: center;
    font-family: "Quicksand", sans-serif;
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    cursor: pointer;
    padding: 1rem 5rem;
    border: 1px solid #00CBE0;
    border-radius: 0.5rem;
    background-color: #fff;
    box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12); }
    .title-box:hover {
      background-color: #00CBE0;
      color: #fff;
      transition: all ease-out .3s; }
  @media only screen and (max-width: 37.5em) {
    .title {
      gap: 2rem; } }

/********** Top-bar **********/
.top-bar {
  width: 100%;
  height: 5rem;
  background: linear-gradient(97deg, #00CBE0 0.4%, #002D5D 100.52%);
  box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
  z-index: 99999; }

/********** Container **********/
.container {
  padding: 0 9rem; }
  @media only screen and (max-width: 56.25em) {
    .container {
      padding: 7.5rem; } }

/********** Footer **********/
.footer {
  width: 100%;
  height: auto;
  padding: 6rem 0 3rem 0;
  background-image: url(../images/footer-bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: repeat; }
  @media only screen and (max-width: 56.25em) {
    .footer {
      height: 100%; } }
  .footer-inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10rem; }
    @media only screen and (max-width: 56.25em) {
      .footer-inner {
        flex-direction: column;
        align-items: center; } }
    .footer-inner-1 {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      gap: 2rem;
      width: 93%; }
      @media only screen and (max-width: 56.25em) {
        .footer-inner-1 {
          width: 100%;
          align-items: center; } }
      .footer-inner-1-icons {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 2rem; }
        .footer-inner-1-icons .instagram {
          display: inline-block;
          width: 4rem;
          height: 3rem;
          fill: #00CBE0; }
          .footer-inner-1-icons .instagram:hover {
            fill: #fff; }
        .footer-inner-1-icons .facebook {
          display: inline-block;
          width: 4rem;
          height: 3rem;
          fill: #00CBE0; }
          .footer-inner-1-icons .facebook:hover {
            fill: #fff; }
        .footer-inner-1-icons .linkedin {
          display: inline-block;
          width: 4rem;
          height: 3rem;
          fill: #00CBE0; }
          .footer-inner-1-icons .linkedin:hover {
            fill: #fff; }
        .footer-inner-1-icons .twitter {
          display: inline-block;
          width: 4rem;
          height: 3rem;
          fill: #00CBE0; }
          .footer-inner-1-icons .twitter:hover {
            fill: #fff; }
      .footer-inner-1-para {
        color: #E1FBFF;
        font-family: "Roboto Slab", serif;
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 400;
        line-height: normal; }
        @media only screen and (max-width: 56.25em) {
          .footer-inner-1-para {
            text-align: center; } }
        .footer-inner-1-para-1 {
          font-size: 2.4rem;
          font-weight: 700; }
    .footer-inner-2 {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: flex-start;
      gap: 2rem;
      width: 40%; }
      @media only screen and (max-width: 56.25em) {
        .footer-inner-2 {
          width: 100%;
          align-items: center; } }
      .footer-inner-2-head {
        color: #E1FBFF;
        font-family: "Quicksand", sans-serif;
        font-size: 2.8rem;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        border-bottom: 1px solid #fff;
        width: 40%; }
        @media only screen and (max-width: 56.25em) {
          .footer-inner-2-head {
            width: 100%;
            text-align: center; } }
      .footer-inner-2-links {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: 2rem; }
        @media only screen and (max-width: 56.25em) {
          .footer-inner-2-links {
            width: 100%;
            align-items: center; } }
      .footer-inner-2-link {
        color: #E1FBFF;
        font-family: "Quicksand", sans-serif;
        font-size: 2rem;
        font-style: normal;
        font-weight: 700;
        line-height: normal; }
    .footer-inner-3 {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: flex-start;
      gap: 2rem;
      width: 77%; }
      @media only screen and (max-width: 56.25em) {
        .footer-inner-3 {
          width: 100%;
          align-items: center; } }
      .footer-inner-3-head {
        color: #E1FBFF;
        font-family: "Quicksand", sans-serif;
        font-size: 3.2rem;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        border-bottom: 1px solid #fff;
        width: 50%; }
        @media only screen and (max-width: 56.25em) {
          .footer-inner-3-head {
            width: 100%;
            text-align: center; } }
      .footer-inner-3-links {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: 2rem; }
        @media only screen and (max-width: 56.25em) {
          .footer-inner-3-links {
            width: 100%;
            align-items: center; } }
      .footer-inner-3-link {
        color: #E1FBFF;
        font-family: "Roboto Slab", serif;
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 400;
        line-height: normal; }
        @media only screen and (max-width: 56.25em) {
          .footer-inner-3-link {
            width: 100%;
            text-align: center; } }
  .footer-copyrights {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-top: 5rem;
    color: #E1FBFF;
    font-family: "Quicksand", sans-serif;
    font-size: 1.2rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal; }
    .footer-copyrights hr {
      height: 1px;
      width: 50%; }

/********** Section-2 **********/
.section-2 {
  position: relative; }
  .section-2 .box-2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 0.2rem;
    margin-top: -75px;
    z-index: 2;
    position: relative; }
    @media only screen and (max-width: 56.25em) {
      .section-2 .box-2 {
        flex-direction: column;
        margin-top: 0px;
        gap: 1rem; } }
    .section-2 .box-2 .qty {
      border-radius: 2rem 0rem 0rem 2rem; }
    .section-2 .box-2 .care {
      border-radius: 0rem 2rem 2rem 0rem; }
    .section-2 .box-2 .qty, .section-2 .box-2 .conv, .section-2 .box-2 .care {
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 1rem;
      width: 23.2rem;
      height: 20rem;
      background-color: #fff;
      box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12); }
      @media only screen and (max-width: 56.25em) {
        .section-2 .box-2 .qty, .section-2 .box-2 .conv, .section-2 .box-2 .care {
          width: 34.7rem;
          height: 20rem;
          border-radius: 1rem 1rem 1rem 1rem; } }
      .section-2 .box-2 .qty-img, .section-2 .box-2 .conv-img, .section-2 .box-2 .care-img {
        width: 8rem;
        height: auto; }
      .section-2 .box-2 .qty-para, .section-2 .box-2 .conv-para, .section-2 .box-2 .care-para {
        color: #002D5D;
        text-align: center;
        font-family: "Quicksand", sans-serif;
        font-size: 2.4rem;
        font-style: normal;
        font-weight: 700; }
  .section-2 .short-dec {
    margin-left: auto;
    width: 34.7rem;
    height: 20rem;
    padding: 2rem;
    border-radius: 2rem;
    background-color: #00CBE0;
    box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 1rem; }
    @media only screen and (max-width: 56.25em) {
      .section-2 .short-dec {
        margin-left: 0; } }
    .section-2 .short-dec-head {
      display: block;
      color: #fff;
      font-family: "Quicksand", sans-serif;
      font-size: 2rem;
      font-style: normal;
      font-weight: 700;
      line-height: normal; }
    .section-2 .short-dec-para {
      display: block;
      color: #fff;
      font-family: "Roboto Slab", serif;
      font-size: 1.6rem;
      font-style: normal;
      font-weight: 400;
      line-height: normal; }
    .section-2 .short-dec-img {
      position: absolute;
      right: 0;
      bottom: 0; }

/********** Section-3 **********/
.section-3 {
  position: relative;
  margin: 7.5rem 0; }
  .section-3 .inner-sec-3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 4rem 0; }
    @media only screen and (max-width: 56.25em) {
      .section-3 .inner-sec-3 {
        flex-direction: column;
        gap: 2.5rem; } }
    .section-3 .inner-sec-3--1 {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; }
      .section-3 .inner-sec-3--1-top {
        color: #002D5D;
        font-family: "Quicksand", sans-serif;
        font-size: 12.8rem;
        font-style: normal;
        font-weight: 400; }
      .section-3 .inner-sec-3--1-bottom {
        color: #002D5D;
        font-family: "Quicksand", sans-serif;
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 700;
        line-height: normal; }
    .section-3 .inner-sec-3--2 {
      width: 52rem;
      text-align: justify; }
      @media only screen and (max-width: 56.25em) {
        .section-3 .inner-sec-3--2 {
          width: 100%; } }
      .section-3 .inner-sec-3--2-para {
        color: #7990AA;
        font-family: "Roboto Slab", serif;
        font-size: 2.4rem;
        font-style: normal;
        font-weight: 400;
        line-height: normal; }
    .section-3 .inner-sec-3--3 {
      width: 34.7rem;
      height: 17.8rem;
      border-radius: .5rem;
      box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
      overflow: hidden; }
      @media only screen and (max-width: 56.25em) {
        .section-3 .inner-sec-3--3 {
          width: 100%;
          height: auto; } }
      .section-3 .inner-sec-3--3-img {
        width: 100%;
        height: 100%; }

/********** Section-4 **********/
.section-4 {
  width: 100%;
  height: 100%;
  padding: 6rem 0;
  background-image: url(../images/section4-bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: repeat; }
  .section-4-inner {
    display: flex;
    justify-content: center;
    align-items: center; }
    @media only screen and (max-width: 56.25em) {
      .section-4-inner {
        flex-direction: column;
        gap: 2.5rem; } }
  .section-4-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 3rem;
    width: 50%; }
    @media only screen and (max-width: 56.25em) {
      .section-4-left {
        align-items: center;
        width: 100%; } }
    .section-4-left-para {
      color: #002D5D;
      font-family: "Roboto Slab", serif;
      font-size: 1.6rem;
      font-style: normal;
      font-weight: 400;
      line-height: normal; }
      @media only screen and (max-width: 56.25em) {
        .section-4-left-para {
          text-align: center; } }
    .section-4-left-img {
      width: 53.8rem;
      height: 36.3rem;
      border-radius: .5rem;
      box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
      overflow: hidden; }
      @media only screen and (max-width: 56.25em) {
        .section-4-left-img {
          width: 100%;
          height: auto; } }
      .section-4-left-img--1 {
        width: 100%;
        height: 100%; }
  .section-4-right {
    width: 50%; }
    @media only screen and (max-width: 56.25em) {
      .section-4-right {
        width: 100%; } }
    .section-4-right-boxes {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-end;
      gap: 2rem; }
      @media only screen and (max-width: 56.25em) {
        .section-4-right-boxes {
          align-items: center; } }
    .section-4-right-box {
      width: 45.1rem;
      height: 12rem;
      background-color: #fff;
      box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
      border-radius: 2rem;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      gap: 1rem;
      overflow: hidden; }
      @media only screen and (max-width: 56.25em) {
        .section-4-right-box {
          flex-direction: column;
          width: 100%;
          height: auto; } }
      .section-4-right-box-left {
        width: auto;
        height: 100%;
        padding: 3.4rem;
        background-color: #00CBE0;
        border-radius: 2rem 0rem 0rem 2rem;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative; }
        @media only screen and (max-width: 56.25em) {
          .section-4-right-box-left {
            width: 100%;
            border-radius: 2rem 2rem 0rem 0rem; } }
        .section-4-right-box-left-icon {
          width: 4.8rem;
          height: auto; }
        .section-4-right-box-left-plus {
          position: absolute;
          top: 1rem;
          right: 1rem; }
      .section-4-right-box-right {
        background-color: #fff; }
        .section-4-right-box-right-box {
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: flex-start; }
          @media only screen and (max-width: 56.25em) {
            .section-4-right-box-right-box {
              align-items: center;
              padding: 3rem 1rem;
              text-align: center; } }
        .section-4-right-box-right-head {
          color: #002D5D;
          font-family: "Quicksand", sans-serif;
          font-size: 2rem;
          font-style: normal;
          font-weight: 700;
          line-height: normal; }
        .section-4-right-box-right-para {
          color: #7990AA;
          font-family: "Roboto Slab", serif;
          font-size: 1.6rem;
          font-style: normal;
          font-weight: 400;
          line-height: normal; }

/********** Section-5 **********/
.section-5 {
  position: relative;
  margin: 7.5rem 0; }
  .section-5-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 3rem;
    padding: 7.5rem 0; }
    @media only screen and (max-width: 56.25em) {
      .section-5-inner {
        flex-direction: column;
        gap: 2.5rem; } }
  .section-5-left {
    width: 100%; }
    .section-5-left-img {
      width: 61.3rem;
      height: 41.2rem;
      border-radius: .5rem;
      box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
      overflow: hidden; }
      @media only screen and (max-width: 56.25em) {
        .section-5-left-img {
          width: 100%;
          height: auto; } }
      .section-5-left-img-1 {
        width: 100%;
        height: auto; }
  .section-5-right {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    gap: 1rem; }
    .section-5-right-box {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.1rem; }
      .section-5-right-box-top {
        width: 100%;
        height: 5.6rem;
        padding: 0 2rem;
        background-color: #00CBE0;
        border-radius: .5rem;
        box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
        display: flex;
        justify-content: space-between;
        align-items: center;
        z-index: 2; }
        .section-5-right-box-top-head {
          color: #fff;
          font-family: "Quicksand", sans-serif;
          font-size: 2rem;
          font-style: normal;
          font-weight: 700;
          line-height: normal; }
        .section-5-right-box-top-img {
          width: 2.4rem;
          height: auto; }
      .section-5-right-box-bottom {
        width: 100%;
        height: 0;
        padding: 0;
        background-color: #00CBE0;
        border-radius: .5rem;
        box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 1;
        transform: translateY(-5.8rem);
        opacity: 0;
        transition: all ease-out .3s; }
        .section-5-right-box-bottom-para {
          color: #fff;
          font-family: "Roboto Slab", serif;
          font-size: 1.6rem;
          font-style: normal;
          font-weight: 400;
          line-height: normal; }

.bottom-trans {
  width: 100%;
  height: auto;
  padding: 2rem;
  transform: translateY(0rem);
  opacity: 1;
  transition: all ease-out .3s;
  z-index: 2; }

/********** Section-6 **********/
.section-6-para {
  display: flex;
  justify-content: center;
  margin: 3rem 0;
  color: #7990AA;
  text-align: center;
  font-family: "Roboto Slab", serif;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal; }

.section-6-inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(26rem, 1fr));
  gap: 2.5rem;
  justify-content: center;
  margin: 5rem 0;
  position: relative; }
  .section-6-inner-img {
    width: 26rem;
    height: 40rem;
    border-radius: .5rem;
    box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
    overflow: hidden;
    position: relative;
    z-index: 1;
    justify-self: center; }
    .section-6-inner-img-1 {
      width: 100%;
      height: auto; }
  .section-6-inner-name {
    width: 26rem;
    height: 8.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    border-radius: 2.9rem 0rem .5rem .5rem;
    background: linear-gradient(180deg, rgba(0, 45, 93, 0.45) 0%, rgba(0, 45, 93, 0.9) 100%);
    position: absolute;
    bottom: 0;
    z-index: 2; }
    .section-6-inner-name-1 {
      color: #fff;
      font-family: "Quicksand", sans-serif;
      font-size: 2rem;
      font-style: normal;
      font-weight: 700;
      line-height: normal; }
  .section-6-inner-description {
    width: 26rem;
    height: 40rem;
    border-radius: .5rem;
    padding: 3rem;
    box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
    background: linear-gradient(203deg, rgba(0, 203, 224, 0.9) 1.48%, rgba(0, 45, 93, 0.9) 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 2rem;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    opacity: 0; }
    .section-6-inner-description:hover {
      opacity: 1;
      animation: zoom-in-zoom-out .3s ease-out; }

@keyframes zoom-in-zoom-out {
  0% {
    opacity: .5;
    transform: scale(0.9, 0.9); }
  100% {
    transform: scale(1, 1); } }
    .section-6-inner-description hr {
      height: 1px;
      width: 50%;
      background-color: #fff; }
    .section-6-inner-description-head {
      color: #fff;
      font-family: "Quicksand", sans-serif;
      font-size: 2rem;
      font-style: normal;
      font-weight: 700;
      line-height: normal; }
    .section-6-inner-description-para {
      color: #fff;
      font-family: "Roboto Slab", serif;
      font-size: 1.6rem;
      font-style: normal;
      font-weight: 400;
      line-height: normal; }

/********** Section-7 **********/
.section-7 {
  width: 100%;
  height: 490px;
  padding: 6rem 0;
  background-image: url(../images/section7-bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: repeat; }
  .section-7-inner {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    position: relative; }
    .section-7-inner-slide {
      width: 950px;
      height: 325px;
      background-color: #fff;
      border-radius: 2rem;
      box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative; }
      .section-7-inner-slide-1 {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        gap: 1rem;
        width: 70%;
        animation: zoom-in-zoom-out .3s ease-out; }

@keyframes zoom-in-zoom-out {
  0% {
    opacity: .5;
    transform: scale(0.9, 0.9); }
  100% {
    transform: scale(1, 1); } }
        .section-7-inner-slide-1--1 {
          width: 12.5rem;
          height: 12.5rem; }
          .section-7-inner-slide-1--1-img {
            width: 100%;
            height: 100%;
            border-radius: 125px; }
        .section-7-inner-slide-1-name {
          color: #002D5D;
          text-align: center;
          font-family: "Quicksand", sans-serif;
          font-size: 2rem;
          font-style: normal;
          font-weight: 700;
          line-height: normal; }
        .section-7-inner-slide-1-designation {
          color: #7990AA;
          text-align: center;
          font-family: "Quicksand", sans-serif;
          font-size: 1.4rem;
          font-style: normal;
          font-weight: 700;
          line-height: normal; }
        .section-7-inner-slide-1-word {
          color: #7990AA;
          text-align: center;
          font-family: "Roboto Slab", serif;
          font-size: 1.6rem;
          font-style: normal;
          font-weight: 400;
          line-height: normal;
          padding-top: 1rem; }
    .section-7-inner .box-left {
      right: 0; }
    .section-7-inner .box-right {
      left: 0; }
    .section-7-inner .box {
      display: flex;
      flex-direction: column;
      gap: .5rem;
      position: absolute;
      top: 50%;
      transform: translateY(-50%); }
      .section-7-inner .box-top {
        display: inline-block;
        width: 1.5rem;
        height: 1.5rem;
        background-color: #00CBE0; }
      .section-7-inner .box-bottom {
        display: inline-block;
        width: 1.5rem;
        height: 1.5rem;
        background-color: #002D5D; }
    .section-7-inner-arrow {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 2rem;
      position: absolute;
      top: -35px;
      right: 20px; }
      .section-7-inner-arrow-left, .section-7-inner-arrow-right {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 25px;
        height: 25px;
        border-radius: 100px;
        background: #fff;
        box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12); }
  .section-7 .quat {
    width: 10rem;
    height: auto;
    position: absolute;
    top: 3rem;
    left: 3rem; }
    @media only screen and (max-width: 37.5em) {
      .section-7 .quat {
        width: 5rem;
        height: auto; } }

/********** Section-8 **********/
.section-8 {
  margin: 7.5rem 0; }
  .section-8-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    overflow: hidden;
    width: 100%;
    height: 25rem;
    border-radius: 2rem;
    background: #fff;
    box-shadow: 0px 4px 50px 10px rgba(212, 212, 212, 0.25), 0px -4px 50px 10px rgba(212, 212, 212, 0.25); }
    @media only screen and (max-width: 37.5em) {
      .section-8-inner {
        flex-direction: column;
        height: auto;
        padding: 5rem 0 0 0; } }
    .section-8-inner-left {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      gap: 1rem;
      margin-left: 3rem;
      width: 50%; }
      @media only screen and (max-width: 37.5em) {
        .section-8-inner-left {
          align-items: center;
          width: 80%;
          margin-left: 0rem; } }
      @media only screen and (max-width: 56.25em) {
        .section-8-inner-left .header {
          align-items: flex-start; } }
      .section-8-inner-left-para {
        color: #7990AA;
        font-family: "Roboto Slab", serif;
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 400;
        line-height: normal; }
        @media only screen and (max-width: 37.5em) {
          .section-8-inner-left-para {
            text-align: center; } }
    .section-8-inner-right {
      width: 50%;
      height: 25rem;
      background-image: linear-gradient(97deg, #002D5D 0.4%, #00CBE0 100.52%);
      clip-path: polygon(25% 0%, 100% 0%, 100% 100%, 0% 100%);
      position: relative; }
      @media only screen and (max-width: 37.5em) {
        .section-8-inner-right {
          width: 100%;
          clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%); } }
      .section-8-inner-right--1 {
        width: 24.8rem;
        height: 24.8rem;
        position: absolute;
        left: 20%;
        bottom: 0%; }
        @media only screen and (max-width: 37.5em) {
          .section-8-inner-right--1 {
            left: 10%; } }
      .section-8-inner-right--2 {
        width: 19rem;
        height: 24.6rem;
        position: absolute;
        bottom: 0;
        right: 0; }
  .section-8 .header {
    gap: 0.2rem; }
    .section-8 .header-top {
      font-size: 1.6rem; }
    .section-8 .header-bottom {
      font-size: 2rem; }
  .section-8 .btn-nav {
    width: 22.9rem;
    margin-top: 1rem; }

/********** Section-1 **********/
.section-1 {
  position: relative; }
  .section-1 .top-img {
    width: 100%;
    height: auto; }
  .section-1 .doctors {
    width: 69.8rem;
    height: 46.5rem;
    position: absolute;
    bottom: 0;
    right: 9rem; }
    @media only screen and (max-width: 75em) {
      .section-1 .doctors {
        width: 69.8rem;
        height: 46.5rem; } }
    @media only screen and (max-width: 37.5em) {
      .section-1 .doctors {
        display: none; } }
  .section-1 .top-header {
    color: #002D5D;
    font-family: "Quicksand", sans-serif;
    font-size: 6.4rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    position: absolute;
    top: 30%;
    left: 9rem; }
    @media only screen and (max-width: 37.5em) {
      .section-1 .top-header {
        font-size: 4.8rem;
        text-align: center;
        left: 50%;
        transform: translateX(-50%);
        width: 100%; } }

/********** About-Us **********/
.about {
  margin: 7.5rem 0; }
  .about-us {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 3rem;
    margin: 7.5rem 0; }
    .about-us-head {
      color: #002D5D;
      font-family: "Quicksand", sans-serif;
      font-size: 3.6rem;
      font-style: normal;
      font-weight: 700;
      line-height: normal; }
    .about-us-subhead {
      color: #002D5D;
      font-family: "Quicksand", sans-serif;
      font-size: 2rem;
      font-style: normal;
      font-weight: 700;
      line-height: normal;
      margin-bottom: -2rem; }
    .about-us-para {
      color: #7990AA;
      font-family: "Roboto Slab", serif;
      font-size: 1.6rem;
      font-style: normal;
      font-weight: 400;
      line-height: normal; }

.health-care {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 3rem;
  margin: 7.5rem 0; }
  .health-care-head {
    color: #002D5D;
    font-family: "Quicksand", sans-serif;
    font-size: 3.6rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal; }
  .health-care-para {
    color: #7990AA;
    font-family: "Roboto Slab", serif;
    font-size: 1.6rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal; }

.faq-head {
  color: #002D5D;
  font-family: "Quicksand", sans-serif;
  font-size: 3.6rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal; }

.faq .section-5 {
  margin-top: 3rem; }

.credentials {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 3rem;
  margin: 7.5rem 0; }
  .credentials-head {
    color: #002D5D;
    font-family: "Quicksand", sans-serif;
    font-size: 3.6rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal; }
  .credentials-subhead {
    color: #002D5D;
    font-family: "Quicksand", sans-serif;
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-bottom: -2rem; }
  .credentials-para {
    color: #7990AA;
    font-family: "Roboto Slab", serif;
    font-size: 1.6rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal; }
  .credentials-links {
    color: #7990AA;
    font-family: "Roboto Slab", serif;
    font-size: 1.6rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin-left: 3rem; }

/********** Contact-Us **********/
.contact-us {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 7.5rem 0;
  box-shadow: 0px 18px 88px -4px rgba(24, 39, 75, 0.14), 0px 8px 28px -6px rgba(24, 39, 75, 0.12);
  border-radius: 0.5rem;
  overflow: hidden; }
  @media only screen and (max-width: 37.5em) {
    .contact-us {
      flex-direction: column; } }
  .contact-us-left {
    width: 30%;
    background: var(--Gradient, linear-gradient(97deg, #002D5D 0.4%, #00CBE0 100.52%)); }
    @media only screen and (max-width: 37.5em) {
      .contact-us-left {
        width: 100%; } }
    .contact-us-left-boxes {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: flex-start;
      gap: 2rem;
      padding: 5rem; }
      @media only screen and (max-width: 37.5em) {
        .contact-us-left-boxes {
          align-items: center; } }
      .contact-us-left-boxes hr {
        width: 100%;
        height: 1px; }
    .contact-us-left-box {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: flex-start;
      gap: 0.5rem; }
      @media only screen and (max-width: 37.5em) {
        .contact-us-left-box {
          align-items: center; } }
      .contact-us-left-box-head {
        color: #E1FBFF;
        font-family: "Quicksand", sans-serif;
        font-size: 2.4rem;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        text-align: left; }
        @media only screen and (max-width: 37.5em) {
          .contact-us-left-box-head {
            text-align: center; } }
      .contact-us-left-box-para {
        color: #E1FBFF;
        font-family: "Roboto Slab", serif;
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        text-align: left; }
        @media only screen and (max-width: 37.5em) {
          .contact-us-left-box-para {
            text-align: center; } }
  .contact-us-right {
    width: 70%;
    padding: 5rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    gap: 2rem; }
    @media only screen and (max-width: 37.5em) {
      .contact-us-right {
        width: 100%;
        align-items: center; } }
    .contact-us-right-para {
      color: #7990AA;
      font-family: "Roboto Slab", serif;
      font-size: 2.4rem;
      font-style: normal;
      font-weight: 400;
      line-height: normal; }
      @media only screen and (max-width: 37.5em) {
        .contact-us-right-para {
          text-align: center; } }
    .contact-us-right-box {
      display: flex;
      justify-content: flex-start;
      align-items: center;
      gap: 3rem; }
      @media only screen and (max-width: 37.5em) {
        .contact-us-right-box {
          flex-direction: column; } }
      .contact-us-right-box-btn-1 {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 1rem;
        padding: 5rem;
        border-radius: 0.5rem;
        box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
        background: var(--Gradient, linear-gradient(97deg, #002D5D 0.4%, #00CBE0 100.52%));
        color: #fff;
        font-family: "Roboto Slab", serif;
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 400;
        line-height: normal; }
        @media only screen and (max-width: 37.5em) {
          .contact-us-right-box-btn-1 {
            text-align: center;
            width: 100%;
            height: 100%; } }
        .contact-us-right-box-btn-1:hover {
          transform: translateY(-2px);
          transition: all ease-out .3s; }
        .contact-us-right-box-btn-1 img {
          width: 4.8rem;
          height: 4.8rem; }
      .contact-us-right-box-btn-2 {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 1rem;
        padding: 5rem;
        border-radius: 0.5rem;
        box-shadow: 0px 10px 32px -4px rgba(24, 39, 75, 0.1), 0px 6px 14px -6px rgba(24, 39, 75, 0.12);
        background: var(--Gradient, linear-gradient(97deg, #002D5D 0.4%, #00CBE0 100.52%));
        color: #fff;
        font-family: "Roboto Slab", serif;
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 400;
        line-height: normal; }
        @media only screen and (max-width: 37.5em) {
          .contact-us-right-box-btn-2 {
            text-align: center;
            width: 100%;
            height: 100%; } }
        .contact-us-right-box-btn-2:hover {
          transform: translateY(-2px);
          transition: all ease-out .3s; }
        .contact-us-right-box-btn-2 img {
          width: 4.8rem;
          height: 4.8rem; }

/********** Download Form **********/
.download-forms {
  margin: 7.5rem 0; }
  .download-forms-form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(35rem, 1fr));
    gap: 2.5rem;
    margin: 5rem 0; }