.ad { display: none; clear: both; background: #cccccc; padding: 20px 10px 10px 10px; position: relative; overflow: hidden; margin: 15px 15px 0 15px; }
.c-banner { display: none; height: 0; width: 100%; background-size: contain; background-repeat: no-repeat; border: #cccccc 2px solid; background-position: center center; margin: 0 auto; }
.ad .sponsored { display: none; letter-spacing: 0.05rem; position: absolute; top: 7px; left: 0; right: 0; color: #323232; font-size: 55%; text-align: center; display: block; margin: 0 auto; text-transform: uppercase; }
.ad a.c-banner { background-size: contain; background-repeat: no-repeat; }

/* for responsive ads */
@media screen and (max-width: 559px) {
    .c-banner { /* height: 195px; width: 260px; */ display: block; }
    .ad a.c-banner { /* height: 195px; width: 260px; */ display: block; }
    .ad .sponsored { display: block; }
    .ad { display: block; /* max-width: 280px; */ }
}
@media screen and (min-width: 560px) and (max-width: 767px) {
    .c-banner { /* height: 315px; width: 420px; */ display: block; }
    .ad a.c-banner { /* height: 315px; width: 420px; */ display: block; }
    .ad .sponsored { display: block; }
    .ad { display: block; /* max-width: 460px; */ }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .c-banner { /* height: 450px; width: 600px; */ display: block; }
    .ad a.c-banner { /* height: 450px; width: 600px; */ display: block; }
    .ad .sponsored { display: block; }
    .ad { display: block; /* max-width: 660px; */ }
}
