html{
    height: 100%;
}

body{
    margin: 0;
    min-height: 100%;
    background-image: linear-gradient(180deg, var(--PRIMARY-COLOR) 0%, var(--SECONDARY-COLOR) 100%);
    background-repeat: no-repeat;
    background-attachment: fixed;
    display: flex;
    flex-direction: column;
}

/*NAVBAR STYLING*/
nav.navbar{
    background-color: transparent;
}

/*MAIN STYLING*/

.main{
    flex-grow: 1;
    margin: 1.6rem;
}

.card-rules{
    min-width: 35rem;
    background-color: var(--TEXT-COLOR);
    border-radius: 5px;
    padding: 1rem;
    position: relative;
}

.rules-heading{
    color: var(--PRIMARY-COLOR);
}

.quiz-rules{
    padding: 1.6rem;
}

/*FOOTER STYLING*/

.card-footer{
    justify-content:space-around;
}

.footer-menu-link{
    color: var(--TEXT-COLOR-ALTERNATE);
}

.footer{
    background-color: transparent;
    color: var(--TEXT-COLOR-ALTERNATE);
}

.footer-credit{
    color: var(--TEXT-COLOR-ALTERNATE);
  }