* {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

#main {
    width: 100%;
    /* height: 100vh; */
    display: grid;
    grid-template-columns: 30% 70%;
    padding: 20px;
    /* border: 2px solid red; */
}
#left {
    /* width: 40%; */
    /* border: 2px solid black; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
#left > form {
    width: 50%;
    height: 300px;
    display: flex;
    flex-direction: column;
    /* border: 2px solid blue; */

}
#post {
    height: 250px;
}
#right {
    padding: 50px;
    height: 700px;
    /* width: 60%; */
    background-color:whitesmoke;
    border-radius: 30px;
    overflow: scroll;
}

.post-box {
    width: 90%;
    /* height: 200px; */
    margin: 20px;
    background-color:rgb(225, 224, 224);
    border-radius: 10px;
    padding: 20px;
    text-align: center;
}

textarea {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 768px) {
    
    #main {
        grid-template-columns: repeat(1, 1fr);
    }

}