.sf-menu {
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative
}

ul.sf-menu li.normal_drop_down ul,
ul.sf-menu li.menu-item-has-children ul {
  margin: 0;
  padding: 0;
  list-style: none
}

.sf-menu li.normal_drop_down,
.sf-menu li.menu-item-has-children {
  position: relative
}

ul.sf-menu li ul {
  position: absolute;
  display: none;
  top: 100%;
  left: 0;
  z-index: 999
}

.sf-menu>li {
  float: left
}

.sf-menu li:hover>ul,
.sf-menu li.sfHover>ul {
  display: block
}

.sf-menu ul ul {
  top: 0;
  left: 100%
}

.sf-menu {
  margin-bottom: 0
}

.sf-menu a {
  display: block;
  position: relative;
  padding: 1.2em 1.6em;
  text-decoration: none;
  zoom: 1;
  color: #fff
}

.sf-menu li {
  -webkit-transition: background .2s;
  transition: background .2s
}

ul.sf-menu li a {
  color: #fff
}

.sf-menu li:hover,
.sf-menu li.sfHover {
  -webkit-transition: none;
  transition: none;
  color: #fff
}

.sf-arrows .sf-with-ul {
  padding-right: 2.5em;
  padding-right: 1em;
}

.sf-arrows .sf-with-ul:after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1em;
  margin-top: -3px;
  height: 0;
  width: 0;
  border: 5px solid transparent;
  border-top-color: #fff;
  border-top-color: rgba(255, 255, 255, 0.5)
}

.sf-arrows>li>.sf-with-ul:focus:after,
.sf-arrows>li:hover>.sf-with-ul:after,
.sf-arrows>.sfHover>.sf-with-ul:after {
  border-top-color: #fff
}

.sf-arrows ul .sf-with-ul:after {
  margin-top: -5px;
  margin-right: -3px;
  border-color: transparent;
  border-left-color: #fff;
  border-left-color: rgba(255, 255, 255, 0.5)
}

.sf-arrows ul li>.sf-with-ul:focus:after,
.sf-arrows ul li:hover>.sf-with-ul:after,
.sf-arrows ul .sfHover>.sf-with-ul:after {
  border-left-color: white
}

.mobnav-subarrow {
  display: none
}

#mobnav-btn {
  display: none;
  z-index: 9999;
  position: absolute;
  width: 30px;
  height: 30px;
  top: 45px;
  right: 5%;
  background-color: transparent;
  -webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  -o-transform: rotate(0);
  transform: rotate(0);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
  cursor: pointer
}

#mobnav-btn span {
  position: absolute;
  top: 0;
  width: 100%;
  display: block;
  height: 4px;
  background: var(--v1);
  opacity: 1;
  -webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  -o-transform: rotate(0);
  transform: rotate(0);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
  border-radius: 12px;
}
#mobnav-btn span:nth-child(1) {
  width: 80%;
}
#mobnav-btn span:nth-child(2),
#mobnav-btn span:nth-child(3) {
  top: 10px
}

#mobnav-btn span:nth-child(4) {
  top: 20px
}

#mobnav-btn.open span:nth-child(1),
#mobnav-btn.open span:nth-child(4) {
  opacity: 0;
  transform: opacity .1s;
  -webkit-transform: .1s;
  -moz-transform: .1s;
  -o-transform: .1s;
  top: 12px;
  width: 0%;
  left: 50%
}

#mobnav-btn.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg)
}

#mobnav-btn.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg)
}

@media (max-width: 991px) {
  #mobnav-btn {
      display: block
  }
  #mobnav-btn.open {
      position: fixed
  }
  .mobnav-subarrow {
      display: block;
      color: #FFF;
      height: 64px;
      width: 100%;
      background-position: top left !important;
      position: absolute;
      top: 0;
      right: 0;
      cursor: pointer;
      -webkit-transition: all .1s ease-in-out;
      -moz-transition: all .1s ease-in-out;
      -ms-transition: all .1s ease-in-out;
      -o-transition: all .1s ease-in-out;
      transition: all .1s ease-in-out
  }
  .sf-menu {
      width: 100% !important;
      display: none
  }
  .sf-menu.xactive {
      display: block !important
  }
  .sf-menu li {
      float: none !important;
      display: block !important;
      width: 100% !important
  }
  .sf-menu li a {
      float: none !important
  }
  .sf-menu ul {
      position: static !important;
      display: none !important
  }
  .xpopdrop ul {
      display: block !important
  }
  .xpopdrop>ul {
      display: block !important
  }
}