Настройка рекламного блока для мобильных - Вопросы по CSS

Приветствую участников форума.

Помогите, пожалуйста, со следующей задачей.

Есть адаптивный рекламный блок, ширина которого должна меняться в зависимости от разрешения экрана. Рекламный блок находится в теле статьи (между абзацев), обязательно по центру.

Сейчас это реализовано в див-блоке с классом reklama:
.reklama
{margin: 0 25% 0 25%;
width: 50%;
padding: 5px; }

Погуглил, чтобы понять, как изменить пропорции для разных разрешений экрана и нашел следующее. Чтобы пропорции остались такими же для разрешения экрана более 800px, пишу следующее:
@media screen and (min-width: 800px) {
reklama {margin: 0 25% 0 25%;
width: 50%;
padding: 5px; }
}

Вопрос №1: правильно ли это?
Вопрос №2: как мне сделать так, чтобы при разрешении экрана менее 800px пропорции менялись на  margin: 0 15% 0 15%; width: 70% (при этом класс остается тем же самым .reklama)?

Благодарю за ответы.

% - единицы в принципе должны сработать ибо так и поступают, чтобы блоки были резиновыми.
Вот чтобы указать, что

... чтобы при разрешении экрана менее 800px пропорции менялись на  margin: 0 15% 0 15%; width: 70% ...

необходимо прописать:
Размер экрана меньше 800px ---- Подробнее ---->>>