body {
    background-color: rgb(186, 194, 222);
    color: black;
    font-family: "Montserrat", serif;
    text-align: center;
}

.dark-mode {
    background-color: rgb(24, 24, 37);
    color: white;
    a:link {
        color: #c7ceff;
    }

    a:visited {
    color: #cbd2ff;
    }

    a:hover {
        color: #8d8ead;
    }
    button {
        background-color: rgb(24, 24, 37);
        color: white;
        border: 1px solid rgb(108, 112, 134);
        padding: 10px 20px;
        font-size: 16px;
        cursor: pointer;
    }
    
    button:hover {
        background-color: rgb(108, 112, 134);
        color: white;
    }
}

.light-mode {
    background-color: rgb(186, 194, 222);
    color: black;
    a:link {
        color: #1c1d22;
    }
    
    a:visited {
        color: #1c1d22;
    }
    
    a:hover {
        color: #4c4f62;
    }
    button {
        background-color: rgb(186, 194, 222);
        color: black;
        border: 1px solid rgb(108, 112, 134);
        padding: 10px 20px;
        font-size: 16px;
        cursor: pointer;
    }
    
    button:hover {
        background-color: rgb(108, 112, 134);
        color: black;
    }
}

@media (prefers-color-scheme: dark) {
    body {
        background-color: rgb(24, 24, 37);
        color: white;
    }
    a:link {
        color: #c7ceff;
    }

    a:visited {
    color: #cbd2ff;
    }

    a:hover {
        color: #8d8ead;
    }
    button {
        background-color: rgb(24, 24, 37);
        color: white;
        border: 1px solid rgb(108, 112, 134);
        padding: 10px 20px;
        font-size: 16px;
        cursor: pointer;
    }
    
    button:hover {
        background-color: rgb(108, 112, 134);
        color: white;
    }
}

@media (prefers-color-scheme: light) {
    body {
        background-color: rgb(186, 194, 222);
        color: black;
    }
    a:link {
        color: #1c1d22;
    }
    
    a:visited {
        color: #1c1d22;
    }
    
    a:hover {
        color: #4c4f62;
    }
    button {
        background-color: rgb(186, 194, 222);
        color: black;
        border: 1px solid rgb(108, 112, 134);
        padding: 10px 20px;
        font-size: 16px;
        cursor: pointer;
    }
    
    button:hover {
        background-color: rgb(108, 112, 134);
        color: black;
    }
}

.bottom {
    text-align: center;
    width: 100%;
    position: fixed;
    bottom: 0;
}
