body, html {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: transparent;
    cursor: url("images/genshin-cursor.png"), auto;
}

@font-face {
    font-family: "genshinfont";
    src: url("fonts/genshin-font.woff2");
}

@font-face {
    font-family: "genshindripfont";
    src: url("fonts/genshin-drip-font.ttf");
}

a:hover {
    cursor: url("images/genshin-cursor.png"), auto;
}

.gacha-bg {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    position: fixed;
    object-fit: cover;
    z-index: -1;
}

.banner-base {
    height: 900px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    z-index: 1;
}

#kit-gacha {
    height: 600px;
    width: auto;
    position: fixed;
    z-index: 1;
}

.outside-banner {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}

#wish {
    top: 0;
    left: 0;
    margin: 15px;
    padding: 0;
    position: fixed;
}

#banner-buttons {
    bottom: 0;
    left: 25px;
    margin: 0;
    padding: 0;
    position: fixed;
}

#close-icon {
    top: 0;
    right: 0;
    margin: 15px;
    padding: 0;
    position: fixed;
    z-index: 3;
}

#starglitter {
    bottom: 70px;
    left: 35px;
    margin: 0;
    padding: 0;
    position: fixed;
}

#fates-icons {
    bottom: 5px;
    right: 0;
    margin: 0;
    padding: 0;
    position: fixed;
}

#primos {
    top: 10px;
    right: 120px;
    margin: 0;
    padding: 0;
    position: fixed;
}

.banner-icon-container {
    top: 30px;
    height: 50px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    z-index: 1;
}

.arrows {
    top: 45%; 
    margin: 0;
    padding: 0;
    height: 50px;
    width: 100%;
    display: flex;
    align-items: center;
    position: fixed;
    z-index: 2;
}

#left-arrow {
    left: 0;
    margin: 0;
    padding-left: 25px;
    position: fixed;
}

#right-arrow {
    right: 0;
    margin: 0;
    padding-right: 25px;
    position: fixed;
}

.text {
    font-family: "genshinfont";
    display: flex;
    width: 100%;
    height: 800px;
    position: fixed;
    justify-content: center;;
    z-index: 3;
}

#title {
    top: 190px;
    left: 447px;
    margin: 0;
    padding: 0;
    color: #2eaccd;
    font-size: 50px;
    position: fixed;
}

#title-gray {
    color: #525252;
}

#subtitle {
    top: 240px;
    left: 447px;
    color: #525252;
    font-size: 30px;
    position: fixed;
}

#blue-intro {
    top: 292px;
    left: 480px;
    color: #ffffff;
    font-size: 19px;
    position: fixed;
}

#main-text {
    width: 420px;
    top: 347px;
    left: 447px;
    color: #525252;
    font-size: 19px;
    position: fixed;
}

#name {
    bottom: 201px;
    right: 905px;
    color: #ffffff;
    font-size: 52px;
    position: fixed;
    filter: drop-shadow(0 0 2px rgba(0, 0, 0, 1));
}

#webmaster {
    bottom: 183px;
    right: 850px;
    color: #d8bd96;
    font-size: 19px;
    position: fixed;
    filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.8));
}

#time {
    bottom: 225px;
    left: 447px;
    color: #525252;
    font-size: 20px;
    position: fixed;
}