html,
body {
  padding: 0;
  margin: 0;
}

html {
  scroll-behavior: smooth;
}

main {
  width: 100%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}

main section {
  width: 100%;
}

main section:nth-of-type(1) {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 4vw;
}

main section:nth-of-type(1) .panel {
  width: 100%;
  height: 100%;
  position: absolute;
  padding: 2vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: rgba(0, 0, 0, 0.6);
}

main section:nth-of-type(1) .panel h1,
main section:nth-of-type(1) .panel p {
  margin-top: 2vw;
  margin-right: 2vw;
  color: white;
}

main section:nth-of-type(1) .panel h1 {
  font-size: 8vw;
  font-family: "IBM Plex Sans Arabic", sans-serif;
}

main section:nth-of-type(1) .panel p {
  font-size: 6vw;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  width: 80%;
}

main section:nth-of-type(1) video {
  width: 100%;
}

main section:nth-of-type(2) {
  width: 100%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
}

main section:nth-of-type(2) .left,
main section:nth-of-type(2) .right {
  width: 100%;
  height: 100%;
  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: center;
      -ms-flex-align: center;
          align-items: center;
}

main section:nth-of-type(2) .left h1,
main section:nth-of-type(2) .left p,
main section:nth-of-type(2) .right h1,
main section:nth-of-type(2) .right p {
  padding: 6vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-bottom: 0;
}

main section:nth-of-type(2) .left h1,
main section:nth-of-type(2) .right h1 {
  font-size: 6vw;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  text-transform: uppercase;
}

main section:nth-of-type(2) .left p,
main section:nth-of-type(2) .right p {
  font-size: 5vw;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  margin-top: 0;
}

main section:nth-of-type(2) .left a,
main section:nth-of-type(2) .right a {
  font-size: 4.6vw;
  padding: 4.2vw;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 800;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-bottom: 5vw;
}

main section:nth-of-type(2) .left {
  background-color: #162f60;
  color: white;
}

main section:nth-of-type(2) .left a {
  color: #162f60;
  background-color: white;
}

main section:nth-of-type(2) .right {
  margin-top: 0;
  background-color: white;
  color: black;
}

main section:nth-of-type(2) .right a {
  background-color: #162f60;
  color: white;
}

main section:nth-of-type(3) {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  width: 100%;
  background-color: black;
  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: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: 30vh;
}

main section:nth-of-type(3) > h1 {
  padding: 0;
  margin-top: 2vw;
  text-transform: uppercase;
  color: white;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  font-size: 6vw;
}

main section:nth-of-type(3) .chart {
  position: relative;
  width: 90%;
  margin-bottom: 5vw;
}

main section:nth-of-type(4) {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  background-color: black;
  width: 100%;
  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: center;
      -ms-flex-align: center;
          align-items: center;
}

main section:nth-of-type(4) > h1 {
  padding: 0;
  margin-top: 2vw;
  text-transform: uppercase;
  color: white;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  font-size: 6vw;
}

main section:nth-of-type(4) .slider {
  width: 80%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-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: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  margin-bottom: 3vw;
  min-height: 30vh;
}

main section:nth-of-type(4) .slider .panel {
  border: 2px solid black;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  width: 96%;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: white;
  display: none;
  opacity: 0;
}

main section:nth-of-type(4) .slider .panel:nth-of-type(1) {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  opacity: 1;
}

main section:nth-of-type(4) .slider .panel article {
  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: center;
      -ms-flex-align: center;
          align-items: center;
}

main section:nth-of-type(4) .slider .panel article h1,
main section:nth-of-type(4) .slider .panel article h2 {
  font-family: "IBM Plex Sans Arabic", sans-serif;
  text-align: center;
  width: 100%;
}

main section:nth-of-type(4) .slider .panel article h1 {
  font-size: 4.8vw;
  text-transform: capitalize;
  margin-bottom: 0;
}

main section:nth-of-type(4) .slider .panel article h2 {
  font-size: 4.4vw;
  text-transform: uppercase;
  margin-top: 0;
}

main section:nth-of-type(4) .slider .panel article p {
  font-size: 4.2;
  font-family: "IBM Plex Sans Arabic", sans-serif;
  margin-bottom: 4vw;
  width: 90%;
}

main section:nth-of-type(5) {
  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: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}

main section:nth-of-type(5) h1 {
  font-family: "IBM Plex Sans Arabic", sans-serif;
  text-transform: uppercase;
  font-size: 6vw;
}

main section:nth-of-type(5) #clientsGrid {
  width: 80%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 4vw;
}

main section:nth-of-type(5) #clientsGrid img {
  width: 98%;
  margin-bottom: 3vw;
  margin-left: auto;
  margin-right: auto;
}

@media only screen and (min-width: 1080px) {
  main section:nth-of-type(1) .panel h1,
  main section:nth-of-type(1) .panel p {
    margin-top: 3vw;
    margin-right: 3vw;
  }
  main section:nth-of-type(1) .panel h1 {
    font-size: 4vw;
  }
  main section:nth-of-type(1) .panel p {
    font-size: 3vw;
    width: 80%;
  }
  main section:nth-of-type(2) {
    -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
  }
  main section:nth-of-type(2) .left h1,
  main section:nth-of-type(2) .left p,
  main section:nth-of-type(2) .right h1,
  main section:nth-of-type(2) .right p {
    padding: 3vw;
  }
  main section:nth-of-type(2) .left h1,
  main section:nth-of-type(2) .right h1 {
    font-size: 2.5vw;
  }
  main section:nth-of-type(2) .left p,
  main section:nth-of-type(2) .right p {
    font-size: 1.8vw;
  }
  main section:nth-of-type(2) .left a,
  main section:nth-of-type(2) .right a {
    font-size: 1.4vw;
    padding: 1vw;
  }
  main section:nth-of-type(3) {
    background-color: black;
  }
  main section:nth-of-type(3) > h1 {
    font-size: 2vw;
  }
  main section:nth-of-type(3) .chart {
    width: 50%;
  }
  main section:nth-of-type(4) > h1 {
    font-size: 2vw;
  }
  main section:nth-of-type(4) .slider {
    width: 60%;
    margin-bottom: 3vw;
  }
  main section:nth-of-type(4) .slider .panel {
    width: 80%;
  }
  main section:nth-of-type(4) .slider .panel article h1,
  main section:nth-of-type(4) .slider .panel article h2 {
    width: 80%;
  }
  main section:nth-of-type(4) .slider .panel article h1 {
    font-size: 1.8vw;
  }
  main section:nth-of-type(4) .slider .panel article h2 {
    font-size: 1.4vw;
  }
  main section:nth-of-type(4) .slider .panel article p {
    font-size: 1.2vw;
    width: 80%;
  }
  main section:nth-of-type(5) h1 {
    font-size: 2vw;
  }
  main section:nth-of-type(5) #clientsGrid {
    width: 60%;
    -ms-grid-columns: 1fr 1fr 1fr;
        grid-template-columns: 1fr 1fr 1fr;
    margin-bottom: 2vw;
  }
  main section:nth-of-type(5) #clientsGrid img {
    margin-bottom: 1vw;
  }
}
/*# sourceMappingURL=index.css.map */