* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
  font-family: helvetica;
  overflow-x: hidden;
}
#homebutton{
    position:fixed;
}

.container {
    display: flex;
    height: 100vh;
    width:100vw;
    gap:10px;
}

.box {
    flex: 1;
    color: white;
    text-align: justify;
}

.red {
    background-color: red;
    padding: 10px;
    height: 100vh;
    width: 20vw;
}

.green {
    background-color: green;
    padding: 10px;
    height: 100vh;
    width: 60vw;
}

.blue {
    background-color: blue;
    padding: 10px;
    height: 100vh;
    width: 20vw;
}

#aboutme {
    margin-top: 20px;
    width: 100%;
    height: 200px;
    border: 2px solid white;
    overflow-y: scroll;
    border-radius: 5%;
}

#recentposts{
    margin-top: 20px;
    padding: 10px;
    background-color: rgb(0, 149, 255);
    border: 2px solid rgb(0, 11, 128);
    border-radius: 5%;
    font-size: 16px;
    text-align: center;
}

#aboutweb{
    margin-top: 20px;
    padding: 10px;
    background-color: rgb(0, 149, 255);
    border: 2px solid rgb(0, 11, 128);
    border-radius: 5%;
    font-size: 16px;
    text-align: center;
}

#characterimg {
    margin-top: 20px;
    padding: 10px;
    background-color: rgb(0, 149, 255);
    border: 2px solid rgb(0, 11, 128);
    border-radius: 5%;
    font-size: 16px;
    text-align: center;
}

#art {
    margin-top: 20px;
    padding: 10px;
    background-color: rgb(0, 149, 255);
    border: 2px solid rgb(0, 11, 128);
    border-radius: 5%;
    font-size: 16px;
    text-align: center;
}

#blog {
    margin-top: 20px;
    padding: 10px;
    background-color: rgb(0, 149, 255);
    border: 2px solid rgb(0, 11, 128);
    border-radius: 5%;
    font-size: 16px;
    text-align: center;
}

#updatedon {
    margin-top: 20px;
    padding: 10px;
    background-color: rgb(0, 149, 255);
}

.img{
    width: 100%;
}

/*For all dev */
@media (max-width: 768px) {
    .container {
        flex-direction: column;
    }

    .red, .green, .blue {
        width: 100%;
        min-width: auto;
    }

    #aboutme {
        height: auto;
        max-height: 150px;
    }

    #homebutton {
        position: static;
        display: block;
        margin: 10px auto;
    }
}
