/* screen - index */

.index {
  align-items: center;
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 6274px;
  overflow: hidden;
  position: relative;
}

.index .header {
  background-color: transparent;
  background-image: url(../img/header@2x.png);
  background-position: 50% 50%;
  background-size: cover;
  height: 235px;
  position: relative;
  width: 430px;
}

.index .hi-ich-bin-der-sebbo {
  color: var(--black);
  font-family: var(--font-family-january_shine-regular);
  font-size: var(--font-size-xl);
  font-weight: 400;
  left: 151px;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  text-align: center;
  top: 149px;
  white-space: nowrap;
  width: 128px;
}

.index .span1-1 {
  font-size: var(--font-size-xxl);
}

.index .titelbild {
  height: 177px;
  position: relative;
  width: 384px;
}

.index .bildschirmfoto-2024-09-01-um-210653-1 {
  height: 165px;
  left: 117px;
  object-fit: cover;
  position: absolute;
  top: 0;
  width: 156px;
}

.index .text {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
  position: relative;
  width: 100%;
}

.index .x-jetzt {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: 345px;
}

.index .span-1 {
  color: var(--black);
  font-family: var(--font-family-inter);
  font-size: var(--font-size-l);
  font-weight: 700;
}

.index .frame-1 {
  align-items: flex-start;
  display: flex;
  gap: 10px;
  height: 525px;
  justify-content: center;
  overflow: hidden;
  padding: 25px 0px;
  position: relative;
  width: 362px;
}

.index .name-spitznamen-al {
  color: var(--black);
  font-family: var(--font-family-inter);
  font-size: var(--font-size-s);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 25px;
  margin-bottom: -49.00px;
  margin-left: -14.00px;
  margin-top: -1.00px;
  position: relative;
  text-align: right;
  width: 190px;
}

.index .sebastian-sebbo-seb {
  letter-spacing: 0;
  line-height: 25px;
  margin-bottom: -24.00px;
  margin-top: -1.00px;
  position: relative;
  width: 190px;
}

.index .und-jetzt-was-frs-a {
  height: 57px;
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  text-align: center;
  width: 345px;
}

.index .bilder {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 40px;
  position: relative;
  width: 100%;
}

.index .whats-app-image-2024-08-31-at-154553 {
  height: 324px;
  position: relative;
  width: 308px;
}

.index .whats-app-image-2024-08-31-at-154458 {
  height: 412px;
  object-fit: cover;
  position: relative;
  width: 308px;
}

.index .whats-app-image-2024-08-31-at-153759 {
  height: 259px;
  position: relative;
  width: 300px;
}

.index .whats-app-image-2024-08-31-at-154639 {
  height: 238px;
  object-fit: cover;
  position: relative;
  width: 316px;
}

.index .whats-app-image-2024-08-31-at-154428 {
  height: 236px;
  object-fit: cover;
  position: relative;
  width: 316px;
}

.index .whats-app-image-2024-08-31-at-154001 {
  height: 424px;
  object-fit: cover;
  position: relative;
  width: 316px;
}

.index .whats-app-image-2024-08-31-at-153727 {
  height: 585px;
  position: relative;
  width: 310px;
}

.index .whats-app-image-2024-08-31-at-154705 {
  height: 416px;
  object-fit: cover;
  position: relative;
  width: 310px;
}

.index .text-1 {
  color: var(--black);
  font-family: var(--font-family-inter);
  font-size: var(--font-size-xl);
  font-weight: 400;
  left: 277px;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  text-align: center;
  top: 425px;
  white-space: nowrap;
  width: 76px;
}

.index .ellipse-2 {
  border: 2px solid;
  border-color: #fc0000;
  border-radius: 16.5px/15px;
  height: 30px;
  left: 236px;
  position: absolute;
  top: 520px;
  width: 33px;
}

.index .arrow-1 {
  height: 57px;
  left: 263px;
  position: absolute;
  top: 463px;
  width: 34px;
}

.index .text-2 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 10px;
  padding: 10px;
  position: relative;
}

.index .span1 {
  color: var(--black);
  font-family: var(--font-family-inter);
  font-size: var(--font-size-m);
  font-weight: 700;
}

.index .span3 {
  text-decoration: underline;
}

.index .kontakt {
  align-items: center;
  align-self: stretch;
  display: flex;
  gap: 10px;
  height: 178px;
  justify-content: center;
  padding: 0px 115px;
  position: relative;
  width: 100%;
}

.index .insta {
  align-items: center;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 166px;
  justify-content: center;
  margin-left: -101.00px;
  position: relative;
  width: 196px;
}

.index .image {
  height: 90px;
  width: 90px;
}

.index .mallesebbo {
  height: 43px;
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  text-align: center;
  width: 148px;
}

.index .facebook {
  align-items: center;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 166px;
  justify-content: center;
  margin-right: -101.00px;
  position: relative;
  width: 196px;
}

.index .ecksebastian7 {
  height: 43px;
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  text-align: center;
  width: 148px;
}

.index .text-3 {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 10px;
  padding: 20px 10px;
  position: relative;
}

.index .und-wenn-du-dir-nich {
  height: 77px;
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  width: 345px;
}

.index .woher-kommt-der-begr {
  height: 131px;
  letter-spacing: 0;
  line-height: 30px;
  position: relative;
  width: 324px;
}

.index .abspann {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 29px;
  height: 1115px;
  margin-left: -1.00px;
  margin-right: -1.00px;
  overflow: hidden;
  padding: 9px 73px;
  position: relative;
  width: 432px;
}

.index .whats-app-image-2024-08-31-at-153951 {
  height: 412px;
  margin-left: -72.00px;
  margin-right: -72.00px;
  position: relative;
  width: 430px;
}

.index .arrow-2 {
  height: 307px;
  position: relative;
  width: 73.64px;
}

.index .und-das-sind-wir-die-tollen-freunde {
  height: 67px;
  letter-spacing: 0;
  line-height: 30px;
  margin-left: -13.00px;
  margin-right: -13.00px;
  position: relative;
  text-align: center;
  width: 312px;
}

.index .image-5 {
  height: 257px;
  margin-bottom: -9.00px;
  margin-left: -73.00px;
  margin-right: -73.00px;
  width: 432px;
}

.index .image-1 {
  object-fit: cover;
  position: relative;
}