/* --------------------------------------------------------------- Initializations */
*, *::before, *::after {
position: relative;
display: inline-block;
max-width: 100%;
margin: 0;
padding: 0;
vertical-align: top;
color : white;
background-size: 100% auto;
background-position: 50% 50%;
background-repeat: no-repeat;
font-family: MysticFay;
font-size: 0;
z-index: 100;
scrollbar-color: #a25ba0 #070707;
scrollbar-width: thin;
}
*::before, *::after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
html {
min-height: 100vh;
scroll-behavior: smooth;
}
head {
display: block;
height: 0px;
}
body {
width: 100%;
min-height: 100vh;
overflow-x: hidden;
}
main {
width: 100%;
}
script,style {
display: none;
}
a {
color: #64f8ff;
font-size: 14px;
}
b {
font-weight: normal;
text-shadow: 1px 0 1px white;
font-size: 14px;
}
p {
font-weight: normal;
font-size: 14px;
}
h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    text-shadow: 1px 0 1px white;
    font-size: 23px;
}
.hidden {
    display: none;
}
/* --------------------------------------------------------------- Scrollbar */
*::-webkit-scrollbar-track {
	background-color: #070707;
}

*::-webkit-scrollbar {
	width: 10px;
	height: 7px;
	background-color: #070707;
}

*::-webkit-scrollbar-thumb {
	background-color: #a25ba0;
	border: 1px #000 solid;
}
/* --------------------------------------------------------------- Selection fix */
*::selection {
background: #ffffff69;
}

.unselectable  {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Opera and Firefox */
}
/* --------------------------------------------------------------- Font */
@font-face {
    src: url("https://www.legacyreforge.com/Extras/Fonts/Calistoga-Regular.ttf");
    font-family: MysticFay;
    font-display: swap;
}
@font-face {
    src: url("https://www.legacyreforge.com/Extras/Fonts/Acme-Regular.ttf");
    font-family: MysticFay-1;
    font-display: swap;
}
/* --------------------------------------------------------------- Shines */
.shineText {
    color: transparent;
    background: linear-gradient( 45deg, rgba(255, 255, 255, 0) 35%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 65% );
    background-size: auto;
    background-clip: border-box;
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    animation: ShineTextAnimation 3s linear infinite;
    }
    @keyframes ShineTextAnimation {
        0% { background-position: 200% 0; }
        100% { background-position: -200% 0; }
}
.shineBox {
    overflow: hidden;
    }
    .shineBox::before {
        content: "";
        display: inline-block;
        position: absolute;
        opacity: 0.1;
        top: 0px;
        left: 0px;
        width: 300%;
        height: 100%;
        margin: 0;
        padding: 0;
        background: linear-gradient(45deg, rgba(255,255,255,0) 35%,rgba(255,255,255,1)50%,rgba(255,255,255,0)65% );
        animation: ShineBoxAnimation 4s ease-in-out infinite;
        z-index: 101;
    }
    @keyframes ShineBoxAnimation {
    	0% {transform:translateX(-100%);}
    	100% {transform:translateX(100%);}
}

/* --------------------------------------------------------------- Particles */
#Particles {
    position: fixed;
    left: 0px;
    top: 0px;
}

#Particles canvas {
    position: fixed;
    width: 100%;
    height: 100%;
}
/* --------------------------------------------------------------- Mobile Only & Desktop Only */
.mobileOnly-block {
    display: none !important;
}
.mobileOnly-inline {
    display: none !important;
}
.mobileOnly-flex {
    display: none !important;
}
.mobileOnly {
    display: none !important;
}
.desktopOnly-block {
    display: block !important;
}
.desktopOnly-inline {
    display: inline !important;
}
.desktopOnly-flex {
    display: flex !important;
}
.desktopOnly {
    display: inline-block !important;
}
@media (max-width: 1000px) {
.mobileOnly-block {
    display: block !important;
}
.mobileOnly-inline{
    display: inline !important;
}
.mobileOnly-inline{
    display: flex !important;
}
.mobileOnly{
    display: inline-block !important;
}
.desktopOnly-block {
    display: none !important;
}
.desktopOnly-inline {
    display: none !important;
}
.desktopOnly-flex {
    display: none !important;
}
.desktopOnly {
    display: none !important;
}
}