Как правильно применить селекторы?

Question

[falwxey]

Здравствуйте.
Скажите, почему не применяется фон к остальным табам, только к одной вкладке.


html для меню (одного элемента )

<div class="tab__menu">
<ul class="tabsx" role="tablist">
    <li>
        <input type="radio" name="tabs2" id="tab2" checked />
        <label for="tab2" 
               role="tab" 
               aria-selected="true" 
               aria-controls="panel1" 
               tabindex="0">Солнцезащитные</label>
        <div id="tab-content2" 
             class="tab-content" 
             role="tabpanel" 
             aria-labelledby="description" 
             aria-hidden="false">
             <div class="menu__wrapper">

	<ul class="ul-menu">
	
		<li><a href="/product-category/brendy/alexander-mcqueen/?filter_pol=muzhskoy">Alexander McQueen</a></li>
		<li><a href="/product-category/brendy/balenciaga/?filter_pol=muzhskoy">Balenciaga</a></li>
		<li><a href="/product-category/brendy/bottega-veneta/?filter_pol=muzhskoy">Bottega Veneta</a></li>
		<li><a href="/product-category/brendy/bvlgari/?filter_pol=muzhskoy">Bvlgari</a></li>
		<li><a href="/product-category/brendy/carrera/?filter_pol=muzhskoy">Carrera</a></li>
		<li><a href="/product-category/brendy/dior/?filter_pol=muzhskoy">Cazal</a></li>
		<li><a href="/product-category/brendy/chloe/?filter_pol=muzhskoy">Chloe'</a></li>
		<li><a href="/product-category/brendy/chopard/?filter_pol=muzhskoy">Chopard</a></li>
		?filter_pol=zhensie
	</ul>

	<ul class="ul-menu">
		<li><a href="/product-category/brendy/dior/?filter_pol=muzhskoy">Dior</a></li>
		<li><a href="/product-category/brendy/dolce-gabbana/?filter_pol=muzhskoy">Dolce & Gabbana</a></li>
		<li><a href="/product-category/brendy/dsquared/?filter_pol=muzhskoy">Dsquared</a></li>
		<li><a href="/product-category/brendy/givenchy/?filter_pol=muzhskoy">Givenchy</a></li>
		<li><a href="/product-category/brendy/gucci/?filter_pol=muzhskoy">Gucci</a></li>
		<li><a href="/product-category/brendy/jimmy-choo/?filter_pol=muzhskoy">jimmy Choo</a></li>
		<li><a href="/product-category/brendy/johnson-amp-johnson/?filter_pol=muzhskoy">Johnson&Johnson</a></li>
		<li><a href="/product-category/brendy/love-moschino/?filter_pol=muzhskoy">Love Moschino</a></li>
		
		
	</ul>

	<ul class="ul-menu">
		<li><a href="/product-category/brendy/marc-jacobs/?filter_pol=muzhskoy">Marc Jacobs</a></li>
		<li><a href="/product-category/brendy/max-mara/?filter_pol=muzhskoy">Max Mara</a></li>
		<li><a href="/product-category/brendy/moschino/?filter_pol=muzhskoy">Moschino</a></li>
		<li><a href="/product-category/brendy/polaroid/?filter_pol=muzhskoy">Polaroid</a></li>
		<li><a href="/product-category/brendy/alain-mikli/?filter_pol=muzhskoy">Alain Mikli</a></li>
		<li><a href="/product-category/brendy/ray-ban-brendy/?filter_pol=muzhskoy">Ray-Ban</a></li>
		<li><a href="/product-category/brendy/fendi/?filter_pol=muzhskoy">Fendi</a></li>

	</ul>

	</div>


        </div>
    </li>
  
    <li>
        <input type="radio" name="tabs2" id="tab22" />
        <label for="tab22"
               role="tab" 
               aria-selected="false" 
               aria-controls="panel2" 
               tabindex="0">Очки для зрения</label>
        <div id="tab-content22" 
             class="tab-content"
             role="tabpanel" 
             aria-labelledby="specification" 
             aria-hidden="true">
          <ul class="ul-menu">
	
		<li><a href="/product-category/brendy/gucci/?filter_pol=muzhskoy">Gucci</a></li>
		<li><a href="/product-category/brendy/">jimmy Choo</a></li>
		<li><a href="/product-category/brendy/marc-jacobs/?filter_pol=muzhskoy/">Marc Jacobs</a></li>
		<li><a href="/product-category/brendy/alain-mikli/?filter_pol=muzhskoy">Alain Mikli</a></li>
		<li><a href="/product-category/brendy/?filter_pol=muzhskoy">СМОТРЕТЬ ВСЕ ></a></li>
	</ul>
        </div>
    </li>
</ul>


</div>

+немного css

.tabsx {
  width: 650px;
  float: none;
  list-style: none;
  position: relative;
  margin: 10px 0 0 10px;
  text-align: left;
 	height: 500px; 
}
.tabsx li {
  float: left;
  display: block;
}
.tabsx input[type="radio"] {
  position: absolute;
  top: 0;
  left: -9999px;
}
.tabsx label {
  display: block;
  padding: 14px 21px;
  border-radius: 2px 2px 0 0;
  font-size: 20px;
  font-weight: normal;
  text-transform: uppercase;
  
  cursor: pointer;
  position: relative;
  top: 4px;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.tabsx label:hover {
     background: #ccc;
    color: #fff;
}
.tabsx .tab-content {
  z-index: 2;
  display: none;
  overflow: hidden;
  width: 100%;
  font-size: 17px;
  line-height: 25px;
  padding: 25px;
  position: absolute;
  top: 53px;
  left: 0;
  
}


/* woo */
.tabsx [id^="tab1"]:checked + label {
  top: 0;
  padding-top: 17px;
   background: #000;
    color: #fff;
}
.tabsx [id^="tab1"]:checked ~ [id^="tab-content1"] {
  display: block;
}

/* cHILD */
.tabsx [id^="tab3"]:checked + label {
  top: 0;
  padding-top: 17px;
   background: #000;
    color: #fff;
}
.tabsx [id^="tab3"]:checked ~ [id^="tab-content3"] {
  display: block;
}
/* man */

.tabsx [id^="tab2"]:checked + label {
  top: 0;
  padding-top: 17px;
   background: #000;
    color: #fff;
}
.tabsx [id^="tab2"]:checked ~ [id^="tab-content2"] {
  display: block;
}


ul.sub-menu{
	min-height: 300px;
}

ссылка на сайт panoramaoptica.ru
Как можно сделать, чтобы табы подсвечивались в своих вкладках?