.phone.div {
  display: flex;
  flex-direction: column;
  min-width: 376px;
  align-items: flex-start;
  gap: 10px;
  position: relative;
  background-color: #111111;
}

.phone .navbar {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 30px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame {
  display: flex;
  flex-direction: column;
  height: 49.96px;
  align-items: center;
  justify-content: center;
  gap: 3.76px;
  position: relative;
  align-self: stretch;
  width: 100%;
  border-radius: 26.29px;
  overflow: hidden;
  box-shadow: 0px 0px 13.67px #ffffff;
  background: linear-gradient(
    90deg,
    rgba(45, 164, 130, 1) 0%,
    rgba(22, 83, 66, 1) 61%,
    rgba(48, 163, 130, 1) 100%
  );
}

.phone .frame-2 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 23px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .text-wrapper {
  position: relative;
  width: fit-content;
  margin-top: -0.38px;
  text-shadow: 0px 0px 10.77px #ffffff;
  font-family: "Sarpanch", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 16px;
  letter-spacing: 0;
  line-height: normal;
}

.phone .vector {
  position: absolute;
  top: 0;
  left: 10px;
  width: 54px;
  height: 50px;
}

.phone .hero-section {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 108px 63px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .text-wrapper-2 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  margin-left: -24.00px;
  margin-right: -24.00px;
  text-shadow: -0.64px 5.77px 12.82px #719489e6;
  font-family: "Sarpanch", Helvetica;
  font-weight: 900;
  color: #ffffff;
  font-size: 80.1px;
  letter-spacing: 8.01px;
  line-height: normal;
}

.phone .music-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 30px;
  padding: 36px 60px 60px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .div-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 7.17px;
  position: relative;
  flex: 0 0 auto;
}

.phone .text-wrapper-3 {
  position: relative;
  width: fit-content;
  margin-top: -0.72px;
  text-shadow: 0px 0px 15.77px #ffffff;
  font-family: "Sarpanch", Helvetica;
  font-weight: 900;
  color: #ffffff;
  font-size: 52px;
  letter-spacing: 5.20px;
  line-height: normal;
}

.phone .img {
  position: relative;
  flex: 0 0 auto;
  margin-bottom: -1.86px;
  margin-left: -49.89px;
  margin-right: -59.46px;
}

.phone .social-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 30px;
  padding: 35.7px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}


#container {
  display: flex;
  padding: 20px;
  margin: 5px;
  gap: 80px; 
}


.phone .text-wrapper-4 {
  width: fit-content;
  margin-top: -0.59px;
  text-shadow: 0px 0px 15.77px #ffffff;
  font-weight: 900;
  font-size: 52px;
  letter-spacing: 5.20px;
  position: relative;
  font-family: "Sarpanch", Helvetica;
  color: #ffffff;
  line-height: normal;
}

.phone .frame-3 {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14.28px;
  padding: 11.9px;
  background-color: #262626;
  border-radius: 26.77px;
  box-shadow: -0.81px 0px 85.86px #ffffff21;
  display: flex;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame-4 {
  display: flex;
  align-items: center;
  gap: 3.94px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .text-wrapper-5 {
  position: relative;
  width: fit-content;
  margin-top: -0.39px;
  text-shadow: 0px 0px 13.04px #000000ad;
  font-family: "Sarpanch", Helvetica;
  font-weight: 600;
  color: #ffffff;
  font-size: 17.6px;
  letter-spacing: 0;
  line-height: normal;
}

.phone .frame-5 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 23.19px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame-6 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0.62px 13px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame-7 {
  display: flex;
  height: 36.54px;
  align-items: center;
  justify-content: flex-end;
  gap: 6.19px;
  padding: 6.19px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.phone .text-wrapper-6 {
  width: 73.69px;
  margin-top: -0.54px;
  font-weight: 700;
  font-size: 17.3px;
  letter-spacing: 0;
  position: relative;
  font-family: "Sarpanch", Helvetica;
  color: #ffffff;
  line-height: normal;
}

.phone .input {
  height: 20.87px;
  margin-top: -1.86px;
  margin-bottom: -1.86px;
  background-color: #ffffff;
  border-radius: 107.34px;
  box-shadow: 0px 0px 20.5px #00000029;
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.phone .frame-8 {
  display: flex;
  width: 267.4px;
  height: 116.3px;
  align-items: flex-start;
  gap: 6.5px;
  position: relative;
}

.phone .frame-9 {
  display: flex;
  align-items: flex-start;
  gap: 6.5px;
  position: relative;
  flex: 1;
  align-self: stretch;
  flex-grow: 1;
}

.phone .text-wrapper-7 {
  position: relative;
  width: fit-content;
  margin-top: -0.65px;
  font-family: "Sarpanch", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 16.2px;
  letter-spacing: 0;
  line-height: normal;
}

.phone .rectangle-2 {
  align-self: stretch;
  margin-top: -21.51px;
  margin-bottom: -21.51px;
  margin-right: -21.51px;
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.phone .frame-10 {
  display: inline-flex;
  height: 25.64px;
  align-items: center;
  gap: 1.86px;
  padding: 3.52px 11.06px;
  position: relative;
  border-radius: 12.57px;
  border: 1.51px solid;
  border-color: #ffffff;
}

.phone .text-wrapper-8 {
  width: fit-content;
  margin-top: -5.71px;
  margin-bottom: -2.69px;
  text-shadow: 0px 0px 13.18px #ffffff;
  font-weight: 700;
  font-size: 19.6px;
  letter-spacing: 0;
  position: relative;
  font-family: "Sarpanch", Helvetica;
  color: #ffffff;
  line-height: normal;
}

.phone .footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7.46px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: transparent;
  border-radius: 33.59px 33.59px 0px 0px;
  background: linear-gradient(
    90deg,
    rgba(45, 164, 130, 1) 0%,
    rgba(22, 83, 66, 1) 61%,
    rgba(48, 163, 130, 1) 100%
  );
}

.phone .frame-11 {
  align-items: flex-start;
  padding: 7.46px;
  border-radius: 33.59px 33.59px 0px 0px;
  display: flex;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .vector-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 2.02px;
  padding: 2.02px;
  position: relative;
  flex: 0 0 auto;
}

.phone .vector-2 {
  position: relative;
  width: 77.19px;
  height: 77.19px;
  margin-top: -3.67px;
  margin-bottom: -3.67px;
  margin-left: -3.72px;
  margin-right: -3.62px;
}

.phone .frame-12 {
  position: relative;
  width: 47.77px;
  height: 47.77px;
}

.phone .vector-3 {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 42px;
  height: 42px;
}

.phone .vector-4 {
  position: absolute;
  width: 10.94%;
  height: 10.94%;
  top: 20.83%;
  left: 68.23%;
}

.phone .vector-5 {
  position: absolute;
  width: 43.75%;
  height: 43.75%;
  top: 28.13%;
  left: 28.13%;
}

.phone .frame-13 {
  display: flex;
  height: 22.25px;
  align-items: center;
  justify-content: space-between;
  padding: 0px 21.88px;
  position: relative;
  align-self: stretch;
  width: 100%;
  border-top-width: 0.36px;
  border-top-style: solid;
  border-color: #ffffff;
}

.phone .p {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 5.8px;
  letter-spacing: 0;
  line-height: 7.3px;
  white-space: nowrap;
}

.phone .frame-14 {
  display: inline-flex;
  align-items: center;
  gap: 11.67px;
  position: relative;
  flex: 0 0 auto;
}

.phone .text-wrapper-9 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin-top: -0.36px;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 5.8px;
  letter-spacing: 0;
  line-height: 7.3px;
  white-space: nowrap;
}

.phone.tablet {
  display: flex;
  flex-direction: column;
  min-width: 772px;
  align-items: flex-start;
  gap: 10px;
  position: relative;
  background-color: #111111;
  overflow: hidden;
}

.phone .frame-15 {
  display: flex;
  flex-direction: column;
  height: 92.62px;
  align-items: center;
  justify-content: center;
  gap: 6.96px;
  position: relative;
  align-self: stretch;
  width: 100%;
  border-radius: 48.75px;
  box-shadow: 0px 0px 25.35px #ffffff;
  background: linear-gradient(
    90deg,
    rgba(45, 164, 130, 1) 0%,
    rgba(22, 83, 66, 1) 61%,
    rgba(48, 163, 130, 1) 100%
  );
}

.phone .frame-16 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 65.46px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .text-wrapper-10 {
  position: relative;
  width: fit-content;
  margin-top: -0.70px;
  text-shadow: 0px 0px 25.35px #ffffff;
  font-family: "Sarpanch", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 37.6px;
  letter-spacing: 0;
  line-height: normal;
}

.phone .vector-6 {
  position: absolute;
  top: -5px;
  left: 18px;
  width: 100px;
  height: 100px;
}

.phone .hero-section-2 {
  display: flex;
  height: 935px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 60px 63px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.phone .text-wrapper-11 {
  position: relative;
  width: fit-content;
  text-shadow: -1.29px 11.61px 25.81px #719489e6;
  font-family: "Sarpanch", Helvetica;
  font-weight: 900;
  color: #ffffff;
  font-size: 161.3px;
  letter-spacing: 16.13px;
  line-height: normal;
}

.phone .div-2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 60px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .text-wrapper-12 {
  position: relative;
  width: fit-content;
  margin-top: -0.72px;
  text-shadow: 0px 0px 26.08px #ffffff;
  font-family: "Sarpanch", Helvetica;
  font-weight: 900;
  color: #ffffff;
  font-size: 86px;
  letter-spacing: 8.60px;
  line-height: normal;
}

.phone .frame-17 {
  width: 580.38px;
  margin-bottom: -2.96px;
  position: relative;
  flex: 0 0 auto;
}

.phone .frame-18 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 20px;
  align-self: stretch;
  width: 100%;
  background-color: #262626;
  border-radius: 45px;
  box-shadow: -1.36px 0px 144.3px #ffffff21;
  position: relative;
  flex: 0 0 auto;
}

.phone .frame-19 {
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .text-wrapper-13 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  text-shadow: 0px 0px 33.1px #000000ad;
  font-family: "Sarpanch", Helvetica;
  font-weight: 600;
  color: #ffffff;
  font-size: 37.6px;
  letter-spacing: 0;
  line-height: normal;
}

.phone .frame-20 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 48px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame-21 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 1px 21px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame-22 {
  display: flex;
  height: 59px;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding: 10px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.phone .text-wrapper-14 {
  width: 119px;
  margin-top: -1.00px;
  font-weight: var(--paragraph-1-font-weight);
  font-size: var(--paragraph-1-font-size);
  letter-spacing: var(--paragraph-1-letter-spacing);
  position: relative;
  font-family: var(--paragraph-1-font-family);
  color: #ffffff;
  line-height: var(--paragraph-1-line-height);
  font-style: var(--paragraph-1-font-style);
}

.phone .rectangle-3 {
  position: relative;
  flex: 1;
  flex-grow: 1;
  height: 45px;
  margin-top: -3.00px;
  margin-bottom: -3.00px;
  background-color: #ffffff;
  border-radius: 28px;
  box-shadow: var(--black-shadow-1);
}

.phone .frame-23 {
  height: 179px;
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  position: relative;
  align-self: stretch;
}

.phone .frame-24 {
  padding: 0px 20px;
  flex: 1;
  flex-grow: 1;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  position: relative;
  align-self: stretch;
}

.phone .text-wrapper-15 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: var(--paragraph-1-font-family);
  font-weight: var(--paragraph-1-font-weight);
  color: #ffffff;
  font-size: var(--paragraph-1-font-size);
  letter-spacing: var(--paragraph-1-letter-spacing);
  line-height: var(--paragraph-1-line-height);
  font-style: var(--paragraph-1-font-style);
}

.phone .rectangle-4 {
  position: relative;
  flex: 1;
  align-self: stretch;
  flex-grow: 1;
  margin-top: -1.10px;
  margin-bottom: -0.10px;
  margin-right: -33.10px;
}

.phone .frame-25 {
  display: inline-flex;
  height: 51px;
  align-items: center;
  gap: 3.69px;
  padding: 7px 22px;
  position: relative;
  border-radius: 25px;
  border: 3px solid;
  border-color: #ffffff;
}

.phone .text-wrapper-16 {
  width: fit-content;
  margin-top: -11.50px;
  margin-bottom: -5.50px;
  text-shadow: 0px 0px 26.22px #ffffff;
  font-weight: 700;
  font-size: 38.9px;
  letter-spacing: 0;
  position: relative;
  font-family: "Sarpanch", Helvetica;
  color: #ffffff;
  line-height: normal;
}

.phone .footer-2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6.96px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: transparent;
  border-radius: 31.32px 31.32px 0px 0px;
  background: linear-gradient(
    90deg,
    rgba(45, 164, 130, 1) 0%,
    rgba(22, 83, 66, 1) 61%,
    rgba(48, 163, 130, 1) 100%
  );
}

.phone .frame-26 {
  display: flex;
  align-items: flex-start;
  padding: 6.96px;
  align-self: stretch;
  width: 100%;
  border-radius: 31.32px 31.32px 0px 0px;
  position: relative;
  flex: 0 0 auto;
}

.phone .img-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 3.98px;
  padding: 3.98px;
  position: relative;
  flex: 0 0 auto;
}

.phone .vector-7 {
  position: relative;
  width: 151.94px;
  height: 151.94px;
  margin-top: -7.23px;
  margin-bottom: -7.23px;
  margin-left: -7.32px;
  margin-right: -7.13px;
}

.phone .frame-27 {
  position: relative;
  width: 44.54px;
  height: 44.54px;
}

.phone .vector-8 {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 39px;
  height: 39px;
}

.phone .frame-28 {
  display: flex;
  height: 30.64px;
  align-items: center;
  justify-content: space-between;
  padding: 0px 30.14px;
  position: relative;
  align-self: stretch;
  width: 100%;
  border-top-width: 0.5px;
  border-top-style: solid;
  border-color: #ffffff;
}

.phone .text-wrapper-17 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8px;
  letter-spacing: 0;
  line-height: 10.0px;
  white-space: nowrap;
}

.phone .frame-29 {
  display: inline-flex;
  align-items: center;
  gap: 16.07px;
  position: relative;
  flex: 0 0 auto;
}

.phone .text-wrapper-18 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin-top: -0.50px;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 8px;
  letter-spacing: 0;
  line-height: 10.0px;
  white-space: nowrap;
}

.phone.desktop {
  display: flex;
  flex-direction: column;
  min-width: 1474px;
  align-items: flex-start;
  gap: 10px;
  position: relative;
  background-color: #111111;
}

.phone .navbar-2 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7.2px;
  padding: 21.61px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame-30 {
  display: flex;
  flex-direction: column;
  height: 95.79px;
  align-items: center;
  justify-content: center;
  gap: 7.2px;
  position: relative;
  align-self: stretch;
  width: 100%;
  border-radius: 50.41px;
  box-shadow: 0px 0px 26.22px #ffffff;
  background: linear-gradient(
    90deg,
    rgba(45, 164, 130, 1) 0%,
    rgba(22, 83, 66, 1) 61%,
    rgba(48, 163, 130, 1) 100%
  );
}

.phone .frame-31 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 67.7px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .text-wrapper-19 {
  position: relative;
  width: fit-content;
  margin-top: -0.72px;
  text-shadow: 0px 0px 26.22px #ffffff;
  font-family: "Sarpanch", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 38.9px;
  letter-spacing: 0;
  line-height: normal;
}

.phone .vector-9 {
  position: absolute;
  top: -5px;
  left: 19px;
  width: 103px;
  height: 103px;
}

.phone .text-wrapper-20 {
  position: relative;
  width: fit-content;
  text-shadow: -1.3px 11.69px 25.98px #719489e6;
  font-family: "Sarpanch", Helvetica;
  font-weight: 900;
  color: #ffffff;
  font-size: 162.4px;
  letter-spacing: 16.24px;
  line-height: normal;
}

.phone .music-section-2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7.45px;
  padding: 44.69px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame-32 {
  gap: 7.45px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  position: relative;
}

.phone .text-wrapper-21 {
  position: relative;
  width: fit-content;
  margin-top: -0.74px;
  text-shadow: 0px 0px 27.11px #ffffff;
  font-family: "Sarpanch", Helvetica;
  font-weight: 900;
  color: #ffffff;
  font-size: 89.4px;
  letter-spacing: 8.94px;
  line-height: normal;
}

.phone .frame-33 {
  width: 867.06px;
  margin-bottom: -4.42px;
  position: relative;
  flex: 0 0 auto;
}

.phone .text-wrapper-22 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  text-shadow: 0px 0px 33.1px #000000ad;
  font-family: "Sarpanch", Helvetica;
  font-weight: 600;
  color: #ffffff;
  font-size: 40px;
  letter-spacing: 0;
  line-height: normal;
}

.phone .frame-34 {
  display: flex;
  align-items: flex-start;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.phone .frame-35 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 1px 0px;
  position: relative;
  flex: 0 0 auto;
}

.phone .frame-36 {
  display: flex;
  flex-direction: column;
  width: 592px;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
}

.phone .frame-37 {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  position: relative;
  flex: 1;
  align-self: stretch;
  flex-grow: 1;
}

.phone .footer-3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5.68px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: transparent;
  border-radius: 25.58px 25.58px 0px 0px;
  background: linear-gradient(
    90deg,
    rgba(45, 164, 130, 1) 0%,
    rgba(22, 83, 66, 1) 61%,
    rgba(48, 163, 130, 1) 100%
  );
}

.phone .frame-38 {
  display: flex;
  align-items: flex-start;
  padding: 5.68px;
  align-self: stretch;
  width: 100%;
  border-radius: 25.58px 25.58px 0px 0px;
  position: relative;
  flex: 0 0 auto;
}

.phone .frame-39 {
  display: inline-flex;
  align-items: center;
  gap: 5.68px;
  padding: 5.68px;
  position: relative;
  flex: 0 0 auto;
}

.phone .vector-10 {
  position: relative;
  width: 216.74px;
  height: 216.74px;
  margin-top: -10.31px;
  margin-bottom: -10.31px;
  margin-left: -10.44px;
  margin-right: -10.18px;
}

.phone .frame-40 {
  position: relative;
  width: 66.65px;
  height: 66.65px;
}

.phone .vector-11 {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 59px;
  height: 59px;
}

.phone .vector-12 {
  position: absolute;
  width: 43.75%;
  height: 43.75%;
  top: 28.12%;
  left: 28.13%;
}

.phone .frame-41 {
  display: flex;
  height: 68.19px;
  align-items: center;
  justify-content: space-between;
  padding: 0px 67.07px;
  position: relative;
  align-self: stretch;
  width: 100%;
  border-top-width: 1.12px;
  border-top-style: solid;
  border-color: #ffffff;
}

.phone .text-wrapper-23 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 17.9px;
  letter-spacing: 0;
  line-height: 22.4px;
  white-space: nowrap;
}

.phone .frame-42 {
  display: inline-flex;
  align-items: center;
  gap: 35.77px;
  position: relative;
  flex: 0 0 auto;
}

#class img {
  overflow: visible;
}

html {
  scroll-behavior: smooth;
}

#container {
  overflow: visible
}

#containerP {
  display: flex;
  gap: 105px;
}

#containerT {
  display: flex;
  gap: 150px;
}



.phone .text-wrapper-24 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin-top: -1.12px;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 17.9px;
  letter-spacing: 0;
  line-height: 22.4px;
  white-space: nowrap;
}

@media (max-width: 771px) {
  .phone.tablet {
    display: none !important;
  }
  .phone.desktop {
    display: none !important;
  }
}

@media (min-width: 772px) and (max-width: 1473px) {
  .phone.div {
    display: none !important;
  }
  .phone.desktop {
    display: none !important;
  }
}

@media (min-width: 1474px) {
  .phone.div {
    display: none !important;
  }
  .phone.tablet {
    display: none !important;
  }
}

#test-button {
  position: absolute
}