Как скрыть div на мобильных устройствах (см. код)?

Всем доброго вечера/ночи.

Что-то не пойму, как применить @media к этому коду (виджет вордпресса)?

<style type="text/css">

.brighten img {

margin:50px 5px 15px 200px;

-webkit-filter: brightness(100%);

-webkit-transition: all 1s ease;

-moz-transition: all 1s ease;

-o-transition: all 1s ease;

-ms-transition: all 1s ease;

transition: all 1s ease;

}

.brighten img:hover

{

-webkit-filter: brightness(150%);

}

</style>

<div class="brighten">

<a href="http://сайт.ру"><img class="aligncenter size-full wp-image-2520" src="http://сайт.ру/wp-content/uploads/2018/02/sitaty-1.png" alt="" width="598" height="100" /></a>

</div>

Пробовал так в style.css (не работает):

@media screen and (min-width: 1000px) {

#brighten {

visibility: hidden !important;

display: none !important;

}

}