body {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
}

/*===============Main Body================*/
.mainBody {
    margin-top: 5%;
    margin-left: 20%;
    margin-right: 20%;
    padding: 0;
}

#section-header{
    border-bottom: solid 1px rgba(128, 128, 128, 0.3);
}

#section-header h1 {
    text-decoration: underline;
    text-decoration-color: #bb2a30ff;
    text-decoration-thickness: 2px;
    text-underline-offset: 8px;
    padding: 0%;
    margin:0;
    margin-top: 150px;
    font-size: 36px;
    font-weight: lighter;
    color: gray
}

#blog-section {
    margin-top: 5px;
    text-align: center;
    padding-bottom: 15px;
    border-bottom: solid 1px rgba(128, 128, 128, 0.3);
}

#blog-section p {
    text-align: left;
}

#blog-section-flex {
    display: flex;
    margin-top: 5px;
    text-align: left;
    padding-bottom: 15px;
    border-bottom: solid 1px rgba(128, 128, 128, 0.3);
}

#blog-section-flex p {
    text-align: left;
    padding-right: 10px;
}

/* ==Tablets (landscape)== */
@media (min-width: 800px) and (max-width: 1366px) and (orientation : landscape) {  
    .tablet-column {
        display: flex;
        flex-direction: column;
        margin-top: 5px;
        text-align: left;
        padding-bottom: 15px;
        border-bottom: solid 1px rgba(128, 128, 128, 0.3);
    }
}

/* ==Tablets (Portrait)== */
@media (min-width: 800px) and (max-width: 1024px) and (orientation : portrait)  {

    html, body {
        overflow-x: hidden;
    }

    .mainBody {
        width: 100%;
        margin-top: 25%;
        margin-inline: 0%;
        padding: 0;
    }

    #section-header h1 {
        text-decoration: underline;
        text-decoration-color: #bb2a30ff;
        text-decoration-thickness: 2px;
        text-underline-offset: 8px;
        padding: 0%;
        margin:0;
        font-size: 30px;
        font-weight: lighter;
        color: gray
    }

    #blog-section {
        margin-top: 5px;
        text-align: center;
        padding-bottom: 15px;
        border-bottom: solid 1px rgba(128, 128, 128, 0.3);
    }

    #blog-section h1{
        text-align: center;
    }

    #blog-section-flex h1{
        text-align: center;
    }

    #blog-section p {
        text-align: left;
        margin-inline: 3%;
    }

    #blog-section img {
        width: 100%;
    }

    #blog-section-flex {
        display: flex;
        margin-top: 5px;
        text-align: left;
        padding-bottom: 15px;
        border-bottom: solid 1px rgba(128, 128, 128, 0.3);
    }

    .tablet-column {
        display: flex;
        flex-direction: column;
        margin-top: 5px;
        text-align: left;
        padding-bottom: 15px;
        border-bottom: solid 1px rgba(128, 128, 128, 0.3);
    }

    #blog-section-flex p {
        text-align: left;
        margin-inline: 3%;
    }
}

@media (max-width: 800px) {

    html, body {
        overflow-x: hidden;
    }

    .mainBody {
        width: 100%;
        margin-top: 25%;
        margin-inline: 0%;
        padding: 0;
    }

    #section-header h1 {
        text-decoration: underline;
        text-decoration-color: #bb2a30ff;
        text-decoration-thickness: 2px;
        text-underline-offset: 8px;
        padding: 0%;
        margin:0;
        font-size: 30px;
        font-weight: lighter;
        color: gray
    }

    #blog-section {
        margin-top: 5px;
        text-align: center;
        padding-bottom: 15px;
        border-bottom: solid 1px rgba(128, 128, 128, 0.3);
    }

    #blog-section h1{
        text-align: center;
    }

    #blog-section-flex h1{
        text-align: center;
    }

    #blog-section p {
        text-align: left;
        margin-inline: 3%;
    }

    #blog-section img {
        width: 100%;
    }

    #blog-section-flex {
        display: flex;
        flex-direction: column;
        margin-top: 5px;
        text-align: left;
        padding-bottom: 15px;
        border-bottom: solid 1px rgba(128, 128, 128, 0.3);
    }

    #blog-section-flex p {
        text-align: left;
        margin-inline: 3%;
    }
}