#background {
    width: 200%;
    height: 200%;
    top: -100%;
    left: -100%;

    z-index: -1;

    background: url("../assets/images/background2.png");
    background-position: center;
    
    -webkit-animation-play-state: running;
    -webkit-animation: none;
}

.landing {
    height: 500vh;
    background: none;
    overflow: hidden;

    background: 
    linear-gradient(
        180deg, 
    rgba(255,250,250,1) 0%, 
    rgba(127,127,127,1) 48%, 
    rgba(127,127,127,1) 52%, 
    rgba(250,250,255,1) 100%
    );
}

.trim {
    background:
    linear-gradient(
        90deg, 
        rgba(200, 50, 50, 1) 0%, 
        rgba(200, 50, 50, 0) 5%, 
        rgba(200, 50, 50, 0) 95%, 
        rgba(200, 50, 50, 1) 100%
    );
}

.landing button:hover {
    opacity: 1;
}

.quartz-button {
    display: block;
    position: fixed;
    transform-origin: 0% 0%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin: 0 !important;
}

.quartzIcon {
    width: 140.8px;
    height: 64px;
}

.disable-animations-button {
    position: fixed;
    bottom: -25px;
    right: -25px;
    font-size: 16pt;
    opacity: .5;
    margin-right: 8px;
    font-family: "Fredoka One", sans-serif;
    z-index: 100000;
    border-radius: 8px;
    background-color: white;
    padding-bottom: 25px;
    padding-right: 25px;
    padding-left: 5px;
}

.disable-animations-button:hover {
    opacity: 1;
    cursor: pointer;
}

.disabled{
    pointer-events: none;
}

#can-questions {
    display: none;
}

#final-text {
    text-align: center;
}