body {
    background-color: whitesmoke;
    font-family: 'Architects Daughter', cursive;
}

img {
    border-radius: 50%;
}

h1 {
    color: #222;
}

p {
    color: #222;
}

.content-container {
    height: 90vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.avatar-section, .description-section {
    padding: 1rem;
}

.text_emoji{
    margin-right: 0.5rem;
}

@media only screen and (max-width: 680px) {
    .content-container {
        flex-direction: column;
    }
}

@media only screen and (min-width: 675px) {
    body {
        background-color: darkgray;
    }
}

@media only screen and (min-width: 999px) {
    body {
        background-color: gray;
    }
}

@media only screen and (min-width: 1280px) {
    body {
        background-color: dimgray;
    }
}

@media only screen and (max-width: 1080px) {
    h1 {
        color: #444;
    }
}

@media only screen and (max-width: 550px) {
    h1 {
        color: #666;
    }
}

@media only screen and (max-width: 400px) {
    h1 {
        color: #888;
    }
}

@media only screen and (min-width: 715px) and (max-width: 960px) {
    p {
        color: #111;
    }
}