@keyframes fade-in {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.main-page {
  position: relative;
  background-color: var(--color-white);
  width: 100%;
  height: 11000px;
  text-align: left;
  font-size: var(--fs-30);
  color: var(--color-black);
  font-family: var(--font-perandory);
}
.background-icon5 {
  position: absolute;
  bottom: 49px;
  left: 0;
  width: var(--width-1920);
  height: var(--height-1080);
  object-fit: cover;
}
.baex2025,
.div2 {
  position: absolute;
  bottom: 956px;
  left: 67px;
  line-height: var(--lh-15_5);
}
.baex2025 {
  left: 582px;
  text-align: right;
}
.socialscombined-1 {
  position: absolute;
  bottom: 401px;
  left: 807px;
  width: 479px;
  height: 479px;
}
.canterbury-christ-church {
  position: absolute;
  bottom: 255px;
  left: 79px;
  font-size: var(--fs-12_77);
  line-height: var(--lh-15_5);
  font-weight: 500;
  font-family: var(--font-made-tommy);
  display: inline-block;
  width: 1178px;
}
.carousel-post,
.reel,
.tv-display {
  position: absolute;
  bottom: 344px;
  left: 187px;
  font-size: var(--fs-28);
  line-height: var(--lh-15);
}
.carousel-post,
.tv-display {
  left: 522px;
}
.carousel-post {
  left: 956px;
}
.reelprev1,
.tvscreen-combined-1 {
  position: absolute;
  bottom: 402px;
  left: 79px;
  width: 269px;
  height: 478px;
}
.tvscreen-combined-1 {
  bottom: 401px;
  left: 444px;
  height: 479px;
}
.play-parent {
  position: absolute;
  bottom: 412px;
  left: 467px;
  width: 34.6px;
  height: var(--height-12);
  font-size: var(--fs-12);
}
.play {
  position: absolute;
  top: 0;
  left: 0;
  line-height: 7px;
}
.group-child {
  position: absolute;
  height: calc(100% - 1.2px);
  top: 0.12px;
  right: -0.03px;
  bottom: 1.08px;
  max-height: 100%;
  width: 8.7px;
}
.play-group {
  position: absolute;
  bottom: 412px;
  left: 841px;
  width: 35px;
  height: var(--height-12);
  font-size: var(--fs-12);
}
.group-item {
  position: absolute;
  height: calc(100% - 1.2px);
  top: 0.12px;
  right: -0.06px;
  bottom: 1.08px;
  max-height: 100%;
  width: 8.7px;
}
.background-icon6 {
  position: absolute;
  bottom: 1016px;
  left: 0;
  width: var(--width-1920);
  height: var(--height-1080);
  object-fit: cover;
}
.div3 {
  left: 67px;
}
.div3,
.div4,
.hannis-world,
.revengeseekerz {
  position: absolute;
  bottom: 1923px;
  line-height: var(--lh-15_5);
}
.div4 {
  left: 1216px;
}
.hannis-world,
.revengeseekerz {
  text-align: right;
}
.revengeseekerz {
  left: 497px;
}
.hannis-world {
  right: 71px;
}
.hanniworld-icon,
.revengeseekerz-icon {
  position: absolute;
  bottom: 1175px;
  width: 492px;
  height: 696px;
  object-fit: cover;
}
.revengeseekerz-icon {
  left: 79px;
}
.hanniworld-icon {
  right: 200px;
}
.background-icon7 {
  position: absolute;
  top: 7936px;
  left: 0;
  width: var(--width-1920);
  height: var(--height-1080);
  object-fit: cover;
}
.div5,
.njz-never-die {
  position: absolute;
  top: 8078px;
  left: 67px;
  line-height: var(--lh-15_5);
}
.njz-never-die {
  left: 392px;
  text-align: right;
}
.newjeansneverdie-icon {
  top: 8161px;
  left: 79px;
  width: 492px;
  height: 696px;
}
.background-icon8,
.newjeansneverdie-icon,
.v2-icon {
  position: absolute;
  object-fit: cover;
}
.v2-icon {
  top: 8161px;
  right: 200px;
  width: 492px;
  height: 696px;
}
.background-icon8 {
  top: 6969px;
  left: 0;
  width: var(--width-1920);
  height: var(--height-1080);
}
.div6,
.yall-tour {
  position: absolute;
  top: 7111px;
  left: 67px;
  line-height: var(--lh-15_5);
}
.yall-tour {
  left: 572px;
  text-align: right;
}
.glaiveyallscanned-icon {
  left: 79px;
  height: 698px;
}
.glaivetour2-icon,
.glaiveyall-icon,
.glaiveyallscanned-icon {
  position: absolute;
  top: 7194px;
  width: var(--width-493);
  object-fit: cover;
}
.glaiveyall-icon {
  right: 142px;
  height: 697px;
}
.glaivetour2-icon {
  left: 683px;
  height: 698px;
}
.background-icon9 {
  position: absolute;
  top: 6003px;
  left: 0;
  width: var(--width-1920);
  height: var(--height-1080);
  object-fit: cover;
}
.div7,
.foreigner {
  position: absolute;
  top: 6145px;
  left: 67px;
  line-height: var(--lh-15_5);
}
.foreigner {
  left: 575px;
  text-align: right;
}
.foreigner-icon,
.foreignerjeans-icon {
  position: absolute;
  top: 6228px;
  width: var(--width-493);
  height: 698px;
  object-fit: cover;
}
.foreignerjeans-icon {
  left: 81px;
}
.foreigner-icon {
  right: 142px;
}
.background-icon10 {
  position: absolute;
  top: 5037px;
  left: 0;
  width: var(--width-1920);
  height: var(--height-1080);
  object-fit: cover;
}
.a-bit-of,
.div8 {
  position: absolute;
  top: 5179px;
  left: 67px;
  line-height: var(--lh-15_5);
}
.a-bit-of {
  left: 465px;
  text-align: right;
}
.aboamov3-copy4-icon {
  left: 81px;
}
.aboamov3-copy2-icon,
.aboamov3-copy2-icon2,
.aboamov3-copy4-icon {
  position: absolute;
  top: 5262px;
  width: var(--width-493);
  height: 697px;
  object-fit: cover;
}
.aboamov3-copy2-icon {
  left: 683px;
}
.aboamov3-copy2-icon2 {
  right: 142px;
}
.background-icon11,
.background-icon12,
.background-icon13 {
  position: absolute;
  top: 4070px;
  left: 0;
  width: var(--width-1920);
  height: var(--height-1080);
  object-fit: cover;
}
.background-icon12,
.background-icon13 {
  top: 2076px;
}
.background-icon13 {
  top: 3071px;
}
.div10,
.div11,
.div9,
.hypr {
  position: absolute;
  top: 2218px;
  left: 67px;
  line-height: var(--lh-15_5);
}
.div10,
.div11,
.hypr {
  top: 3213px;
}
.div11,
.hypr {
  top: 4212px;
}
.hypr {
  top: 2218px;
  left: 638px;
}
.kromatic {
  top: 3213px;
  left: 583px;
  text-align: right;
}
.kromatic,
.main-logo,
.pencel,
.secondary-logo {
  position: absolute;
  line-height: var(--lh-15_5);
}
.pencel {
  top: 4212px;
  left: 615px;
  text-align: right;
}
.main-logo,
.secondary-logo {
  top: 2930px;
  left: 89px;
  font-size: 28.03px;
}
.secondary-logo {
  left: 387px;
}
.brand-guidelines-were-container,
.hypr-is-a {
  position: absolute;
  font-size: var(--fs-12_77);
  line-height: var(--lh-15_5);
  font-weight: 500;
  font-family: var(--font-made-tommy);
  display: inline-block;
}
.hypr-is-a {
  top: 2495px;
  left: 59px;
  white-space: pre-wrap;
  width: 494px;
}
.brand-guidelines-were-container {
  top: 2983px;
  left: 766px;
  width: 405px;
  height: 69px;
}
.brand-guidelines-were-created {
  color: inherit;
}
.here2 {
  text-decoration: underline;
}
.a-big-part {
  position: absolute;
  top: 2977px;
  right: 147px;
  font-size: var(--fs-12_77);
  line-height: var(--lh-15_5);
  font-weight: 500;
  font-family: var(--font-made-tommy);
  display: inline-block;
  width: 485px;
  height: 69px;
}
.asset-24x-icon,
.asset-34x-icon,
.asset-64x-icon {
  position: absolute;
  top: 2305px;
  left: 76px;
  width: 460px;
  height: 155px;
  object-fit: cover;
}
.asset-24x-icon,
.asset-34x-icon {
  top: 2736px;
  left: 64px;
  width: 163px;
  height: 163px;
}
.asset-34x-icon {
  top: 2746px;
  left: 385px;
  width: 154px;
  height: 144px;
}
.brand-guidelines-00006-icon,
.brand-guidelines-00009-icon {
  position: absolute;
  top: 2305px;
  left: 772px;
  width: 391px;
  height: 277px;
  object-fit: cover;
}
.brand-guidelines-00009-icon {
  top: 2628px;
}
.hypr-advert-v5,
.hypr-ident-brief-ver-1 {
  position: absolute;
  top: 2299px;
  right: 132px;
  width: 497px;
  height: 280px;
}
.hypr-advert-v5 {
  top: 2619px;
}
.play-container {
  position: absolute;
  top: 2887px;
  left: 1291px;
  width: 32.5px;
  height: var(--height-12);
  font-size: var(--fs-12);
}
.group-inner {
  position: absolute;
  top: 0;
  right: 0;
  width: 8px;
  height: 10px;
}
.kromatic-is-a,
.pencel-is-a {
  position: absolute;
  top: 3471px;
  left: 57px;
  font-size: var(--fs-12_77);
  line-height: var(--lh-15_5);
  font-weight: 500;
  font-family: var(--font-made-tommy);
  display: inline-block;
  width: 494px;
}
.pencel-is-a {
  top: 4498px;
  width: 643px;
}
.alternate-logo-style,
.alternate-logo-style2 {
  position: absolute;
  top: 3848px;
  left: 175px;
  font-size: 28.03px;
  line-height: var(--lh-15_5);
}
.alternate-logo-style2 {
  top: 4956px;
  left: 256px;
}
.chromatype-icon,
.logotypeasciiblack-icon {
  position: absolute;
  top: 3313px;
  left: 57px;
  width: var(--width-493);
  height: 110px;
  object-fit: cover;
}
.logotypeasciiblack-icon {
  top: 3713px;
  left: 55px;
  height: 107px;
}
.kromaticident {
  position: absolute;
  top: 3313px;
  right: 148px;
  width: 1006px;
  height: 566px;
}
.layer-1-icon,
.layer-1-icon2 {
  position: absolute;
  top: 4295.03px;
  left: 67px;
  width: 632px;
  height: 151.4px;
}
.layer-1-icon2 {
  top: 4744.47px;
}
.pencel-ui-2-icon {
  position: absolute;
  top: 4212px;
  left: 766px;
  width: 477px;
  height: 805px;
  object-fit: cover;
}
.pencelfigmascreenshot-icon {
  position: absolute;
  top: 4197px;
  right: 148px;
  width: 434px;
  height: 836px;
  object-fit: cover;
}
.portfoliocover-copy-3-icon2 {
  top: 0;
  left: 0;
  width: var(--width-1920);
  height: var(--height-1080);
  opacity: 0;
}
.portfoliocover-copy-3-icon2.animate {
  animation: 1s ease 0s 1 normal forwards fade-in;
}
.background-icon14,
.kuru-icon2,
.portfoliocover-copy-3-icon2 {
  position: absolute;
  object-fit: cover;
}
.background-icon14 {
  top: 1080px;
  left: 0;
  width: var(--width-1920);
  height: var(--height-1080);
}
.kuru-icon2 {
  top: 1298px;
  left: 82px;
  width: 607px;
  height: 298px;
}
.div12,
.kuru3,
.view {
  position: absolute;
  top: 1206px;
  line-height: var(--lh-15_5);
}
.div12 {
  left: 67px;
}
.kuru3,
.view {
  cursor: pointer;
}
.kuru3 {
  left: 638px;
}
.view {
  right: 141px;
}
.logo2,
.rebranding-underground-artist2,
.reforever-crest2 {
  position: absolute;
  top: 2060px;
  left: 195px;
  line-height: var(--lh-15_5);
}
.rebranding-underground-artist2,
.reforever-crest2 {
  left: 460px;
}
.rebranding-underground-artist2 {
  top: 1676px;
  left: 82px;
  font-size: var(--fs-12_77);
  font-weight: 500;
  font-family: var(--font-made-tommy);
  display: inline-block;
  width: 590px;
}
.kuru-crest-icon2,
.kurulogoblue-icon2 {
  position: absolute;
  top: 1807px;
  left: 105px;
  width: 230px;
  height: 230px;
  object-fit: cover;
}
.kuru-crest-icon2 {
  top: 1825px;
  left: 421px;
  width: 258px;
  height: 203px;
}
.kuruvinyl-1-icon2,
.kuruvinyl-2-icon2,
.kuruvinyl-3-icon2 {
  position: absolute;
  top: 1298px;
  left: 780px;
  width: var(--width-380);
  height: 269px;
  object-fit: cover;
}
.kuruvinyl-2-icon2,
.kuruvinyl-3-icon2 {
  top: 1835.69px;
  height: 268.7px;
}
.kuruvinyl-2-icon2 {
  top: 1567px;
}
.kuru-ident2,
.vinylanimation2 {
  position: absolute;
  top: 1298px;
  right: 142px;
  width: 456px;
  height: 323px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
}
.kuru-ident2 {
  top: 1647px;
  height: 456px;
}
.main-page-child {
  position: absolute;
  top: 1128.5px;
  left: 48px;
  width: 17px;
  height: 17px;
}