Перекликивание стилей CSS - Вопросы по CSS

nav#mycustomid ul {
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
}

<nav id="test">
  <ul>

    <li><a href="#">&nbsp ВСЕ ГОДА</a>

      <!-- первый уровень выпадающего списка -->
      <ul class="spisok">
        <li><a class="active" href="#">ВСЕ ГОДА</a></li>
        <li><a href="#">&nbsp 2019</a></li>
        <li><a href="#">&nbsp 2018</a></li>
        <li><a href="#">&nbsp 2017</a></li>
        <li><a href="#">&nbsp 2016</a></li>
        <li><a href="#">&nbsp 2015<</a></li>
      </ul>

    </li>

  </ul>
</nav>

nav#myspisok {
  margin: 0px !important;
  padding: 0 !important;
  z-index: 9999; overflow: hidden;
}
/* убираем отступы и поля, а также list-style для "ul", 
			 * и добавляем "position:relative" */
nav#myspisok ul {
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  position: relative !important; z-index: 9999
}
/* применяем inline-block позиционирование к элементам навигации */
nav#myspisok ul li {
  position: relative !important;
  margin: 0px -7px 0 0 !important;
  display: inline-block !important;
  border: 2px solid #2c3e50 !important; z-index: 9999
}
/* стилизуем ссылки */
nav#myspisok a {
  display: block !important;
  padding: 0 10px !important;
  color: #000 !important;
  font-family: webnar, sans-serif !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  line-height: 60px !important;
  text-decoration: none !important; z-index: 9999
}
nav#myspisok ul li .spisok a {
  display: block !important;
  padding: 0 10px !important;
  color: #fff !important;
  font-family: webnar, sans-serif !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  line-height: 60px !important;
  text-decoration: none !important; z-index: 9999
}
nav#myspisok a.active {
  position: relative !important;
  margin: 10px 10px 0px 10px !important;
  width: 112px !important;
  background-color: #009fdf !important; z-index: 9999
}
/* изменяем цвет фона при наведении курсора */
nav#myspisok ul li .spisok a:hover { z-index: 9999;
  color: #f65376 !important;
}
/* скрываем выпадающие списки по умолчанию
			 * и задаем абсолютное позиционирование */
nav#myspisok ul ul { z-index: 9999;
  display: none !important;
  position: absolute !important;
  top: 100%; z-index: 9999
}
/* отображаем выпадающий список при наведении */
nav#myspisok ul li:hover>ul { z-index: 9999;
  display: inherit !important; z-index: 9999
}
/* первый уровень выпадающего списка */
nav#myspisok ul ul li {
  min-width: 160px !important;
  float: none !important;
  display: list-item !important;
  position: relative !important;
  background-color: #2c3e50 !important; z-index: 9999
}
/* измените ' +' на любой другой символ, если нужно*/
li>a: after {
  content: ' ▼' !important; z-index: 9999
}
li>a:only-child: after { 
  content: '' !important; z-index: 9999
}

.art-postcontent ul>li, .art-post ul>li, .art-textblock ul>li {

    overflow-x: visible;    overflow-y: hidden;

.art-postcontent ul>li:before, .art-post ul>li:before, .art-textblock ul>li:before {
    content: url(../images/postbullets.png);
    margin-right: 6px;
    bottom: 2px;
    position: relative;
    /* display: inline-block; */
    vertical-align: middle;
    font-size: 0;
    line-height: 0;
}