/* replacing the sddm menu with suckerfish style menu */
.shown {
   display: inherit;
}
.hidden {
   display: none !important;
}
nav#tnav {
   display:    block;
   float:      none;
   height:     35px;
   margin:     0 auto;
   padding:    0;
   /* position:   relative;*/
   text-align: center;
   width:      100%;
   z-index:    1;
}
/*display: block; not necessary at start */
ul#nav {
   background:       rgba(128,128,128,0.5);
   clear:            both;
   display:          block;
   min-height:       35px;
   height:           35px;
   list-style:       none;
   margin:           0 auto;
   padding:          0;
   position:         relative;
   text-align:       center;
   text-decoration:  none;
   width:            inherit;
}

@media only screen and (min-device-width:200px) and (max-device-width:800px) {
   nav>div#bun {
      background:    #2A5B29;
      clear:         both;
      color:         white;
      font-size:     18px;
      font-weight:   bold;
      height:        24px;
      margin:        0;
      padding:       4px;
      width:         100%;
   }
   a.ctColors {
      display:       inline-block;
      background:    none;
      clear:         none;
      color:         white;
      float:         left;
      font-family:   "Century Gothic", "Arial Black", Arial, Helvetica, sans;
      font-size:     inherit;
      font-style:    normal;
      font-weight:   bold;
      padding:       0;
      white-space:   nowrap;
   }
   ul#nav {
      display: block;
      white-space:   normal;
   }
   .burger {
      background:    none;
      clear:         none;
      color:         black;
      display:       inline;
      font-size:     inherit;
      float:         left;
      margin:        0;
      padding:       0 1em 0 0;
      text-align:    left;
      white-space:   nowrap;
   }
   a.burger, a.burger:visited, a.burger:active {
      color:         white;
      cursor:        pointer;
      text-decoration: none;
   }
   ul#nav>li:first-child {
      left:0;
   }
}
@media only screen and (min-device-width:800px) {
   .ctColors, nav>div#bun {
      display: none;
   }
   ul#nav {
      background:       #c0f0c0;
      display:          block;
      margin:           0 auto;
      white-space:      nowrap;
      width:            100%;
   }
   .burger {
      display: none;
   }
}

#nav ul, #nav ol {
  display:           none;
}
#nav>a {
   padding:          1pt 1em;
}
#nav a {
   background:       #2A5B29;
   display:          inline-block;
   color:            #EECC22;
   padding:          4px 0;
   _padding:         2px 1em;
   text-align:       center;
   font-weight:      bold;
   font-size:        10pt;
   text-decoration:  none;
   margin: 0;
}
@media only screen and (min-device-width: 200px) and (max-device-width:800px) {
   .mobileHide {
      display: none !important;
   }
   #nav a {
      display: block;
   }
   #nav>li {
      background: #aaa;
   }
   #nav li.shown > ul.menu2,
   #nav li.shown > ul.menu2 > li.item2 {
      width: 100%;
   }
   ul > a.dmenu, .item2 {
     font-size:        120% !important;
     font-weight:      bold !important;
   }
   #nav li.item2 a, a.item2 {
      white-space:      normal !important;
   }
}
@media only screen and (min-device-width: 800px) {
   #nav>li {
      background:       rgba(248,248,248,0.2); /* #eee; */
   }
   .mobileHide {
      display: inline-block;
   }
   #nav a {
      display: inline-block;
   }
   ul > a.dmenu, .item2 {
     font-size:        100% !important;
     font-weight:      bold !important;
   }
}

ul#nav>li.shown {
   background:       #eecc22; /* #ddffcc;*/
   color:            #2A5B29;
}
ul#nav>li.shown a {
   background:       inherit; /* #ddffcc;*/
   color:            inherit;
}

ul#nav>li.shown mmenu {
   background:       #eecc22; /* #ddffcc;*/
   color:            inherit;
}

#nav a:hover {
   background:       inherit; /* #2A5B29;*/
   color:            inherit;
   text-decoration:  none;
}

#nav>li {
   clear:            none;
   color:            white;
   font-weight:      bold;
   height:           inherit;
   text-align:       center;
   padding:          0;
}

#nav>li>a {
   background:       rgba(45,110,45,0.6);
   clear:            none;
   color:            inherit;
   font-weight:      bold;
   font-family:     "Century Gothic Bold";
   font-size:        16px;
   height:           33px;
   line-height:      2;
   margin:           0;
   padding:          2px 18px 0 18px;
   text-align:       center;
   text-decoration:  none;
   vertical-align:   bottom;
}
#nav>li {
   border:           0 none; /*1px solid rgba(248,248,248,0.1);*/
   margin:           0;
}
@media only screen and (min-device-width: 200px) and (max-device-width:800px) {
   #nav>li {
      clear: both;
      display: block;
   }
}
@media only screen and (min-device-width: 800px) {
   #nav>li {
      clear: both;
      display: inline-block;
   }
}
#nav li:hover, #nav ul:hover li {
   background:       #aaa;
   color:            white;
}

#nav>li>ul {
   background:       white;
   display:          none;
   font-weight:      normal;
   font-size:        inherit;
   position:         absolute;
   padding:          0;
   width:            auto;
}

ul#nav>li.shown > ul.menu2 {
   clear:   both;
   display: block;
   float:   none;
   height:  auto;
}
@media only screen and (min-device-width: 200px) and (max-device-width:800px) {
   ul#nav>li.shown > ul.menu2 {
      position: relative;
      left: 0px;
      z-index:10;
   }
}
@media only screen and (min-device-width: 800px) {
   ul#nav>li.shown > ul.menu2 {
      position: absolute;
      z-index:10;
   }
}

ul#nav>li.shown > ul.menu2 li {
   background:       #eee;
   border:           1px solid white;
   color:            #2a5b29;
   clear:            none;
   display:          inline-block;
   float:            left;
   font-weight:      normal;
   font-size:        inherit;
   height:           auto;
   margin:           0;
   padding:          2px;
   text-align:       center;
   min-width:        28ch;
   white-space:      nowrap;
   width:            inherit;
   max-width:        24em;
   /*max-width:        410px\9;*/
   vertical-align:   inherit;
}

ul#nav>li.shown > ul.menu2 li:hover,
ul#nav>li.shown > ul.menu2 li:hover a {
   border: 1px solid #aaa;
   background: #aaa;
}

ul#nav>li.shown ul.menu2 li a {
   color:            inherit;
   background:       inherit;
   border:           1px solid #eee;
   display:          inline-block;
   font-weight:      normal;
   font-size:        100%;
   min-height:       inherit;
   height:           inherit;
   text-align:       center;
   text-decoration:  none;
   white-space:      nowrap;
   width:            inherit;
   min-width:        inherit;
}

ul#nav>li.shown ul.menu2 li a:hover,
ul#nav>li.shown ul.menu2 li:hover a {
   background:       #aaa;
   color:            white;
}

ul#nav>li.shown>ul.menu2 {
   background: rgba( 38,120,38,0.5);
   border: none;
   display: block;
}
@media only screen and (min-device-width: 800px) {
   ul#nav li.shown ul.menu2 {
      width: 100%;
      margin: 0 auto 0 auto;
      border-bottom: 8px solid rgba(10,70,10,0.7);
   }
}
ul#nav>li.shown>ul.menu2>li.shown {
   display: inline-block;
}

ul#nav>li.shown>ul.menu2>li.shown ul.menu3 {
   display: block;
}

.menu2, .menu3 {
   position: absolute;
   clear: left;
   left: 0;
}

a.indent1 {
  width: auto;
  padding-left: 1em;
  margin-left: 1em;
}
.rh-arrow {
   display:          inline;
   clear:            none;
   float:            right;
   margin-left:      0; /*-4em;*/
   margin-right:     0;
   white-space:     pre-line;
}
.before-rh-arrow {
   clear:            none;
   float:            left;
   min-width:        10em;
   max-width:        30em;
   width:            inherit;
   max-width:        400px\9;
   /*white-space:     pre-line;*/
}

.mmenu, span .mmenu, li .mmenu {
  display: none;
}
.menutext {
   font-family: "Century Gothic", Arial, Helvetica, sans-serif;
   font-size: small;
   text-transform: none;
}
.menutext li, .menutext a {
   font-family: "Century Gothic", Arial, Helvetica, sans-serif;
}
.menutext2 {
   font-family: "Century Gothic", Arial, Helvetica, sans-serif;
   font-size: medium;
   text-transform: none;
   color: #2A5B29;
}
.med_heading {
   font-family: "Century Gothic", "DejaVu Sans",Arial, Helvetica, sans-serif;
   font-size: large;
   font-weight: bold;
   text-transform: none;
   color: #2A5B29;
}
.small_heading {
   font-family: "Century Gothic", "DejaVu Sans",Arial, Helvetica, sans-serif;
   font-style: normal;
   font-size: large;
   font-weight: bold;
   text-transform: none;
   color: #2A5B29;
}

.search_button {
  background: #FFFFFF;
  color: #2A5B29;
  font-size: small;
  font-weight: bold;
}

.search_box {
  background:#eaeaea;
  font-size: small;
}

#homelink a {
   display:         inline-block;
   font-size:       26px !important;
   height:          33px;
   line-height:     1 !important;
   padding:         2px 18px 0 18px;
   text-align:      center;
   vertical-align:  bottom;
   font-weight:     bold;
}
#homelink a:hover {
   background:       #aaa;
   font-size:  26px !important;
   color:            white;
   font-weight:      bold;
   text-decoration:  none;
}