@-ms-viewport {
    width: device-width;
}

@media (min-width: 1439px) and (max-width: 1559px) {
    
}

@media (min-width: 1201px) and (max-width: 1439px) {
    

}

@media (min-width: 1023px) and (max-width: 1200px) {
    
    
}

@media (min-width: 769px) and (max-width: 1023px) {
    .main-nav.open ul{
        display: block;
        padding: 0;
    }
    .main-nav ul li{
        display: block;
        padding: 5px 0;
        margin: 5px 0;
    }
    .main-nav ul li a{
        border-bottom: none;
    }
    .blog-item{
        width: 31.33%;
        margin: 1% 1% 1% 1%;
    }
   
}

@media (min-width: 481px) and (max-width: 768px) {
    
    .main-nav.open ul{
        display: block;
        padding: 0;
    }
    .main-nav ul li{
        display: block;
        padding: 5px 0;
        margin: 5px 0;
    }
    .main-nav ul li a{
        border-bottom: none;
    }
    .blog-item{
        width: 48%;
        margin: 1% 1% 1% 1%;
    }
}

@media (max-width: 480px) {
    
    .main-nav.open ul{
        display: block;
        padding: 0;
    }
    .main-nav ul li{
        display: block;
        padding: 5px 0;
        margin: 5px 0;
    }
    .main-nav ul li a{
        border-bottom: none;
    }
    .blog-item{
        width: 100%;
        margin: 10px 0;
    }
}

@media (max-width: 375px) {
    .main-nav.open ul{
        display: block;
        padding: 0;
    }
    .main-nav ul li{
        display: block;
        padding: 5px 0;
        margin: 5px 0;
    }
    .main-nav ul li a{
        border-bottom: none;
    }
    .blog-item{
        width: 100%;
        margin: 10px 0;
    }
}