body {
    font-family: 'Josefin Sans', sans-serif;
    /* all EM in the document is based off this DONT TOUCH */
    /* it's also kinda the default so you can touch it if you want */
    /* BODY TEXT SHOULD BE 1EM */
    font-size: 16px;
    /* zoom: 80%; */
    color: #222;
    text-decoration: none;
    background-color: #F5F6F6;
    display: block;
    margin-left: auto;
    margin-right: auto;
    transition: all 250ms ease-in;
}

limited-margin {
    position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 85%;
    max-width: 1400px;
}

/* small screen */
@media screen and (max-width: 900px) {
    body {
        font-size: 25px;
    }

    limited-margin {
        width: 90%;
    }
}

/* mobile */
@media (pointer:none), (pointer:coarse) {
    body {
        zoom: 120%;
    }

    limited-margin {
        width: 95%;
    }
}

.slide-in {
    display: inline;
    transition: all 1s;
    translate: translateX(-100%);
}

.slide-out {
    display: inline;
    transition: all 1s;
    translate: translateX(100%);
}