Screen breakpoints for matteblue/clook

screen.css

@media only screen and (max-width: 1024px) {
    .package-info-container{ padding: 0 2%; }
    .package-info{ width: 49.5%; margin-right: 0; }
    .package-info h5 { min-height: unset; }
    .package-info:not(:last-child) { margin-right: 0; }
    .package-info:nth-child(odd) { margin-right: .4%; }
    .package-info:first-child, .package-info:nth-child(2) { margin-bottom: 20px; }

    section.main { width: 100%; max-width: 100%; }
}

@media only screen and (max-width: 767px) {
    section.heading{ padding-bottom: 80px; }
    section.heading .wrapper { width: 100%; padding: 0 15px; }
    section.heading .wrapper .inner-wrapper { width: 100%; }

    section.main { margin-bottom: 0; }
    section.product-description h4 { text-align: center; }
    section.product-description .text-holder { text-align: center; padding: 0; margin-bottom: 60px; }
}

@media only screen and (max-width: 570px) {
    .package-info { width: 100%; margin: 0 !important; margin-bottom: 20px !important; }
}