body {
    font-family: 'Poppins';
    background-color: #0B0C10;
    color: #C5C6C7;
}

::-webkit-scrollbar {
    display: none;
}

h1 {
    margin-top: 30px;
    font-size: 50px;
    color: #e5e6e6;
}

input {
    border-radius: 5px;
    border-width: 1px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.leaderboard-username {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

a{
    color: #ffd900;
}

.achievements {
    border-radius: 10px;
    background-color: #1F2833;
}
.achievements-message {
    margin-top: 5px;
}

.body {
    margin-left:5%;
    margin-right:5%;
    padding-bottom:30px;
}

.login-buttons {
    background-color: #66FCF1;
    color:#0B0C10;
}

.login-buttons:disabled {
    opacity: 0.6;
    background-color: #66FCF1;
    color:#0B0C10;
    border:0px;
}

.login-buttons:hover {
    background-color: #66FCF1;
    color:white;
}

#leaderboard-title{
    position:relative;
}

#leaderboard-heading{
    font-size: 40px;
}

.leckerli-one-regular {
    font-family: "Leckerli One", cursive;
    font-weight: 200;
    font-style: normal;
}

.form-group {
    margin-bottom:5px;
}

#test {
    margin-top: 50px;
}

#answer {
    text-align: center;
    font-size:30px;
    width: 100%;
    background-color: #1F2833;
    border: 0px;
    color:#e5e6e6;
}

.test-number {
    font-size: 40px;
    font-weight: bold;
    color: #45A29E;
}

.test-heading {
    font-size: 20px;
    font-weight: bold;
}

.info-title {
    margin-top: 30px;
    font-size: 100px;
    color: #ffd900;
}

.faq {
    color:#e5e6e6;
    font-size: 15px;
}

.faq-heading {
    margin-top:15px;
}

.faq-content {
    display: none;
}

.info-main {
    margin-top:50px;
    margin-bottom:50px;
}

#question {
    font-size: 80px;
    font-weight: bold;
    color: #66FCF1;
    white-space: nowrap;
}

.highlight {
    color: #ccad00;
    font-weight: bold;
}

.highlight-2 {
    color: #66FCF1;
    font-weight: bold;
}

.notice {
    font-size: 12px;
    margin-bottom:5px;
    font-family: 'Courier Prime';
}

.navbar {
    margin-left:5%;
    margin-right:5%;
    margin-top: 20px;
    border-radius:10px;
    background-color: #1F2833;
}

a.nav-link-active {
    color: #ffd900 !important;
    font-weight: bold;
    text-decoration: none;
    pointer-events: none;
}

.nav-link-symbol{
    font-size: 25px;
}

.navbar-brand-active {
    color: #ffd900 !important;
    text-decoration: none;
    pointer-events: none;
}

.leaderboard-icon {
    margin-right: 3px;
}

.trophy-icon {
    font-size: 40px;
    color: #ffd900;
    margin:5px;
}
.level-icon {
    margin-right:5px;
}

.level-1-icon {
    color: #FF5733;
}

.level-2-icon {
    color: #66FCF1;
}

.level-3-icon {
    color: #ffd900;
}

.username {
    color: #e5e6e6;
    white-space: nowrap;
}

a.nav-link {
    color: #C5C6C7;
}

a.nav-link:hover {
    color: #e5e6e6;
}

.navbar-brand {
    padding: 0px;
    color: #66FCF1;
    font-size:35px;
}

.navbar-brand:hover {
    font-weight:bold;
    color: #66FCF1;
}

.select-time-label {
    padding:5px;
}

hr {
    margin-top: 0px;
    margin-bottom: 0px;
}

.leaderboard-entry {
    position:relative;
    background-color: #0B0C10;
    padding-top:10px;
    padding-bottom:10px;
    border-radius: 10px;
    margin-bottom: 10px;
    color: #e5e6e6;
}

.leaderboard-entry:hover {
    background-color: #1F2833;
    color: #ffd900;
}

#leaderboard-options {
    margin-bottom:10px;
}

.time-options {
    color:#C5C6C7;
    cursor: pointer;
    padding:5px;
}

.time-option-active {
    color:#66FCF1;
}

.form-check-input:checked {
    background-color: #66FCF1;
}

input[type=checkbox], input[type=checkbox] {
    outline: none;
  }

.form-check-input {
    background-color: #C5C6C7;
}

.settings-row {
    margin:10px;
    border-radius:10px;
    padding:5px;
    background-color: #1F2833;
}

.signs {
    font-size: 20px;
}

.num-input {
    text-align: center;
    width:30px;
    font-size: 12px;
    font-weight: bold;
    height:20px;
    background-color: #1F2833;
    color: #66FCF1;
    border: 0px;
}

.add-input {
    width:35px;
}

textarea:focus, input:focus{
    outline: none;
}

.num-input:focus {
    border-color: #66FCF1;
}

.num-input:disabled {
    color: #C5C6C7;
    background-color: #1F2833;
}

#enter-button {
    margin-top:20px;
    margin-bottom:20px;
    font-size:30px;
    color:#e5e6e6;
}

.key-button {
    border-radius:10px;
    background-color: #45A29E;
    color:white;
    padding:5px;
    padding-left:10px;
    padding-right:10px;
    white-space:nowrap;
    cursor: pointer;
}

.result-heading {
    font-size:20px;
    font-weight: bold;
    margin-top:10px;
}

.result-number {
    font-size:100px;
    color: #45A29E;
}

.faq-title-container {
    margin-top: 20px;
}

.faq-title {
    font-size: 50px;
    white-space: nowrap;
    color:#e5e6e6;
}

.faq-item {
    cursor: pointer;
}

.result-qpm {
    font-size:100px;
    color:#66FCF1;
}

.result-average-number {
    font-size:30px;
    color: #45A29E;
}

.result-number-header {
    margin-top: 5px;
    font-size:15px;
    font-weight: bold;
}

.leaderboard-button {
    background-color:  #ccad00;
    font-weight: bold;
    color:#332b00;
    margin:5px;
    border-radius:5px;
    opacity:0.7;
}

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

.leaderboard-button-active {
    background-color: #ffd900;
    opacity:1;
    color:#1a1600;
}

.place-sign {
    font-size: 20px;
}

.profile-info {
    margin-bottom: 15px;
    font-size: 15px;
}

.page-button {
    background-color: #45A29E;
    color: #0B0C10;
    border-radius: 5px;
    width:45px;
    padding-top: 7px;
    padding-bottom: 7px;
    margin-left: 5px;
    margin-right: 5px;
    font-size: 20px;
    position: relative;
    cursor: pointer;
}

.page-button-container {
    padding-bottom: 20px;
}

.page-button:hover {
    color: #C5C6C7;
}

.page-button-mute {
    opacity:60%;
}

.leaderboard-entry-empty {
    visibility: hidden;
}

#current {
    width:60px;
    padding-top: 12px;
    padding-bottom: 12px;
    background-color: #66FCF1;
    pointer-events: none;
}

#default-button:hover{
    background-color: #45A29E;
    color:#1a1600;
    cursor: pointer;
}


footer {
    font-family: 'Poppins';
    background-color: #1F2833;
    width:100%;
    position:absolute;
    left:0;
    opacity: 0;
}

footer a {text-decoration: none;}

.footer-text {
    color: #9ccfd8;
}

.error-message {
    color:  #ff4d4d;
    font-family: 'Courier Prime';
    font-stretch:condensed;
    font-size: 15px;
}

.leaderboard-message {
    font-weight:bold;
    color:#ffd900;
}

.personal-message {
    font-weight:bold;
    color:#66FCF1;
}

.test-qpm {
    color:#ffd900;
    font-size:40px;
    font-weight: bold;
}

.result-message {
    margin-bottom: 10px;
}

.result-message-text {
    font-size: 15px;
    font-family: 'Courier Prime';
}

.congrats-text {
    color:#ffd900;
    font-weight:bold;
    font-size:20px;
    font-family: 'Courier Prime';
}

.congrats-exclamation-mark{
    color:#ffd900;
} 

#register-message{
    margin-top: 5px;
    font-size: 15px;
    font-family: 'Courier Prime';
}

.register-exclamation-mark{
    color: #ff4d4d;
}

.register-check-mark{
    color:#66FCF1;
}
