/*
   Hauptmenue
*/
@media (max-width: 767px) {

  #sidebar {
    position: absolute;
    width: 100%;
    top: 0px;
    left: 0px;
    height: auto;
    margin-bottom: 0px;
    z-index: 100;
    background: none;
  }

  #hauptmenue {
    position: relative;
    width: 100%;
    height: auto;
    margin-bottom: 0px;
    z-index: 100;
    background: none;
  }

  #hauptmenue ul {
    margin: 0px;
  }

  .dropdown { padding-top: 52px; }

  #hauptmenue ul li {
    list-style-type: none;
    list-style-image: none;
    width: 100%;
  }

  .hm1 {
    display: block;
    width: 100%;
    height: 27px;
    font-family: 'Playfair Display', Verdana, Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: capitalize;
    text-align: center;
    padding: 7px 0 5px 0;
    color: #A02B2B;
    background: rgba(255, 255, 255, 0.9);
    margin-bottom: 0px;
    border-bottom: 1px solid #CCC;
    }

  #hauptmenue ul li:hover .hm1, ul li:active .hm1 {
    color: #FFF;
    background: #A02B2B;
    text-shadow: 1px 1px 2px #000;
    }

  /*
     Submenue allgemein
  */
  ul.sub_menu { position: relative; display: none;}

  ul.sub_menu li {
    display: block;
    width: 100%;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    float: left;
    margin: 0px;
    background: rgba(255, 255, 255, 0.9);
  }

  ul.sub_menu a:hover { color: #342019; }

  ul.sub_menu a:active { color: #ffa500; }

  ul.sub_menu li a {
    display: block;
    padding: 8px;
  }

  ul.sub_menu li a:link, ul.sub_menu li a:visited { color: #342019; }

  ul.sub_menu li:last-child a { border-right: none; }

  ul.sub_menu li.hover,
  ul.sub_menu li:hover {
    background-image: linear-gradient(to bottom, #EEEEEE, #F5FAFF);
    color: #342019;
    position: relative;
  }

  ul.sub_menu li.hover a { color: #342019; }
  /*
  	LEVEL TWO
  */
  ul.dropdown ul {
    width: 100%;
    position: relative;
    z-index: 40;
  }

  ul.dropdown ul li {
    font-weight: normal;
    color: #342019;
    border-bottom: 1px solid #CEC2B5;
    float: none;
  }

  /* Speziell für Hauptmenüpunkt mit Submenü */
  #hauptmenue li a:link[id*="hmnu-"] { background: rgba(255, 255, 255, 0.9) url(../designpics/arrow_smartmenue.png) no-repeat center right !important;}
  #hauptmenue li a:hover[id*="hmnu-"] { background: #A02B2B url(../designpics/arrow_smartmenue2.png) no-repeat center right !important;}
  #hauptmenue li a:active[id*="hmnu-"] { background: #A02B2B url(../designpics/arrow_smartmenue2.png) no-repeat center right !important;}


  /* NAVIGATION */
  .sr-only {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;}
  .sr-only-focusable:active, .sr-only-focusable:focus {position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto;}
  [role="button"] {cursor: pointer;}
  .navbar-toggle {position: absolute; padding: 5px; top: 10px; left: 20px; background-color: transparent; background-image: none; border: 1px solid #A02B2B; border-radius: 4px; z-index: 100; cursor: pointer;}
  .navbar-toggle:focus {outline: 0;}
  .navbar-toggle .icon-bar {display: block; width: 30px; height: 4px; border-radius: 1px; background-color: #A02B2B;}
  .navbar-toggle .icon-bar + .icon-bar {margin-top: 6px;}

  .closed {
    display: none;
  }

}
@media (min-width: 768px) {

  #hauptmenue {
    width: 100%;
    height: auto;
    margin-bottom: 30px;
    z-index: 100;
    background: none;
    float: left;
    padding-left: 20px;
  }
  #hauptmenue ul {
    margin: 0px;
  }

  #hauptmenue ul li {
    list-style-type: none;
    list-style-image: none;
    width: 100%;
  }

  .hm1 {
    display: block;
    width: 100%;
    height: 27px;
    font-family: 'Playfair Display', 'Times New Roman', Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: capitalize;
    text-align: left;
    padding: 7px 0 5px 0;
    color: #A02B2B;
    background: #FFF;
    margin-bottom: 0px;
    border-bottom: 1px solid #CCC;
    }

.hm1:hover  {
    color: #FFF;
    background: #A02B2B;
    text-shadow: 1px 1px 2px #000;
    }

  /*
     Submenue allgemein
  */
  ul.sub_menu { position: relative; display: none;}

  ul.sub_menu li {
    display: block;
    width: 100%;
    font-weight: bold;
    font-size: 18px;
    text-align: left;
    float: left;
    margin: 0px;
  }

  ul.sub_menu a:hover { color: #342019; }

  ul.sub_menu a:active { color: #ffa500; }

  ul.sub_menu li a {
    display: block;
    padding: 8px 0;
  }

  ul.sub_menu li a:link, ul.sub_menu li a:visited { color: #342019; padding-left: 20px; }

  ul.sub_menu li:last-child a { border-right: none; }

  ul.sub_menu li.hover,
  ul.sub_menu li:hover {
    background-image: linear-gradient(to bottom, #EEEEEE, #F5FAFF);
    color: #342019;
    position: relative;
  }

  ul.sub_menu li.hover a { color: #342019; }
  /*
  	LEVEL TWO
  */
  ul.dropdown ul {
    width: 100%;
    position: relative;
    z-index: 40;
  }

  ul.dropdown ul li {
    font-weight: normal;
    color: #342019;
    border-bottom: 1px solid #CEC2B5;
    float: none;
  }

    /* Speziell für Hauptmenüpunkt mit Submenü */
  #hauptmenue li a:link[id*="hmnu-"] {background: url(../designpics/arrow_smartmenue2.png) no-repeat center right; }
  #hauptmenue li a:active[id*="hmnu-"] {background:  url(../designpics/arrow_smartmenue.png) no-repeat center right; }
  #hauptmenue li a:hover[id*="hmnu-"] {background: #A02B2B url(../designpics/arrow_smartmenue_white.png) no-repeat center right; }

  /* NAVIGATION */
  .navbar-toggle { display: none; }

}