* {
  margin: 0;
  padding: 0;
}
body {
  background-color: rgb(0, 0, 33);
  color: white;
  font-family: "poppins", sans-serif;
}
nav {
  height: 80px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: rgb(18, 18, 62);
}
nav ul {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
nav ul li {
  list-style: none;
  margin: 0 23px;
}
nav ul li a {
  text-decoration: none;
  color: white;
}
nav ul li a:hover {
  color: rgb(153, 153, 226);
  font-size: 1.01rem;
}
main hr {
  border: 0;
  background: #9c97f1;
  height: 1.2px;
  margin: 60px 84px;
}
.left {
  font-size: 1.5rem;
}
.first-section {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 130px 0;
}
first-section div {
  width: 30%;
}
.left-section {
  font-size: 3rem;
}
.left-section .buttons {
  padding: 50px 0;
}
.left-section .btn {
  padding: 12px;
  background: #1e2167;
  color: white;
  border: 2px solid white;
  border-radius: 6px;
  font-size: 20px;
  cursor: pointer;
}
.purple {
  color: rgb(140, 74, 202);
}
.text-gray {
  color: gray;
}
.right-section {
  width: 500px;
  height: 500px;
  overflow: hidden;

  border-radius: 20px;
  box-shadow: 0 8px 16px rgba(94, 122, 183, 0.7);
  animation: pulse 4s infinite ease-in-out;
}
.right-section img {
  width: 500px;
  height: 500px;
  background-size: auto;
  object-fit: cover;
  width: 500px;
  animation: zoom 4s infinite ease-in-out;
}
@keyframes zoom {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
}

@keyframes pulse {
  0%,
  100% {
    box-shadow: 0 8px 16px rgba(94, 122, 183, 0.771);
  }
  50% {
    box-shadow: 0 12px 24px rgba(94, 122, 183, 0.215);
  }
}

#element {
  color: rgb(140, 74, 202);
}
.second-section {
  max-width: 80vw;
  margin: auto;
  height: 80vh;
}
.second-section h1 {
  font-size: 1.9rem;
}
.second-section .box {
  background: white;
  width: 77vw;
  height: 2px;
  margin: 56px 0;
  display: flex;
}
.second-section .vertical {
  height: 93px;
  width: 1px;
  background-color: white;
  margin: 0 120px;
}
.image-top {
  width: 23px;
  position: relative;
  top: -32px;
  left: -9px;
}
.vertical-title {
  position: relative;
  top: 75px;
  width: 150px;
  font-size: 14px;
}
.vertical-desc {
  position: relative;
  top: 75px;
  width: 150px;
  color: gray;
  font-size: 9px;
}
footer {
  background-color: #0e0e1a;
}
.footer {
  display: flex;
  padding: 23px 122px;
  justify-content: space-evenly;
}
.footer ul {
  list-style: none;
}
.footer > div {
  width: 223px;
}
footer .footer-rights {
  text-align: center;
  color: gray;
  padding: 12px 0;
}