/* main styles extracted from index-orjinal.html */
body {
    margin: 0px;    
}
.element-light {
  background-color: #ffffff;
  width: 100%;
  min-width: 1920px;
  min-height: 3361px;
  position: relative;
}

.element-light .horizontal-border {
  position: absolute;
  width: 100%;
  top: 1376px;
  left: 0;
  height: 676px;
}

.element-light .heading-clash-news {
  position: absolute;
  top: 47px;
  left: calc(50.00% - 237px);
  width: 474px;
  height: 43px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-Black", Helvetica;
  font-weight: 900;
  color: #000000;
  font-size: 34px;
  text-align: center;
  letter-spacing: -0.85px;
  line-height: 42.5px;
  white-space: nowrap;
}

.element-light .link-october-balance {
  position: absolute;
  top: 141px;
  left: 160px;
  width: 785px;
  height: 425px;
  border-radius: 25px;
  overflow: hidden;
}

.element-light .forest-boss-loading {
  position: absolute;
  top: -64px;
  left: 0;
  width: 785px;
  height: 441px;
  aspect-ratio: 1.78;
  object-fit: cover;
}

.element-light .skeleton {
  position: absolute;
  top: -38px;
  left: -75px;
  width: 936px;
  height: 526px;
  aspect-ratio: 1.78;
  object-fit: cover;
}

.element-light .rectangle {
  position: absolute;
  top: 349px;
  left: -18px;
  width: 810px;
  height: 76px;
  border-radius: 10px 0px 0px 0px;
  background: linear-gradient(
    180deg,
    rgba(98, 98, 98, 1) 0%,
    rgba(183, 183, 183, 1) 100%
  );
}

.element-light .text-wrapper {
  position: absolute;
  top: 368px;
  left: calc(50.00% - 262px);
  width: 525px;
  height: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-Black", Helvetica;
  font-weight: 900;
  color: #ffffff;
  font-size: 22px;
  text-align: center;
  letter-spacing: 0;
  line-height: 36.3px;
  white-space: nowrap;
}

.element-light .link-new-season-rock {
  position: absolute;
  top: 141px;
  left: 975px;
  width: 785px;
  height: 425px;
  border-radius: 25px;
  overflow: hidden;
}

.element-light .skeleton-king {
  position: absolute;
  top: -60px;
  left: -80px;
  width: 865px;
  height: 485px;
  aspect-ratio: 1.78;
  object-fit: cover;
}

.element-light .div {
  position: absolute;
  top: 368px;
  left: calc(50.00% - 262px);
  width: 525px;
  height: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-Black", Helvetica;
  font-weight: 900;
  color: #ffffff;
  font-size: 21.8px;
  text-align: center;
  letter-spacing: 0;
  line-height: 36.3px;
  white-space: nowrap;
}

.element-light .group {
  position: absolute;
  width: 29px;
  height: 29px;
  top: 338px;
  left: 1805px;
  display: flex;
  transform: rotate(-90.00deg);
  box-shadow: 0px 1.44px 0px #000000;
}

.element-light .group-2 {
  margin-top: 0;
  width: 28.95px;
  height: 29.47px;
  margin-left: 0;
  position: relative;
}

.element-light .vector {
  top: 1px;
  left: 0;
  height: 29px;
  position: absolute;
  width: 29px;
  transform: rotate(90.00deg);
}

.element-light .img {
  top: 7px;
  left: -7px;
  height: 15px;
  position: absolute;
  width: 29px;
  transform: rotate(90.00deg);
}

.element-light .group-wrapper {
  position: absolute;
  width: 29px;
  height: 29px;
  top: 338px;
  left: 79px;
  display: flex;
  transform: rotate(90.00deg);
  box-shadow: 0px 1.44px 0px #000000;
}

.element-light .vector-2 {
  position: absolute;
  top: 1px;
  left: 0;
  width: 29px;
  height: 29px;
  transform: rotate(-90.00deg);
}

.element-light .vector-3 {
  position: absolute;
  top: 7px;
  left: -7px;
  width: 29px;
  height: 15px;
  transform: rotate(-90.00deg);
}

.element-light .background {
  position: relative;
  width: 100%;
  height: 710px;
  background: url("../img/Background.png") center top / contain no-repeat;
  overflow: visible !important;
  z-index: 2;
}
 
.element-light .background .Background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;

}

.element-light .picture-hero-bg {
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  width: 1920px;
}

.element-light .group-3 {
  position: absolute;
  width: 1154px;
  height: 621px;
  top: 158px;
  left: 766px;
  background-image: url('../img/mask-group-2.png');
  background-size: 100% 100%;
}

.element-light .container {
  position: absolute;
  width: 100%;
  top: 710px;
  left: 0;
  height: 666px;
  display: flex;
  gap: 93px;
}

.element-light .picture-bg-intro {
  margin-top: 123px;
  width: 837px;
  height: 507px;
  margin-left: 160px;
  display: flex;
  border-radius: 25px;
  overflow: hidden;
}

.element-light .kerem-abi-lvl {
  width: 897px;
  height: 506px;
  margin-left: -30px;
  aspect-ratio: 1.77;
  object-fit: cover;
}

.element-light .group-4 {
  margin-top: 235px;
  width: 674.29px;
  height: 281px;
  position: relative;
}

.element-light .heading-epic-real {
  position: absolute;
  top: 0;
  left: 19px;
  width: 510px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-Black", Helvetica;
  font-weight: 900;
  color: #000000;
  font-size: 34px;
  letter-spacing: -0.85px;
  line-height: 42.5px;
  white-space: nowrap;
}

.element-light .unite-norse {
  position: absolute;
  top: 44px;
  left: 0;
  width: 670px;
  height: 163px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 28.1px;
}

.element-light .link-picture {
  position: absolute;
  top: 231px;
  left: 0;
  width: 148px;
  height: 50px;
  background-image: url('../img/link-picture-download-clash-royale-on-the-app-store.png');
  background-size: cover;
  background-position: 50% 50%;
}

.element-light .link-picture-2 {
  position: absolute;
  top: 231px;
  left: 164px;
  width: 168px;
  height: 50px;
  background-image: url('../img/link-picture-download-clash-royale-on-the-google-play-store.png');
  background-size: cover;
  background-position: 50% 50%;
}

.element-light .download {
  position: absolute;
  top: 2017px;
  left: 0;
  width: 1920px;
  height: 683px;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.element-light .group-5 {
  margin-top: -2px;
  width: 1920px;
  height: 686px;
  position: relative;
}

.element-light .mask-group-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 1920px;
  height: 686px;
  display: flex;
  background-image: url('../img/container-1.png');
  background-size: cover;
  background-position: 50% 50%;
}

.element-light .mask-group {
  width: 1920px;
  height: 686px;
}

.element-light .div-wrapper {
  position: absolute;
  width: 328px;
  height: 107px;
  top: 466px;
  left: 1273px;
  display: flex;
}

.element-light .group-6 {
  width: 330.15px;
  height: 107px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.element-light .text-wrapper-2 {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 46px;
  width: 224px;
  height: 43px;
  margin-top: -2px;
  -webkit-text-stroke: 2px #404040;
  font-family: "Inter-Black", Helvetica;
  font-weight: 900;
  color: #ffffff;
  font-size: 30px;
  letter-spacing: -0.85px;
  line-height: 42.5px;
  white-space: nowrap;
}

.element-light .group-7 {
  width: 328.15px;
  display: flex;
  gap: 12px;
}

.element-light .link-picture-3 {
  width: 148.48px;
  height: 50px;
  background-image: url('../img/link-picture-download-on-the-app-store.png');
  background-size: cover;
  background-position: 50% 50%;
}

.element-light .link-picture-get-it {
  width: 167.67px;
  height: 50px;
  background-image: url('../img/link-picture-get-it-on-google-play.png');
  background-size: cover;
  background-position: 50% 50%;
}

.element-light .age-of-realms {
  position: absolute;
  top: 191px;
  left: calc(50.00% + 332px);
  width: 281px;
  height: 281px;
  aspect-ratio: 1;
  object-fit: cover;
}

.element-light .background-2 {
  position: absolute;
  width: 100%;
  top: 2701px;
  left: 0;
  height: 191px;
  display: flex;
  gap: 74.4px;
  background: linear-gradient(
    180deg,
    rgba(255, 226, 14, 1) 1%,
    rgba(246, 187, 6, 1) 100%
  );
}

.element-light .loki {
  margin-top: -149.2px;
  width: 633.6px;
  height: 377.64px;
  margin-left: 256px;
  aspect-ratio: 1.68;
}

.element-light .p {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 65.8px;
  width: 795px;
  height: 54px;
  -webkit-text-stroke: 1px #404040;
  font-family: "Paytone One-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 38.5px;
  letter-spacing: 0;
  line-height: normal;
}

.element-light .footer {
  position: absolute;
  width: 100%;
  top: 2892px;
  left: 0;
  height: 469px;
  background-color: #000000;
}

.element-light .links {
  position: absolute;
  top: 198px;
  left: 159px;
  width: 800px;
  height: 16px;
  display: flex;
  gap: 23.8px;
}

.element-light .item-link-terms-of {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 101.84px;
  height: 16px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 13px;
  letter-spacing: 0;
  line-height: 21.5px;
  white-space: nowrap;
}

.element-light .item-link-privacy {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 84.33px;
  height: 16px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 13px;
  letter-spacing: 0;
  line-height: 21.5px;
  white-space: nowrap;
}

.element-light .item-link-parent-s {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 87.5px;
  height: 16px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 13px;
  letter-spacing: 0;
  line-height: 21.5px;
  white-space: nowrap;
}

.element-light .item-link-safe-and {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 146.43px;
  height: 16px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 13px;
  letter-spacing: 0;
  line-height: 21.5px;
  white-space: nowrap;
}

.element-light .item-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 143.67px;
  height: 16px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 13px;
  letter-spacing: 0;
  line-height: 21.5px;
  white-space: nowrap;
}

.element-light .item-link-other {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 105.45px;
  height: 16px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 13px;
  letter-spacing: 0;
  line-height: 21.5px;
  white-space: nowrap;
}

.element-light .age-of-realms-2 {
  position: absolute;
  top: 41px;
  left: 1601px;
  width: 159px;
  height: 159px;
  aspect-ratio: 1;
  object-fit: cover;
}

.element-light .text-wrapper-3 {
  position: absolute;
  height: 7.88%;
  top: 83.13%;
  left: calc(50.00% - 92px);
  font-family: "Poppins-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 20.5px;
  letter-spacing: 0;
  line-height: 36.9px;
  white-space: nowrap;
}

.element-light .let-us-grab-your {
  position: absolute;
  top: 253px;
  left: 158px;
  width: 546px;
  font-family: "Helvetica-Light", Helvetica;
  font-weight: 300;
  color: #999999;
  font-size: 18px;
  letter-spacing: 0;
  line-height: normal;
}

.element-light .group-8 {
  position: absolute;
  width: 10.99%;
  height: 11.95%;
  top: 19.65%;
  left: 8.28%;
}

.element-light .line {
  position: absolute;
  top: 355px;
  left: 160px;
  width: 1600px;
  height: 1px;
  object-fit: cover;
}

.element-light .navbar {
  position: absolute;
  top: 0;
  left: 535px;
  width: 850px;
  height: 75px;
  display: flex;
  border-radius: 0px 0px 25px 25px;
  background: linear-gradient(
    180deg,
    rgba(57, 57, 57, 1) 0%,
    rgba(0, 0, 0, 1) 100%
  );
}

.element-light .text-wrapper-4 {
  width: 55.42px;
  margin-left: 100px;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 27.0px;
  height: 22px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  font-size: 17px;
  letter-spacing: 0;
  line-height: 28.0px;
  white-space: nowrap;
}

.element-light .text-wrapper-5 {
  width: 63.14px;
  margin-left: 59.8px;
  color: #909090;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 27.0px;
  height: 22px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  font-size: 17px;
  letter-spacing: 0;
  line-height: 28.0px;
  white-space: nowrap;
}

.element-light .text-wrapper-6 {
  width: 65.02px;
  margin-left: 281.6px;
  color: #909090;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 27.0px;
  height: 22px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  font-size: 17px;
  letter-spacing: 0;
  line-height: 28.0px;
  white-space: nowrap;
}

.element-light .text-wrapper-7 {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 27.0px;
  width: 72.86px;
  height: 22px;
  margin-left: 59.8px;
  font-family: "Helvetica-Regular", Helvetica;
  font-weight: 400;
  color: #909090;
  font-size: 17px;
  letter-spacing: 0;
  line-height: 28.0px;
  white-space: nowrap;
}

.element-light .logo {
  position: absolute;
  top: -13px;
  left: calc(50.00% - 95px);
  width: 191px;
  height: 191px;
  aspect-ratio: 1;
  object-fit: cover;
}

 .footer__nav {
            position: absolute;
            top: 198px;
            left: 159px;
            display: flex;
            gap: 24px;
        }

        .footer__nav-link {
            font-family: "Helvetica", Arial, sans-serif;
            font-weight: 400;
            color: #ffffff;
            font-size: 13px;
            letter-spacing: 0;
            line-height: 21.5px;
            white-space: nowrap;
            text-decoration: none;
            transition: color 0.3s ease;
        }

        .footer__nav-link:hover {
            color: #909090;
        }

.element-light .unlocktxt 
{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 65.8px;
    width: 795px;
    height: 54px;
    -webkit-text-stroke: 1px #404040;
	font-family: Paytone One;
	font-weight: 400;
	color: #ffffff;
	font-style: Regular;
	font-size: 38.5px;
	leading-trim: NONE;
	line-height: 100%;
	letter-spacing: 0%;
	vertical-align: middle;
	text-transform: uppercase;
	font-variant-numeric-figure: lining-nums;
	font-variant-numeric-spacing: proportional-nums;
	angle: 0 deg;
	opacity: 1;
	border-width: 1px;
}
