.breadcrumbs { margin-bottom: 1rem; }
.breadcrumbs ul { margin: 0; padding: 0; list-style: none; font-size: 0; }
.breadcrumbs li { display: inline-block; color: #585559; font-size: 0.938rem; vertical-align: middle; }
.breadcrumbs > ul > li::after { content: '>'; padding: 0 0.5rem; }
.breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs ul li:last-child::after { display: none }

.no-coupons-text { font-size: 3rem; padding: 2rem; text-align: center; margin: 3rem auto; }
.coupon { position: relative; width: 70%; height: 12rem; border: gray solid 1px; background-color: white; margin: 2rem 0; display: flex; flex-direction: row; cursor:pointer;}
.coupon-details { width: calc(100% - 22.5rem); text-align: center; padding: 1rem 5rem; position:relative;}
.coupon-title { font-size: 1.6rem; color: #DF301C; }
.coupon-description { margin: 0.6rem 0; font-size: 1.2rem; }
.coupon-image {width: 22.5rem; }
.coupon-image img {width: 100%; height:100%; }
.coupon-address { bottom: 1rem; left: 0; position: absolute; right: 0; }
.coupon-address pre { font-family: inherit; margin: inherit; }
.rest-logo { width: 7rem; height: 4rem; top: 4rem; right: 19rem; position: absolute; border: black 1px solid; background-color: white; }
.rest-logo img { width: 100%; margin: 0; position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.pagination { list-style-type: none; direction: ltr; width: 100%; text-align: center; padding: 0; }
.pagination:before { content: "<" }
.pagination:after { content: ">" }
.pagination li { display: inline-block; padding: 5px; margin: 5px; color: #7e7e7e }
.pagination li a { text-decoration: none; color: inherit }
.pagination li.selected { color: red }

@media screen and (max-width: 1024px) {
    .coupon {width: 100%;}
}

@media screen and (max-width: 767px) {
    .no-coupons-text {font-size: 2rem; padding: 1rem;}
    .coupon { flex-direction: column; width: 100%; height: 25rem; font-size: 1.2rem; }
    .coupon-image { width: 100%; }
    .coupon-details { top: 1em; padding: 1rem; width: auto; height: 12.5rem; }
    .coupon-title { font-size: 1.6rem; }
    .coupon-description { font-size: 1.2rem; margin: 0; }
    .coupon-address { bottom: 1.6rem; }
    .rest-logo { right: calc(50% - 2.5rem); top: 38%; border: black 1px solid; background: white; width: 5rem; height: 5rem; }
}

@media screen and (max-width: 410px){
    .coupon-description {margin: 0.5rem 0; }
    .coupon-address { bottom: 0.6rem; }
    .rest-logo { top: 33%;}
}

@media screen and (max-width: 320px) {
    .coupon { height: 20rem; font-size: 1rem; }
    .coupon-details { top: 0.3rem; height: 12rem; }
    .coupon-title { font-size: 1.4rem; }
    .coupon-description { font-size: 1rem; }
    .rest-logo { right: calc(50% - 2rem); width: 4rem; height: 4rem; }
}