.main__menu {
  display: none;
  font-size: .9em;
  line-height: 35px;
}

.main__menu ul ul {
  display: none;
}

.main__menu ul {
  animation: bounceInLeft 1s ease-out;
}


.main__menu ul li {
  position: relative;
}

.main__menu ul a {
  border-bottom: 1px solid #c8c6c6;
  padding: 0 0 0 1em;
  display: block;
  line-height: 65px;
  background: #fff;
  color: #222;
  text-transform: uppercase;
}

@media (max-width:1024px) {

  .main__menu ul .active-trail>ul {
    display: block;
  }

  .main__menu ul a {
    font-size: 100%;
    background-image: linear-gradient(to right, #133a22, #133a22d9 30%, #133a22d6 70%, #133a22);
    background: cadetblue;
    background: rgb(232, 222, 186);
  }
}

.main__menu ul li li a {
  text-transform: none;
}

.main__menu ul a.active {
  font-weight: bold;
  color: #fcedc4;
}

.main__menu ul ul a {
  padding-left: 1.5em;
}

.main__menu ul ul ul a {
  padding-left: 2em;
}

.main__menu ul ul ul ul a {
  padding-left: 3em;
}

.main__menu ul ul ul ul ul a {
  padding-left: 4em;
}

.menu-trigger {
  position: absolute;
  border-left: 1px solid #ddd;
  top: 0;
  right: 0;
  cursor: pointer;
  width: 65px;
  height: 65px;
  line-height: 35px;
  text-align: center;
  background: #133a22;
}

.menu-trigger:after,
.menu-trigger:before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  transform: translateX(-50%) translateY(-50%);
  width: 12px;
  margin-left: -6px;
  height: 1px;
  background: #fff;
  transition: all .3s ease-in-out;
}

.menu-trigger:before {
  opacity: 1;
  transform: rotate(0deg);
}

.menu-trigger:after {
  opacity: 1;
  transform: rotate(90deg);
}

.menu-trigger.active-trigger {
  background: #a72020b3;
  color: #fff;
}

.menu-trigger.active-trigger:after {
  opacity: 0;
  transform: rotate(0deg);
}

.main__menu ul ul ul {
  animation: bounceInLeft 1s ease-out;
}