Как убрать прозрачность (opacity) для вложенного дива?

Question

[Miku Hatsune]

Код таков:

<div class="dokuro-black-box">
            <div class="dokuro-full-popular-image uk-vertical-align" style="background-image: url('images/popular.png');">

                <div class="info uk-vertical-align-bottom">
                    <h2>Название видео</h2>
                    <h5>краткое описание видео, примерно строк этак в 3 или больше, но 3 строки смотрятся хорошо.</h5>

                    <a href="/">Просмотреть</a>
                </div>
            </div>
        </div>

Проблема:

В общем я вывожу картинку, но так как сверху на картинку нужно наложить текст - было решено сделать её как фон блока. Текст накладывается хорошо, но если картинка слишком яркая, то белые буквы плохо видно, поэтому я решил затемнять её. Вложил всё это в див "dokuro-black-box" которому предал чёрный фон. Для блока с фоном задал opacity: 0.7;
Всё отлично, но затемняется и текст. Как сделать что бы текст не становился затемнённым?
Или посоветуйте как рациональнее решить мою проблему.

// Пробовал задать для дива "info" opacity: 1; или просто для h2, h5 и ссылки - не хочет.

Answer 1

[Андрей Федоров]

Не нужно картинку затенять. Дайте тексту тень - text-shadow: 0 0 5px rgba(0,0,0,.5);
С параметрами поиграйте.