Как можно сделать такой серый фон, но при этом чтобы карту можно было использовать?

Question

[tokmaganbet1]

Как можно сделать такой серый фон, но при этом чтобы карту можно было использовать?

<section>
        <div class="map">
            <iframe src="https://yandex.ru/map-widget/v1/?um=constructor%3Abb1ea4fad291dee4fd03164165545c1409621f6b10c3b1114043f16395c58cd7&amp;source=constructor" frameborder="0"></iframe>
            <div class="container">
                <div class="map_item">
                    <h5>Головной офис:</h5>
                    <p>г.Москва, ул. ХХХХХХХ, хххХХ, ХЗХХ</p>
                    <p>Тел.: 8(800) ХХХ ХХ ХХ</p>
                    <p>E-Mail: хххххх@xxxxxx.ru</p>
                </div>
            </div>
        </div>
    </section>

Answer 1

[Ankhena]

.map [class*="ymaps-2"][class*="-ground-pane"] {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  /* Firefox 3.5+ */
  -webkit-filter: grayscale(100%);
  /* Chrome 19+ & Safari 6+ */
}

где .map это контейнер, в котором лежит карта

Comments

[tokmaganbet1]

Спасибо!