/** @format */

/**@import url("https://use.typekit.net/jfx1zdi.css");**/

@font-face {
  font-family: myriad-pro;
  src: url(MyriadRegular.tff);
}

* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}

body {
  background-color: #292321;
  font-family: "myriad-pro", sans-serif;
}

.main-section {
  position: relative;
  z-index: 1;
  width: 1250px;
  height: 768px;
  margin: 2rem auto 0rem auto;
}

video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: inherit;
  height: auto;
  transform: translate(-50%, -50%);
  z-index: -1;
}

.header {
  display: flex;
  background-color: #fff;
  list-style: none;
  padding: 0;
  /* justify-content: space-around; */
  align-items: center;
  text-align: center;
  position: absolute;
  width: 100%;
  margin: 0;
  padding: 0;
}

.nav {
  display: flex;
  list-style: none;
  padding: 0;
  /* justify-content: space-around; */
  text-align: center;
  width: 100%;
  margin: 0;
}

.nav li {
  padding: 20px;
  flex-basis: 33.3%;
  cursor: pointer;
  color: #2fa8e1;
  border-bottom: 4px solid #e9e9e9;
  margin: 10px;
}

.nav li.active {
  border-bottom: 4px solid #332e84;
  background-color: #e9e9e9;
  border-right: none;
}

.header img {
  width: 75%;
}

.pin a {
  text-decoration: none;
  color: #fff;
  font-size: 0.6rem;
}

.pin {
  background-color: #332e84;
  border-radius: 15px;
  color: #fff;
  padding: 0.2rem 0.5rem 0.2rem 0.5rem;
  width: max-content;
  opacity: 1;
  position: absolute;
}

.pin.pin a:hover {
  opacity: 0.6;
}

.pin1 {
  top: 17.5rem;
  left: 9.5rem;
}

.pin2 {
  top: 19rem;
  left: 1.5rem;
}

.pin3 {
  top: 17rem;
  left: 3.2rem;
}

.pin4 {
  top: 56%;
  left: 85%;
  background-color: green;
}

.pin5 {
  top: 66%;
  left: 34%;
  background-color: green;
}

.pin6 {
  bottom: 5.3rem;
  right: 3.5rem;
}

.pin7 {
  top: 29.5rem;
  right: 38rem;
}

.pin8 {
  top: 26rem;
  left: 26rem;
}

.pin9 {
  bottom: 3.4rem;
  left: 25rem;
}

.pin10 {
  bottom: 3.5rem;
  left: 7rem;
}

.pin11 {
  top: 28.5rem;
  left: 5rem;
}

.pin12 {
  top: 22rem;
  right: 24.5rem;
}

.pin13 {
  top: 22rem;
  left: 15.5rem;
}

.pin14 {
  top: 21rem;
  left: 2rem;
}

.pin15 {
  top: 18rem;
  right: 42.7rem;
}

.pin16 {
  bottom: 4rem;
  right: 19rem;
}

.pin16 {
  bottom: 5rem;
  right: 20.5rem;
}

.pin17 {
  bottom: 16.5rem;
  left: 4rem;
}

.pin18 {
  bottom: 20rem;
  left: 17rem;
}

.pin19 {
  bottom: 5.5rem;
  left: 19rem;
}

.pin20 {
  bottom: 19.5rem;
  left: 30rem;
}

.pin21 {
  bottom: 4.3rem;
  left: 29.5rem;
}

.pin22 {
  top: 16rem;
  left: 34.8rem;
}

.pin23 {
  top: 16.5rem;
  right: 25.8rem;
}

.pin24 {
  bottom: 14.5rem;
  right: 21.5rem;
}

.pin25 {
  bottom: 3rem;
  right: 17rem;
}

.pin26 {
  top: 17rem;
  right: 12rem;
}

.pin27 {
  top: 15.5rem;
  right: 5.5rem;
}

.pin28 {
  top: 19.5rem;
  right: 7.5rem;
}

.pin29 {
  top: 24.2rem;
  right: 8.5rem;
}

.pin30 {
  top: 27rem;
  right: 2rem;
}

.pin31 {
  bottom: 10.5rem;
  right: 10rem;
}

.site-footer {
  display: flex;
  position: absolute;
  bottom: 0rem;
  width: 100%;
  color: #fff;
  justify-content: space-between;
  font-size: 15px;
}

.site-footer ul {
  display: flex;
  list-style: none;
  margin: 0;
  gap: 10px;
}

.site-footer a {
  text-decoration: none;
  color: #fff;
}

/* @media screen and (max-width: 1400px) {
  .main-section {
    position: relative;
    z-index: 1;
    width: 1150px;
    height: 768px;
    margin: 2rem auto 0rem auto;
  }

  video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: inherit;
    height: auto;
    transform: translate(-50%, -50%);
    z-index: -1;
  }

  .pin1 {
    top: 18rem;
    left: 8rem;
  }

  .pin2 {
    top: 19.3rem;
    left: 1rem;
  }

  .pin3 {
    top: 17.5rem;
    left: 2.5rem;
  }

  .pin4 {
    top: 56%;
    left: 85%;
    background-color: green;
  }

  .pin5 {
    top: 66%;
    left: 34%;
    background-color: green;
  }

  .pin6 {
    bottom: 6.7rem;
    right: 2.7rem;
  }

  .pin7 {
    top: 29rem;
    right: 34.5rem;
  }

  .pin8 {
    top: 26rem;
    left: 23.5rem;
  }

  .pin9 {
    bottom: 5rem;
    left: 22.5rem;
  }

  .pin10 {
    bottom: 5.5rem;
    left: 5rem;
  }

  .pin11 {
    top: 28rem;
    left: 5rem;
  }

  .pin12 {
    top: 22rem;
    right: 21rem;
  }

  .pin13 {
    top: 21.9rem;
    left: 14rem;
  }

  .pin14 {
    top: 21rem;
    left: 1.7rem;
  }

  .pin15 {
    top: 18.7rem;
    right: 39rem;
  }

  .pin16 {
    bottom: 6rem;
    right: 19rem;
  }

  .pin17 {
    bottom: 17.2rem;
    left: 2.7rem;
  }

  .pin18 {
    bottom: 20rem;
    left: 14.5rem;
  }

  .pin19 {
    bottom: 6.5rem;
    left: 17rem;
  }

  .pin20 {
    bottom: 19.5rem;
    left: 28rem;
  }

  .pin21 {
    bottom: 5.7rem;
    left: 27.5rem;
  }

  .pin22 {
    top: 16.5rem;
    left: 32.5rem;
  }

  .pin23 {
    top: 16.5rem;
    right: 23rem;
  }

  .pin24 {
    bottom: 15.5rem;
    right: 19rem;
  }

  .pin25 {
    bottom: 4.3rem;
    right: 14.5rem;
  }

  .pin26 {
    top: 17.5rem;
    right: 10rem;
  }

  .pin27 {
    top: 15.8rem;
    right: 4rem;
  }

  .pin28 {
    top: 19.7rem;
    right: 6rem;
  }

  .pin29 {
    top: 24.2rem;
    right: 6.5rem;
  }

  .pin30 {
    top: 26.7rem;
    right: 1.7rem;
  }

  .pin31 {
    bottom: 11.5rem;
    right: 10rem;
  }

  .site-footer {
    bottom: 2rem;
  }
} */

/* @media screen and (max-width: 1200px) {
  .main-section {
    position: relative;
    z-index: 1;
    width: 1024px;
    height: 768px;
    margin: 2rem auto 0rem auto;
  }

  video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: inherit;
    height: auto;
    transform: translate(-50%, -50%);
    z-index: -1;
  }

  .header {
    top: 1rem;
  }

  .pin1 {
    top: 18.6rem;
    left: 7rem;
  }

  .pin2 {
    top: 20rem;
    left: 0.5rem;
  }

  .pin3 {
    top: 18rem;
    left: 2.2rem;
  }

  .pin4 {
    top: 56%;
    left: 85%;
    background-color: green;
  }

  .pin5 {
    top: 66%;
    left: 34%;
    background-color: green;
  }

  .pin6 {
    bottom: 8.5rem;
    right: 2.8rem;
  }

  .pin7 {
    top: 28rem;
    right: 30rem;
  }

  .pin8 {
    top: 25rem;
    left: 21rem;
  }

  .pin9 {
    bottom: 7rem;
    left: 20rem;
  }

  .pin10 {
    bottom: 7.5rem;
    left: 3.5rem;
  }

  .pin11 {
    top: 27.5rem;
    left: 4.5rem;
  }

  .pin12 {
    top: 22rem;
    right: 20rem;
  }

  .pin13 {
    top: 21.7rem;
    left: 11rem;
  }

  .pin14 {
    top: 21.7rem;
    left: 1.2rem;
  }

  .pin15 {
    top: 19rem;
    right: 35rem;
  }

  .pin16 {
    bottom: 8rem;
    right: 17.7rem;
  }

  .pin17 {
    bottom: 17.7rem;
    left: 2rem;
  }

  .pin18 {
    bottom: 20.8rem;
    left: 12rem;
  }

  .pin19 {
    bottom: 8.5rem;
    left: 15.5rem;
  }

  .pin20 {
    bottom: 20.5rem;
    left: 25rem;
  }

  .pin21 {
    bottom: 7.5rem;
    left: 24.5rem;
  }

  .pin22 {
    top: 17rem;
    left: 29rem;
  }

  .pin23 {
    top: 17rem;
    right: 19.7rem;
  }

  .pin24 {
    bottom: 16.5rem;
    right: 16.2rem;
  }

  .pin25 {
    bottom: 6.5rem;
    right: 14.3rem;
  }

  .pin26 {
    top: 18.2rem;
    right: 8rem;
  }

  .pin27 {
    top: 16.7rem;
    right: 3rem;
  }

  .pin28 {
    top: 20.5rem;
    right: 4rem;
  }

  .pin29 {
    top: 24rem;
    right: 5rem;
  }

  .pin30 {
    top: 26.5rem;
    right: 1.6rem;
  }

  .pin31 {
    bottom: 13rem;
    right: 10rem;
  }

  .site-footer {
    bottom: 4rem;
  }
} */

@media screen and (max-width: 1024px) {
  .main-section {
    position: relative;
    z-index: 1;
    width: 1000px;
    height: 700px;
    margin: 2rem auto 0rem auto;
  }

  video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: inherit;
    height: auto;
    transform: translate(-50%, -50%);
    z-index: -1;
  }

  .pin a {
    text-decoration: none;
    color: #fff;
    font-size: 0.5rem;
  }

  .pin1 {
    top: 16.8rem;
    left: 6.5rem;
  }

  .pin2 {
    top: 18rem;
    left: 0.5rem;
  }

  .pin3 {
    top: 16.5rem;
    left: 2rem;
  }

  .pin4 {
    top: 56%;
    left: 85%;
    background-color: green;
  }

  .pin5 {
    top: 66%;
    left: 34%;
    background-color: green;
  }

  .pin6 {
    bottom: 6.7rem;
    right: 3rem;
  }

  .pin7 {
    top: 26rem;
    right: 30rem;
  }

  .pin8 {
    top: 23rem;
    left: 20.5rem;
  }

  .pin9 {
    bottom: 5.3rem;
    left: 19.5rem;
  }

  .pin10 {
    bottom: 5.5rem;
    left: 5rem;
  }

  .pin11 {
    top: 25.5rem;
    left: 4rem;
  }

  .pin12 {
    top: 20.5rem;
    right: 19rem;
  }

  .pin13 {
    top: 20rem;
    left: 13rem;
  }

  .pin14 {
    top: 19.8rem;
    left: 1rem;
  }

  .pin15 {
    top: 17rem;
    right: 34rem;
  }

  .pin16 {
    bottom: 6.5rem;
    right: 16rem;
  }

  .pin17 {
    bottom: 15.5rem;
    left: 2rem;
  }

  .pin18 {
    bottom: 18.7rem;
    left: 12rem;
  }

  .pin19 {
    bottom: 6.5rem;
    left: 14rem;
  }

  .pin20 {
    bottom: 18.5rem;
    left: 24rem;
  }

  .pin21 {
    bottom: 6rem;
    left: 24rem;
  }

  .pin22 {
    top: 15.5rem;
    left: 28rem;
  }

  .pin23 {
    top: 15.5rem;
    right: 19.7rem;
  }

  .pin24 {
    bottom: 14.7rem;
    right: 16.5rem;
  }

  .pin25 {
    bottom: 5rem;
    right: 13rem;
  }

  .pin26 {
    top: 17rem;
    right: 8rem;
  }

  .pin27 {
    top: 15.5rem;
    right: 3rem;
  }

  .pin28 {
    top: 19rem;
    right: 4.5rem;
  }

  .pin29 {
    top: 21.5rem;
    right: 5.5rem;
  }

  .pin30 {
    top: 24rem;
    right: 1.6rem;
  }

  .pin31 {
    bottom: 11rem;
    right: 9rem;
  }

  .site-footer {
    bottom: 2.5rem;
  }
}

@media screen and (max-width: 1010px) {
  .main-section {
    position: relative;
    z-index: 1;
    width: 890px;
    height: 700px;
    margin: 2rem auto 0rem auto;
  }

  video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: inherit;
    height: auto;
    transform: translate(-50%, -50%);
    z-index: -1;
  }

  .header {
    top: 1.5rem;
  }

  .pin a {
    text-decoration: none;
    color: #fff;
    font-size: 0.5rem;
  }

  .pin1 {
    top: 17rem;
    left: 6rem;
  }

  .pin2 {
    top: 18.3rem;
    left: 0.3rem;
  }

  .pin3 {
    top: 16.5rem;
    left: 1.3rem;
  }

  .pin4 {
    top: 56%;
    left: 85%;
    background-color: green;
  }

  .pin5 {
    top: 66%;
    left: 34%;
    background-color: green;
  }

  .pin6 {
    bottom: 8.3rem;
    right: 2.5rem;
  }

  .pin7 {
    top: 25.5rem;
    right: 26rem;
  }

  .pin8 {
    top: 23rem;
    left: 18.5rem;
  }

  .pin9 {
    bottom: 7.3rem;
    left: 17.5rem;
  }

  .pin10 {
    bottom: 7.3rem;
    left: 4rem;
  }

  .pin11 {
    top: 25rem;
    left: 3.5rem;
  }

  .pin12 {
    top: 20.3rem;
    right: 15.7rem;
  }

  .pin13 {
    top: 20.1rem;
    left: 10rem;
  }

  .pin14 {
    top: 19.8rem;
    left: 0.8rem;
  }

  .pin15 {
    top: 17.5rem;
    right: 30rem;
  }

  .pin16 {
    bottom: 8rem;
    right: 15.3rem;
  }

  .pin17 {
    bottom: 16.2rem;
    left: 2rem;
  }

  .pin18 {
    bottom: 18.7rem;
    left: 12rem;
  }

  .pin19 {
    bottom: 8.5rem;
    left: 12.5rem;
  }

  .pin20 {
    bottom: 18.6rem;
    left: 22rem;
  }

  .pin21 {
    bottom: 8rem;
    left: 21.5rem;
  }

  .pin22 {
    top: 15.7rem;
    left: 25.5rem;
  }

  .pin23 {
    top: 15.7rem;
    right: 17rem;
  }

  .pin24 {
    bottom: 15.2rem;
    right: 14.2rem;
  }

  .pin25 {
    bottom: 6.6rem;
    right: 12rem;
  }

  .pin26 {
    top: 17rem;
    right: 7.5rem;
  }

  .pin27 {
    top: 15.5rem;
    right: 2.7rem;
  }

  .pin28 {
    top: 18.7rem;
    right: 4.5rem;
  }

  .pin29 {
    top: 21.7rem;
    right: 5rem;
  }

  .pin30 {
    top: 24rem;
    right: 1.6rem;
  }

  .pin31 {
    bottom: 12rem;
    right: 8.5rem;
  }

  .site-footer {
    bottom: 4rem;
  }
}

@media screen and (max-width: 900px) {
  .main-section {
    position: relative;
    z-index: 1;
    width: 768px;
    height: 700px;
    margin: 2rem auto 0rem auto;
  }

  video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: inherit;
    height: auto;
    transform: translate(-50%, -50%);
    z-index: -1;
  }

  .header {
    top: 3.3rem;
  }

  .pin {
    background-color: #332e84;
    border-radius: 15px;
    color: #fff;
    padding: 0.2rem 0.2rem 0.2rem 0.2rem;
    width: max-content;
    opacity: 0.9;
    position: absolute;
  }

  .pin a {
    text-decoration: none;
    color: #fff;
    font-size: 0.5rem;
  }

  .pin1 {
    top: 17.1rem;
    left: 5rem;
  }

  .pin2 {
    top: 18.3rem;
    left: 0.3rem;
  }

  .pin3 {
    top: 17rem;
    left: 1.3rem;
  }

  .pin4 {
    top: 56%;
    left: 85%;
    background-color: green;
  }

  .pin5 {
    top: 66%;
    left: 34%;
    background-color: green;
  }

  .pin6 {
    bottom: 10rem;
    right: 2rem;
  }

  .pin7 {
    top: 25rem;
    right: 23rem;
  }

  .pin8 {
    top: 23rem;
    left: 17rem;
  }

  .pin9 {
    bottom: 9rem;
    left: 15rem;
  }

  .pin10 {
    bottom: 9rem;
    left: 3rem;
  }

  .pin11 {
    top: 24.3rem;
    left: 3.3rem;
  }

  .pin12 {
    top: 20.3rem;
    right: 14rem;
  }

  .pin13 {
    top: 20.1rem;
    left: 8.5rem;
  }

  .pin14 {
    top: 19.8rem;
    left: 0.8rem;
  }

  .pin15 {
    top: 17.5rem;
    right: 25.7rem;
  }

  .pin16 {
    bottom: 9.7rem;
    right: 13rem;
  }

  .pin17 {
    bottom: 16.6rem;
    left: 1rem;
  }

  .pin18 {
    bottom: 18.7rem;
    left: 11.7rem;
  }

  .pin19 {
    bottom: 10rem;
    left: 10.5rem;
  }

  .pin20 {
    bottom: 18.7rem;
    left: 19rem;
  }

  .pin21 {
    bottom: 9.8rem;
    left: 19rem;
  }

  .pin22 {
    top: 16.5rem;
    left: 22rem;
  }

  .pin23 {
    top: 16.5rem;
    right: 15rem;
  }

  .pin24 {
    bottom: 15.9rem;
    right: 12rem;
  }

  .pin25 {
    bottom: 8.5rem;
    right: 10rem;
  }

  .pin26 {
    top: 17.5rem;
    right: 6rem;
  }

  .pin27 {
    top: 16.1rem;
    right: 2rem;
  }

  .pin28 {
    top: 19rem;
    right: 3.5rem;
  }

  .pin29 {
    top: 21.7rem;
    right: 4rem;
  }

  .pin30 {
    top: 24rem;
    right: 1.5rem;
  }

  .pin31 {
    bottom: 13.2rem;
    right: 7rem;
    background: black;
  }

  .site-footer {
    bottom: 4rem;
  }
}

@media screen and (max-width: 800px) {
  .main-section {
    position: relative;
    z-index: 1;
    width: 1000px;
    height: 700px;
    margin: 2rem auto 0rem auto;
  }

  video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: inherit;
    height: auto;
    transform: translate(-50%, -50%);
    z-index: -1;
  }

  .pin a {
    text-decoration: none;
    color: #fff;
    font-size: 0.5rem;
  }

  .pin1 {
    top: 16.5rem;
    left: 6.5rem;
  }

  .pin2 {
    top: 18rem;
    left: 0.5rem;
  }

  .pin3 {
    top: 16.5rem;
    left: 2rem;
  }

  .pin4 {
    top: 56%;
    left: 85%;
    background-color: green;
  }

  .pin5 {
    top: 66%;
    left: 34%;
    background-color: green;
  }

  .pin6 {
    bottom: 6.7rem;
    right: 3rem;
  }

  .pin7 {
    top: 26rem;
    right: 30rem;
  }

  .pin8 {
    top: 23rem;
    left: 20.5rem;
  }

  .pin9 {
    bottom: 5.3rem;
    left: 19.5rem;
  }

  .pin10 {
    bottom: 5.5rem;
    left: 5rem;
  }

  .pin11 {
    top: 25.5rem;
    left: 4rem;
  }

  .pin12 {
    top: 20.5rem;
    right: 19rem;
  }

  .pin13 {
    top: 20rem;
    left: 13rem;
  }

  .pin14 {
    top: 19.8rem;
    left: 1rem;
  }

  .pin15 {
    top: 17rem;
    right: 34rem;
  }

  .pin16 {
    bottom: 6.5rem;
    right: 16rem;
  }

  .pin17 {
    bottom: 15.5rem;
    left: 2rem;
  }

  .pin18 {
    bottom: 18.7rem;
    left: 12rem;
  }

  .pin19 {
    bottom: 6.5rem;
    left: 14rem;
  }

  .pin20 {
    bottom: 18.5rem;
    left: 24rem;
  }

  .pin21 {
    bottom: 6rem;
    left: 24rem;
  }

  .pin22 {
    top: 15.5rem;
    left: 28rem;
  }

  .pin23 {
    top: 15.5rem;
    right: 19.7rem;
  }

  .pin24 {
    bottom: 14.7rem;
    right: 16.5rem;
  }

  .pin25 {
    bottom: 5rem;
    right: 13rem;
  }

  .pin26 {
    top: 17rem;
    right: 8rem;
  }

  .pin27 {
    top: 15.5rem;
    right: 3rem;
  }

  .pin28 {
    top: 19rem;
    right: 4.5rem;
  }

  .pin29 {
    top: 21.5rem;
    right: 5.5rem;
  }

  .pin30 {
    top: 24rem;
    right: 1.6rem;
  }

  .pin31 {
    bottom: 11rem;
    right: 9rem;
  }

  .site-footer {
    bottom: 2.5rem;
  }
}

@media screen and (min-width: 1025px) {
  body {
    overflow: hidden;
  }
  .main-section {
    position: relative;
    z-index: 1;
    width: 90%;
    height: 100%;
    margin: 2rem auto 0rem auto;
  }

  video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: inherit;
    height: auto;
    transform: translate(-50%, -50%);
    z-index: -1;
  }

  .pin a {
    text-decoration: none;
    color: #fff;
    font-size: 0.5rem;
  }

  .pin1 {
    top: 16.8rem;
    left: 6.5rem;
  }

  .pin2 {
    top: 18rem;
    left: 0.5rem;
  }

  .pin3 {
    top: 16.5rem;
    left: 2rem;
  }

  .pin4 {
    top: 56%;
    left: 85%;
    background-color: green;
  }

  .pin5 {
    top: 66%;
    left: 34%;
    background-color: green;
  }

  .pin6 {
    bottom: 6.7rem;
    right: 3rem;
  }

  .pin7 {
    top: 26rem;
    right: 30rem;
  }

  .pin8 {
    top: 23rem;
    left: 20.5rem;
  }

  .pin9 {
    bottom: 5.3rem;
    left: 19.5rem;
  }

  .pin10 {
    bottom: 5.5rem;
    left: 5rem;
  }

  .pin11 {
    top: 25.5rem;
    left: 4rem;
  }

  .pin12 {
    top: 20.5rem;
    right: 19rem;
  }

  .pin13 {
    top: 20rem;
    left: 13rem;
  }

  .pin14 {
    top: 19.8rem;
    left: 1rem;
  }

  .pin15 {
    top: 17rem;
    right: 34rem;
  }

  .pin16 {
    bottom: 6.5rem;
    right: 16rem;
  }

  .pin17 {
    bottom: 15.5rem;
    left: 2rem;
  }

  .pin18 {
    bottom: 18.7rem;
    left: 12rem;
  }

  .pin19 {
    bottom: 6.5rem;
    left: 14rem;
  }

  .pin20 {
    bottom: 18.5rem;
    left: 24rem;
  }

  .pin21 {
    bottom: 6rem;
    left: 24rem;
  }

  .pin22 {
    top: 15.5rem;
    left: 28rem;
  }

  .pin23 {
    top: 15.5rem;
    right: 19.7rem;
  }

  .pin24 {
    bottom: 14.7rem;
    right: 16.5rem;
  }

  .pin25 {
    bottom: 5rem;
    right: 13rem;
  }

  .pin26 {
    top: 17rem;
    right: 8rem;
  }

  .pin27 {
    top: 15.5rem;
    right: 3rem;
  }

  .pin28 {
    top: 19rem;
    right: 4.5rem;
  }

  .pin29 {
    top: 21.5rem;
    right: 5.5rem;
  }

  .pin30 {
    top: 24rem;
    right: 1.6rem;
  }

  .pin31 {
    bottom: 11rem;
    right: 9rem;
  }

  .site-footer {
    bottom: 2.5rem;
  }
}

@media screen and (min-width: 2560px) {
  .main-section {
    position: relative;
    z-index: 1;
    width: 2250px;
    height: 800px;
    margin: 5rem auto 0rem auto;
  }

  video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: inherit;
    height: auto;
    transform: translate(-50%, -40%);
    margin: 5rem auto 0rem auto;
    z-index: -1;
  }

  .header {
    display: flex;
    background-color: #fff;
    list-style: none;
    padding: 0;
    align-items: center;
    text-align: center;
    position: absolute;
    top: -2.5rem;
    width: 100%;
    margin: 0;
    padding: 0;
  }

  .nav {
    display: flex;
    list-style: none;
    padding: 0;
    /* justify-content: space-around; */
    text-align: center;
    width: 100%;
    margin: 0;
  }

  .nav li {
    padding: 20px;
    flex-basis: 33.3%;
    cursor: pointer;
    color: #2fa8e1;
    border-bottom: 4px solid #e9e9e9;
    margin: 10px;
  }

  .nav li.active {
    border-bottom: 4px solid #332e84;
    background-color: #e9e9e9;
    border-right: none;
  }

  .header img {
    width: 75%;
  }

  .pin a {
    text-decoration: none;
    color: #fff;
    font-size: 1rem;
  }

  .pin {
    background-color: #332e84;
    border-radius: 15px;
    color: #fff;
    padding: 0.2rem 0.5rem 0.2rem 0.5rem;
    width: max-content;
    opacity: 0.9;
    position: absolute;
  }

  .pin.pin a:hover {
    opacity: 0.6;
  }

  .pin1 {
    top: 27rem;
    left: 16rem;
  }

  .pin2 {
    top: 29rem;
    left: 5rem;
  }

  .pin3 {
    top: 25.5rem;
    left: 7rem;
  }

  .pin4 {
    top: 56%;
    left: 85%;
    background-color: green;
  }

  .pin5 {
    top: 66%;
    left: 34%;
    background-color: green;
  }

  .pin6 {
    bottom: -22rem;
    right: 6rem;
  }

  .pin7 {
    top: 46rem;
    left: 53rem;
  }

  .pin8 {
    top: 40rem;
    left: 46rem;
  }

  .pin9 {
    bottom: 5.5rem;
    left: 50rem;
  }

  .pin10 {
    bottom: -24rem;
    left: 10rem;
  }

  .pin11 {
    top: 47rem;
    left: 12rem;
  }

  .pin12 {
    top: 34rem;
    right: 43rem;
  }

  .pin13 {
    top: 33.5rem;
    left: 28rem;
  }

  .pin14 {
    top: 32rem;
    left: 4rem;
  }

  .pin15 {
    top: 27rem;
    left: 57rem;
  }

  .pin16 {
    bottom: -23rem;
    right: 37rem;
  }

  .pin17 {
    bottom: -2rem;
    left: 8rem;
  }

  .pin18 {
    bottom: 4rem;
    left: 29rem;
  }

  .pin19 {
    bottom: -21rem;
    left: 35rem;
  }

  .pin20 {
    bottom: -24rem;
    left: 43rem;
  }

  .pin21 {
    bottom: -23rem;
    left: 50rem;
  }

  .pin22 {
    top: 23rem;
    left: 63rem;
  }

  .pin23 {
    top: 22.5rem;
    right: 45rem;
  }

  .pin24 {
    bottom: -4rem;
    right: 41rem;
  }

  .pin25 {
    bottom: -25rem;
    right: 32.5rem;
  }

  .pin26 {
    top: 25rem;
    right: 23rem;
  }

  .pin27 {
    top: 23rem;
    right: 15rem;
  }

  .pin28 {
    top: 28rem;
    right: 17rem;
  }

  .pin29 {
    top: 33rem;
    right: 18rem;
  }

  .pin30 {
    top: 37rem;
    right: 13rem;
  }

  .pin31 {
    bottom: -12rem;
    right: 20rem;
  }

  .site-footer {
    display: flex;
    position: absolute;
    bottom: -31rem;
    width: 100%;
    color: #fff;
    justify-content: space-between;
    font-size: 1.5rem;
  }

  .site-footer ul {
    display: flex;
    list-style: none;
    margin: 0;
    gap: 10px;
  }

  .site-footer a {
    text-decoration: none;
    color: #fff;
  }
}