html
{
    font-size: 62.5%;
}

body
{
    margin: 0;
    font-family:'poppins';
    background-color: rgba(229, 229, 203, 100%);
}

.wrapper
{
    max-width: 1200px;
    margin: 0 auto;    
}

p, a, h1{
    margin: 0;
    padding: 0;
}

header
{
    height: 100%;
    max-height: 10vh;
    margin-bottom: 5vh;
    display: flex;
    justify-content:space-between;
}

.left-side
{
    align-self: center;
}

.right-side
{
    display: flex;
    width: fit-content;
}

.social-media-buttons
{
    display: flex;
    align-self: center;
    gap: 2vh;
    margin-right: 5vh;
}

.social-media-buttons .icon
{
    
    font-size: 1.9rem;
    color: Black;
}

.social-media-buttons .icon .fab
{
    color: black;
}


main
{
    display: flex;
    flex-direction: column;
    gap: 4vh;
    height: max(85vh);
    width: 90%;
    padding: 5vh 5%;
    padding-bottom: 0;
    overflow-y: auto;
    background-color: #9d977f;
}

.post
{
    background-color: rgb(54, 48, 48);
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-auto-rows: 30vh;
    gap: 1vh;
}

.post img
{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.post .description
{
    width: 100%;
    display: grid;
    grid-auto-rows: 1fr;
    align-items: center;
}
.post .description h1
{
    font-size: 2.7rem;
    color: rgb(184, 180, 180);
}
.post .description p
{
    color: #7a7f73;
    width: 90%;
    font-size: 1.7rem;
}
.post .description p.polls
{
    color: white;
}

.post .description a
{
    /* background-color: rgb(151, 133, 108); */
    color: rgb(189, 188, 188);
    background-color: #455857;;
    font-size: 1.6rem;
    font-weight: bold;
    text-decoration: none;
    text-transform: capitalize;
    padding: 1.7vh 1.4vw;
    border-radius: 5%;
    width: fit-content;
    height: fit-content;
}