*{
    margin: 0;
    padding: 0;
}
body{
    background: #000000;
    margin: 0;
    padding: 0;
    font-family: nunito;
    color: #fefefe;
}
@font-face{
    font-family: nunito;
    src: url(fonts/nunito.ttf);
}
header img{
    width: 100%;

}
.ad img{
    width: 200px;
    justify-self: center;
    align-self: center;
    margin-left: 100px;
}
.ad h3{
    border: 1px white solid;
    padding: 30px 10px;
}
#burger img{
    width: 30px;
}
#burger{
    padding: 5px;
    cursor: pointer;
}
nav li{
    text-align: center;
    background: #151414;
    padding: 15px;
    margin: 1px 0px;
}
.menu img{
    width: 30px;
    height: 30px;
    cursor: pointer;
}
.active{
    background: white;
    color: black;
}
nav a{
    text-decoration: none;
    color: #fefefe;
    font-weight: bold;
}
nav a:hover{
    color: #15d701;
}
.ht{
    text-align: center;
    color: red;
    /*padding-top: 5px;*/
}
.pin{
    max-width: 64px;
    position: absolute;
    left: 100px;
}
.section_post{
    /*background: #151414;*/
    border-radius: 10px;
    padding: 10px 0;
    margin: 5px 5px;
}
.section_post_side{
    background: #151414;
    border-radius: 10px;
    padding: 10px 0;
    margin: 5px 5px;
}
.post{
    text-align: center;
    padding: 10px 0px;
}
.post img{
    width: 80vw;
}
.post h3{
    padding: 5px 0px;
}
.post a{
    text-decoration: none;
    color: #fefefe;
}
.post a:hover{
    color: #15d701;
}
footer img{
    width: 100%;
    border-radius: 3px;
}
footer{
    margin: 0px 5px;
}
.spost{
    text-align: center;
    padding: 10px 0px;
}
.spost img{
    width: 80vw;
}
.spost h3{
    padding: 5px 0px;
}
.spost a{
    text-decoration: none;
    color: #fefefe;
}
.spost a:hover{
    color: #15d701;
}
.post img{
    opacity: 50%;
}
.post img:hover{
    opacity: 100%;
 }
/*........... MEDIA QUERYIES......... */
/*........MOBILE............*/
@media(min-width: 200px){
    .mOpen{
    display: initial;
    }
    .mClose{
    display: none;
    }
}

/*..........TAB..........*/
@media(min-width: 568px){
    nav li{
        display: inline-block;
        text-align: center;
    }
    nav{
        text-align: center;
    }
    .mClose{
        display: initial;
    }
    #burger{
        display: none;
    }
    .ad img{
        margin: 0;
    }
    .section_post_side{
        text-align: center;
    }
    .spost{
        display: inline-block;
        padding: 5px;
        margin: 2px;

    }
    .spost img{
        max-width: 200px;
    }
    .section_post{
        text-align: center;
    }
    .post{
        display: inline-block;
        padding: 10px;
        /*margin: 2px;*/
    }
    .post img{
        max-width: 200px;
    }

}

/*.........SMALL LAPTOPS........*/
@media(min-width: 838px){
     .section_post_side{
        text-align: center;
        float: right;
        width: 25%;
    }
    .spost{
        padding: 5px;
        margin: 2px;

    }
    .spost img{
        max-width: 200px;
    }
    .spost img:hover{
        opacity: 50%;
    }

    .section_post{
        text-align: center;
        width: 70%;
        float: left;
    }
    .mid{
        display: none;
    }
    .post img{
        50%
    }

}

/*.........DESKTOP........
@media(min-width: 1200px){
    nav li{
        display: inline-block;
        text-align: center;
    }
    nav{
        text-align: center;
    }
    .section_post_side {
        float: right;
        width: 25%;
        margin-top: 5px;
        margin-right: 5px;
    }
    .section_post_side img{
        max-width: 200px;
        max-height: 200px;
    }
     .section_post_side img:hover{
        max-width: 250px;
        max-height: 250px;
    }
    .section_post{
        width: 74%;
        text-align: center;
        margin-top: 10px;
    }
    .section_post img{
        max-width: 200px;
        max-height: 200px;
    }
    .section_post img:hover{
        max-width: 250px;
        max-height: 250px;
    }
    .mid{
        display: none;
    }
     .section_post .post{
        display: inline-block;
        margin: 10px;
    }
}*/