body {
    background-image: url('');
    color: #000305;
    font-size: 87%;
    font-family:Arial, Helvetica, sans-serif;
    line-height: 1.5;
    text-align: left;
}

a {text-decoration:none;}
a:link, a:visited {color: #14a18f;}
a:hover, a:active {color:#f58233;}

.body {
    margin: 0 auto;
    width: 70%;
    clear: both;
}


/*-------  MAIN HEADER  --------*/

.mainheader img {
    width: 100%;
}

.mainheader nav {
    background-color: #14a18f;
    height: 40px;
    border-radius: 5px;
}
.mainheader nav ul {
    text-align: center;
    list-style: none;
    margin: 0 auto;
}
.mainheader nav ul li{
    display: inline;
}

.mainheader a:link,.mainheader a:visited{
color: white;
padding: 10px 40px;
display: inline-block;
height: 20px;
}
.mainheader a:hover, .mainheader a:active{
    color: #0f0f32;
    background-color: rgb(157, 144, 159);
    text-shadow: none;

}

/*-------  MAIN CONTENT  --------*/

.mainContant{
    width: 70%;
    float: left;
}

.top-content{
    background-color:rgb(240, 237, 231);
    padding: 3%;
    margin-top: 3%;
    border-radius: 5px;
}
.post-info{
    font-size: 90%;
    color: #999;
    font-style: italic;
    margin-top: -20px;
}

.post-content{
    display: block;
}




/*-------  SAID BAR  --------*/

.theSidebar{
    width: 24%;
    margin: 2% 0% 0% 2%;
    float: left;
    padding: 2%;
    background-color:rgb(240, 237, 231);
    border-radius: 5px;

}


/*-------  FOOTER  --------*/


    .footer{
        margin-top: 20px;

        float: left;
        width: 100%;
        background-color: #14a18f;
        height: 60px;
        border-radius: 5px;
        text-align: center;
    }


    .footer p {
        text-align: center;
        color: #0f0f32;
        width: 90%;
    }


/*-------  HTML5  --------*/


.post-img{
    width: 100%;

}

figure {
    margin:25px 0;
    font-size: 80%;
    color: rgb(112, 104, 104);
}



    /*-----------CSS3 For Mobile ----------------*/


    @media screen and ( max-width: 480px) {
        .body {
            width: 90%;
            font-size: 95%;
        }


        /*-------  MAIN HEADER Mobile --------*/



        .mainheader nav {
            height: 160px;
    
        }
        .mainheader nav ul{
            width: 100%;
            padding: 0;
        }


        .mainheader nav ul li{
            display: inline;
        }
        .mainheader a:link,.mainheader a:visited{
            display: block;
        }

        .mainheader a:hover, .mainheader a:active{
            color: #0f0f32;
            background-color: rgb(157, 144, 159);
    
            }

        /*-------  MAIN CONTENT  --------*/

        .mainContant{
            width: 100%;
        }

        /*-------  SAID BAR  --------*/

        .theSidebar{
            width: 94%;
            margin: 10px;

        }

}

@media screen and ( max-width: 680px) {
    .body {
        width: 90%;
        font-size: 95%;
    }

    .mainheader nav {
    font-size: 80%;

    }

}