@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  background-color: black;
}
/*asdasd*/
.container {
  width: 1440px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
header {
  width: 1440px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-image: url(./images/HeroImage.png);
}
.Tour {
  height: 35px;
  width: 101px;
}
nav {
  display: flex;
  gap: 24px;
}
nav a {
  color: white;
  font-size: 18px;
  font-weight: 600;
  text-align: center;
  width: 100px;
  display: block;
  text-decoration: none;
}
.icon {
  width: 20px;
}
.Hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: white;
  height: 773px;
  width: 1440px;
  background-image: url(./images/HeroImage.png);
}
.Hero-11 {
  font-size: 70px;
  font-weight: 600;
  opacity: 0.7;
}
.Hero-12 {
  font-size: 180px;
  font-weight: 600;
}
.Hero-13 {
  font-size: 64px;
  font-weight: 600;
  opacity: 0.6;
}
.Location {
  display: flex;
  justify-content: center;
  gap: 20px;
  height: 500px;
  width: 1440px;
  font-family: Inter, serif;
  background-image: url(./images/Location\ image.png);
  color: white;
}

.loc1,
.loc2,
.loc3,
.loc4 {
  height: 370px;
  width: 275.49px;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: -8px -8px 0px 0px rgba(46, 65, 71, 0.4),
    8px 8px 0px 0px rgba(41, 114, 139, 0.25);
}
.Location img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.Location img:hover {
  cursor: pointer;
  box-shadow: -8px -8px 0px 0px rgba(46, 65, 71, 0.4),
    8px 8px 0px 0px rgba(41, 114, 139, 0.25);
  opacity: 0.8;
}
.loc1 {
  position: relative;
}
.loc1 h2 {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.loc2 {
  position: relative;
}
.loc2 h2 {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.loc3 {
  position: relative;
}
.loc3 h2 {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.loc4 {
  position: relative;
}
.loc4 h2 {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.Roadmap {
  display: flex;
  flex-direction: column;
  height: 1022px;
  width: 1440px;
  background-image: url(./images/Roadmap\ image.png);
  gap: 50px;
  position: relative;
}
.box2 {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  height: 85px;
  width: 1440px;
}
.box2 h2 {
  font-size: 42px;
}
.box2 p {
  font-size: 20px;
  font-family: Inter, serif;
}
.box31 {
  display: flex;
  flex-direction: column;
  height: 640px;
  width: 1200px;
  gap: 20px;
  margin-left: 100px;
}
.box311 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 112px;
  width: 513px;
  background-color: #eee9d9;
  border-radius: 90px;
  padding-left: 20px;
  padding-right: 20px;
}
.map11 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 52px;
  width: 52px;
  background-color: white;
  border-radius: 999px;
}
.box312 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 112px;
  width: 513px;
  background-color: #8bb8c1;
  border-radius: 90px;
  padding-left: 20px;
  padding-right: 20px;
}
.map12 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 52px;
  width: 52px;
  background-color: white;
  border-radius: 999px;
}
.box313 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 112px;
  width: 513px;
  background-color: #aad8d7;
  border-radius: 90px;
  padding-left: 20px;
  padding-right: 20px;
}
.map13 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 52px;
  width: 52px;
  background-color: white;
  border-radius: 999px;
}
.box314 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 112px;
  width: 513px;
  background-color: #8bc0bd;
  border-radius: 90px;
  padding-left: 20px;
  padding-right: 20px;
}
.map14 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 52px;
  width: 52px;
  background-color: white;
  border-radius: 999px;
}
.box315 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 112px;
  width: 513px;
  background-color: #97cce0;
  border-radius: 90px;
  padding-left: 20px;
  padding-right: 20px;
}
.map15 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 52px;
  width: 52px;
  background-color: white;
  border-radius: 999px;
}
.ping1 {
  height: 34px;
  width: 34px;
  position: absolute;
  left: 80%;
  top: 43%;
}
.ping2 {
  height: 34px;
  width: 34px;
  position: absolute;
  left: 68%;
  top: 30%;
}
.ping3 {
  height: 34px;
  width: 34px;
  position: absolute;
  left: 56%;
  top: 45%;
}
.ping4 {
  height: 34px;
  width: 34px;
  position: absolute;
  left: 51%;
  top: 13%;
}
.ping5 {
  height: 34px;
  width: 34px;
  position: absolute;
  left: 60%;
  top: 23%;
}
.pic1 {
  height: 369px;
  width: 369px;
  position: absolute;
  left: 80%;
  top: 43%;
  display: none;
}
.pic2 {
  height: 369px;
  width: 369px;
  position: absolute;
  left: 68%;
  top: 30%;
  display: none;
}
.pic3 {
  height: 369px;
  width: 369px;
  position: absolute;
  left: 56%;
  top: 45%;
  display: none;
}
.pic4 {
  height: 369px;
  width: 369px;
  position: absolute;
  left: 51%;
  top: 13%;
  display: none;
}
.pic5 {
  height: 369px;
  width: 369px;
  position: absolute;
  left: 60%;
  top: 23%;
  display: none;
}
.box311:hover ~ .pic1 {
  display: block;
}

.box312:hover ~ .pic2 {
  display: block;
}

.box313:hover ~ .pic3 {
  display: block;
}
.box314:hover ~ .pic4 {
  display: block;
}
.box315:hover ~ .pic5 {
  display: block;
}
.footerbox1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 1440px;
  background-image: url(./images/Price&Footer\ image.png);
}
.footerbox11 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 85px;
  width: 1440px;
}
.footerbox111 {
  font-size: 42px;
  font-weight: 600;
  font-family: Inter, serif;
}
.footerbox112 {
  font-size: 20px;
  font-weight: 500;
  font-family: Inter, serif;
  opacity: 0.5;
}
.footerbox12 {
  display: flex;
  height: 527px;
  width: 1200px;
  gap: 24px;
  margin-top: 79px;
  margin-bottom: 185px;
}

.footerbox121 {
  display: flex;
  flex-direction: column;
  height: 527px;
  width: 384px;
  background-color: white;
  border-radius: 30px;
}
.footerbox121:hover {
  box-shadow: -8px -8px 0px 0px rgba(46, 65, 71, 0.4),
    8px 8px 0px 0px rgba(41, 114, 139, 0.25);
}

.footerbox1211 {
  display: flex;
  align-items: center;
  gap: 16px;
  height: 92px;
  width: 384px;
}
.footerbox1211 span {
  font-size: 18px;
  font-weight: 500;
  font-family: Inter, serif;
}

.footerbox1211 img {
  display: flex;
  margin-left: 24px;
  height: 36px;
  width: 36px;
}
.footerbox1211 h2 {
  font-size: 18px;
}
.footerbox1212 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 435px;
  width: 384px;
  gap: 29px;
}
.footerbox12121 {
  display: flex;
  flex-direction: column;
  gap: 20px;
  height: 298px;
  width: 336px;
  background-color: white;
}
.footerbox121211 h2 {
  font-size: 40px;
  font-weight: 1200;
  font-family: Inter, sans-serif;
}

.footerbox121211 p {
  font-size: 18px;
  color: #919191;
}

.footerbox121212 {
  display: flex;
  flex-direction: column;
  justify-content: first baseline;
  height: 290px;
  width: 336px;
  gap: 16px;
}
.footerbox1212121 {
  height: 22px;
  width: 336px;
}
.footerbox1212121 {
  display: flex;
  font-size: 18px;
  font-weight: 500;
  font-family: Inter, serif;
  opacity: 0.7;
}
.footerbox1212121 h2 {
  height: 18px;
}
.mark1 {
  height: 20px;
  font-weight: 20px;
}
.spanm1 {
  font-size: 14px;
  font-family: Inter serif;
}
.footerbox1212122 {
  height: 20px;
  width: 336px;
}
.footerbox1212123 {
  height: 34px;
  width: 336px;
}
.footerbox1212124 {
  height: 20px;
  width: 336px;
}
.footerbox1212125 {
  height: 20px;
  width: 336px;
}
.footerbox12122 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 48px;
  width: 336px;
  background-color: #a4d1e2;
  border-radius: 90px;
  font-weight: 600;
  color: white;
}
.footerbox121:hover .footerbox12122 {
  background-color: black;
}
.footerbox122 {
  display: flex;
  flex-direction: column;
  height: 527px;
  width: 384px;
  background-color: white;
  border-radius: 30px;
}
.footerbox122:hover {
  box-shadow: -8px -8px 0px 0px rgba(46, 65, 71, 0.4),
    8px 8px 0px 0px rgba(41, 114, 139, 0.25);
}
.footerbox1213 {
  display: flex;
  align-items: center;
  gap: 16px;
  height: 92px;
  width: 384px;
}
.footerbox1213 img {
  display: flex;
  margin-left: 24px;
  height: 36px;
  width: 36px;
}
.footerbox1213 h2 {
  font-size: 18px;
}
.footerbox1213 span {
  font-size: 18px;
  font-weight: 500;
  font-family: Inter, serif;
}
.footerbox1214 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 435px;
  width: 384px;
  gap: 29px;
}
.footerbox12141 {
  display: flex;
  flex-direction: column;
  gap: 20px;
  height: 298px;
  width: 336px;
  background-color: white;
}
.footerbox121411 h2 {
  font-size: 40px;
  font-weight: 600;
  font-family: Inter, sans-serif;
}

.footerbox121411 p {
  font-size: 18px;
  color: #919191;
}
.bal1 {
  display: flex;
  justify-content: space-between;
  font-size: 16px;
  font-family: Inter, serif;
  height: 27px;
  width: 336px;
}
.footerbox121411 span {
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  background-color: #6972b5;
  border-radius: 40px;
  height: 27px;
  width: 91px;
}
.footerbox121412 {
  display: flex;
  flex-direction: column;
  justify-content: first baseline;
  height: 180px;
  width: 336px;
  gap: 16px;
}
.footerbox1214121 {
  height: 22px;
  width: 336px;
}
.footerbox1214121 {
  display: flex;
  font-size: 18px;
  font-weight: 500;
  font-family: Inter, serif;
  opacity: 0.7;
}
.footerbox1214121 h2 {
  height: 18px;
}
.mark1 {
  height: 20px;
  font-weight: 20px;
}
.spanm1 {
  font-size: 14px;
  font-family: Inter serif;
}
.footerbox1214122 {
  height: 20px;
  width: 336px;
}
.footerbox1214123 {
  height: 34px;
  width: 336px;
}
.footerbox1214124 {
  height: 20px;
  width: 336px;
}
.footerbox1214125 {
  height: 20px;
  width: 336px;
}
.footerbox12142 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 48px;
  width: 336px;
  background-color: #a4d1e2;
  border-radius: 90px;
  font-weight: 600;
  color: white;
}
.footerbox122:hover .footerbox12142 {
  background-color: black;
}
.footerbox123 {
  display: flex;
  flex-direction: column;
  height: 527px;
  width: 384px;
  background-color: white;
  border-radius: 30px;
}
.footerbox123:hover {
  box-shadow: -8px -8px 0px 0px rgba(46, 65, 71, 0.4),
    8px 8px 0px 0px rgba(41, 114, 139, 0.25);
}
.footerbox1215 {
  display: flex;
  align-items: center;
  gap: 16px;
  height: 92px;
  width: 384px;
}
.footerbox1215 span {
  font-size: 18px;
  font-weight: 500;
  font-family: Inter, serif;
}
.footerbox1215 img {
  display: flex;
  margin-left: 24px;
  height: 36px;
  width: 36px;
}
.footerbox1215 h2 {
  font-size: 18px;
}
.footerbox1216 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 435px;
  width: 384px;
  gap: 29px;
}
.footerbox12161 {
  display: flex;
  flex-direction: column;
  gap: 20px;
  height: 298px;
  width: 336px;
  background-color: white;
}
.footerbox121611 h2 {
  font-size: 40px;
  font-weight: 1200;
  font-family: Inter, sans-serif;
}

.footerbox121611 p {
  font-size: 18px;
  color: #919191;
}

.footerbox121612 {
  display: flex;
  flex-direction: column;
  justify-content: first baseline;
  height: 290px;
  width: 336px;
  gap: 16px;
}
.footerbox1216121 {
  height: 22px;
  width: 336px;
}
.footerbox1216121 {
  display: flex;
  font-size: 18px;
  font-weight: 500;
  font-family: Inter, serif;
  opacity: 0.7;
}
.footerbox1216121 h2 {
  height: 18px;
}
.mark1 {
  height: 20px;
  font-weight: 20px;
}
.spanm1 {
  font-size: 14px;
  font-family: Inter serif;
}
.footerbox1216122 {
  height: 20px;
  width: 336px;
}
.footerbox1216123 {
  height: 34px;
  width: 336px;
}
.footerbox1216124 {
  height: 20px;
  width: 336px;
}
.footerbox1216125 {
  height: 20px;
  width: 336px;
}
.footerbox12162 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 48px;
  width: 336px;
  background-color: #a4d1e2;
  border-radius: 90px;
  font-weight: 600;
  color: white;
}
.footerbox123:hover .footerbox12162 {
  background-color: black;
}
footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-image: url(./images/Price&Footer\ image.png);
  height: 1120px;
  width: 1440px;
}
.footerbox13 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 204px;
  width: 1440px;
}
.footerbox131 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 44px;
  width: 1200px;
}
.footerbox1311 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 44px;
  width: 358px;
  gap: 20px;
}
.footerbox13111 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 44px;
  width: 160px;
  background-color: white;
  border-radius: 50px;
  gap: 10px;
  font-size: 18px;
  font-family: Inter, serif;
  color: #6972b5;
  font-weight: 600;
}

.face1 {
  height: 24px;
  width: 24px;
}
.span1 {
  height: 22px;
  width: 93px;
}
.Tour2 {
  height: 35px;
  width: 101px;
}
.footerbox13112 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 44px;
  width: 160px;
  background-color: white;
  border-radius: 40px;
  gap: 10px;
  font-size: 18px;
  font-family: Inter, serif;
  color: #6972b5;
  font-weight: 600;
}
.ins1 {
  height: 24px;
  width: 24px;
}
.span2 {
  height: 22px;
  width: 97px;
}
.footerbox1312 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 35px;
  width: 101px;
}