@media only screen and (max-width: 767px) {
    
    .logo {
        float:none;
        text-align: center;
        margin: 5px auto 0;
    }
    
    .top-menu ul {
        padding-left: 0;
        text-align: center;
    }
    
    .arrow-left {
        left: 10px;
        background-color: black !important;
        opacity: 0.9;
    }
    
    .arrow-right {
        right: 10px;
        background-color: black !important;
        opacity: 0.9;
    }
    
    .main-content ul {
        text-align: center;
    }
    
    .mini-text-shop h2 {
        text-align: center;
    }
    
    .mini-text-shop p {
        padding: 0 20px 10px;
        text-align: justify;
    }
    
    .main-footer p {
        padding: 0 15px;
    }
    
    .top-menu ul li {
        line-height: 35px;
    }
    
    .content-magazine {
        padding-top: 160px;
    }
    
    
    
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    
    .logo, .logo img {
        width: 110px;
        height: 50px;
    }
    
    .top-menu {
        height: 65px;
    }
    
    .top-menu ul {
        padding-left: 50px;
    }
    
    .top-menu ul li {
        padding: 0 7px;
    }
    
    .main-content ul {
        text-align: center;
    }
    
    .main-content ul li {
        width: 355px;
    }
    
    
}