body {
  margin: 0;
  padding: 0;
  font-family: "Poppins", sans-serif;
}

:root {
  --d-red: #f06550;
  --m-red: #ff7d6a;
  --l-red: #fab8af;
  --d-pink: #f598a9;
  --m-pink: #ffc0cb;
  --l-pink: #fde5e9;
  --d-gyellow: #f29e00;
  --m-gyellow: #feb602;
  --l-gyellow: #fad372;
  --d-yellow: #f5d073;
  --m-yellow: #ffe6a7;
  --l-yellow: #faecc8;
  --d-green: #2bbf79;
  --m-green: #52d999;
  --l-green: #8ee6bc;
  --d-blue: #8facf0;
  --m-blue: #b8cbf8;
  --l-blue: #ccd9f8;
  --d-grey: #a79d9d;
  --m-grey: #c8c8c8;
  --l-grey: #d8d8d8;
  --d-black: #000000;
  --m-black: #404040;
  --l-black: #898989;
}

/* ===== Scrollbar CSS ===== */
/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #f06550 #ffffff;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 16px;
}

*::-webkit-scrollbar-track {
  background: #ffffff;
}

*::-webkit-scrollbar-thumb {
  background-color: #f06550;
  border-radius: 20px;
  border: 3px solid #c63f3f;
}

.clearfix {
  clear: both;
  width: 100%;
}

.spacer10 {
  float: left;
  height: 10px;
  width: 100%;
}

.spacer20 {
  float: left;
  height: 20px;
  width: 100%;
}

.spacer30 {
  height: 30px;
  width: 100%;
}

.dgreen-txt {
  color: var(--d-green);
}

.txt-20 {
  font-size: 20px;
}

.container,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
  max-width: 1150px;
}

.spacer {
  /* margin: 0 0 50px 0; */
}

.clearfix {
  clear: both;
}

a {
  text-decoration: none;
}

.rows {
  width: 100%;
  display: block;
  float: left;
}

.background-layer {
  position: fixed;
  top: 0;
  left: 0;
  width: 105vw;
  height: 100vh;
  z-index: 1;
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
}

.background-layer.layer1 {
  background-image: url("../img/space-bg.jpg");
}

.background-layer.layer3 {
  background-image: url("../img/bg.png");
  animation: jerk 5s ease-in-out infinite;
  z-index: 3;
}

#stars {
  width: 1px;
  height: 1px;
  background: transparent;
  box-shadow: 1460px 4016px #fff, 996px 1139px #fff, 1760px 1759px #fff,
    655px 1422px #fff, 1311px 980px #fff, 1546px 1431px #fff, 1458px 473px #fff,
    1913px 992px #fff, 1261px 540px #fff, 261px 1889px #fff, 1421px 509px #fff,
    1897px 767px #fff, 516px 477px #fff, 453px 1220px #fff, 305px 1456px #fff,
    1835px 1072px #fff, 1330px 793px #fff, 1824px 196px #fff, 317px 1734px #fff,
    731px 1641px #fff, 91px 802px #fff, 1720px 1407px #fff, 399px 1334px #fff,
    1788px 1769px #fff, 613px 717px #fff, 1241px 1521px #fff, 1189px 1981px #fff,
    1899px 1221px #fff, 864px 735px #fff, 1814px 1604px #fff, 1145px 1407px #fff,
    1950px 1396px #fff, 1034px 282px #fff, 1059px 1319px #fff, 832px 1620px #fff,
    773px 1019px #fff, 941px 337px #fff, 1189px 1555px #fff, 1965px 1521px #fff,
    1879px 198px #fff, 180px 1487px #fff, 1514px 259px #fff, 1313px 1649px #fff,
    1687px 1231px #fff, 978px 1201px #fff, 1426px 878px #fff, 1889px 1304px #fff,
    1460px 441px #fff, 1794px 1317px #fff, 181px 1109px #fff, 369px 445px #fff,
    348px 164px #fff, 1931px 667px #fff, 1172px 1314px #fff, 312px 1862px #fff,
    603px 1742px #fff, 328px 160px #fff, 920px 192px #fff, 1560px 362px #fff,
    808px 1677px #fff, 1658px 1205px #fff, 531px 1630px #fff, 1073px 792px #fff,
    484px 741px #fff, 965px 1080px #fff, 862px 274px #fff, 1018px 460px #fff,
    1457px 1297px #fff, 765px 814px #fff, 476px 2000px #fff, 1252px 576px #fff,
    1242px 519px #fff, 344px 1800px #fff, 210px 636px #fff, 1389px 198px #fff,
    420px 1682px #fff, 1365px 1558px #fff, 617px 535px #fff, 375px 1176px #fff,
    90px 709px #fff, 1838px 173px #fff, 1601px 1961px #fff, 403px 967px #fff,
    478px 1129px #fff, 101px 1897px #fff, 1097px 1425px #fff, 1756px 454px #fff,
    1808px 512px #fff, 1725px 1977px #fff, 1064px 937px #fff, 1188px 1334px #fff,
    934px 820px #fff, 890px 478px #fff, 748px 1794px #fff, 1743px 1576px #fff,
    1555px 261px #fff, 1719px 682px #fff, 1064px 1035px #fff, 1512px 540px #fff,
    1234px 823px #fff, 1985px 972px #fff, 699px 1772px #fff, 252px 1990px #fff,
    287px 1491px #fff, 1304px 44px #fff, 1388px 734px #fff, 970px 1416px #fff,
    463px 947px #fff, 989px 937px #fff, 1032px 865px #fff, 1179px 332px #fff,
    1756px 955px #fff, 1355px 18px #fff, 278px 762px #fff, 1137px 1535px #fff,
    1824px 1748px #fff, 1457px 1826px #fff, 1221px 804px #fff, 1974px 359px #fff,
    1573px 1514px #fff, 749px 1354px #fff, 67px 491px #fff, 963px 849px #fff,
    585px 70px #fff, 1182px 1299px #fff, 1622px 253px #fff, 1976px 986px #fff,
    305px 1016px #fff, 21px 591px #fff, 584px 300px #fff, 1133px 32px #fff,
    1252px 1214px #fff, 1871px 808px #fff, 82px 829px #fff, 1114px 124px #fff,
    957px 1479px #fff, 40px 1328px #fff, 1226px 381px #fff, 1674px 1711px #fff,
    1194px 970px #fff, 720px 874px #fff, 1255px 611px #fff, 220px 738px #fff,
    880px 540px #fff, 692px 971px #fff, 1200px 271px #fff, 1978px 1046px #fff,
    1021px 1831px #fff, 363px 1969px #fff, 936px 866px #fff, 628px 474px #fff,
    222px 172px #fff, 1095px 448px #fff, 313px 646px #fff, 1184px 911px #fff,
    1054px 530px #fff, 581px 1870px #fff, 145px 1163px #fff, 1139px 1761px #fff,
    617px 1866px #fff, 258px 271px #fff, 1676px 730px #fff, 1659px 422px #fff,
    629px 1279px #fff, 217px 967px #fff, 8px 734px #fff, 1520px 1199px #fff,
    1683px 650px #fff, 645px 291px #fff, 1450px 1177px #fff, 147px 1466px #fff,
    794px 71px #fff, 660px 394px #fff, 734px 409px #fff, 234px 813px #fff,
    837px 1410px #fff, 1555px 1575px #fff, 256px 834px #fff, 1915px 201px #fff,
    1947px 363px #fff, 683px 361px #fff, 1877px 1283px #fff, 1730px 1666px #fff,
    1678px 1395px #fff, 663px 1990px #fff, 58px 291px #fff, 1728px 1124px #fff,
    656px 980px #fff, 1413px 659px #fff, 548px 1852px #fff, 323px 1344px #fff,
    1922px 784px #fff, 973px 480px #fff, 1477px 855px #fff, 1119px 291px #fff,
    1427px 1437px #fff, 1920px 836px #fff, 1956px 659px #fff, 1190px 246px #fff,
    890px 1010px #fff, 1442px 1416px #fff, 1017px 933px #fff, 1715px 690px #fff,
    600px 1156px #fff, 267px 460px #fff, 1881px 1734px #fff, 823px 637px #fff,
    885px 61px #fff, 777px 761px #fff, 1956px 1513px #fff, 294px 797px #fff,
    933px 1869px #fff, 1504px 580px #fff, 516px 661px #fff, 1752px 1655px #fff,
    1262px 1175px #fff, 1443px 346px #fff, 1110px 711px #fff, 1849px 996px #fff,
    1353px 972px #fff, 1852px 1662px #fff, 107px 1000px #fff, 1555px 396px #fff,
    492px 799px #fff, 227px 311px #fff, 476px 1779px #fff, 14px 546px #fff,
    1724px 1094px #fff, 1189px 1842px #fff, 1434px 1999px #fff,
    1266px 175px #fff, 1597px 1809px #fff, 87px 1540px #fff, 148px 808px #fff,
    148px 795px #fff, 799px 388px #fff, 1031px 135px #fff, 1945px 1886px #fff,
    1304px 236px #fff, 918px 1787px #fff, 1441px 371px #fff, 1913px 1263px #fff,
    1304px 1557px #fff, 1977px 350px #fff, 201px 688px #fff, 1602px 299px #fff,
    1247px 1024px #fff, 1925px 953px #fff, 1587px 365px #fff, 199px 1253px #fff,
    948px 1671px #fff, 864px 1507px #fff, 1929px 1627px #fff, 784px 1676px #fff,
    1087px 1909px #fff, 412px 963px #fff, 912px 1630px #fff, 1928px 1306px #fff,
    722px 930px #fff, 771px 419px #fff, 1263px 109px #fff, 1103px 1451px #fff,
    1210px 17px #fff, 965px 394px #fff, 1457px 1530px #fff, 1978px 471px #fff,
    1288px 342px #fff, 1429px 261px #fff, 1130px 1390px #fff, 652px 1327px #fff,
    1233px 1366px #fff, 1707px 1174px #fff, 313px 277px #fff, 315px 850px #fff,
    1963px 1353px #fff, 1214px 1885px #fff, 1268px 479px #fff, 549px 1599px #fff,
    1652px 1798px #fff, 1590px 1973px #fff, 1780px 106px #fff, 1800px 465px #fff,
    723px 420px #fff, 784px 1180px #fff, 416px 230px #fff, 1604px 229px #fff,
    1267px 1283px #fff, 1184px 29px #fff, 720px 1265px #fff, 963px 128px #fff,
    402px 480px #fff, 268px 1143px #fff, 1414px 1486px #fff, 978px 1235px #fff,
    92px 1508px #fff, 75px 1294px #fff, 156px 1750px #fff, 970px 20px #fff,
    404px 1753px #fff, 924px 1871px #fff, 1804px 397px #fff, 1012px 1410px #fff,
    1601px 1203px #fff, 1404px 1084px #fff, 981px 1757px #fff, 519px 1917px #fff,
    1017px 1778px #fff, 1297px 1565px #fff, 1951px 1574px #fff,
    956px 1378px #fff, 583px 221px #fff, 1915px 1548px #fff, 960px 382px #fff,
    428px 659px #fff, 724px 977px #fff, 77px 1262px #fff, 737px 48px #fff,
    192px 434px #fff, 1793px 123px #fff, 667px 599px #fff, 1011px 1338px #fff,
    1553px 1750px #fff, 284px 389px #fff, 160px 1147px #fff, 369px 388px #fff,
    998px 5px #fff, 1533px 1698px #fff, 537px 335px #fff, 440px 1826px #fff,
    611px 705px #fff, 180px 1043px #fff, 735px 1481px #fff, 67px 1723px #fff,
    480px 164px #fff, 943px 211px #fff, 1521px 1473px #fff, 652px 929px #fff,
    1814px 880px #fff, 1401px 790px #fff, 1751px 321px #fff, 563px 1745px #fff,
    1508px 1847px #fff, 202px 659px #fff, 721px 874px #fff, 447px 162px #fff,
    671px 1704px #fff, 1540px 909px #fff, 138px 1535px #fff, 1400px 261px #fff,
    1189px 618px #fff, 330px 289px #fff, 700px 1067px #fff, 918px 1397px #fff,
    1964px 1966px #fff, 754px 99px #fff, 695px 1308px #fff, 446px 521px #fff,
    1957px 1002px #fff, 209px 433px #fff, 1146px 1351px #fff, 384px 242px #fff,
    1203px 1947px #fff, 700px 1473px #fff, 1075px 572px #fff, 1066px 1270px #fff,
    1202px 1603px #fff, 1433px 1461px #fff, 548px 1616px #fff,
    1533px 1550px #fff, 283px 686px #fff, 778px 794px #fff, 1836px 1060px #fff,
    553px 109px #fff, 264px 1699px #fff, 1885px 377px #fff, 1955px 1294px #fff,
    965px 193px #fff, 1018px 1592px #fff, 1244px 160px #fff, 787px 191px #fff,
    1705px 1260px #fff, 874px 537px #fff, 557px 912px #fff, 1049px 447px #fff,
    189px 1483px #fff, 828px 1067px #fff, 1575px 17px #fff, 921px 824px #fff,
    202px 1964px #fff, 603px 1201px #fff, 891px 1457px #fff, 1400px 1146px #fff,
    553px 454px #fff, 387px 1795px #fff, 831px 1849px #fff, 408px 76px #fff,
    328px 209px #fff, 576px 813px #fff, 1819px 770px #fff, 772px 1814px #fff,
    991px 300px #fff, 665px 183px #fff, 426px 1422px #fff, 1358px 1176px #fff,
    1661px 399px #fff, 50px 1451px #fff, 1032px 486px #fff, 742px 59px #fff,
    1415px 24px #fff, 1577px 1921px #fff, 1377px 1317px #fff, 1355px 640px #fff,
    578px 495px #fff, 945px 630px #fff, 1197px 77px #fff, 116px 1126px #fff,
    1133px 907px #fff, 997px 392px #fff, 1091px 1928px #fff, 383px 1002px #fff,
    1470px 379px #fff, 1293px 1103px #fff, 929px 568px #fff, 1200px 1696px #fff,
    1584px 1020px #fff, 372px 418px #fff, 1690px 1937px #fff, 1455px 1143px #fff,
    1758px 791px #fff, 446px 780px #fff, 432px 1156px #fff, 1899px 987px #fff,
    1447px 118px #fff, 1822px 739px #fff, 1063px 1595px #fff, 810px 942px #fff,
    538px 1165px #fff, 241px 1128px #fff, 101px 1751px #fff, 289px 1033px #fff,
    644px 637px #fff, 1275px 373px #fff, 1736px 274px #fff, 654px 1347px #fff,
    1706px 1013px #fff, 1319px 587px #fff, 570px 1700px #fff, 681px 702px #fff,
    466px 187px #fff, 1983px 416px #fff, 1581px 1903px #fff, 455px 1362px #fff,
    1019px 970px #fff, 587px 1700px #fff, 1984px 1750px #fff, 1448px 1297px #fff,
    1620px 451px #fff, 295px 1082px #fff, 821px 557px #fff, 639px 307px #fff,
    1842px 178px #fff, 1646px 515px #fff, 207px 1232px #fff, 657px 118px #fff,
    1332px 1650px #fff, 1427px 1716px #fff, 1463px 1046px #fff,
    1389px 755px #fff, 1083px 365px #fff, 599px 1574px #fff, 1042px 173px #fff,
    1471px 1492px #fff, 180px 696px #fff, 805px 597px #fff, 1559px 1749px #fff,
    576px 1669px #fff, 1861px 549px #fff, 330px 738px #fff, 1366px 695px #fff,
    484px 954px #fff, 935px 1897px #fff, 520px 845px #fff, 39px 806px #fff,
    1335px 624px #fff, 1292px 948px #fff, 1659px 1436px #fff, 1168px 1973px #fff,
    1413px 197px #fff, 1119px 609px #fff, 264px 228px #fff, 52px 371px #fff,
    1922px 1779px #fff, 1589px 664px #fff, 908px 893px #fff, 776px 1531px #fff,
    880px 119px #fff, 781px 262px #fff, 91px 235px #fff, 1016px 1846px #fff,
    1385px 552px #fff, 1951px 501px #fff, 1241px 1813px #fff, 392px 296px #fff,
    7px 332px #fff, 953px 805px #fff, 205px 7px #fff, 1488px 112px #fff,
    1949px 84px #fff, 316px 511px #fff, 1139px 1906px #fff, 514px 406px #fff,
    942px 847px #fff, 737px 1141px #fff, 259px 342px #fff, 438px 811px #fff,
    423px 201px #fff, 1354px 738px #fff, 1315px 1244px #fff, 986px 972px #fff,
    660px 162px #fff, 761px 182px #fff, 874px 1231px #fff, 845px 1409px #fff,
    54px 1261px #fff, 1687px 407px #fff, 1108px 369px #fff, 457px 1171px #fff,
    1825px 8px #fff, 461px 476px #fff, 461px 1403px #fff, 890px 1797px #fff,
    1502px 558px #fff, 483px 124px #fff, 1974px 1069px #fff, 452px 1311px #fff,
    673px 1966px #fff, 1903px 1675px #fff, 746px 402px #fff, 1844px 1964px #fff,
    775px 964px #fff, 916px 1858px #fff, 171px 396px #fff, 756px 967px #fff,
    1269px 1802px #fff, 1202px 603px #fff, 556px 1695px #fff, 707px 582px #fff,
    454px 1146px #fff, 277px 1466px #fff, 1994px 983px #fff, 585px 946px #fff,
    75px 1462px #fff, 532px 1601px #fff, 270px 619px #fff, 1762px 572px #fff,
    524px 1999px #fff, 1787px 71px #fff, 320px 1218px #fff, 106px 58px #fff,
    124px 623px #fff, 1299px 626px #fff, 540px 1521px #fff, 1103px 1546px #fff,
    1702px 190px #fff, 1403px 1888px #fff, 77px 1309px #fff, 1036px 1811px #fff,
    590px 680px #fff, 163px 1460px #fff, 726px 723px #fff, 49px 1643px #fff,
    708px 1454px #fff, 1970px 624px #fff, 1865px 818px #fff, 228px 1481px #fff,
    227px 533px #fff, 513px 937px #fff, 586px 1623px #fff, 1462px 179px #fff,
    1467px 1009px #fff, 1483px 1716px #fff, 1108px 186px #fff, 377px 187px #fff,
    844px 1513px #fff, 1532px 1383px #fff, 467px 1897px #fff, 61px 1177px #fff,
    354px 1345px #fff, 1395px 437px #fff, 1813px 580px #fff, 190px 846px #fff,
    301px 1709px #fff, 1246px 752px #fff, 1188px 1713px #fff, 900px 1891px #fff,
    1892px 1094px #fff, 1456px 1856px #fff, 1052px 559px #fff, 989px 1080px #fff,
    975px 1637px #fff, 1411px 1615px #fff, 1500px 633px #fff, 26px 1971px #fff,
    542px 371px #fff, 444px 1373px #fff, 1462px 1497px #fff, 757px 840px #fff,
    1227px 789px #fff, 1986px 535px #fff, 1413px 1555px #fff, 1481px 1747px #fff,
    755px 1663px #fff, 1395px 1419px #fff, 277px 1690px #fff, 1378px 299px #fff,
    1483px 727px #fff, 1342px 184px #fff, 40px 871px #fff, 322px 915px #fff,
    575px 1616px #fff, 1150px 417px #fff, 997px 818px #fff, 633px 1820px #fff,
    1663px 1476px #fff, 1876px 1327px #fff, 1076px 1540px #fff, 830px 419px #fff,
    625px 657px #fff, 608px 1867px #fff, 763px 705px #fff, 1155px 584px #fff,
    1921px 1398px #fff, 1858px 802px #fff, 1075px 1467px #fff, 1002px 551px #fff,
    1609px 41px #fff, 546px 1362px #fff, 1814px 398px #fff, 303px 189px #fff,
    904px 1464px #fff, 1275px 1434px #fff, 1619px 199px #fff, 169px 1603px #fff,
    1192px 1981px #fff, 1945px 1270px #fff, 1190px 1742px #fff,
    202px 1365px #fff, 815px 1296px #fff, 780px 75px #fff, 1625px 829px #fff,
    1417px 1417px #fff, 1336px 297px #fff, 1822px 1506px #fff, 1108px 478px #fff,
    1355px 654px #fff, 766px 1812px #fff, 1746px 788px #fff, 1627px 980px #fff,
    96px 1118px #fff, 231px 1992px #fff, 1046px 1495px #fff, 1691px 1281px #fff,
    1503px 673px #fff, 1424px 1456px #fff, 967px 890px #fff, 513px 1638px #fff,
    1987px 906px #fff, 1750px 1595px #fff, 439px 584px #fff, 299px 1108px #fff,
    1067px 1156px #fff, 922px 1178px #fff, 100px 555px #fff, 101px 1125px #fff,
    21px 782px #fff, 1471px 1613px #fff, 1885px 802px #fff, 634px 1994px #fff,
    1158px 261px #fff, 543px 817px #fff, 954px 834px #fff, 1721px 1303px #fff,
    1598px 71px #fff, 1714px 1744px #fff, 555px 844px #fff, 614px 1995px #fff,
    702px 1770px #fff, 1914px 1396px #fff, 1747px 1735px #fff, 297px 1271px #fff,
    30px 1656px #fff, 491px 1037px #fff, 1590px 1449px #fff, 852px 1420px #fff,
    69px 137px #fff, 319px 1731px #fff, 1968px 14px #fff, 683px 289px #fff,
    3px 1988px #fff, 140px 1085px #fff;
  animation: animStar 50s linear infinite;
}

#stars:after {
  content: " ";
  position: absolute;
  left: 2000px;
  width: 1px;
  height: 1px;
  background: transparent;
  box-shadow: 1460px 4016px #fff, 996px 1139px #fff, 1760px 1759px #fff,
    655px 1422px #fff, 1311px 980px #fff, 1546px 1431px #fff, 1458px 473px #fff,
    1913px 992px #fff, 1261px 540px #fff, 261px 1889px #fff, 1421px 509px #fff,
    1897px 767px #fff, 516px 477px #fff, 453px 1220px #fff, 305px 1456px #fff,
    1835px 1072px #fff, 1330px 793px #fff, 1824px 196px #fff, 317px 1734px #fff,
    731px 1641px #fff, 91px 802px #fff, 1720px 1407px #fff, 399px 1334px #fff,
    1788px 1769px #fff, 613px 717px #fff, 1241px 1521px #fff, 1189px 1981px #fff,
    1899px 1221px #fff, 864px 735px #fff, 1814px 1604px #fff, 1145px 1407px #fff,
    1950px 1396px #fff, 1034px 282px #fff, 1059px 1319px #fff, 832px 1620px #fff,
    773px 1019px #fff, 941px 337px #fff, 1189px 1555px #fff, 1965px 1521px #fff,
    1879px 198px #fff, 180px 1487px #fff, 1514px 259px #fff, 1313px 1649px #fff,
    1687px 1231px #fff, 978px 1201px #fff, 1426px 878px #fff, 1889px 1304px #fff,
    1460px 441px #fff, 1794px 1317px #fff, 181px 1109px #fff, 369px 445px #fff,
    348px 164px #fff, 1931px 667px #fff, 1172px 1314px #fff, 312px 1862px #fff,
    603px 1742px #fff, 328px 160px #fff, 920px 192px #fff, 1560px 362px #fff,
    808px 1677px #fff, 1658px 1205px #fff, 531px 1630px #fff, 1073px 792px #fff,
    484px 741px #fff, 965px 1080px #fff, 862px 274px #fff, 1018px 460px #fff,
    1457px 1297px #fff, 765px 814px #fff, 476px 2000px #fff, 1252px 576px #fff,
    1242px 519px #fff, 344px 1800px #fff, 210px 636px #fff, 1389px 198px #fff,
    420px 1682px #fff, 1365px 1558px #fff, 617px 535px #fff, 375px 1176px #fff,
    90px 709px #fff, 1838px 173px #fff, 1601px 1961px #fff, 403px 967px #fff,
    478px 1129px #fff, 101px 1897px #fff, 1097px 1425px #fff, 1756px 454px #fff,
    1808px 512px #fff, 1725px 1977px #fff, 1064px 937px #fff, 1188px 1334px #fff,
    934px 820px #fff, 890px 478px #fff, 748px 1794px #fff, 1743px 1576px #fff,
    1555px 261px #fff, 1719px 682px #fff, 1064px 1035px #fff, 1512px 540px #fff,
    1234px 823px #fff, 1985px 972px #fff, 699px 1772px #fff, 252px 1990px #fff,
    287px 1491px #fff, 1304px 44px #fff, 1388px 734px #fff, 970px 1416px #fff,
    463px 947px #fff, 989px 937px #fff, 1032px 865px #fff, 1179px 332px #fff,
    1756px 955px #fff, 1355px 18px #fff, 278px 762px #fff, 1137px 1535px #fff,
    1824px 1748px #fff, 1457px 1826px #fff, 1221px 804px #fff, 1974px 359px #fff,
    1573px 1514px #fff, 749px 1354px #fff, 67px 491px #fff, 963px 849px #fff,
    585px 70px #fff, 1182px 1299px #fff, 1622px 253px #fff, 1976px 986px #fff,
    305px 1016px #fff, 21px 591px #fff, 584px 300px #fff, 1133px 32px #fff,
    1252px 1214px #fff, 1871px 808px #fff, 82px 829px #fff, 1114px 124px #fff,
    957px 1479px #fff, 40px 1328px #fff, 1226px 381px #fff, 1674px 1711px #fff,
    1194px 970px #fff, 720px 874px #fff, 1255px 611px #fff, 220px 738px #fff,
    880px 540px #fff, 692px 971px #fff, 1200px 271px #fff, 1978px 1046px #fff,
    1021px 1831px #fff, 363px 1969px #fff, 936px 866px #fff, 628px 474px #fff,
    222px 172px #fff, 1095px 448px #fff, 313px 646px #fff, 1184px 911px #fff,
    1054px 530px #fff, 581px 1870px #fff, 145px 1163px #fff, 1139px 1761px #fff,
    617px 1866px #fff, 258px 271px #fff, 1676px 730px #fff, 1659px 422px #fff,
    629px 1279px #fff, 217px 967px #fff, 8px 734px #fff, 1520px 1199px #fff,
    1683px 650px #fff, 645px 291px #fff, 1450px 1177px #fff, 147px 1466px #fff,
    794px 71px #fff, 660px 394px #fff, 734px 409px #fff, 234px 813px #fff,
    837px 1410px #fff, 1555px 1575px #fff, 256px 834px #fff, 1915px 201px #fff,
    1947px 363px #fff, 683px 361px #fff, 1877px 1283px #fff, 1730px 1666px #fff,
    1678px 1395px #fff, 663px 1990px #fff, 58px 291px #fff, 1728px 1124px #fff,
    656px 980px #fff, 1413px 659px #fff, 548px 1852px #fff, 323px 1344px #fff,
    1922px 784px #fff, 973px 480px #fff, 1477px 855px #fff, 1119px 291px #fff,
    1427px 1437px #fff, 1920px 836px #fff, 1956px 659px #fff, 1190px 246px #fff,
    890px 1010px #fff, 1442px 1416px #fff, 1017px 933px #fff, 1715px 690px #fff,
    600px 1156px #fff, 267px 460px #fff, 1881px 1734px #fff, 823px 637px #fff,
    885px 61px #fff, 777px 761px #fff, 1956px 1513px #fff, 294px 797px #fff,
    933px 1869px #fff, 1504px 580px #fff, 516px 661px #fff, 1752px 1655px #fff,
    1262px 1175px #fff, 1443px 346px #fff, 1110px 711px #fff, 1849px 996px #fff,
    1353px 972px #fff, 1852px 1662px #fff, 107px 1000px #fff, 1555px 396px #fff,
    492px 799px #fff, 227px 311px #fff, 476px 1779px #fff, 14px 546px #fff,
    1724px 1094px #fff, 1189px 1842px #fff, 1434px 1999px #fff,
    1266px 175px #fff, 1597px 1809px #fff, 87px 1540px #fff, 148px 808px #fff,
    148px 795px #fff, 799px 388px #fff, 1031px 135px #fff, 1945px 1886px #fff,
    1304px 236px #fff, 918px 1787px #fff, 1441px 371px #fff, 1913px 1263px #fff,
    1304px 1557px #fff, 1977px 350px #fff, 201px 688px #fff, 1602px 299px #fff,
    1247px 1024px #fff, 1925px 953px #fff, 1587px 365px #fff, 199px 1253px #fff,
    948px 1671px #fff, 864px 1507px #fff, 1929px 1627px #fff, 784px 1676px #fff,
    1087px 1909px #fff, 412px 963px #fff, 912px 1630px #fff, 1928px 1306px #fff,
    722px 930px #fff, 771px 419px #fff, 1263px 109px #fff, 1103px 1451px #fff,
    1210px 17px #fff, 965px 394px #fff, 1457px 1530px #fff, 1978px 471px #fff,
    1288px 342px #fff, 1429px 261px #fff, 1130px 1390px #fff, 652px 1327px #fff,
    1233px 1366px #fff, 1707px 1174px #fff, 313px 277px #fff, 315px 850px #fff,
    1963px 1353px #fff, 1214px 1885px #fff, 1268px 479px #fff, 549px 1599px #fff,
    1652px 1798px #fff, 1590px 1973px #fff, 1780px 106px #fff, 1800px 465px #fff,
    723px 420px #fff, 784px 1180px #fff, 416px 230px #fff, 1604px 229px #fff,
    1267px 1283px #fff, 1184px 29px #fff, 720px 1265px #fff, 963px 128px #fff,
    402px 480px #fff, 268px 1143px #fff, 1414px 1486px #fff, 978px 1235px #fff,
    92px 1508px #fff, 75px 1294px #fff, 156px 1750px #fff, 970px 20px #fff,
    404px 1753px #fff, 924px 1871px #fff, 1804px 397px #fff, 1012px 1410px #fff,
    1601px 1203px #fff, 1404px 1084px #fff, 981px 1757px #fff, 519px 1917px #fff,
    1017px 1778px #fff, 1297px 1565px #fff, 1951px 1574px #fff,
    956px 1378px #fff, 583px 221px #fff, 1915px 1548px #fff, 960px 382px #fff,
    428px 659px #fff, 724px 977px #fff, 77px 1262px #fff, 737px 48px #fff,
    192px 434px #fff, 1793px 123px #fff, 667px 599px #fff, 1011px 1338px #fff,
    1553px 1750px #fff, 284px 389px #fff, 160px 1147px #fff, 369px 388px #fff,
    998px 5px #fff, 1533px 1698px #fff, 537px 335px #fff, 440px 1826px #fff,
    611px 705px #fff, 180px 1043px #fff, 735px 1481px #fff, 67px 1723px #fff,
    480px 164px #fff, 943px 211px #fff, 1521px 1473px #fff, 652px 929px #fff,
    1814px 880px #fff, 1401px 790px #fff, 1751px 321px #fff, 563px 1745px #fff,
    1508px 1847px #fff, 202px 659px #fff, 721px 874px #fff, 447px 162px #fff,
    671px 1704px #fff, 1540px 909px #fff, 138px 1535px #fff, 1400px 261px #fff,
    1189px 618px #fff, 330px 289px #fff, 700px 1067px #fff, 918px 1397px #fff,
    1964px 1966px #fff, 754px 99px #fff, 695px 1308px #fff, 446px 521px #fff,
    1957px 1002px #fff, 209px 433px #fff, 1146px 1351px #fff, 384px 242px #fff,
    1203px 1947px #fff, 700px 1473px #fff, 1075px 572px #fff, 1066px 1270px #fff,
    1202px 1603px #fff, 1433px 1461px #fff, 548px 1616px #fff,
    1533px 1550px #fff, 283px 686px #fff, 778px 794px #fff, 1836px 1060px #fff,
    553px 109px #fff, 264px 1699px #fff, 1885px 377px #fff, 1955px 1294px #fff,
    965px 193px #fff, 1018px 1592px #fff, 1244px 160px #fff, 787px 191px #fff,
    1705px 1260px #fff, 874px 537px #fff, 557px 912px #fff, 1049px 447px #fff,
    189px 1483px #fff, 828px 1067px #fff, 1575px 17px #fff, 921px 824px #fff,
    202px 1964px #fff, 603px 1201px #fff, 891px 1457px #fff, 1400px 1146px #fff,
    553px 454px #fff, 387px 1795px #fff, 831px 1849px #fff, 408px 76px #fff,
    328px 209px #fff, 576px 813px #fff, 1819px 770px #fff, 772px 1814px #fff,
    991px 300px #fff, 665px 183px #fff, 426px 1422px #fff, 1358px 1176px #fff,
    1661px 399px #fff, 50px 1451px #fff, 1032px 486px #fff, 742px 59px #fff,
    1415px 24px #fff, 1577px 1921px #fff, 1377px 1317px #fff, 1355px 640px #fff,
    578px 495px #fff, 945px 630px #fff, 1197px 77px #fff, 116px 1126px #fff,
    1133px 907px #fff, 997px 392px #fff, 1091px 1928px #fff, 383px 1002px #fff,
    1470px 379px #fff, 1293px 1103px #fff, 929px 568px #fff, 1200px 1696px #fff,
    1584px 1020px #fff, 372px 418px #fff, 1690px 1937px #fff, 1455px 1143px #fff,
    1758px 791px #fff, 446px 780px #fff, 432px 1156px #fff, 1899px 987px #fff,
    1447px 118px #fff, 1822px 739px #fff, 1063px 1595px #fff, 810px 942px #fff,
    538px 1165px #fff, 241px 1128px #fff, 101px 1751px #fff, 289px 1033px #fff,
    644px 637px #fff, 1275px 373px #fff, 1736px 274px #fff, 654px 1347px #fff,
    1706px 1013px #fff, 1319px 587px #fff, 570px 1700px #fff, 681px 702px #fff,
    466px 187px #fff, 1983px 416px #fff, 1581px 1903px #fff, 455px 1362px #fff,
    1019px 970px #fff, 587px 1700px #fff, 1984px 1750px #fff, 1448px 1297px #fff,
    1620px 451px #fff, 295px 1082px #fff, 821px 557px #fff, 639px 307px #fff,
    1842px 178px #fff, 1646px 515px #fff, 207px 1232px #fff, 657px 118px #fff,
    1332px 1650px #fff, 1427px 1716px #fff, 1463px 1046px #fff,
    1389px 755px #fff, 1083px 365px #fff, 599px 1574px #fff, 1042px 173px #fff,
    1471px 1492px #fff, 180px 696px #fff, 805px 597px #fff, 1559px 1749px #fff,
    576px 1669px #fff, 1861px 549px #fff, 330px 738px #fff, 1366px 695px #fff,
    484px 954px #fff, 935px 1897px #fff, 520px 845px #fff, 39px 806px #fff,
    1335px 624px #fff, 1292px 948px #fff, 1659px 1436px #fff, 1168px 1973px #fff,
    1413px 197px #fff, 1119px 609px #fff, 264px 228px #fff, 52px 371px #fff,
    1922px 1779px #fff, 1589px 664px #fff, 908px 893px #fff, 776px 1531px #fff,
    880px 119px #fff, 781px 262px #fff, 91px 235px #fff, 1016px 1846px #fff,
    1385px 552px #fff, 1951px 501px #fff, 1241px 1813px #fff, 392px 296px #fff,
    7px 332px #fff, 953px 805px #fff, 205px 7px #fff, 1488px 112px #fff,
    1949px 84px #fff, 316px 511px #fff, 1139px 1906px #fff, 514px 406px #fff,
    942px 847px #fff, 737px 1141px #fff, 259px 342px #fff, 438px 811px #fff,
    423px 201px #fff, 1354px 738px #fff, 1315px 1244px #fff, 986px 972px #fff,
    660px 162px #fff, 761px 182px #fff, 874px 1231px #fff, 845px 1409px #fff,
    54px 1261px #fff, 1687px 407px #fff, 1108px 369px #fff, 457px 1171px #fff,
    1825px 8px #fff, 461px 476px #fff, 461px 1403px #fff, 890px 1797px #fff,
    1502px 558px #fff, 483px 124px #fff, 1974px 1069px #fff, 452px 1311px #fff,
    673px 1966px #fff, 1903px 1675px #fff, 746px 402px #fff, 1844px 1964px #fff,
    775px 964px #fff, 916px 1858px #fff, 171px 396px #fff, 756px 967px #fff,
    1269px 1802px #fff, 1202px 603px #fff, 556px 1695px #fff, 707px 582px #fff,
    454px 1146px #fff, 277px 1466px #fff, 1994px 983px #fff, 585px 946px #fff,
    75px 1462px #fff, 532px 1601px #fff, 270px 619px #fff, 1762px 572px #fff,
    524px 1999px #fff, 1787px 71px #fff, 320px 1218px #fff, 106px 58px #fff,
    124px 623px #fff, 1299px 626px #fff, 540px 1521px #fff, 1103px 1546px #fff,
    1702px 190px #fff, 1403px 1888px #fff, 77px 1309px #fff, 1036px 1811px #fff,
    590px 680px #fff, 163px 1460px #fff, 726px 723px #fff, 49px 1643px #fff,
    708px 1454px #fff, 1970px 624px #fff, 1865px 818px #fff, 228px 1481px #fff,
    227px 533px #fff, 513px 937px #fff, 586px 1623px #fff, 1462px 179px #fff,
    1467px 1009px #fff, 1483px 1716px #fff, 1108px 186px #fff, 377px 187px #fff,
    844px 1513px #fff, 1532px 1383px #fff, 467px 1897px #fff, 61px 1177px #fff,
    354px 1345px #fff, 1395px 437px #fff, 1813px 580px #fff, 190px 846px #fff,
    301px 1709px #fff, 1246px 752px #fff, 1188px 1713px #fff, 900px 1891px #fff,
    1892px 1094px #fff, 1456px 1856px #fff, 1052px 559px #fff, 989px 1080px #fff,
    975px 1637px #fff, 1411px 1615px #fff, 1500px 633px #fff, 26px 1971px #fff,
    542px 371px #fff, 444px 1373px #fff, 1462px 1497px #fff, 757px 840px #fff,
    1227px 789px #fff, 1986px 535px #fff, 1413px 1555px #fff, 1481px 1747px #fff,
    755px 1663px #fff, 1395px 1419px #fff, 277px 1690px #fff, 1378px 299px #fff,
    1483px 727px #fff, 1342px 184px #fff, 40px 871px #fff, 322px 915px #fff,
    575px 1616px #fff, 1150px 417px #fff, 997px 818px #fff, 633px 1820px #fff,
    1663px 1476px #fff, 1876px 1327px #fff, 1076px 1540px #fff, 830px 419px #fff,
    625px 657px #fff, 608px 1867px #fff, 763px 705px #fff, 1155px 584px #fff,
    1921px 1398px #fff, 1858px 802px #fff, 1075px 1467px #fff, 1002px 551px #fff,
    1609px 41px #fff, 546px 1362px #fff, 1814px 398px #fff, 303px 189px #fff,
    904px 1464px #fff, 1275px 1434px #fff, 1619px 199px #fff, 169px 1603px #fff,
    1192px 1981px #fff, 1945px 1270px #fff, 1190px 1742px #fff,
    202px 1365px #fff, 815px 1296px #fff, 780px 75px #fff, 1625px 829px #fff,
    1417px 1417px #fff, 1336px 297px #fff, 1822px 1506px #fff, 1108px 478px #fff,
    1355px 654px #fff, 766px 1812px #fff, 1746px 788px #fff, 1627px 980px #fff,
    96px 1118px #fff, 231px 1992px #fff, 1046px 1495px #fff, 1691px 1281px #fff,
    1503px 673px #fff, 1424px 1456px #fff, 967px 890px #fff, 513px 1638px #fff,
    1987px 906px #fff, 1750px 1595px #fff, 439px 584px #fff, 299px 1108px #fff,
    1067px 1156px #fff, 922px 1178px #fff, 100px 555px #fff, 101px 1125px #fff,
    21px 782px #fff, 1471px 1613px #fff, 1885px 802px #fff, 634px 1994px #fff,
    1158px 261px #fff, 543px 817px #fff, 954px 834px #fff, 1721px 1303px #fff,
    1598px 71px #fff, 1714px 1744px #fff, 555px 844px #fff, 614px 1995px #fff,
    702px 1770px #fff, 1914px 1396px #fff, 1747px 1735px #fff, 297px 1271px #fff,
    30px 1656px #fff, 491px 1037px #fff, 1590px 1449px #fff, 852px 1420px #fff,
    69px 137px #fff, 319px 1731px #fff, 1968px 14px #fff, 683px 289px #fff,
    3px 1988px #fff, 140px 1085px #fff;
}

#stars2 {
  width: 2px;
  height: 2px;
  background: transparent;
  box-shadow: 1476px 6278px #fff, 353px 416px #fff, 1489px 680px #fff,
    608px 755px #fff, 1607px 983px #fff, 985px 1527px #fff, 1450px 1953px #fff,
    932px 946px #fff, 1981px 74px #fff, 213px 138px #fff, 887px 1536px #fff,
    450px 1011px #fff, 589px 143px #fff, 1493px 355px #fff, 1475px 106px #fff,
    666px 732px #fff, 715px 1509px #fff, 100px 1609px #fff, 504px 1985px #fff,
    913px 828px #fff, 118px 1272px #fff, 1451px 489px #fff, 1917px 1881px #fff,
    1326px 1262px #fff, 11px 1018px #fff, 698px 1574px #fff, 441px 1228px #fff,
    307px 1976px #fff, 305px 1363px #fff, 1920px 416px #fff, 288px 1431px #fff,
    1917px 1661px #fff, 399px 1152px #fff, 1694px 279px #fff, 896px 452px #fff,
    1136px 1409px #fff, 1174px 461px #fff, 1316px 947px #fff, 690px 471px #fff,
    1945px 1157px #fff, 818px 486px #fff, 495px 1611px #fff, 982px 694px #fff,
    562px 1587px #fff, 1707px 1770px #fff, 496px 979px #fff, 1821px 1291px #fff,
    165px 269px #fff, 1539px 1638px #fff, 470px 1106px #fff, 984px 1253px #fff,
    1173px 1064px #fff, 860px 189px #fff, 1384px 971px #fff, 90px 421px #fff,
    87px 743px #fff, 1603px 127px #fff, 981px 806px #fff, 16px 1778px #fff,
    977px 510px #fff, 1311px 8px #fff, 418px 1101px #fff, 474px 159px #fff,
    864px 1340px #fff, 1224px 1405px #fff, 419px 1898px #fff, 1092px 962px #fff,
    547px 553px #fff, 1201px 198px #fff, 683px 1725px #fff, 1561px 556px #fff,
    1092px 1197px #fff, 386px 1669px #fff, 1221px 1768px #fff, 744px 692px #fff,
    1883px 1153px #fff, 577px 259px #fff, 1714px 130px #fff, 1451px 1459px #fff,
    90px 858px #fff, 1101px 840px #fff, 1444px 951px #fff, 1142px 1665px #fff,
    1194px 1907px #fff, 1363px 682px #fff, 402px 1296px #fff, 1235px 918px #fff,
    507px 590px #fff, 1301px 801px #fff, 954px 1882px #fff, 50px 1910px #fff,
    713px 1936px #fff, 919px 1843px #fff, 1186px 997px #fff, 1178px 1363px #fff,
    1344px 1906px #fff, 485px 616px #fff, 573px 352px #fff, 1138px 965px #fff,
    62px 427px #fff, 195px 1137px #fff, 839px 1712px #fff, 1176px 1745px #fff,
    689px 664px #fff, 108px 1732px #fff, 63px 1845px #fff, 1555px 650px #fff,
    855px 45px #fff, 1255px 870px #fff, 843px 668px #fff, 1380px 717px #fff,
    1502px 1887px #fff, 1037px 1427px #fff, 1019px 720px #fff, 658px 939px #fff,
    1915px 1409px #fff, 1110px 27px #fff, 1966px 1526px #fff, 1243px 479px #fff,
    1510px 1816px #fff, 1692px 616px #fff, 445px 1855px #fff, 1667px 1082px #fff,
    448px 881px #fff, 1684px 1640px #fff, 1114px 410px #fff, 297px 815px #fff,
    633px 471px #fff, 1736px 1392px #fff, 1018px 380px #fff, 1148px 396px #fff,
    325px 1175px #fff, 444px 847px #fff, 456px 1231px #fff, 1986px 1431px #fff,
    1077px 1950px #fff, 1433px 1004px #fff, 1662px 1458px #fff,
    904px 1332px #fff, 1253px 972px #fff, 1691px 1212px #fff, 327px 1852px #fff,
    821px 1294px #fff, 867px 794px #fff, 1216px 1800px #fff, 502px 742px #fff,
    440px 1363px #fff, 1903px 1746px #fff, 1887px 288px #fff, 1792px 72px #fff,
    1920px 1060px #fff, 1830px 961px #fff, 415px 226px #fff, 291px 1650px #fff,
    1811px 1748px #fff, 1470px 1857px #fff, 997px 269px #fff, 1682px 55px #fff,
    909px 1506px #fff, 1614px 53px #fff, 746px 1476px #fff, 543px 1475px #fff,
    1693px 1974px #fff, 17px 1771px #fff, 23px 1775px #fff, 1280px 1429px #fff,
    1991px 1318px #fff, 1848px 98px #fff, 1971px 808px #fff, 1253px 26px #fff,
    503px 991px #fff, 592px 218px #fff, 1667px 1063px #fff, 1601px 1002px #fff,
    841px 1486px #fff, 360px 1500px #fff, 1225px 133px #fff, 78px 1380px #fff,
    158px 643px #fff, 1791px 1549px #fff, 850px 1593px #fff, 1515px 1103px #fff,
    177px 613px #fff, 497px 1492px #fff, 1961px 23px #fff, 1150px 220px #fff,
    1503px 412px #fff, 29px 496px #fff, 1520px 652px #fff, 520px 1251px #fff,
    1574px 1477px #fff, 405px 1597px #fff, 1043px 1090px #fff,
    1214px 1830px #fff, 1793px 81px #fff, 536px 901px #fff, 168px 1041px #fff,
    79px 166px #fff, 564px 1461px #fff, 1037px 905px #fff;
  animation: animStar 100s linear infinite;
}

#stars2:after {
  content: " ";
  position: absolute;
  left: 2000px;
  width: 2px;
  height: 2px;
  background: transparent;
  box-shadow: 1476px 6278px #fff, 353px 416px #fff, 1489px 680px #fff,
    608px 755px #fff, 1607px 983px #fff, 985px 1527px #fff, 1450px 1953px #fff,
    932px 946px #fff, 1981px 74px #fff, 213px 138px #fff, 887px 1536px #fff,
    450px 1011px #fff, 589px 143px #fff, 1493px 355px #fff, 1475px 106px #fff,
    666px 732px #fff, 715px 1509px #fff, 100px 1609px #fff, 504px 1985px #fff,
    913px 828px #fff, 118px 1272px #fff, 1451px 489px #fff, 1917px 1881px #fff,
    1326px 1262px #fff, 11px 1018px #fff, 698px 1574px #fff, 441px 1228px #fff,
    307px 1976px #fff, 305px 1363px #fff, 1920px 416px #fff, 288px 1431px #fff,
    1917px 1661px #fff, 399px 1152px #fff, 1694px 279px #fff, 896px 452px #fff,
    1136px 1409px #fff, 1174px 461px #fff, 1316px 947px #fff, 690px 471px #fff,
    1945px 1157px #fff, 818px 486px #fff, 495px 1611px #fff, 982px 694px #fff,
    562px 1587px #fff, 1707px 1770px #fff, 496px 979px #fff, 1821px 1291px #fff,
    165px 269px #fff, 1539px 1638px #fff, 470px 1106px #fff, 984px 1253px #fff,
    1173px 1064px #fff, 860px 189px #fff, 1384px 971px #fff, 90px 421px #fff,
    87px 743px #fff, 1603px 127px #fff, 981px 806px #fff, 16px 1778px #fff,
    977px 510px #fff, 1311px 8px #fff, 418px 1101px #fff, 474px 159px #fff,
    864px 1340px #fff, 1224px 1405px #fff, 419px 1898px #fff, 1092px 962px #fff,
    547px 553px #fff, 1201px 198px #fff, 683px 1725px #fff, 1561px 556px #fff,
    1092px 1197px #fff, 386px 1669px #fff, 1221px 1768px #fff, 744px 692px #fff,
    1883px 1153px #fff, 577px 259px #fff, 1714px 130px #fff, 1451px 1459px #fff,
    90px 858px #fff, 1101px 840px #fff, 1444px 951px #fff, 1142px 1665px #fff,
    1194px 1907px #fff, 1363px 682px #fff, 402px 1296px #fff, 1235px 918px #fff,
    507px 590px #fff, 1301px 801px #fff, 954px 1882px #fff, 50px 1910px #fff,
    713px 1936px #fff, 919px 1843px #fff, 1186px 997px #fff, 1178px 1363px #fff,
    1344px 1906px #fff, 485px 616px #fff, 573px 352px #fff, 1138px 965px #fff,
    62px 427px #fff, 195px 1137px #fff, 839px 1712px #fff, 1176px 1745px #fff,
    689px 664px #fff, 108px 1732px #fff, 63px 1845px #fff, 1555px 650px #fff,
    855px 45px #fff, 1255px 870px #fff, 843px 668px #fff, 1380px 717px #fff,
    1502px 1887px #fff, 1037px 1427px #fff, 1019px 720px #fff, 658px 939px #fff,
    1915px 1409px #fff, 1110px 27px #fff, 1966px 1526px #fff, 1243px 479px #fff,
    1510px 1816px #fff, 1692px 616px #fff, 445px 1855px #fff, 1667px 1082px #fff,
    448px 881px #fff, 1684px 1640px #fff, 1114px 410px #fff, 297px 815px #fff,
    633px 471px #fff, 1736px 1392px #fff, 1018px 380px #fff, 1148px 396px #fff,
    325px 1175px #fff, 444px 847px #fff, 456px 1231px #fff, 1986px 1431px #fff,
    1077px 1950px #fff, 1433px 1004px #fff, 1662px 1458px #fff,
    904px 1332px #fff, 1253px 972px #fff, 1691px 1212px #fff, 327px 1852px #fff,
    821px 1294px #fff, 867px 794px #fff, 1216px 1800px #fff, 502px 742px #fff,
    440px 1363px #fff, 1903px 1746px #fff, 1887px 288px #fff, 1792px 72px #fff,
    1920px 1060px #fff, 1830px 961px #fff, 415px 226px #fff, 291px 1650px #fff,
    1811px 1748px #fff, 1470px 1857px #fff, 997px 269px #fff, 1682px 55px #fff,
    909px 1506px #fff, 1614px 53px #fff, 746px 1476px #fff, 543px 1475px #fff,
    1693px 1974px #fff, 17px 1771px #fff, 23px 1775px #fff, 1280px 1429px #fff,
    1991px 1318px #fff, 1848px 98px #fff, 1971px 808px #fff, 1253px 26px #fff,
    503px 991px #fff, 592px 218px #fff, 1667px 1063px #fff, 1601px 1002px #fff,
    841px 1486px #fff, 360px 1500px #fff, 1225px 133px #fff, 78px 1380px #fff,
    158px 643px #fff, 1791px 1549px #fff, 850px 1593px #fff, 1515px 1103px #fff,
    177px 613px #fff, 497px 1492px #fff, 1961px 23px #fff, 1150px 220px #fff,
    1503px 412px #fff, 29px 496px #fff, 1520px 652px #fff, 520px 1251px #fff,
    1574px 1477px #fff, 405px 1597px #fff, 1043px 1090px #fff,
    1214px 1830px #fff, 1793px 81px #fff, 536px 901px #fff, 168px 1041px #fff,
    79px 166px #fff, 564px 1461px #fff, 1037px 905px #fff;
}

#stars3 {
  width: 3px;
  height: 3px;
  background: transparent;
  box-shadow: 1538px 2368px #fff, 1057px 973px #fff, 830px 1863px #fff,
    1041px 881px #fff, 219px 1386px #fff, 1480px 1229px #fff, 831px 1999px #fff,
    1472px 523px #fff, 1032px 1768px #fff, 1892px 827px #fff, 1635px 231px #fff,
    1224px 400px #fff, 1043px 343px #fff, 305px 1815px #fff, 613px 1015px #fff,
    251px 206px #fff, 640px 1700px #fff, 779px 1044px #fff, 1911px 309px #fff,
    674px 1770px #fff, 346px 1367px #fff, 1742px 1562px #fff, 15px 563px #fff,
    440px 1503px #fff, 1041px 797px #fff, 222px 197px #fff, 1511px 1953px #fff,
    549px 688px #fff, 1410px 1305px #fff, 1567px 591px #fff, 308px 677px #fff,
    673px 1080px #fff, 1714px 1121px #fff, 1034px 473px #fff, 1593px 1055px #fff,
    32px 1006px #fff, 358px 1961px #fff, 596px 1789px #fff, 1409px 1125px #fff,
    241px 723px #fff, 875px 1539px #fff, 54px 1460px #fff, 80px 1140px #fff,
    1027px 1044px #fff, 1329px 615px #fff, 1187px 1874px #fff, 1210px 552px #fff,
    1296px 439px #fff, 1168px 1248px #fff, 446px 290px #fff, 652px 174px #fff,
    685px 1323px #fff, 1917px 34px #fff, 593px 344px #fff, 338px 437px #fff,
    182px 1113px #fff, 654px 1220px #fff, 1735px 1089px #fff, 1281px 1417px #fff,
    265px 191px #fff, 1059px 823px #fff, 1381px 1065px #fff, 659px 1398px #fff,
    1813px 1652px #fff, 1027px 1503px #fff, 518px 955px #fff, 1207px 1169px #fff,
    630px 1041px #fff, 422px 1951px #fff, 749px 941px #fff, 1847px 633px #fff,
    235px 1415px #fff, 444px 672px #fff, 1144px 1516px #fff, 511px 18px #fff,
    444px 405px #fff, 1197px 1284px #fff, 247px 1694px #fff, 1147px 1441px #fff,
    1679px 617px #fff, 1177px 1768px #fff, 1556px 742px #fff, 415px 1822px #fff,
    45px 242px #fff, 555px 1666px #fff, 696px 318px #fff, 950px 1595px #fff,
    666px 947px #fff, 1250px 367px #fff, 453px 1856px #fff, 1794px 166px #fff,
    1863px 1576px #fff, 1115px 90px #fff, 1586px 1980px #fff, 488px 1444px #fff,
    1615px 489px #fff, 161px 1178px #fff, 1355px 236px #fff, 1080px 912px #fff,
    1594px 22px #fff;
  animation: animStar 150s linear infinite;
}

#stars3:after {
  content: " ";
  position: absolute;
  left: 2000px;
  width: 3px;
  height: 3px;
  background: transparent;
  box-shadow: 1538px 2368px #fff, 1057px 973px #fff, 830px 1863px #fff,
    1041px 881px #fff, 219px 1386px #fff, 1480px 1229px #fff, 831px 1999px #fff,
    1472px 523px #fff, 1032px 1768px #fff, 1892px 827px #fff, 1635px 231px #fff,
    1224px 400px #fff, 1043px 343px #fff, 305px 1815px #fff, 613px 1015px #fff,
    251px 206px #fff, 640px 1700px #fff, 779px 1044px #fff, 1911px 309px #fff,
    674px 1770px #fff, 346px 1367px #fff, 1742px 1562px #fff, 15px 563px #fff,
    440px 1503px #fff, 1041px 797px #fff, 222px 197px #fff, 1511px 1953px #fff,
    549px 688px #fff, 1410px 1305px #fff, 1567px 591px #fff, 308px 677px #fff,
    673px 1080px #fff, 1714px 1121px #fff, 1034px 473px #fff, 1593px 1055px #fff,
    32px 1006px #fff, 358px 1961px #fff, 596px 1789px #fff, 1409px 1125px #fff,
    241px 723px #fff, 875px 1539px #fff, 54px 1460px #fff, 80px 1140px #fff,
    1027px 1044px #fff, 1329px 615px #fff, 1187px 1874px #fff, 1210px 552px #fff,
    1296px 439px #fff, 1168px 1248px #fff, 446px 290px #fff, 652px 174px #fff,
    685px 1323px #fff, 1917px 34px #fff, 593px 344px #fff, 338px 437px #fff,
    182px 1113px #fff, 654px 1220px #fff, 1735px 1089px #fff, 1281px 1417px #fff,
    265px 191px #fff, 1059px 823px #fff, 1381px 1065px #fff, 659px 1398px #fff,
    1813px 1652px #fff, 1027px 1503px #fff, 518px 955px #fff, 1207px 1169px #fff,
    630px 1041px #fff, 422px 1951px #fff, 749px 941px #fff, 1847px 633px #fff,
    235px 1415px #fff, 444px 672px #fff, 1144px 1516px #fff, 511px 18px #fff,
    444px 405px #fff, 1197px 1284px #fff, 247px 1694px #fff, 1147px 1441px #fff,
    1679px 617px #fff, 1177px 1768px #fff, 1556px 742px #fff, 415px 1822px #fff,
    45px 242px #fff, 555px 1666px #fff, 696px 318px #fff, 950px 1595px #fff,
    666px 947px #fff, 1250px 367px #fff, 453px 1856px #fff, 1794px 166px #fff,
    1863px 1576px #fff, 1115px 90px #fff, 1586px 1980px #fff, 488px 1444px #fff,
    1615px 489px #fff, 161px 1178px #fff, 1355px 236px #fff, 1080px 912px #fff,
    1594px 22px #fff;
}

@keyframes animStar {
  from {
    transform: translateX(0px);
  }

  to {
    transform: translateX(-2000px);
  }
}

/* Style for the content area */
.content-area {
  position: relative;
  z-index: 2;
  margin: 0 auto;
}

/* Apply styles to the scrollbar */
.content-area::-webkit-scrollbar {
  width: 10px;
}

.content-area::-webkit-scrollbar-thumb {
  background-color: #888;
  border-radius: 5px;
}

.content-area::-webkit-scrollbar-track {
  background-color: #f1f1f1;
}

.animated-elements {
  position: fixed;
  width: 100%;
  display: block;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
}

.globe {
  position: absolute;
  opacity: 0.9;
  z-index: 1;
  top: 440px;
  left: 466px;
  right: 0;
  text-align: center;
}

.globe img {
  width: 120px;
}

.rocket {
  position: absolute;
  opacity: 0.9;
  z-index: 1;
  top: 410px;
  left: -175px;
  right: 0;
  text-align: center;
  position: relative;
  animation: moveUpDown 2s infinite ease-in-out;
}

.rocket img {
  width: 180px;
}

@keyframes moveUpDown {
  0%,
  100% {
    transform: translateY(0);
    /* Initial and final position, no movement */
  }

  50% {
    transform: translateY(-10px);
    /* Move the div up by 100px at 50% of the animation duration */
  }
}

.prof-head {
  margin: 30px auto 70px;
  position: relative;
  z-index: 999;
  float: right;
}

.dropdown-menu.show {
  width: 100%;
  border-radius: 10px;
}

.prof-head .prof {
  background: rgb(254, 182, 2);
  background: linear-gradient(
    0deg,
    rgba(254, 182, 2, 1) 0%,
    rgba(250, 211, 114, 1) 100%
  );
  border-radius: 10px;
  padding: 5px 5px 5px 20px;
}

.prof-head .prof img {
  width: 40px;
  height: 40px;
  border-radius: 50px;
  border: var(--m-red) solid 2px;
}

.prof-head .prof span {
  font-size: 15px;
  margin-right: 5px;
  font-weight: 600;
  color: var(--d-black);
}

.profile h1 {
  font-size: 35px;
  font-weight: 600;
  color: #fff;
  padding: 80px 0 0 35px;
  text-transform: uppercase;
}

.profile {
  background-image: url("../img/profile-banner.jpg");
  background-repeat: no-repeat;
}

.profile .left {
  width: 63%;
  min-height: 282px;
  float: left;
  padding: 30px;
  box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 20px;
  border-radius: 15px;
  margin-right: 2%;
}

.profile .left .l-l {
  width: 25%;
  float: left;
  margin-right: 5%;
}

.profile .left .l-l img {
  width: 100%;
  border-radius: 200px;
}

.profile .left .l-l .btn {
  /* background: rgb(114, 114, 114);
  background: linear-gradient(
    0deg,
    rgba(114, 114, 114, 1) 0%,
    rgba(177, 177, 177, 1) 100%
  );
  border-radius: 50px;
  padding: 5px 13px;
  color: #fff;
  border: none;
  font-size: 16px;
  font-weight: 400;
  margin: 15px auto 0;
  display: block; */
}

.profile .left .l-l .btn img {
  width: 20px;
  margin-right: 5px;
}

.profile .left .l-r {
  width: 70%;
  float: left;
}

.profile .left .l-r h1 {
  font-size: 22px;
  font-weight: 600;
  color: #000;
  text-transform: none;
  margin: 0 0 10px;
  padding: 0;
}

.profile .left .l-r span {
  margin-right: 15px;
  font-size: 15px;
  color: var(--m-black);
}

.profile .left .l-r .be-btn {
  background: rgb(240, 90, 68);
  background: linear-gradient(
    0deg,
    rgba(240, 90, 68, 1) 0%,
    rgba(239, 155, 144, 1) 100%
  );
  border-radius: 50px;
  padding: 5px 13px;
  color: #fff;
  border: none;
  font-size: 16px;
  font-weight: 400;
  margin: 15px 10px 0 0;
  float: left;
  display: block;
}

.profile .left .l-r .pe-btn {
  background: rgb(245, 123, 145);
  background: linear-gradient(
    0deg,
    rgba(245, 123, 145, 1) 0%,
    rgba(255, 173, 188, 1) 100%
  );
  border-radius: 50px;
  padding: 5px 13px;
  color: #fff;
  border: none;
  font-size: 16px;
  font-weight: 400;
  margin: 15px 0 0 0;
  float: left;
  display: block;
}

.profile .left .l-r .be-btn img,
.profile .left .l-r .pe-btn img {
  width: 20px;
  margin-right: 5px;
}

.profile .left .l-r ul {
  clear: both;
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
  float: left;
  width: 100%;
}

.profile .left .l-r ul li {
  border-bottom: #d5d5d5 solid 1px;
  padding: 10px 0 10px;
}

.profile .left .l-r ul li a {
  color: var(--l-black);
}

.profile .left .l-r ul li:last-child {
  border-bottom: none;
}

.profile .left .l-r ul li h5 {
  font-size: 16px;
  font-weight: 600;
}

.profile .left .l-r ul li p {
  font-size: 15px;
  font-weight: 400;
  margin: 0;
}

.profile .right {
  width: 35%;
  min-height: 282px;
  float: right;
  padding: 30px;
  box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 12px;
  border-radius: 15px;
}

.profile .right ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.profile .right ul li {
  border-bottom: #d5d5d5 solid 1px;
  padding: 21px 0 10px;
}

.profile .right ul li:first-child {
  padding: 0 0 9px;
}

.profile .right ul li:last-child {
  border-bottom: none;
}

.profile .right ul li h5 {
  font-size: 16px;
  font-weight: 600;
}

.profile .right ul li p {
  font-size: 15px;
  font-weight: 400;
  margin: 0;
}

.profile .right ul li h5 .wins {
  background: rgb(123 154 245);
  /* background: linear-gradient(0deg, rgb(50 66 125) 0%, rgb(85 128 255) 100%); */
  background: linear-gradient(0deg, rgb(30, 45, 90) 0%, rgb(40, 80, 160) 100%);
  border-radius: 50px;
  padding: 3px 13px;
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  margin-left: 5px;
}

.profile .right ul li h5 .point {
  background: rgb(240, 90, 68);
  /* background: linear-gradient(0deg, rgb(173 35 14) 0%, rgb(255 102 82) 100%); */
  background: linear-gradient(0deg, rgb(114, 28, 36) 0%, rgb(167, 45, 65) 100%);
  border-radius: 50px;
  padding: 3px 13px;
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  margin-left: 5px;
}

.profile .right ul li h5 .score {
  background: rgb(242, 158, 0);
  /* background: linear-gradient(0deg, rgb(171 116 13) 0%, rgb(255 182 0) 100%); */
  background: linear-gradient(0deg, rgb(198, 146, 20) 0%, rgb(255, 204, 77) 100%);
  border-radius: 50px;
  padding: 3px 13px;
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  margin-left: 5px;
}

.profile .right ul li h5 .contests {
  background: rgb(242, 158, 0);
  /* background: linear-gradient(0deg, rgb(0, 128, 128) 0%, rgb(0, 206, 209) 100%); */
  background: linear-gradient(0deg, rgb(0, 77, 77) 0%, rgb(0, 139, 139) 100%);
  border-radius: 50px;
  padding: 3px 13px;
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  margin-left: 5px;
}

.profile .right ul li h5 .leader {
  background: rgb(43, 191, 121);
  background: linear-gradient(
    0deg,
    rgba(43, 191, 121, 1) 0%,
    rgba(142, 230, 188, 1) 100%
  );
  border-radius: 50px;
  padding: 3px 13px;
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  margin-left: 5px;
}

.challenge-box .box {
  width: 100%;
  padding: 30px;
  box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 12px;
  border-radius: 15px;
  overflow: hidden;
}

.challenge-box h1 {
  font-size: 22px;
  font-weight: 600;
  color: #000;
  text-transform: none;
  margin: 30px 0 20px;
  padding: 0;
}

.challenge-shorts .shorts .thumb {
  width: 100%;
}

.challenge-shorts .shorts {
  width: 100%;
  height: 100%;
  position: relative;
}

.challenge-shorts .shorts .overlay {
  background-color: #000;
  opacity: 0.4;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 5;
}

.challenge-shorts .shorts .play-btn {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.challenge-shorts .shorts .play-btn img {
  width: 50px;
}

.challenge-shorts .rating {
  margin: 10px 0 5px;
  float: left;
  width: 100%;
}

.challenge-shorts .rating i {
  color: #fed144;
  font-size: 18px;
  margin: 0 -1px;
}

.challenge-shorts .rating .count {
  font-size: 14px;
  color: var(--m-black);
  margin-left: 5px;
}

.challenge-shorts .love,
.challenge-shorts .like {
  border-radius: 3px;
  padding: 3px 5px;
  margin-right: 5px;
  border: #e0e0e0 solid 1px;
  font-size: 13px;
  color: var(--m-black);
}

.challenge-shorts .badge {
  border-radius: 3px;
  padding: 3px 5px;
  margin-right: 5px;
  border: #e0e0e0 solid 1px;
  font-size: 13px;
  font-weight: 400;
  color: var(--m-black);
  margin-top: 10px;
}

.challenge-box .swiper-button-next {
  right: -15px !important;
  width: 0px;
  top: 125px;
  position: relative !important;
  float: right;
}

.challenge-box .swiper-button-prev {
  left: -15px !important;
  width: 0px;
  float: left;
  top: 125px;
  position: relative !important;
}

.video-preview .box {
  width: 100%;
  padding: 15px;
  background-color: #e0e0e0;
  box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 12px;
  border-radius: 15px;
  overflow: hidden;
  margin: 25px 0 0;
}

.video-preview .player {
  margin-bottom: 20px;
}

.video-preview .stats {
  text-align: center;
}

.video-preview .stats .love {
  background-color: var(--l-black);
  border-radius: 50px;
  color: var(--d-black);
  font-size: 15px;
  padding: 5px 10px;
  margin: 0 2px;
}

.video-preview .stats .like {
  background-color: var(--l-black);
  border-radius: 50px;
  color: var(--d-black);
  font-size: 15px;
  padding: 5px 10px;
  margin: 0 2px;
}

.video-preview .stats input[type="checkbox"]:checked + .love {
  background-color: var(--d-pink);
  border-radius: 50px;
  color: var(--d-black);
  font-size: 15px;
  padding: 5px 10px;
  margin: 0 2px;
}

.video-preview .stats input[type="checkbox"]:checked + .like {
  background-color: var(--d-blue);
  border-radius: 50px;
  color: var(--d-black);
  font-size: 15px;
  padding: 5px 10px;
  margin: 0 2px;
}

.video-preview .box .close-but {
  float: right;
  font-size: 25px;
}

.video-preview .box .close-but i {
  color: #fff;
}

.video-preview h2 {
  font-size: 18px;
  font-weight: 600;
  color: #481d5c;
  text-transform: none;
  /* margin: 30px 0 20px; */
  padding: 0;
  text-align: center;
}

.video-preview .player {
  display: block;
  text-align: center;
}

.boxes {
  margin: 0 auto 0;
  position: relative;
  z-index: 999;
}

.stogo-logo {
  display: block;
  float: right;
  text-align: right;
  height: 104px;
}

.submit-innovations {
  display: block;
  float: left;
  /* background-image: url("../img/submit-innovations-box.svg"); */ /* tina*/
  background-repeat: no-repeat;
  height: 259px;
  width: 321px;
  padding: 23px 0 0 0; /* tina changed padding: 23px 0 0 47px;*/
  margin-top: 20px; /* tina changed margin-top: 25px; */
}

.submit-innovations .ico {
  margin: 10px 0 0 25px;
  display: block;
  width: 140px;
}

.submit-innovations span {
  font-size: 28px;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 30px;
  letter-spacing: 1px;
}

.submit-innovations .white {
  color: #fff;
}

.submit-innovations .yellow {
  color: #f9c002;
}

.played {
  margin: 25px 40px 0;
  display: block;
  float: left;
  background-image: url("../img/played-box.svg");
  width: 403px;
  max-width: 100%;
  overflow: hidden;
  background-repeat: no-repeat;
  height: 259px;
  padding: 70px 0 0 0;
  vertical-align: middle;
  text-align: center;
}

.played span {
  font-size: 42px;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 33px;
  text-align: center;
}

.played .red {
  color: red;
  font-size: 15px;
}

.played .yellow {
  color: #f9c002;
  font-size: 25px;
}

.played .white {
  color: #fff;
}


.esafety {
  margin: 25px 0 0;
  display: block;
  float: left;
  background-image: url("../img/esafety-box.svg");
  width: 322px;
  background-repeat: no-repeat;
  height: 259px;
  padding: 45px 0 0 35px;
  vertical-align: middle;
  text-align: left;
}

.esafety .cont {
  float: left;
  margin: 30px 0 0;
}

.esafety .ico {
  float: left;
  margin-left: 25px;
}

.esafety span {
  font-size: 30px;
  font-weight: 700;
  line-height: 33px;
  text-align: center;
}

.esafety .white {
  color: #fff;
}

.esafety .yellow {
  color: #f9c002;
}

.redeem {
    margin: 25px 0 0;
    display: block;
    float: left;
    background-image: url("../img/redeem-box.svg");
    text-transform: uppercase;
    width: 258px;
    background-repeat: no-repeat;
    height: 385px;
    padding: 85px 35px 0 35px;
    vertical-align: middle;
    text-align: left;
}

.redeem span {
  font-size: 35px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  width: 100%;
  display: block;
}

.redeem .white {
  color: #fff;
}

.redeem .yellow {
  color: #f9c002;
}

.redeem .ico img {
  width: 100%;
  margin-top: 30px;
}

.points {
  margin: 25px 30px 0 110px;
  display: block;
  float: left;
  background-image: url("../img/points-box.svg");
  width: 400px;
  max-width: 100%;
  overflow: hidden;
  height: 398px;
  padding: 45px 75px 30px 45px;
  vertical-align: middle;
  text-align: center;
}

.but {
    background-image: url("../img/points-but-bg.svg");
    width: 118px;
    height: 41px;
    display: block;
    float: left;
    color: #fff;
    text-transform: uppercase;
    font-size: 17px;
    font-weight: 500;
    padding: 8px 0;
    margin: 0 4px;
}

.points ul {
  margin: 8px 0 0 0;
  padding: 0;
  float: left;
  list-style: none;
}

.points ul li:last-child {
  margin-right: 0;
}

.points ul li:first-child {
  margin-left: 0;
}

.player2,
.player1,
.player3 {
    float: left;
     margin: 0 7px 0; 
}

.player2 .name,
.player1 .name,
.player3 .name {
    font-size: 11px;
    color: #fff;
    text-align: center;
    font-weight: 400;
    max-width: 12ch;
    overflow: hidden;
    /* display: -webkit-box; */
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    line-height: 15px;
}

.player2 .name a,
.player1 .name a,
.player3 .name a {
  color: #fff;
}

.player2 .point,
.player1 .point,
.player3 .point {
    font-size: 14px;
    color: #f0ad4e;
    font-weight: 700;
    text-align: center;
}

.player1 .avatar1 {
    /* border-radius: 100px;
    border: #5865AC solid 2px; */
    width: 80px;
}

.player1 .crown {
    display: block;
    margin: 0 auto 0px;
}

.player2 .avatar2 {
    /* border-radius: 100px;
    border: #5865AC solid 2px; */
    width: 60px;
}

.player3 .avatar3 {
    /* border-radius: 100px;
    border: #5865AC solid 2px; */
    width: 50px;
}

.player3 span,
.player2 span {
  display: block;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
}

.player2 {
  margin-top: 50px;
}

.player1 .crown {
    display: block;
    width: 65px;
}

.player3 {
  margin-top: 50px;
}

.position-block {
  display: block;
  margin-top: -2px;
  margin-left: 12px;
  float: left;
}

.end-container {
  display: block;
  float: left;
  width: 326px;
}

.play-learn-earn {
  margin: 25px 0 0;
  display: block;
  float: left;
  background-image: url("../img/play-learn-earn-box.svg");
  background-repeat: no-repeat;
  width: 326px;
  height: 195px;
  padding: 45px 0 0 35px;
  vertical-align: middle;
  text-align: left;
}

.play-learn-earn .cont {
  float: left;
  margin-top: 15px;
}

.play-learn-earn .ico {
    float: left;
    margin-left: 10px;
}

.play-learn-earn span {
  font-size: 30px;
  font-weight: 700;
  line-height: 33px;
  text-align: left;
  text-transform: uppercase;
}

.play-learn-earn .white {
    color: #fff;
    font-size: 35px;
    line-height: 24px;
}

.play-learn-earn .yellow {
  color: #f9c002;
}

.contests {
  background-image: url("../img/contests-banner.jpg");
  background-repeat: no-repeat;
}

.contest {
  list-style: none;
  border-radius: 10px;
  border: #efefef solid 2px;
}

.swiper {
  width: 96% !important;
  margin-top: 25px;
}

.swiper-button-next {
  right: 20px !important;
}

.swiper-button-prev {
  left: 20px !important;
}

.swiper-button-next,
.swiper-button-prev {
  color: var(--d-grey) !important;
}

.swiper-button-next::after,
.swiper-button-prev::after {
  font-size: 22px !important;
  font-weight: 500;
}

.contest img {
  width: 100%;
  border-radius: 10px 10px 0 0;
}

.contest .cont {
  padding: 25px 20px;
  float: left;
  width: 100%;
}

.contest .cont a {
  color: var(--d-grey);
  text-decoration: underline;
}

.contest .cont h3 {
  font-size: 18px;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--d-red);
  text-align: left;
}

.contest .cont p {
  font-size: 15px;
  font-weight: 400;
  color: #000;
  margin: 2px 0;
  padding: 0;
}

.contest .cont p span {
  font-weight: 600;
}

.contest .cont h5 {
  font-size: 14px;
  font-weight: 400;
  color: var(--d-grey);
  margin: 15px 0 25px;
}

.tc {
  margin-top: 15px;
}

.tc a {
  color: var(--l-black);
  font-size: 14px;
  font-weight: 400;
  text-decoration: underline;
}

.past-btn {
  background: rgb(242, 158, 0);
  background: linear-gradient(
    0deg,
    rgba(242, 158, 0, 1) 0%,
    rgba(254, 182, 2, 1) 100%
  );
  font-size: 15px;
  font-weight: 400;
  float: left;
  padding: 5px 15px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
  float: right;
}

.live-btn {
  background: rgb(43, 191, 121);
  background: linear-gradient(
    0deg,
    rgba(43, 191, 121, 1) 0%,
    rgba(142, 230, 188, 1) 100%
  );
  font-size: 15px;
  font-weight: 400;
  float: left;
  padding: 5px 15px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
  float: right;
}

.title {
  font-size: 22px;
  font-weight: 600;
  color: var(--m-black);
  text-transform: uppercase;
}

.contest .cont .play-btn {
  background: rgb(211, 60, 38);
  background: linear-gradient(
    0deg,
    rgba(211, 60, 38, 1) 0%,
    rgba(255, 125, 106, 1) 100%
  );
  font-size: 18px;
  font-weight: 600;
  float: left;
  padding: 8px 20px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
}

.contest .cont .upcoming-btn {
  background: rgb(165, 165, 165);
  background: linear-gradient(
    0deg,
    rgba(165, 165, 165, 1) 0%,
    rgba(217, 217, 217, 1) 100%
  );
  font-size: 18px;
  font-weight: 600;
  float: left;
  padding: 8px 20px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
}

.quiz-play .name {
  color: #000;
  margin: 0;
  padding: 0;
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 20px;
}

.quiz-play h2 {
  font-size: 23px;
  font-weight: 500;
}

.quiz-play h3 {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 30px;
}

.quiz-play .timer-ico {
  margin-right: 10px;
  float: left;
}

.quiz-play .timer {
  color: var(--d-green);
  font-size: 18px;
  font-weight: 600;
  float: right;
}

.quiz-play .timer img {
  float: left;
  margin-right: 5px;
  width: 25px;
}

.quiz-play .timer #timer {
  float: left;
}

.quiz-play .form-check .form-check-input {
  margin-left: 0;
  margin-right: 10px;
}

.quiz-play .quiz-img {
  border-radius: 10px;
  width: 100%;
}

.answer {
  border-radius: 50px;
  padding: 15px 25px;
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 15px;
  background-color: var(--l-grey);
}

.quiz-play .nxt-btn {
  background: rgb(211, 60, 38);
  background: linear-gradient(
    0deg,
    rgba(211, 60, 38, 1) 0%,
    rgba(255, 125, 106, 1) 100%
  );
  font-size: 18px;
  font-weight: 600;
  float: left;
  padding: 8px 20px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
  margin-top: 15px;
  width: auto;
  float: left;
  margin-right: 10px;
}

.quiz-play .ques-left {
  float: left;
  display: block;
  padding: 30px 0 0 20px;
  font-size: 15px;
  color: var(--l-black);
}

.bg-anim {
  background-image: url("../img/result-bg.gif");
  background-position: bottom;
  background-size: cover;
}

.qresult .time {
  font-size: 20px;
  margin: 10px 0;
}

.qresult .time img {
  margin-right: 10px;
}

.correct {
  background-color: var(--d-green);
}

.wrong {
  background-color: var(--d-red);
}

.owl-theme .owl-controls {
  margin-top: 0;
}

.qresult .quiz-pie {
  width: 200px !important;
  height: 200px !important;
}

.qresult #chart-container {
  position: relative;
  width: 200px;
  height: 200px;
}

.qresult #QuizPieChart {
  position: absolute;
  top: 0;
  left: 0;
}

.qresult #result-percentage {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 45px;
  font-weight: 600;
  color: #fff;
}

.qresult .yellow {
  color: var(--d-gyellow);
}

.qresult .red {
  color: var(--d-red);
}

.qresult .green {
  color: var(--d-green);
}

.result-container {
  float: left;
  margin: 30px 0 0;
}

.owl-theme .owl-controls .owl-buttons div {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 35px;
  background: #f1971f;
  color: #fff;
  border-radius: 0;
  margin-right: 5px;
  opacity: 1;
}

.owl-prev:before,
.owl-next:before {
  content: "\f104";
  font-family: "FontAwesome";
  font-size: 30px;
  font-weight: 400;
}

.owl-next:before {
  content: "\f105";
}

.contests h1 {
  font-size: 35px;
  font-weight: 600;
  color: #fff;
  padding: 80px 0 0 35px;
  text-transform: uppercase;
}

.live-contests {
  margin: 25px 0 0;
  display: block;
  float: left;
  background-image: url("../img/contests-box.svg");
  background-repeat: no-repeat;
  width: 326px;
  height: 195px;
  padding: 45px 0 0 35px;
  vertical-align: middle;
  text-align: left;
}

.live-contests .cont {
  float: left;
  margin-top: 5px;
}

.live-contests .ico {
  float: left;
  margin-left: 25px;
  margin-top: -20px;
}

.live-contests .ico img {
  width: 65px;
}

.live-contests .white {
  color: #fff;
}

.live-contests .yellow {
  color: #f9c002;
}

.live-contests span {
  font-size: 30px;
  font-weight: 700;
  line-height: 33px;
  text-align: left;
  text-transform: uppercase;
  margin: 12px 0 0;
  display: block;
}

.icon-elements {
  width: 305px;
  margin: -45px auto 25px;
}

.icon-elements img {
  width: 100%;
}

/* PopUp */

.modal-content {
  border-radius: 20px;
  background-color: #c6d2ec;
}

.modal-content .content {
  border-radius: 10px;
  background-color: #fff;
  padding: 25px 20px;
  float: left;
  width: 100%;
}

.modal-content .content p {
  font-size: 14px;
  text-align: justify;
}

.modal-body {
  padding: 0 15px 15px;
}

.close-btn {
  right: 0;
  position: absolute;
  width: 40px;
  margin: 20px 20px;
}

.pop-banner {
  border-radius: 40px 40px 0 0;
  width: 850px;
  max-width: 100%;
  height: 150px;
}

/* Login */
.login .form-group {
  margin: 5px 0 10px;
}

.login .form-control {
  padding: 13px 17px;
  font-size: 16px;
}

.login .btns {
  background: rgb(211, 60, 38);
  background: linear-gradient(
    0deg,
    rgba(211, 60, 38, 1) 0%,
    rgba(255, 125, 106, 1) 100%
  );
  font-size: 18px;
  font-weight: 600;
  padding: 8px 20px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
  margin: 20px 10px 0 0;
  float: left;
  cursor: pointer;
}



.login .btns:hover {
  background: rgb(255, 125, 106);
  background: linear-gradient(
    0deg,
    rgba(255, 125, 106, 1) 0%,
    rgba(211, 60, 38, 1) 100%
  );
}

#login-form {
  display: block;
}

#howtoplay h4 {
  margin-bottom: 20px;
}

#howtoplay .cont {
  height: 250px;
  overflow-y: scroll;
  padding-right: 20px;
}

/* Read Comic */

.read-comic {
  background-image: url("../img/read-comic-banner.jpg");
  background-repeat: no-repeat;
}

.read-comic .modal-body .content .left {
  float: left;
  display: block;
  width: 50%;
}

.read-comic .modal-body .content .left img {
    width: 80%;
    text-align: center;
     margin: 0 auto;
    display: block;
}

.read-comic .modal-body .content .right {
  float: left;
  display: block;
  width: 50%;
}

.read-comic span {
  font-size: 45px;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 45px;
  width: 100%;
  display: block;
}

.read-comic .orange {
  color: var(--d-red);
}

.read-comic .brown {
  color: var(--d-gyellow);
}

.read-comic h2 {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  margin: 20px 0 0 25px;
  padding: 10px 20px;
  border-radius: 50px;
  background: linear-gradient(
    0deg,
    rgba(211, 60, 38, 1) 0%,
    rgba(255, 125, 106, 1) 100%
  );
  float: left;
  cursor: pointer;
}

.read-comic .modal-body .content .space {
  margin-top: 50px;
}

.read-comic .modal-body .content .space_new {
  margin-top: 53px;
    margin-left: -12px;
}

/* eGuide */

.eguide {
  background-image: url("../img/eguide-video-banner.jpg");
  background-repeat: no-repeat;
}

.eguide .modal-body .content .left {
  float: left;
  display: block;
  width: 50%;
}

.eguide .modal-body .content .left img,
.eguide .modal-body .content .right img {
  width: 60%;
  margin: 20px auto 0;
  display: block;
}

.eguide .modal-body .content .right {
  float: left;
  display: block;
  width: 50%;
}

.eguide h1 {
  font-size: 30px;
  color: var(--m-black);
  font-weight: 700;
  text-transform: uppercase;
  width: 100%;
  display: block;
  text-align: center;
}

/* Redeem / Points Earned */

.points-earned {
  background-image: url("../img/points-earned-banner.jpg");
  background-repeat: no-repeat;
}

.points-earned h1 {
  font-size: 35px;
  font-weight: 600;
  color: #fff;
  padding: 80px 0 0 35px;
  text-transform: uppercase;
}

.points-earned .modal-body .content .left {
  float: left;
  display: block;
  width: 60%;
}

.points-earned .modal-body .content .right img {
  width: 70%;
  margin: 70px 0 0;
  display: block;
  float: right;
}

.points-earned .modal-body .content .right {
  float: left;
  display: block;
  width: 40%;
}

.points-earned .point-box {
  background-color: var(--d-gyellow);
  border-radius: 30px;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  display: block;
  float: left;
  clear: both;
  padding: 2px 20px 0;
  /* margin: 10px 0 20px; */
  margin-left: 6px;
  
}

.points-earned h2 {
  clear: both;
  font-size: 29px;
  font-weight: 600;
}

.points-earned h3 {
  font-size: 20px;
  margin-top: 20px;
  font-weight: 400;
}

.points-earned .how-to h4 {
  font-size: 25px;
  font-weight: 500;
  color: #fff;
  margin: 20px 0 0;
  padding: 10px 20px;
  border-radius: 50px;
  background-color: #eb84b4;
  float: left;
  text-transform: uppercase;
}

.points-earned .step1 h5 {
  font-size: 20px;
  font-weight: 600;
  color: var(--d-red);
}

.points-earned .btns {
  background: rgb(211, 60, 38);
  background: linear-gradient(
    0deg,
    rgba(211, 60, 38, 1) 0%,
    rgba(255, 125, 106, 1) 100%
  );
  font-size: 18px;
  font-weight: 600;
  padding: 8px 20px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
  margin: 20px 10px 0 0;
}

.points-earned .step2 h3 {
  font-size: 22px;
  font-weight: 600;
  margin: 0 0 15px;
  padding: 0;
}

.points-earned .step2 h4 {
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 15px;
  padding: 0;
}

.points-earned .step2 ul {
  margin: 25px 0 0;
  list-style: none;
  padding: 0;
}

.points-earned .step2 ul li {
  display: inline-block;
  margin: 0 18px 18px 0;
}

.points-earned .step2 ul li .input-hidden {
  position: absolute;
  left: -9999px;
}

.points-earned .step2 ul li input[type="radio"]:checked + label > img {
  outline: 5px solid var(--d-green);
  outline-offset: -4px;
  width: 160px;
  height: 80px;
}

.points-earned .step2 ul li input[type="radio"] + label > img {
  width: 160px;
  height: 80px;
}

.points-earned .step3 img {
  margin: 15px 0;
}

.points-earned .step3 .line {
  border-bottom: solid 1px var(--l-grey);
  width: 100%;
  margin: 5px 0;
  float: left;
}

.points-earned .step3 h4 {
  font-size: 20px;
  font-weight: 600;
  margin: 25px 0 15px;
  float: left;
}

.points-earned .step3 .tc {
  width: 100%;
  overflow-y: scroll;
  height: 80px;
  font-size: 13px;
  padding: 0 25px 0 0;
  margin-bottom: 20px;
}

.points-earned .step3 label {
  font-size: 14px;
  font-weight: 500;
}

.points-earned .step3 span {
  font-size: 20px;
  font-weight: 600;
  margin-left: 15px;
  display: block;
}

.points-earned .step3 h4 {
  font-size: 22px;
  font-weight: 500;
}

.points-earned .step4 img {
  float: left;
  display: block;
  margin-right: 25px;
}

.points-earned .step4 span {
  font-size: 20px;
  font-weight: 600;
  margin-left: 15px;
  display: block;
}

.points-earned .step4 .view-code {
  background-color: var(--d-red);
  padding: 10px 15px;
  font-size: 18px;
  color: #fff;
  float: left;
  border: none;
}

.points-earned .step4 .code span {
  display: block;
  float: left;
  font-size: 18px;
  color: var(--m-black);
  border-right: none !important;
  border: var(--m-grey) dashed 2px;
  padding: 8px 15px;
  margin: 0;
}

.points-earned .step4 .copy-code {
  background-color: var(--d-red);
  padding: 10px 15px;
  font-size: 18px;
  color: #fff;
  float: left;
  border: none;
}

.points-earned .step4 .view-code i,
.points-earned .step4 .copy-code i {
  font-size: 20px;
  margin: 0 5px 0 0;
}

.points-earned .step4 h4 {
  font-size: 18px;
  font-weight: 500;
  color: var(--d-green);
}

.points-earned .step4 p {
  font-size: 16px;
  font-weight: 400;
  color: var(--d-red);
}

/* Games Puzzles */

.games-puzzles {
  background-image: url("../img/games-puzzles-banner.jpg");
  background-repeat: no-repeat;
}

.games-puzzles .modal-body .content .left {
  float: left;
  display: block;
  width: 100%;
}

.games-puzzles h1 {
  font-size: 35px;
  font-weight: 600;
  color: #fff;
  padding: 80px 0 0 35px;
  text-transform: uppercase;
}

.games-puzzles ul {
  margin: 25px 0 0;
  padding: 0;
}

.games-puzzles ul li {
  display: inline-block;
  margin: 0 17px 17px 0;
}

.games-puzzles ul li img {
  width: 125px;
}

/* Play Now */

.play-now {
  background-image: url("../img/play-now-banner.jpg");
  background-repeat: no-repeat;
}

.play-now h1 {
  font-size: 35px;
  font-weight: 600;
  color: #fff;
  padding: 80px 0 0 35px;
  text-transform: uppercase;
}

.play-now ul {
  margin: 20px 1% 20px 1%;
  padding: 0;
  list-style: none;
  width: 30%;
  display: inline-block;
}

.play-now ul:last-child {
  margin: 0;
}

.play-now ul li {
  margin: 0 10px 14px 0;
  background: url("../img/tick-bullet.svg") no-repeat left center;
  padding-left: 30px;
  margin-bottom: 0;
  font-size: 17px;
  font-weight: 500;
  color: #000;
  line-height: 30px;
}

.play-now .btns {
  background: rgb(211, 60, 38);
  background: linear-gradient(
    0deg,
    rgba(211, 60, 38, 1) 0%,
    rgba(255, 125, 106, 1) 100%
  );
  font-size: 18px;
  font-weight: 600;
  padding: 8px 20px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
  margin: 20px 10px 0 0;
}

.scroller-container {
  width: 100%;
  height: 290px;
  overflow-y: hidden;
  position: relative;
  border: none;
  /* Hide the border */
}

.scroller-area {
  width: 100%;
  overflow-y: scroll;
  height: 100%;
  scrollbar-width: thin;
  /* Firefox support */
  scrollbar-color: #b2b2b2;
  /* Firefox support */
  position: relative;
  margin: 5px 0 5px;
  scroll-behavior: smooth;
  /* Smooth scrolling */
}

/* Styling for the colorful scrollbar in WebKit browsers */
.scroller-area::-webkit-scrollbar {
  width: 8px;
}

.scroller-area::-webkit-scrollbar-thumb {
  background-color: #4caf50;
  /* Green */
  border-radius: 10px;
}

.scroller-area::-webkit-scrollbar-track {
  background-color: transparent;
  /* Hide the scrollbar track in WebKit */
}

/* Styling for the highlighted list item */
.highlight {
  outline: #00ad00 dashed 2px;
}

/* Basic styling for the filter area */
.filter-area {
  margin: 20px 0 25px;
}

.filter-area label {
  background-color: var(--l-grey);
  padding: 7px 15px;
  border-radius: 30px;
  color: var(--d-grey);
}

.filter-area input[type="radio"].visually-hidden {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.filter-area label[for="leader"],
.filter-area label[for="my-position"] {
  align-items: center;
  margin-right: 5px;
  cursor: pointer;
}

.filter-area label[for="leader"] span,
.filter-area label[for="my-position"] span {
  display: inline-block;
}

.filter-area
  input[type="radio"].visually-hidden:checked
  + label[for="leader"]
  span,
.filter-area
  input[type="radio"].visually-hidden:checked
  + label[for="my-position"]
  span {
  font-weight: 600;
  color: var(--m-black);
}

.leader-board .play-btn {
  background: rgb(211, 60, 38);
  background: linear-gradient(
    0deg,
    rgba(211, 60, 38, 1) 0%,
    rgba(255, 125, 106, 1) 100%
  );
  font-size: 18px;
  font-weight: 600;
  float: left;
  padding: 8px 20px;
  margin: 3px 5px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
}

.leader-board {
  background-image: url("../img/leader-board-banner.jpg");
  background-repeat: no-repeat;
}

.leader-board .point-box {
  background-color: #eb84b4;
  border-radius: 50px;
  font-size: 40px;
  font-weight: 700;
  color: #fff;
  display: block;
  float: left;
  clear: both;
  padding: 5px 30px;
  margin: 20px 0;
}

.leader-board .button {
  width: 200px;
  margin: 25px auto 0;
  display: block;
}

.leader-board .button img {
  width: 100%;
}

.leader-board h1 {
  font-size: 35px;
  font-weight: 600;
  color: #fff;
  padding: 65px 0 0 35px;
  text-transform: uppercase;
}

.leader-board ul {
  margin: 0 25px 0 0;
  padding: 0;
}

.leader-board ul li {
  display: block;
  height: 47px;
  width: 98%;
  border-radius: 10px;
  margin: 5px 0 10px 5px;
}

.leader-board ul .yellow {
  background-image: url("../img/lb-yellow-bg.jpg");
  background-repeat: repeat-x;
}

.leader-board ul .blue {
  background-image: url("../img/lb-blue-bg.jpg");
  background-repeat: repeat-x;
}

.leader-board ul .red {
  background-image: url("../img/lb-red-bg.jpg");
  background-repeat: repeat-x;
}

.leader-board ul .brown {
  background-image: url("../img/lb-brown-bg.jpg");
  background-repeat: repeat-x;
}

.leader-board ul .pos-ico {
  padding: 0 10px;
  float: left;
}

.leader-board ul .user-ico {
  padding: 0 10px 0 10px;
  float: left;
}

.leader-board ul .number {
  font-size: 20px;
  font-weight: 700;
  color: #a32a1e;
  display: block;
  float: left;
  padding: 8px 20px 0;
}

.leader-board ul .yellow .username {
  font-size: 12px;
  text-transform: uppercase;
  color: #d86116;
  font-weight: 600;
  margin: 15px 0 0;
  float: left;
}

.leader-board ul .username a {
  color: #641d8b;
}

.leader-board ul .yellow .score {
  height: 28px;
  background-color: #faba3b;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 400;
  color: #fff;
  float: right;
  margin: 10px 10px 0 0;
}

.leader-board ul .yellow .score span {
  display: block;
  float: left;
  padding: 5px 10px 0 5px;
}

.leader-board ul .yellow .score img {
  float: left;
}

.leader-board ul .blue .username {
  font-size: 12px;
  text-transform: uppercase;
  color: #328db5;
  font-weight: 600;
  margin: 15px 0 0;
  float: left;
}

.leader-board ul .blue .score {
  height: 28px;
  background-color: #4bacd6;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 400;
  color: #fff;
  float: right;
  margin: 10px 10px 0 15px;
}

.leader-board ul .blue .score span {
  display: block;
  float: left;
  padding: 5px 10px 0 5px;
}

.leader-board ul .blue .score img {
  float: left;
}

.leader-board ul .red .username {
  font-size: 12px;
  text-transform: uppercase;
  color: #9d0214;
  font-weight: 600;
  margin: 15px 0 0;
  float: left;
}

.leader-board ul .red .score {
  height: 28px;
  background-color: #d92e35;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 400;
  color: #fff;
  float: right;
  margin: 10px 10px 0 15px;
}

.leader-board ul .red .score span {
  display: block;
  float: left;
  padding: 5px 10px 0 5px;
}

.leader-board ul .red .score img {
  float: left;
}

.leader-board ul .brown .username {
  font-size: 12px;
  text-transform: uppercase;
  color: #ca6644;
  font-weight: 600;
  margin: 15px 0 0;
  float: left;
}

.leader-board ul .brown .score {
  height: 28px;
  background-color: #e07458;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 400;
  color: #fff;
  float: right;
  margin: 10px 10px 0 15px;
}

.leader-board ul .brown .score span {
  display: block;
  float: left;
  padding: 5px 10px 0 5px;
}

.leader-board ul .brown .score img {
  float: left;
}

/* Challenge of the Month */
.form-control {
  font-size: 14px;
  padding: 8px 5px 8px 10px;
}

.form-label {
  font-size: 15px;
  font-weight: 500;
  margin-bottom: 5px;
}

.fourty {
  width: 46%;
  float: left;
}

.twenty {
  width: 8%;
  float: left;
  font-size: 15px;
  font-weight: 500;
}

.challenge-month {
  background-image: url("../img/challenge-banner.jpg");
  background-repeat: no-repeat;
  background-size: cover;
}

.challenge-month .modal-body .content .left {
  float: left;
  display: block;
  width: 50%;
  padding: 0 30px 0 0;
}

.challenge-month .modal-body .content .right {
  float: left;
  display: block;
  width: 50%;
  padding: 0;
}

.challenge-month .modal-body .content .right form .form-control,
.challenge-month .modal-body .content .right form .form-check-input {
  border: none;
}

.challenge-month .modal-body .content .right form a {
  color: var(--m-black);
}

.challenge-month .modal-body .content .right form .tc {
  margin-bottom: 15px;
}

.challenge-month .modal-body .content .right form .tc a {
  color: var(--d-black);
  text-decoration: underline;
}

.challenge-month .modal-body .content .right .bg-pink {
    background-color: var(--l-pink) !important;
    float: left;
    padding: 25px;
    border-radius: 15px;
    min-height: 403px;
    width: 100%;

}

.challenge-month .modal-body .content .right .bg-blue {
  background-color: var(--l-blue) !important;
  float: left;
  padding: 25px;
  border-radius: 15px;
}

.challenge-month .modal-body .content .right .bg-yellow {
  background-color: var(--l-yellow) !important;
  float: left;
  padding: 25px;
  border-radius: 15px;
}

.challenge-month .modal-body .content .right {
}

.challenge-month h1 {
  font-size: 35px;
  font-weight: 600;
  color: #fff;
  padding: 65px 0 0 35px;
  text-transform: uppercase;
}

.custom-accordion .accordion-item {
  border: none;
}

.challenge-month .right .button {
  background: rgb(211, 60, 38);
  background: linear-gradient(
    0deg,
    rgba(211, 60, 38, 1) 0%,
    rgba(255, 125, 106, 1) 100%
  );
  font-size: 18px;
  font-weight: 600;
  padding: 8px 20px;
  text-transform: uppercase;
  border-radius: 50px;
  height: auto;
  color: #fff;
  border: none;
  margin: 5px 0 0;
}

.accordion-body {
  /* margin: -15px 0 0;
    padding: 30px 20px 20px; */
  font-size: 14px;
}

.accordion-body .steps-link {
  color: var(--d-black);
}

.accordion-button:not(.collapsed) {
  box-shadow: none;
}

.custom-accordion .accordion-item {
  margin-bottom: 10px;
}

.custom-accordion .accordion-button {
  background-color: transparent;
  border: none;
  border-radius: 15px !important;
  color: #000;
  padding: 10px 20px;
  font-size: 18px;
  font-weight: 600;
}

.custom-accordion .accordion-item:nth-child(1) .accordion-button {
  background-color: var(--m-pink);
  color: black;
}

.custom-accordion .accordion-item:nth-child(1) .accordion-collapse {
  background-color: var(--l-pink);
  border: none;
  border-radius: 15px;
  /* height: 684px; */
  /* overflow-y: scroll; */
}

.accordion-collapse {
  margin: -20px 0;
  padding: 20px 5px;
}

.innovation-description {
  height: 547px;
  overflow-y: auto;
}

.custom-accordion .accordion-item:nth-child(2) .accordion-button {
  background-color: var(--m-blue);
  color: black;
}

.custom-accordion .accordion-item:nth-child(2) .accordion-collapse {
  background-color: var(--l-blue);
  border: none;
}

.custom-accordion .accordion-item:nth-child(3) .accordion-button {
  background-color: var(--d-yellow);
  color: black;
}

.custom-accordion .accordion-item:nth-child(3) .accordion-collapse {
  background-color: var(--l-yellow);
  border: none;
}

.gauge {
  width: 200px;
  height: 100px;
  border-radius: 100px 100px 0 0;
  overflow: hidden;
  position: relative;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border: 1px solid rgb(211, 60, 38);
  left: 70px;
  /* left: -45px;
  float: right; */
}

.gauge__body {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.gauge__fill {
  width: 100%;
  height: 100%;
  background: rgb(195, 0, 0);
  background: linear-gradient(
    90deg,
    rgba(195, 0, 0, 1) 0%,
    rgba(247, 174, 8, 1) 50%,
    rgba(102, 166, 6, 1) 100%
  );
  transform-origin: center bottom;
  /* transform: rotate(0.25turn); */
  transition: transform 0.5s ease-out;
  opacity: 0.7;
}

.gauge__cover {
  width: 75%;
  height: 150%;
  background: rgb(255 255 255 / 63%);
  border-radius: 50%;
  position: absolute;
  top: 25%;
  left: 12.5%;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
  z-index: 1;
  text-align: center;
}

.gauge__cover span {
  position: relative;
  top: 21%;
  transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: bold;
  color: rgb(0 0 0 / 21%);
}

.gauge__cover::before {
  content: "";
  width: 50%;
  height: 50%;
  background: #ff1e1c;
  border-radius: 50%;
  position: absolute;
  top: 44%;
  left: 25%;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
  z-index: 2;
}

.gauge__needle {
  width: 65%;
  height: 3px;
  background: red;
  position: absolute;
  bottom: 0;
  left: 17.5%;
  transform-origin: bottom center;
  /* transform: rotate(0.38turn); */
  z-index: 3;
}

.new_challenge {
  display: flex;
  position: relative;
  height: 40px;
  width: 40px;
  right: 0px;
  top: -25px;
  float: right;
}
.new_challenge img {
  width: 100%;
}

.new_contest {
  position: absolute !important;
  height: 40px;
  width: 40px;
  right: 0px;
  top: 0px;
}
.new_contest img {
  width: 100%;
}

@keyframes jerk {
  0% {
    transform: translateX(0);
  }
  20% {
    transform: translateX(-5px);
  }
  40% {
    transform: translateX(5px);
  }
  60% {
    transform: translateX(-5px);
  }
  80% {
    transform: translateX(5px);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes new-icon-anim {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.1);
    opacity: 0.9;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.new-icon {
  animation: new-icon-anim 1.5s ease-in-out infinite;
  position: relative;
  display: inline-block;
  font-size: 1.2em;
  color: #ff69b4;
}

.new-icon::before {
  position: absolute;
  top: -10px;
  left: -10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.approved_tick {
  position: relative;
  top: 10px;
  left: 8px;
  z-index: 9;
}

.rank {
  display: inline-block;
  width: 25px;
  height: 25px;
  /* padding: 10px; */
  background-color: #5865ac;
  color: #fff;
  border-radius: 15px;
  line-height: 25px;
  text-align: center;
  margin-right: 8px;
}
.rank:nth-child(10-1) {
  background-color: #5865ac;
}

.needle_ani {
  animation: wiggle 5s linear infinite;
}

/* Keyframes */
@keyframes wiggle {
  0%,
  7% {
    transform: rotateZ(0);
  }
  15% {
    transform: rotateZ(-15deg);
  }
  20% {
    transform: rotateZ(10deg);
  }
  25% {
    transform: rotateZ(-10deg);
  }
  30% {
    transform: rotateZ(6deg);
  }
  35% {
    transform: rotateZ(-4deg);
  }
  40%,
  100% {
    transform: rotateZ(0);
  }
}

.feeds-image {
  position: relative;
  top: -24px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.feeds-image img {
  width: 98%;
  object-fit: cover;
  border-radius: 10px;
}

.prof_details {
  width: 98%;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.prof_details h3 {
  font-size: 20px;
  font-weight: 600;
  color: #337ab7;
  margin-bottom: 10px;
}

.prof_details .elements {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: fit-content;
  position: relative;
  bottom: 0px;
}
.prof_details .elements span {
  margin-left: -5px;
  border: 1px solid #fff;
}

.rec_count {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #2e6da4;
  /* padding: 5px; */
  text-align: center;
  line-height: 21px;
  margin-left: 5px;
}

@media screen and (max-width: 1300px) {
  .rocket {
    top: 290px;
    left: -160px;
  }

  .globe {
    top: 215px;
    left: 160px;
  }
}

@media screen and (max-width: 1199px) {
  .profile .left,
  .profile .right {
    width: 100%;
    margin-bottom: 20px;
  }
}

@media screen and (max-width: 1149px) {
  .rows {
    display: grid;
    justify-content: center;
    overflow: hidden;
  }

  .spacer {
    margin: 0;
  }

  .globe {
    top: 180px;
    left: 130px;
  }

  .rocket {
    top: 290px;
    left: -140px;
  }

  .stogo-logo {
    margin: 15px auto;
    width: 325px;
    float: none;
  }

    .submit-innovations {
        margin: 25px auto 0;
        /* height: 207px; */
        background-repeat: no-repeat;
        float: none;
    }

  .played {
    margin: 25px auto 0;
  }

  .esafety {
    margin: 25px auto 0;
    height: 211px;
    float: none;
  }

  .redeem {
    margin: 25px auto 0;
    float: none;
  }

  .points {
    margin: 25px auto 0 0;
  }

  .end-container {
    margin: 0 auto;
  }

  .icon-elements {
    margin: 0 auto 15px;
  }

  .read-comic .modal-body .content .left {
    float: left;
    width: 100%;
  }

  .read-comic .modal-body .content .right {
    float: left;
    width: 100%;
    margin-top: 0px;
    margin-left: 0px;
  }

  .read-comic .modal-body .content .right span {
    text-align: center;
  }

  .read-comic h2 {
    display: flex;
    width: 275px;
    margin: 20px auto 0;
    float: none;
    text-align: center;
  }

  .read-comic .modal-body .content .left img {
    width: 40%;
  }
  .gauge {
    top: 0px;
    left: 0px;
    margin: 10px 0px 20px 0px;
  }
}

@media screen and (max-width: 991px) {
  .play-now ul {
    width: 100%;
    margin: 0 10px;
  }

  .points-earned .step1 h5 {
    text-align: center;
  }

  .points-earned .step2 ul {
    text-align: center;
  }

  .points-earned .step2 h4 {
    text-align: center;
  }

  .points-earned .btns {
    margin: 10px auto 0 auto;
    display: block;
  }

  .points-earned .step3 img {
    margin: 0 auto 15px;
    display: block;
  }

  .points-earned h1 {
    padding: 80px 0 0 0;
  }

  .points-earned h1,
  .points-earned h2,
  .points-earned h3 {
    text-align: center;
  }

  .points-earned .point-box {
    margin: 20px auto;
    text-align: center;
    float: none;
  }

  .points-earned .modal-body .content .left {
    float: left;
    display: block;
    width: 100%;
  }

  .points-earned .modal-body .content .right img {
    width: 80%;
    margin: 20px auto 0;
    display: block;
    float: none;
  }

  .points-earned .modal-body .content .right {
    float: left;
    display: block;
    width: 100%;
  }

  .games-puzzles h1 {
    padding: 80px 0 0 0;
    font-size: 28px;
  }

  .leader-board .play-btn {
    font-size: 14px;
  }

  .games-puzzles ul,
  .games-puzzles h1 {
    text-align: center;
  }

  .leader-board .modal-body .content .left,
  .leader-board .modal-body .content .right {
    width: 100%;
  }

  .leader-board h1 {
    padding: 65px 10px 0 0;
    text-align: center;
  }

  .challenge-month .modal-body .content .left,
  .challenge-month .modal-body .content .right {
    width: 100%;
    padding: 0;
  }

  .challenge-month .modal-body .content .right {
    margin-top: 30px;
  }

  .challenge-month h1 {
    font-size: 33px;
    padding: 60px 0 0 20px;
  }

  .challenge-box h1 {
    text-align: center;
  }

  .profile .left .l-l {
    width: 70%;
    margin: 0 auto 20px auto;
    text-align: center;
    float: none;
  }

  .profile .left .l-r {
    width: 100%;
    text-align: center;
  }

  .profile .left .l-r .pe-btn,
  .profile .left .l-r .be-btn {
    float: none;
    margin: 15px auto 0 auto;
  }

  .leader-board ul .username {
    width: 45%;
    text-overflow: ellipsis;
    text-align: left;
    margin: 10px 0 0 !important;
    line-height: 15px;
  }
}

@media screen and (max-width: 767px) {
  .quiz-play .timer {
    float: left;
    margin-bottom: 18px;
  }

  .past-btn,
  .live-btn {
    float: left;
  }

  .swiper-button-next {
    right: 0px !important;
  }

  .swiper-button-prev {
    left: 0px !important;
  }
}

@media screen and (max-width: 575px) {
  .modal-body {
    padding: 0;
  }

  .modal-content .content {
    padding: 20px 20px 20px;
  }

  .read-comic .modal-body .content .right span {
    font-size: 50px;
    line-height: 55px;
  }

  .play-learn-earn .white {
    font-size: 35px !important;
    line-height: 24px !important;
}

  .challenge-month h1 {
    padding: 62px 20px 0 20px;
    font-size: 30px;
    text-align: center;
  }

  .fourty {
    width: 100%;
  }

  .eguide .modal-body .content .left,
  .eguide .modal-body .content .right {
    width: 100%;
    margin: 20px 0;
  }

  .read-comic .modal-body .content .left img {
    width: 70%;
  }
}

.link {
  color: var(--d-black);
  text-decoration: underline;
  cursor: pointer;
}
.button-small img {
  width: 150px;
}

.bakto{
    width: 150px;
  padding: 10px;
  border-radius: 10px;
  margin-top: 10px;
  animation: leftRight 3s ease-in-out infinite;
}
@keyframes leftRight {
    0% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(10px);
    }

    100% {
        transform: translateX(0);
    }
}
.feedback {
  background-image: url("../img/read-comic-banner.jpg");
  background-repeat: no-repeat;
}
.feedback h1 {
  font-weight: 600;
  color: white;
  text-transform: none;
  margin: 30px 0 20px;
  padding: 0;
  text-align: left;
  font-size: 33px;
  padding: 60px 0 0 20px;
}
.feedback h2 {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  margin: 0px 0 0 10px;
  padding: 10px 20px;
  border-radius: 50px;
  background: linear-gradient(
    0deg,
    rgba(211, 60, 38, 1) 0%,
    rgba(255, 125, 106, 1) 100%
  );
  float: left;
  cursor: pointer;
}

.feedback .modal-body .content .left {
  float: left;
  display: block;
  width: 50%;
}

.feedback .modal-body .content .left img {
    width: 80%;
    text-align: center;
     margin: 0 auto;
    display: block;
}

.feedback .modal-body .content .right {
  float: left;
  display: block;
  width: 50%;
}


.feedback .modal-body .content .space {
  margin-top: 50px;
}

.feedback .modal-body .content .space_new {
  margin-top: 53px;
    margin-left: -12px;
}
.feeds-container {
  max-height: 300px;   /* Set a fixed height */
  overflow-y: auto;    /* Enable vertical scrolling */
  border: 1px solid #ccc; /* Optional: to see the container boundary */
}
.contestlist {
  max-height: 300px;
	overflow-y: auto;
	padding-right: 10px;
	margin-top: 20px;
	border: 1px solid #ddd;
	border-radius: 8px;
}
.contestlistimage {
  
  /* height: auto;  */
      width: 100%;        
      height: 150px;    
      object-fit: cover; 
      border-radius: 5px;
      
}
.custom-alert {
  position: absolute;
  top: 5px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #ffc107;
  color: #000;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: bold;
  white-space: nowrap;
  z-index: 2;
}

.points-container {
  margin-left: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px; /* spacing between elements */
}

.coin-img {
  width: 50px; /* adjust as needed */
  height: 50px;
  object-fit: contain;
}

.text-group {
  display: flex;
  align-items: center;
  gap: 4px; /* space between "Points Earned:" and coin number */
}

.coupon-container {
  display: flex;
  flex-direction: column;
  align-items: center; /* center image and price horizontally */
  gap: 6px; /* space between image and price */
}

.coupon-label {
  position: relative;
  display: inline-block;
}

.coupon-label img {
  display: block;
  width: 100%;
  height: auto;
}

.watermark {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%; /* This stretches it across the image */
  color: white;
  background: rgba(0, 0, 0, 0.6);
  padding: 4px 0; /* Use vertical padding only */
  border-radius: 4px;
  font-weight: bold;
  text-align: center;
  pointer-events: none;
  font-size: 12px;
  box-sizing: border-box; /* Ensures it respects width + padding */
}

.feedback-logo {
  margin: 25px auto;
  width: 320px;
  float: none;
  display: block;
  float: right;
  text-align: right;
  height: 104px;
}
