/* 
    Document   : com_showmenu
    Created on : 2012.05.30., 12:09:43
    Author     : semmer@infoart.hu
*/

/**
 *  MAIN MENU
*/

div#header-in div.portlet-content.box.part-showmenu > div.component-body {
  width: 1255px;
  height: 32px;
  background: #ccc;
  border: 1px solid #646464;
  border-radius: 3px;
  -khtml-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  -webkit-border-radius: 3px;
  box-shadow: 2px 2px 3px 0 #000;
  -khtml-box-shadow: 2px 2px 3px 0 #000;
  -moz-box-shadow: 2px 2px 3px 0 #000;
  -ms-box-shadow: 2px 2px 3px 0 #000;
  -o-box-shadow: 2px 2px 3px 0 #000;
  -webkit-box-shadow: 2px 2px 3px 0 #000;
  position: absolute;
  top: 32px;
  right: 85px;
  z-index: 55;
}

div.header-in-with-slider div#header-in div.portlet-content.box.part-showmenu > div.component-body {
  width: 1055px;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav {
  position: absolute;
  right: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li {
  float: left;
  width: 32px;
  height: 32px;
  display: block;
  position: relative;
  padding: 0 0 0 3px;
  background: #000 url('../gfx/main_menu_separator.png') 0 0 no-repeat;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li > a {
  display: block;
  text-decoration: none !important;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li > a.active {
  background: #76B652;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li > a > img {
  display: block;
}

div#header-in  div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li > a > span {
  display: none;
  background: #fff url('../gfx/menu_bg.png') 0 100% repeat-x;
  padding: 10px;
  color: #000;
  position: absolute;
  top: 35px;
  right: 0;
  z-index: 9999;
  white-space: nowrap;
  text-decoration: none;
  border: 1px solid #646464;
  border-radius: 3px;
  -khtml-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  -webkit-border-radius: 3px;
  box-shadow: 2px 2px 3px 0 #000;
  -khtml-box-shadow: 2px 2px 3px 0 #000;
  -moz-box-shadow: 2px 2px 3px 0 #000;
  -ms-box-shadow: 2px 2px 3px 0 #000;
  -o-box-shadow: 2px 2px 3px 0 #000;
  -webkit-box-shadow: 2px 2px 3px 0 #000;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li > a:hover > span {
  display: block;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:hover {
  background-color: #42B547;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(1):hover {
  background-color: #CD2829;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(1) > a.active {
  background: #CD2829;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(2):hover,
div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(3):hover,
div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(4):hover {
  background-color: #64A9DF;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(2) > a.active,
div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(3) > a.active,
div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(4) > a.active {
  background-color: #64A9DF;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(5):hover,
div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(5) > a.active {
  background-color: #EEBC31;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(6):hover,
div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(7):hover {
  background-color: #CA0088;
}

div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(6) > a.active,
div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li:nth-last-of-type(7) > a.active {
  background-color: #CA0088;
}

/* Mobile & Tablet ---------------------------------------------------------- */

@media only screen and (min-width: 1305px) and (max-width: 1680px) {
  div#header-in div.portlet-content.box.part-showmenu > div.component-body {
    width: 935px;
  }
  div.header-in-with-slider div#header-in div.portlet-content.box.part-showmenu > div.component-body {
    width: 905px;
  }
}

@media only screen and (min-width: 984px) and (max-width: 1304px) {
  div#header-in div.portlet-content.box.part-showmenu > div.component-body {
    width: 665px;
  }
  div.header-in-with-slider div#header-in div.portlet-content.box.part-showmenu > div.component-body {
    width: 705px;
  }
}

@media only screen and (min-width: 665px) and (max-width: 983px) {
  div#header-in div.portlet-content.box.part-showmenu > div.component-body {
    width: 445px;
    height: 64px;
    top: 30px;
  }
  div.header-in-with-slider div#header-in div.portlet-content.box.part-showmenu > div.component-body {
    width: 445px;
  }

  div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav {
    width: 210px;
  }
}

@media only screen and (min-width: 320px) and (max-width: 664px) {
  div#header-in div.portlet-content.box.part-showmenu > div.component-body {
    width: 308px;
    height: 122px;
    margin: 10px auto;
    position: relative;
    top: 0;
    left: 0;
    box-shadow: none;
    z-index: 120;
  }
  div.header-in-with-slider div#header-in div.portlet-content.box.part-showmenu > div.component-body {
    width: 308px;
  }
  div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav {
    position: relative !important;
    left: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
  }
  div#header-in div.portlet-content.box.part-showmenu > div.component-body > ul.nav > li {
    padding: 0;
    background: #000;
    margin: 5px 21px;
  }
}

/**
 *  FOOTER MENU
*/

div#footer-in div.portlet-content.box.part-showmenu div.component-body {
  padding: 0 5px;
}

div#footer-in div.portlet-content.box.part-showmenu {
  margin-bottom: 10px;
}

div#footer-in div.portlet-content.box.part-showmenu > h2.component-heading {
  color: #666;
  border: none;
  margin: 0;
  padding: 0 0 5px;
  line-height: 24px;
  font-size: 18px;
}

div#footer-in div.portlet-content.box.part-showmenu ul.nav {
  margin: 0;
  padding: 0;
  list-style: none;
}

div#footer-in div.portlet-content.box.part-showmenu ul.nav > li {
  padding: 3px 0;
}

div#footer-in div.portlet-content.box.part-showmenu ul.nav > li > a {
  font-size: 14px;
  color: #333;
}

/**
 * SUBMENU
*/

div.portlet-content.box.part-submenu-moving {
  width: 320px;
  margin: 0;
}

div.portlet-content.box.part-submenu-moving div.component-body {
  padding: 0 5px;
}

div.portlet-content.box.part-submenu-moving ul.nav {
  margin: 5px 0;
  padding: 0;
  list-style: none;
}

div.portlet-content.box.part-submenu-moving ul.nav ul {
  display: none;
  list-style: none;
  margin: 5px 0 0;
  background: #ececec;
}

div.portlet-content.box.part-submenu-moving ul.nav ul ul {
  display: none;
  list-style: none;
  margin: 5px 0 0;
  background: #d9d9d9;
}

div.portlet-content.box.part-submenu-moving ul.nav ul.open {
  display: block;
}

div.portlet-content.box.part-submenu-moving ul.nav li {
  padding: 5px 0 5px 20px;
}

div.portlet-content.box.part-submenu-moving ul.nav > li {
  border-bottom: 1px dotted #ccc;
  padding: 5px 0;
}

div.portlet-content.box.part-submenu-moving ul.nav > li > a {
  background: transparent url('../gfx/title_bullets.png') 0 -279px no-repeat;
  display: block;
  min-height: 13px;
  padding: 0 0 0 20px;
}
div.portlet-content.box.part-submenu-moving > div.blue ul.nav > li > a {
  background-position: 0 1px;
}
div.portlet-content.box.part-submenu-moving > div.green ul.nav > li > a {
  background-position: 0 -69px;
}
div.portlet-content.box.part-submenu-moving > div.red ul.nav > li > a {
  background-position: 0 -139px;
}
div.portlet-content.box.part-submenu-moving > div.orange ul.nav > li > a {
  background-position: 0 -209px;
}
div.portlet-content.box.part-submenu-moving ul.nav > li ul a {
  padding: 0 0 0 5px;
  background: transparent url('../gfx/title_bullets.png') 0 -279px no-repeat;
  display: block;
  min-height: 13px;
  padding: 0 0 0 20px;
}

div.portlet-content.box.part-submenu-moving ul.nav a:hover,
div.portlet-content.box.part-submenu-moving ul.nav li.selected > a,
div.portlet-content.box.part-submenu-moving ul.nav li a:hover {
  font-weight: 700;
  text-decoration: none;
  color: #333;
}

div.portlet-content.box.part-submenu-moving ul.nav li.selected li.selected a {
  font-weight: 700;
}

div.portlet-content.box.part-submenu-moving ul.nav li.selected li a,
div.portlet-content.box.part-submenu-moving ul.nav li.selected li.selected li a{
  font-weight: normal;
}

@media only screen and (min-width: 1305px) {
  div.portlet-content.box.part-submenu-moving {
    width: 640px;
    margin: 0;
  }
  div.portlet-content.box.part-submenu-moving > div {
    width: 630px;
    margin: 0 5px 20px 5px;
  }
}

@media only screen and (min-width: 665px) and (max-width: 983px) {
  div.portlet-content.box.part-submenu-moving {
    width: 640px;
    margin: 0;
  }
  div.portlet-content.box.part-submenu-moving > div {
    width: 630px;
    margin: 0 5px 20px 5px;
  }
}

@media only screen and (min-width : 320px) and (max-width : 479px) {
  div.portlet-content.box.part-submenu-moving {
    width: 100%;
    margin: 0;
  }
}