.nav {
  margin-bottom: 0;
  padding-left: 0;
  list-style: none;
}

.nav > li {
  position: relative;
  display: block;
}

.nav > li > a {
  position: relative;
  display: block;
}

.nav > li > a:hover, .nav > li > a:focus {
  text-decoration: none;
}

.nav > li.disabled > a {
  color: #888;
}

.nav > li.disabled > a:hover, .nav > li.disabled > a:focus {
  color: #888;
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
}

.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav > li > a > img {
  max-width: none;
}

/** nav1 */

.nav1 {
  padding-left: 0;
  list-style: none;
}

.nav1 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 25%;
  text-align: center;
}

.nav1 > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
}

.nav1 > li.active {
  background: #014f25;
  color: #fff;
}

.nav1 > li > a:hover, .nav1 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav1 > li > a:active {
  background: #adaa96;
}

.nav1 > li.disabled > a {
  color: #888;
}

.nav1 > li.disabled > a:hover, .nav1 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav1 .open > a, .nav1 .open > a:hover, .nav1 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav1 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav1 > li > a > img {
  max-width: none;
}

/** nav11 */

.nav11 {
  padding-left: 0;
  list-style: none;
}

.nav11 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 25%;
  text-align: center;
  border-right: 1px solid #f9f9f9;
  border-top: 1px solid #f9f9f9;
}

.nav11 > li > a {
  position: relative;
  display: block;
  padding: 8px 12px;
  text-decoration: none;
}

.nav11 > li.active {
  background: #014f25;
  border-right: 1px solid #f9f9f9;
  border-top: 1px solid #f9f9f9;
  color: #fff;
}

.nav11 > li.activeall {
  background: #014f25;
}

.nav11 > li > a:hover, .nav11 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav11 > li > a:active {
  background: #008641;
}

.nav11 > li.disabled > a {
  color: #888;
}

.nav11 > li.disabled > a:hover, .nav11 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav11 .open > a, .nav11 .open > a:hover, .nav11 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav11 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav11 > li > a > img {
  max-width: none;
}

/** nav2 */

.nav2 {
  margin-bottom: 0;
  padding-left: 0;
  list-style: none;
}

.nav2 > li {
  position: relative;
  display: block;
  background: #e8e8de;
  margin: 0 2px 2px 0;
}

.nav2 > li > a {
  position: relative;
  display: block;
  padding: 8px;
}

.nav2 > li > a:hover, .nav2 > li > a:focus {
  text-decoration: none;
  color: #008641;
  background: #dedede;
}

.nav2 > li > a:active {
  background: #dedede;
}

.nav2 > li.disabled > a {
  color: #888;
}

.nav2 > li.disabled > a:hover, .nav2 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: #008641;
}

.nav2 .open > a, .nav2 .open > a:hover, .nav2 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav2 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav2 > li > a > img {
  max-width: none;
}

.nav2 {
  margin-bottom: 0;
  padding-left: 0;
  list-style: none;
}

.nav2 > li {
  position: relative;
  display: block;
  background: #e8e8de;
  margin: 0 2px 2px 0;
}

.nav2 > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
}

.nav2 > li > a:hover, .nav2 > li > a:focus {
  text-decoration: none;
  color: #008641;
  background: #dedede;
}

.nav2 > li > a:active {
  background: #dedede;
}

.nav2 > li.disabled > a {
  color: #888;
}

.nav2 > li.disabled > a:hover, .nav2 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: #008641;
}

.nav2 .open > a, .nav2 .open > a:hover, .nav2 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav2 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav2 > li > a > img {
  max-width: none;
}

/** nav3 */

.nav3 {
  margin-bottom: 44px;
  padding-left: 0;
  list-style: none;
}

.nav3 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 234px;
  text-align: center;
  
 
}

.nav3 > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
}

.nav3 > li.active {
  background: #014f25;
}

.nav3 > li > a:hover, .nav3 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav3 > li > a:active {
  background: #adaa96;
}

.nav3 > li.disabled > a {
  color: #888;
}

.nav3 > li.disabled > a:hover, .nav3 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav3 .open > a, .nav3 .open > a:hover, .nav3 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav3 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav3 > li > a > img {
  max-width: none;
}

/** nav4 */

.nav4 {
  float: left;
}

.nav4 > li {
  font-family: 'K2D';
  font-size: 13px;
  display: inline-block;
  margin-bottom: 6px;
  color: #666;
}

.nav4 > li > a {
  display: block;
  position: relative;
  padding: 6px;
  background: #d7d7d7;
  text-decoration: none;
}

.nav4 > li.active {
  background: #014f25;
}

.nav4 > li > a:hover, .nav4 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav4 > li > a:active {
  background: #adaa96;
}

.nav4 > li.disabled > a {
  color: #888;
}

.nav4 > li.disabled > a:hover, .nav4 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav4 .open > a, .nav4 .open > a:hover, .nav4 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav4 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav4 > li > a > img {
  max-width: none;
}

/** nav5 */

.nav5 {
  padding-left: 0;
  list-style: none;
}

.nav5 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  text-align: center;
  border-right: 1px solid #f9f9f9;
  border-bottom: 1px solid #f9f9f9;
}

.nav5 > li > a {
  position: relative;
  display: block;
  padding: 8px 12px;
  text-decoration: none;
}

.nav5 > li.active {
  background: #014f25;
  border-right: 1px solid #f9f9f9;
  border-bottom: 1px solid #f9f9f9;
}

.nav5 > li > a:hover, .nav5 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav5 > li > a:active {
  background: #adaa96;
}

.nav5 > li.disabled > a {
  color: #888;
}

.nav5 > li.disabled > a:hover, .nav5 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav5 .open > a, .nav5 .open > a:hover, .nav5 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav5 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav5 > li > a > img {
  max-width: none;
}

/** nav56 */

.nav56 {
  padding-left: 0;
  list-style: none;
}

.nav56 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  text-align: center;
  border-right: 1px solid #f9f9f9;
  border-top: 1px solid #f9f9f9;
  width: 25%;
}

.nav56 > li > a {
  position: relative;
  display: block;
  padding: 8px 12px;
}

.nav56 > li.active {
  background: #014f25;
  border-right: 1px solid #f9f9f9;
  border-top: 1px solid #f9f9f9;
  color: #fff;
}

.nav56 > li.activeall {
  background: #014f25;
}

.nav56 > li > a:hover, .nav56 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav56 > li > a:active {
  background: #008641;
}

.nav56 > li.disabled > a {
  color: #888;
}

.nav56 > li.disabled > a:hover, .nav56 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav56 .open > a, .nav56 .open > a:hover, .nav56 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav56 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav56 > li > a > img {
  max-width: none;
}

/** nav6 */

.nav6 {
  padding-left: 0;
  list-style: none;
}

.nav6 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  text-align: center;
  border-right: 1px solid #f9f9f9;
  border-top: 1px solid #f9f9f9;
}

.nav6 > li > a {
  position: relative;
  display: block;
  padding: 8px 12px;
  text-decoration: none;
}

.nav6 > li.active {
  color: #fff;
  background: #008641;
  border-right: 1px solid #f9f9f9;
  border-top: 1px solid #f9f9f9;
}

.nav6 > li.activeall {
  background: #014f25;
}

.nav6 > li > a:hover, .nav6 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav6 > li > a:active {
  background: #adaa96;
}

.nav6 > li.disabled > a {
  color: #888;
}

.nav6 > li.disabled > a:hover, .nav6 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav6 .open > a, .nav6 .open > a:hover, .nav6 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav6 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav6 > li > a > img {
  max-width: none;
}

/** nav61 */

.nav61 {
  padding-left: 0;
  list-style: none;
}

.nav61 > li {
  position: relative;
  display: block;
  float: left;
  text-align: center;
}

.nav61 > li > a {
  position: relative;
  display: block;
  padding: 8px 12px;
  
}

.nav61 > li.active {
  background: #014f25;
  
}

.nav61 > li.active > a {
  color: #fff;
}

.nav61 > li.activeall {
  background: #014f25;
}

.nav61 > li > a:hover, .nav61 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
  
}

.nav61 > li > a:active {
  background: #adaa96;
}

.nav61 > li.disabled > a {
  color: #888;
}

.nav61 > li.disabled > a:hover, .nav61 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav61 .open > a, .nav61 .open > a:hover, .nav61 .open > a:focus {
  background-color: #fff;
  border-color: #008641; /*#747474;*/
}

.nav61 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav61 > li > a > img {
  max-width: none;
}

/** nav7 */

.nav7 {
  padding-left: 0;
  list-style: none;
}

.nav7 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  text-align: center;
  border-bottom: 1px solid #f9f9f9;
  width: 250px;
}

.nav7 > li > a {
  position: relative;
  display: block;
  padding: 8px 12px;
  text-decoration: none;
}

.nav7 > li.active {
  background: #014f25;
}

.nav7 > li > a:hover, .nav7 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav7 > li > a:active {
  background: #adaa96;
}

.nav7 > li.disabled > a {
  color: #888;
}

.nav7 > li.disabled > a:hover, .nav7 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav7 .open > a, .nav7 .open > a:hover, .nav7 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav7 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav7 > li > a > img {
  max-width: none;
}

/** nav8 */

.nav8 {
  list-style: none;
  display: inline-block;
  margin-bottom: 10px;
  width: 100%;
}

.nav8 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 25%;
  text-align: center;
  
 
}

.nav8 > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
}

.nav8 > li.active {
  background: #014f25;
  color: #fff;
}

.nav8 > li > a:hover, .nav8 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav8 > li > a:active {
  background: #008641;
}

.nav8 > li.disabled > a {
  color: #888;
}

.nav8 > li.disabled > a:hover, .nav8 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav8 .open > a, .nav8 .open > a:hover, .nav8 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav8 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav8 > li > a > img {
  max-width: none;
}

/** nav8v */

.nav8v {
  list-style: none;
  width: 100%;
}

.nav8v > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 50%;
  text-align: center;
}

.nav8v > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
  color: #474747;
}

.nav8v > li.active {
  background: #014f25;
  color: #fff;
}

.nav8v > li.active > a {
  color: #fff;
}

.nav8v > li > a:hover, .nav8v > li > a:focus {
  text-decoration: none;
  background: #014f25;
  color: #fff;
}

.nav8v > li > a:active {
  background: #008641;
}

.nav8v > li.disabled > a {
  color: #888;
}

.nav8v > li.disabled > a:hover, .nav8v > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav8v .open > a, .nav8v .open > a:hover, .nav8v .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav8v .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav8v > li > a > img {
  max-width: none;
}


/** nav8w */

.nav8w {
  list-style: none;
  width: 100%;
}

.nav8w > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 33.33%;
  text-align: center;
}

.nav8w > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
  color: #474747;
}

.nav8w > li.active {
  background: #014f25;
  color: #fff;
}

.nav8w > li.active > a {
  color: #fff;
}

.nav8w > li > a:hover, .nav8w > li > a:focus {
  text-decoration: none;
  background: #014f25;
  color: #fff;
}

.nav8w > li > a:active {
  background: #008641;
}

.nav8w > li.disabled > a {
  color: #888;
}

.nav8w > li.disabled > a:hover, .nav8w > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav8w .open > a, .nav8w .open > a:hover, .nav8w .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav8w .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav8w > li > a > img {
  max-width: none;
}

/** nav8x */

.nav8x {
  list-style: none;
  width: 100%;
}

.nav8x > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 25%;
  text-align: center;
}

.nav8x > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
}

@media (min-width: 768px) and (max-width: 1023.99px) {

}

@media (max-width: 1499.99px) {
  .nav8x > li {
    width: 33.33%;
    font-size: 1.25rem;
  }
}

.nav8x > li.active {
  background: #014f25;
  color: #fff;
}

.nav8x > li > a:hover, .nav8x > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav8x > li > a:active {
  background: #008641;
}

.nav8x > li.disabled > a {
  color: #888;
}

.nav8x > li.disabled > a:hover, .nav8x > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav8x .open > a, .nav8x .open > a:hover, .nav8x .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav8x .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav8x > li > a > img {
  max-width: none;
}

/** nav8y */

.nav8y {
  list-style: none;
  width: 100%;
}

.nav8y > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 20%;
  text-align: center;
}

.nav8y > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
}

.nav8y > li.active {
  background: #014f25;
  color: #fff;
}

.nav8y > li > a:hover, .nav8y > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav8y > li > a:active {
  background: #008641;
}

.nav8y > li.disabled > a {
  color: #888;
}

.nav8y > li.disabled > a:hover, .nav8y > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav8y .open > a, .nav8y .open > a:hover, .nav8y .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav8y .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav8y > li > a > img {
  max-width: none;
}

/** nav8z */

.nav8z {
  list-style: none;
  width: 100%;
}

.nav8z > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 16.66%;
  text-align: center;
}

.nav8z > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
}

.nav8z > li.active {
  background: #014f25;
  color: #fff;
}

.nav8z > li > a:hover, .nav8z > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.nav8z > li > a:active {
  background: #008641;
}

.nav8z > li.disabled > a {
  color: #888;
}

.nav8z > li.disabled > a:hover, .nav8z > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav8z .open > a, .nav8z .open > a:hover, .nav8z .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav8z .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav8z > li > a > img {
  max-width: none;
}

/** nav9 */

.nav9 {
  list-style: none;
  display: inline-block;
  margin-bottom: 10px;
  width: 100%;
}

.nav9 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  text-align: center;
}

.nav9 > li > a {
  position: relative;
  display: block;
  text-decoration: none;
  padding: 18px;
}

.nav9 > li.active {
  background: #014f25;
  color: #fff;
}

.nav9 > li > a:hover, .nav9 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
  padding: 18px;
}

.nav9 > li > a:active {
  background: #008641;
}

.nav9 > li.disabled > a {
  color: #888;
}

.nav9 > li.disabled > a:hover, .nav9 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav9 .open > a, .nav9 .open > a:hover, .nav9 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav9 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav9 > li > a > img {
  max-width: none;
}

/** nav9x */

.nav9x {
  padding-left: 0;
  list-style: none;
}

.nav9x > li {
  position: relative;
  display: block;
  width: 25%;
  background: #d7d7d7;
  float: left;
  text-align: center;
}

.nav9x > li > a {
  position: relative;
  display: block;
  padding: 18px;
  text-decoration: none;
}

.nav9x > li.active {
  background: #00a5a5;
  color: #fff;
}

.nav9x > li > a:hover, .nav9x > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #00a5a5;
  padding: 18px;
  color: #fff;
}

.nav9x > li > a:active {
  background: #00a5a5;
}

.nav9x > li.disabled > a {
  color: #888;
}

.nav9x > li.disabled > a:hover, .nav9x > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.nav9x .open > a, .nav9x .open > a:hover, .nav9x .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.nav9x .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.nav9x > li > a > img {
  max-width: none;
}

/** navgreen6 */

.navgreen6 {
  list-style: none;
  width: 100%;
}

.navgreen6 > li {
  position: relative;
  display: block;
  background: #d7d7d7;
  float: left;
  width: 16.66%;
  text-align: center;
}

.navgreen6 > li > a {
  position: relative;
  display: block;
  padding: 8px;
  text-decoration: none;
}

.navgreen6 > li.active {
  background: #014f25;
  color: #fff;
}

.navgreen6 > li > a:hover, .navgreen6 > li > a:focus {
  text-decoration: none;
  color: #fff;
  background: #014f25;
}

.navgreen6 > li > a:active {
  background: #008641;
}

.navgreen6 > li.disabled > a {
  color: #888;
}

.navgreen6 > li.disabled > a:hover, .navgreen6 > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
  color: inherit;
}

.navgreen6 .open > a, .navgreen6 .open > a:hover, .navgreen6 .open > a:focus {
  background-color: #fff;
  border-color: #747474;
}

.navgreen6 .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #d7d7d7;
}

.navgreen6 > li > a > img {
  max-width: 80px;
}


@media (min-width: 389px) and (max-width: 767.99px) {
  .nav1 > li,
  .nav11 > li,
  .nav2 > li,
  .nav3 > li,
  .nav4 > li,
  .nav5 > li,
  .nav56 > li,
  .nav6 > li,
  .nav61 > li,
  .nav7 > li,
  .nav8 > li,
  .nav8v > li,
  .nav8w > li,
  .nav8x > li,
  .nav8y > li,
  .nav8z > li,
  .nav9 > li,
  .nav9x > li,
  .navgreen6 > li 
  {
    width: 50%;
    font-size: 1.15rem;
  }
}

@media (max-width: 388.99px) {
  .nav1 > li,
  .nav11 > li,
  .nav2 > li,
  .nav3 > li,
  .nav4 > li,
  .nav5 > li,
  .nav56 > li,
  .nav6 > li,
  .nav61 > li,
  .nav7 > li,
  .nav8 > li,
  .nav8v > li,
  .nav8w > li,
  .nav8x > li,
  .nav8y > li,
  .nav8z > li,
  .nav9 > li,
  .nav9x > li, 
  .navgreen6 > li 
  {
    width: 100%;
    font-size: 1.15rem;
  }
}




/** nav home*/

#nav33AreasTree {
  list-style-image: url(//www.hrdi.or.th/public/images/Areas/33AreasTreeSM.png);
}

#nav33AreasTree > li {
  margin: 10px 0 15px 36px;
}

#nav33AreasTree > li > a {
  display: block;
  padding: 0;
  margin-bottom: 5px;
}

#nav33AreasTree > li > a:hover, #nav33AreasTree > li > a:focus {
  background-color: #f1eedb;
}

#nav11AreasTree {
  list-style-image: url(//www.hrdi.or.th/public/images/Areas/11AreasTreeSM.png);
}

#nav11AreasTree > li {
  margin: 10px 0 15px 28px;
}

#nav11AreasTree > li > a {
  display: block;
  padding: 0 0 0 8px;
  margin-bottom: 5px;
}

#nav11AreasTree > li > a:hover, #nav11AreasTree > li > a:focus {
  background-color: #f1eedb;
}

.navhome {
  list-style: none;
}

.navhome > li {
  display: block;
}

.navhome > li:before {
  content: '\f04b';
  font-family: 'FontAwesome';
  padding: 8px 10px 0 5px;
  float: left;
}

.navhome > li > a {
  display: block;
  padding: 8px 0 8px 30px;
  margin-bottom: 5px;
}

.navhome > li > a:hover, .navhome > li > a:focus {
  background-color: #f1eedb;
}

.navweblink {
  list-style: none;
}

.navweblink > li {
  display: block;
  border-bottom: 1px #ccc solid;
}

.navweblink > li:before {
  content: '\f04b';
  font-family: 'FontAwesome';
  padding: 8px 10px 0 5px;
  float: left;
}

.navweblink > li > a {
  display: block;
  padding: 8px 0 8px 50px;
  margin-bottom: 5px;
}

.navweblink > li > a:hover, .navweblink > li > a:focus {
  background-color: #f1eedb;
}

.navarrow {
  list-style: none;
}

.navarrow > li {
  display: block;
  border-bottom: 1px #ccc solid;
}

.navarrow > li:before {
  content: '\f04b';
  font-family: 'FontAwesome';
  padding: 8px 10px 0 5px;
  float: left;
}

.navarrow > li > p {
  display: block;
  padding: 8px 0 8px 50px;
  margin-bottom: 5px;
}

.navarrow > li > p:hover, .navarrow > li > p:focus {
  background-color: #f1eedb;
}

.navhomepdf {
  list-style: none;
}

.navhomepdf > li {
  display: block;
}

.navhomepdf > li:before {
  content: '\f1c1';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  font-weight: 400;
  color: #cc0000;
  padding: 8px 10px 0 5px;
  float: left;
}

.navhomepdf > li > a {
  display: block;
  padding: 8px 0 8px 30px;
  margin-bottom: 5px;
}

.navhomepdf > li > a:hover, .navhomepdf > li > a:focus {
  background-color: #f1eedb;
}

.navhomemap {
  list-style: none;
}

.navhomemap > li {
  display: block;
}

.navhomemap > li:before {
  content: '\f5a0';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  padding: 8px 10px 0 5px;
  float: left;
}

.navhomemap > li > a {
  display: block;
  padding: 8px 0 8px 30px;
  margin-bottom: 5px;
}

.navhomemap > li > a:hover, .navhomemap > li > a:focus {
  background-color: #f1eedb;
}

.navhomedoc {
  list-style: none;
}

.navhomedoc > li {
  display: block;
}

.navhomedoc > li:before {
  content: '\f15c';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  padding: 8px 10px 0 5px;
  float: left;
}

.navhomedoc > li > a {
  display: block;
  padding: 8px 0 8px 30px;
  margin-bottom: 5px;
}

.navhomedoc > li > a:hover, .navhomedoc > li > a:focus {
  background-color: #008641;
  color: #fff;
}


.navhomeexpert {
  list-style: none;
}

.navhomeexpert > li {
  display: block;
}

.navhomeexpert > li:before {
  content: '\f507';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  padding: 8px 10px 0 5px;
  float: left;
}

.navhomeexpert > li > a {
  display: block;
  padding: 8px 0 8px 30px;
  margin-bottom: 5px;
}

.navhomeexpert > li > a:hover, .navhomeexpert > li > a:focus {
  background-color: #008641;
  color: #fff;
}

.navvideo {
  list-style: none;
}

.navvideo > li {
  display: block;
}

.navvideo > li:before {
  content: '\f1c8';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  padding: 8px 10px 0 5px;
  float: left;
}

.navvideo > li > a {
  display: block;
  padding: 8px 0 8px 30px;
  margin-bottom: 5px;
}

.navvideo > li > a:hover, .navvideo > li > a:focus {
  background-color: #008641;
  color: #fff;
}

.navdownload {
  list-style: none;
}

.navdownload > li {
  display: block;
  line-height: 0.85em;
  text-align: left;
}

.navdownload > li:before {
  content: '\f019';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  padding: 8px 10px 0 5px;
  float: left;
}

.navdownload > li > a {
  display: flex;
  padding: 8px 0 8px 4px;
}

.navdownload > li > a:hover, .navdownload > li > a:focus {
  background-color: #008641;
  color: #fff;
}

.navmail {
  list-style: none;
}

.navmail > li {
  display: block;
  line-height: 0.85em;
  text-align: left;
}

.navmail > li:before {
  content: '\f0e0';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  padding: 8px 10px 0 5px;
  float: left;
}

.navmail > li > a {
  display: flex;
  padding: 8px 0 8px 4px;
}

.navmail > li > a:hover, .navmail > li > a:focus {
  background-color: #008641;
  color: #fff;
}

.navextlink {
  list-style: none;
}

.navextlink > li {
  display: block;
  border-bottom: 1px #ccc solid;
}

.navextlink > li:before {
  content: '\f35d';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  padding: 16px 10px 0 5px;
  float: left;
}

.navextlink > li > a {
  display: block;
  padding: 18px 0 18px 38px;
}

.navextlink > li > a:hover, .navextlink > li > a:focus {
  background-color: #f1eedb;
}

.navfileunderline {
  list-style: none;
}

.navfileunderline > li {
  display: block;
  border-bottom: 1px #ccc solid;
  text-decoration: underline;
}

.navfileunderline > li:before {
  content: '\f15c';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  padding: 16px 10px 0 5px;
  float: left;
  color: #693db8;
}

.navfileunderline > li > a {
  display: block;
  padding: 18px 0 18px 38px;
}

.navfileunderline > li > a:hover, .navfileunderline > li > a:focus {
  background-color: #f1eedb;
  color: #693db8;
}

.navpdf {
  list-style: none;
}

.navpdf > li {
  display: block;
  border-bottom: 1px #ccc solid;
}

.navpdf > li:before , .navpdf > li.navpdf:before {
  content: '\f1c1';
  font-size: 1.5em;
  font-family: 'FontAwesome';
  font-weight: 400;
  color: #cc0000;
  padding: 16px 10px 0 5px;
  float: left;
}

.navpdf > li > a {
  display: block;
  padding: 18px 0 18px 38px;
  text-align: left;
}

.navpdf > li > a:hover, .navpdf > li > a:focus {
  background-color: #f1eedb;
}

.navdoc {
  list-style: none;
}

.navdoc > li {
  display: block;
  border-bottom: 1px #ccc solid;
}

.navdoc > li:before , .navdoc > li.navdoc:before {
  content: '\f1c2';
  font-size: 1.5em;
  font-family: 'FontAwesome';
  font-weight: 400;
  color: #cc0000;
  padding: 16px 10px 0 5px;
  float: left;
}

.navdoc > li > a {
  display: block;
  padding: 18px 0 18px 38px;
  text-align: left;
}

.navdoc > li > a:hover, .navdoc > li > a:focus {
  background-color: #f1eedb;
}

.navxls {
  list-style: none;
}

.navxls > li {
  display: block;
  border-bottom: 1px #ccc solid;
}

.navxls > li:before , .navxls > li.navxls:before {
  content: '\f1c3';
  font-size: 1.5em;
  font-family: 'FontAwesome';
  font-weight: 400;
  color: #cc0000;
  padding: 16px 10px 0 5px;
  float: left;
}

.navxls > li > a {
  display: block;
  padding: 18px 0 18px 38px;
  text-align: left;
}

.navxls > li > a:hover, .navxls > li > a:focus {
  background-color: #f1eedb;
}


.navarrow2 {
  list-style: none;
}

.navarrow2 > li {
  display: block;
  border-bottom: 1px #ccc solid;
}

.navarrow2 > li:before {
  content: '\f04b';
  font-size: 1.25em;
  font-family: 'FontAwesome';
  font-weight: 400;
  color: #cc0000;
  padding: 16px 10px 0 5px;
  float: left;
}

.navarrow2 > li > a {
  display: block;
  padding: 18px 0 18px 38px;
}

.navarrow2 > li > a:hover, .navarrow2 > li > a:focus {
  background-color: #f1eedb;
}

/** START navicon */

.navicon {
  list-style: none;
  display: flex;
}

.navicon > li {
  margin-right: 10px;
  width: 50px;
  text-align: center;
}

.navicon > li > a > em.fa-facebook {
  padding: 12px 13px;
  background-color: #3b5998 !important;
  color: white;
  border-radius: 50%;
}

.navicon > li > a > em.fa-line {
  padding: 12px;
  background-color: #08b53b !important;
  color: white;
  border-radius: 50%;
}

.navicon > li > a > em.fa-youtube {
  padding: 12px 10px;
  background-color: #ff0000 !important;
  color: white;
  border-radius: 50%;
}

.navicon > li > a > em.fa-soundcloud {
  padding: 12px 8px;
  background-color: #ff5500 !important;
  color: white;
  border-radius: 50%;
}

.navicon > li > a > em.fa-mail-bulk {
  padding: 12px 10px;
  background-color: #2f90c4 !important;
  color: white;
  border-radius: 50%;
}

.navicon > li > a > em.fa-globe {
  padding: 12px;
  background-color: #00652d !important;
  color: white;
  border-radius: 50%;
}

.navicon > li > a > em.fa-tiktok {
  padding: 12px;
  background-color: #000 !important;
  color: white;
  border-radius: 50%;
}

.navicon > li > a > em.fa-instagram {
  padding: 12px;
  background-color: #fe2c55 !important;
  color: white;
  border-radius: 50%;
}

.navicon > li > a > em.fa-twitter {
  padding: 12px;
  background-color: #1d9bf0 !important;
  color: white;
  border-radius: 50%;
}

/** END navicon */

.nav-tabs {
  border-bottom: 1px solid #008641;
  margin-bottom: 10px;
}

.nav-tabs > li {
  float: left;
  margin-bottom: -1px;
}

.nav-tabs > li > a {/**margin-right: 2px;*/
  line-height: 1.2em;
  border-left: 3px solid #f2f2f2;
}

.nav-tabs > li > a:hover {
  background-color: #dddddd;
  border-bottom: 1px solid #008641;
  border-left: 3px solid #999999;
  color: #474747;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  color: #474747;
  background-color: #dfdfdf;
  border-bottom: 1px solid #014f25;
  cursor: default;
  border-left: 3px solid #014f25;
}

.nav-tabs.nav-justified {
  width: 100%;
  border-bottom: 0;
}

.nav-tabs.nav-justified > li {
  float: none;
}

.nav-tabs.nav-justified > li > a {
  text-align: center;
  margin-bottom: 5px;
}

.nav-tabs.nav-justified > .dropdown .dropdown-menu {
  top: auto;
  left: auto;
}

.nav-tabs-2 {
  border-bottom: 1px solid #008641;
  margin-bottom: 10px;
}

.nav-tabs-2 > li {
  float: left;
  margin-bottom: -1px;
}

.nav-tabs-2 > li > a {/**margin-right: 2px;*/
  line-height: 1.2em;
  border-left: 3px solid #fff;
}

.nav-tabs-2 > li > a:hover {
  background-color: #dddddd;
  border-bottom: 1px solid #008641;
  border-left: 3px solid #999999;
  color: #474747;
}

.nav-tabs-2 > li.active > a, .nav-tabs-2 > li.active > a:hover,
.nav-tabs-2 > li.active > a:focus {
  color: #474747;
  background-color: #dfdfdf;
  border-bottom: 1px solid #014f25;
  cursor: default;
  border-left: 3px solid #014f25;
}

@media (min-width: 768px) {
  .nav-tabs.nav-justified > li {
    display: table-cell;
    width: 1%;
  }

  .nav-tabs.nav-justified > li > a {
    margin-bottom: 0;
  }
}

.nav-tabs.nav-justified > li > a {
  margin-right: 0;
  border-radius: 0;
}

.nav-tabs.nav-justified > .active > a,
.nav-tabs.nav-justified > .active > a:hover,
.nav-tabs.nav-justified > .active > a:focus {
  border: 1px solid #dddddd;
}

@media (min-width: 768px) {
  .nav-tabs.nav-justified > li > a {
    border-bottom: 1px solid #dddddd;
    border-radius: 0 0 0 0;
  }

  .nav-tabs.nav-justified > .active > a,
  .nav-tabs.nav-justified > .active > a:hover,
  .nav-tabs.nav-justified > .active > a:focus {
    border-bottom-color: #191919;
  }
}