#menu-horizont { background-color: transparent; line-height: 1; position: relative; width: auto; padding: 0px;  margin: 0; z-index: 2000; }

/* !!!  1 уровень !!! */

#menu-horizont ul,   #menu-horizont-top ul   { list-style: none;  line-height: 1;  padding: 0;  margin: 0; }
#menu-horizont > ul, #menu-horizont-top > ul { position: relative;  display: block;  width: 100%;  z-index: 500;  text-align: center; }
#cssmenu-horizont:after, #menu-horizont > ul:after { content: "."; display: block;  clear: both;  visibility: hidden;  line-height: 0;  height: 0; }
#menu-horizont > ul > #menu-horizont-button { display: none; }
#menu-horizont > ul > li, #menu-horizont-top > ul > li {  display: inline-block;  position: relative;  margin: 0;  padding: 0;  text-align: left; }
#menu-horizont > ul > li.has-sub > a { display: inline-block; padding-right: 40px; }
#menu-horizont > ul > li { margin-right: -4px; }
#menu-horizont ul li a {  font-weight: 800; font-size:14px; display: block;  text-decoration: none; text-transform: normal; } /*uppercase*/
#menu-horizont > ul > li > a { text-transform: uppercase; padding: 20px 15px 16px 15px; color: #FFF; }

#menu-horizont > ul > li:hover > a { color: #fff; background-color: #FFD700;}

/* стрелка */
#menu-horizont > ul > li.has-sub a { padding-left: 20px; }
#menu-horizont > ul > li.has-sub::after { right: 20px;  top: 17px;  font-family: 'FontAwesome';   content: "\f107"; color: #FFFFFF; 
}

/* !!!  2-3 уровень !!! */

#menu-horizont ul ul {
  position: absolute; left: -9999px;  top: 0px;  margin: 0px;  z-index: 1000;
  opacity: 0;  -webkit-transition: opacity .3s ease, top .25s ease;  -moz-transition: opacity .3s ease, top .25s ease;  -ms-transition: opacity .3s ease, top .25s ease;  -o-transition: opacity .3s ease, top .25s ease;  transition: opacity .3s ease, top .25s ease;
  border: 1px solid #f1f1f1;
  border-top: transparent;
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
  background-color: #fff;
  padding-bottom: 15px !important;
  padding-top: 10px !important;
}



#menu-horizont ul ul li { position: relative;}

#menu-horizont > ul > li:hover > ul {    	     top: 49px;    left: auto; opacity: 1;}
#cssmenu-horizont.align-right > ul > li:hover > ul { left: auto;   right: 0;  opacity: 1;}
#menu-horizont ul ul li:hover > ul { 		     left: 300px;  top: 0; opacity: 1; margin-top:0px; }
#menu-horizont ul ul li:last-child:hover > ul {      left: 276px;  top: 0;  opacity: 1; }
#cssmenu-horizont.align-right ul ul li:hover > ul {  right: 280px; left: auto; top: 0;  opacity: 1;  padding-right: 5px; }

#menu-horizont ul ul li a {  -webkit-transition: all .35s ease;  -moz-transition: all .35s ease;  -ms-transition: all .35s ease;  -o-transition: all .35s ease;  transition: all .35s ease;

  font-weight: 400; font-size:14px; line-height: 16px;
  width: 290px;					
  text-transform: none;
  padding: 6px 15px 6px 15px;
  background-color: #fff;
  color: #000;
}

#menu-horizont ul ul li:hover > a { color: #00A74A; }

#menu-horizont li.has-sub::after { display: block; content: ""; position: absolute; width: 0; height: 0; }

#menu-horizont ul ul ul { top: 40px;  padding-left: 15px;  margin: 0px 0 0 -10px;  padding-top: 10px !important; }

/*  стрелка под меню */
#menu-horizont > ul > li > ul::after {  
  content: '';  border: 10px solid transparent;  width: 0;  height: 0;
  position: absolute;  top: -21px;  left: 20px;
  border-bottom-color: transparent; 
}
 /* стрелка в право */
#menu-horizont ul ul li.has-sub::after {             
  border: 4px solid transparent;  right: 10px;  top: 18px;  z-index: 1000; -moz-transition: all .2s ease;  -ms-transition: all .2s ease;  -o-transition: all .2s ease;  transition: all .2s ease;  -webkit-transition: -webkit-transform 0.2s ease, right 0.2s ease;
  border-left-color: #ccc;
}
/* ответная стрелка в лево */
#menu-horizont ul ul li.has-sub:hover::after {
  right: -15px;  -webkit-transform: rotateY(180deg);  -ms-transform: rotateY(180deg);  -moz-transform: rotateY(180deg);  -o-transform: rotateY(180deg);  transform: rotateY(180deg);
  border-left-color: #ccc;
}
#cssmenu-horizont.align-right ul ul li.has-sub:hover::after { border-left-color: transparent;  left: -5px;  -webkit-transform: rotateY(180deg);  -ms-transform: rotateY(180deg);  -moz-transform: rotateY(180deg);  -o-transform: rotateY(180deg);  transform: rotateY(180deg);
  border-right-color: #ffffff;
}
#indicatorContainer {  position: absolute;  height: 12px;  width: 100%;  bottom: 0px;  overflow: hidden;  z-index: -1; }
#pIndicator { position: absolute;  height: 0;  width: 100%;  border: 12px solid transparent;  z-index: -2;  -webkit-transition: left .25s ease;  -moz-transition: left .25s ease;  -ms-transition: left .25s ease;  -o-transition: left .25s ease;  transition: left .25s ease;
  border-top-color: #EEC7D4;
}
#cIndicator { position: absolute;  height: 0;  width: 100%;  border: 12px solid transparent; top: -12px;  right: 100%;  z-index: -2; 
  border-top-color: #2b2f3a;
}


/* active */
#menu-horizont > ul > li.active >    a { color: #FFD700; background-color: #00A74A; }
#menu-horizont > ul ul > li.active > a { color: #FFD700;  }
#menu-horizont > ul > li.active.has-sub::after { color: #fff !important; }
#menu-horizont > ul > li.has-sub > a.taphover:hover::after { color:#424242; }
#menu-horizont > ul > li.has-sub:hover::after {color: #fff; }