.modal-box { display: none; position: absolute; z-index: 1000; width: 98%; background: white; border-radius: 8px; background-clip: padding-box; }
@media (min-width: 32em) {
.modal-box { width: 777px; }
}

.modal-box .modal-body { padding: 2em 1.5em; background: url("../../images/applycoupon/applycoupon-bg.png"); min-height: 504px;  }
.coupon-successfully-img { text-align: center; margin: 36px 0 15px 0;}
.coupon-successfully-img img { display: inline-block; max-width: 100%;}
.coupon-successfully-text { color: #000000; font-family: "Raleway","Helvetica Neue",Verdana,Arial,sans-serif; font-size: 28px; font-weight: 500; line-height: 34px; text-align: center;}
.modal-overlay { opacity: 0; filter: alpha(opacity=0); position: fixed; top: 0; left: 0; z-index: 900; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.77) !important; }
.modal-box a.close {z-index:99999; line-height: 1; font-size: 1.5em; position: absolute; top: 20px; right: 20px; text-decoration: none; color: #bbb; background: url("../../images/applycoupon/popup-close.png"); text-indent: -9999px; width: 23px; height: 23px; }
.modal-box a.close:hover { color: #222; -webkit-transition: color 1s ease; -moz-transition: color 1s ease; transition: color 1s ease; }
@media screen and (max-width: 800px) {
    .modal-box { width: 92%;}
    .modal-box .modal-body { min-height:0;}
    .coupon-successfully-text { margin-bottom: 15px; }
}
@media screen and (max-width: 767px) {
    .coupon-successfully-text { font-size: 24px; line-height: 30px;}
}

@media screen and (max-width: 480px) {
.modal-box a.close { background-size: cover; height: 18px; right: 10px; top: 10px; width: 18px; }
.coupon-successfully-img { margin-top: 15px;}
.coupon-successfully-text { font-size: 20px; line-height: 26px; } 
.modal-box .modal-body { padding: 2em 1em;}
}
@media screen and (max-width: 360px) {
.coupon-successfully-img { margin-top: 0px;}
.coupon-successfully-text { font-size: 18px; line-height: 24px; margin-bottom: 0 } 
}