.ddsmoothmenu {
  /*background of menu bar (default state)*/
  width: 100%;
  display: none;
}

.ddsmoothmenu ul {
  width: 100%;
  z-index: 100;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.ddsmoothmenu > ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
}

/*Top level list items*/
.ddsmoothmenu ul li {
  position: relative;
  display: inline-block;
  /* float: left; */
}

/*Top level menu link items style*/
.ddsmoothmenu ul li a {
  cursor: pointer;
  display: block;
  font-weight: 500;
  text-transform:uppercase;
  /*background of menu items (default state)*/
  color: #000000;
  padding: 19px 4px;
  text-decoration: none;
  /* letter-spacing: .050rem; */
  /* font-size: 110%; */
  font-size:13px;
}

.ddsmoothmenu ul li a .selected {
  /*CSS class that's dynamically added to the currently active menu items' LI A element*/
  color: #6ab43e;
}

.ddsmoothmenu ul li a:hover {
  /*background of menu items during onmouseover (hover state)*/
  color: #6ab43e;
}

/* sub menus */
.ddsmoothmenu ul li ul {
  width: 300px !important;
  position: absolute;
  display: none;
  /*collapse all sub menus to begin with*/
  visibility: visible;
  -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
          box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
  background: #fff;
}

.ddsmoothmenu ul li ul li {
  display: list-item;
  float: none;
  padding: 0 10px;
}

.ddsmoothmenu ul li ul li ul {
  top: 0;
}

.ddsmoothmenu ul li ul li a {
  min-width: 160px;
  /*width of sub menus*/
  padding: 10px;
  border-top-width: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

/* Holly Hack for IE \*/
* html .ddsmoothmenu {
  height: 1%;
}

/*Holly Hack for IE7 and below*/
/* ######### CSS classes applied to down and right arrow images  ######### */
.downarrowclass {
  position: absolute;
  top: 12px;
  right: 7px;
}

.rightarrowclass {
  position: absolute;
  top: 6px;
  right: 5px;
}

.leftarrowclass {
  margin-right: 5px;
}

/* ######### CSS for shadow added to sub menus  ######### */
.ddshadow {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  background-color: #ccc;
  /* generally should be just a little lighter than the box-shadow color for CSS3 capable browsers */
}

.toplevelshadow {
  margin: 5px 0 0 5px;
  /* in NON CSS3 capable browsers gives the offset of the shadow */
  opacity: 0.8;
  /* shadow opacity mostly for NON CSS3 capable browsers. Doesn't work in IE */
}

.ddcss3support .ddshadow.toplevelshadow {
  margin: 0;
  /* in CSS3 capable browsers overrides offset from NON CSS3 capable browsers, allowing the box-shadow values in the next selector to govern that */
  /* opacity: 1; */
  /* optionally uncomment this to remove partial opacity for browsers supporting a box-shadow property which has its own slight gradient opacity */
}

.ddcss3support .ddshadow {
  background-color: transparent;
  -webkit-box-shadow: 5px 5px 5px #aaa;
          box-shadow: 5px 5px 5px #aaa;
}

/* ######### Mobile menu container CSS ######### */
div.ddsmoothmobile::before {
  position: fixed;
  content: "";
  background: #6ab43e;
  width: 250px;
  height: 100%;
  opacity: 0.5;
}

div.ddsmoothmobile {
  /* main mobile menu container */
  background: #fff;
  color: #000;
  position: fixed;
  top: 0;
  left: 0;
  width: 300px;
  /* width of mobile menu */
  height: 100%;
  overflow: hidden;
  visibility: hidden;
  border-radius: 0;
  -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.4);
          box-shadow: 0 5px 5px rgba(0, 0, 0, 0.4);
}

div.ddsmoothmobile a {
  color: #000;
  text-decoration: none;
  /*  font-weight: 400; */
}

div.ddsmoothmobile div.topulsdiv {
  /* Single DIV that surrounds all top level ULs before being flattened, or the ULs on the "frontpage" of the menu */
  position: relative;
  background: #fff;
  overflow-y: auto;
  width: 100%;
  height: 100%;
}

div.ddsmoothmobile ul {
  /* style for all ULs in general inside mobile menu */
  list-style: none;
  width: 100%;
  top: 0;
  left: 0;
  background: #fff;
  margin: 0;
  padding: 0;
}

/*
div.ddsmoothmobile div.topulsdiv ul.submenu {
     top level ULs style
}
*/
div.ddsmoothmobile ul.submenu {
  /* sub level ULs style */
  position: absolute;
  height: 100%;
  overflow-y: auto;
}

div.ddsmoothmobile ul li {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  position: relative;
  /* font-weight: bold; */
}

div.ddsmoothmobile ul li.breadcrumb {
  /* breadcrumb LI that's added to the top of every sub level UL */
  cursor: pointer;
  padding: 13px 25px;
  background: #6ab43e;
  border-radius: 0 !important;
  position: relative;
  color: #fff;
}

div.ddsmoothmobile ul li.breadcrumb::before {
  background: url(https://img.icons8.com/ios/50/ffffff/back--v1.png) center center no-repeat !important;
}

div.ddsmoothmobile ul li.breadcrumb::before,
div.ddsmoothmobile li a .arrow-img-box:before {
  position: absolute;
  content: "";
  background: url(https://img.icons8.com/ios/50/000000/back--v1.png) center center no-repeat;
  width: 31px;
  height: 100%;
  left: 0;
  top: 0;
  background-size: 56% !important;
}

div.ddsmoothmobile li a .arrow-img-box:before {
  left: auto !important;
  right: 0;
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

div.ddsmoothmobile ul li a {
  display: block;
  padding: 13px 25px;
  color: #000000;
}

div.ddsmoothmobile ul li a:hover {
  background: #6ab43e;
  color: #fff;
}

/* ############# Animated Drawer icon (mobile menu toggler) CSS ############# */
/* ############# Animated Drawer icon (mobile menu toggler) CSS ############# */
.animateddrawer {
  font-size: 10px;
  /* Base font size. Adjust this value to modify size of drawer icon */
  width: 3em;
  height: 2.2em;
  outline: none;
  position: relative;
  /* BY default, make toggler fixed on screen */
  display: none;
  top: auto;
  /* Position at upper right corner */
  right: 0px;
  background: transparent;
  z-index: 1000;
}

.animateddrawer:before,
.animateddrawer:after {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  height: 0.1em;
  /* height of top and bottom drawer line */
  background: #060303;
  border-radius: 2px;
  top: 0;
  left: 0;
  opacity: 1;
  -webkit-transition: all 0.3s ease-in;
  /* set transition type and time */
  transition: all 0.3s ease-in;
}

.animateddrawer:after {
  top: auto;
  bottom: 0;
}

.animateddrawer span {
  width: 100%;
  height: 0.1em;
  /* height of middle drawer line */
  background: #060303;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -0.1em;
  /* set this to - half of middle drawer line height */
  border-radius: 2px;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transition: all 0.3s ease-in 0.3s;
  /* set transition type and time */
  transition: all 0.3s ease-in 0.3s;
}

.animateddrawer span::after {
  content: "";
  display: block;
  width: 100%;
  height: 0.1em;
  /* height of middle drawer line */
  background: #060303;
  border-radius: 2px;
  position: absolute;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transition: all 0.3s ease-in 0.3s;
  /* set transition type and time */
  transition: all 0.3s ease-in 0.3s;
}

/*
.animateddrawer.open {}
 */
.animateddrawer.open:before {
  /* style when .open class is added to button */
  top: 50%;
  margin-top: -0.3em;
  /* set this to - half of top drawer line height */
  opacity: 0;
}

.animateddrawer.open:after {
  /* style when .open class is added to button */
  bottom: 50%;
  opacity: 0;
}

.animateddrawer.open span {
  /* style when .open class is added to button */
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.animateddrawer.open span:after {
  /* style when .open class is added to button */
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
/*# sourceMappingURL=ddsmoothmenu.css.map */