#navigatie
{
  position: relative;
  width: 960px;
  height: 115px;
  margin: 0;
  color: #FFFFFF;
  line-height: 120%;
  clear: both;
  z-index: 0;
  overflow: hidden;
}

#navigatie ul
{
  position: relative;
  padding: 0;
  margin: 0;
  list-style: none;
  background: #35a8d8;
  z-index: 0;
  overflow: hidden;
  width: 1060px;
  height: 115px;
  background: #0289bc url(../img/jouwzld/menu.png) repeat-x left bottom;  
}

#navigatie ul li
{
  display: block;
  position: relative;
  float: left;
  width: 195px;
  height: 109px;
  padding: 0px;
  margin: 0px;
  list-style: none;
  z-index: 0;
  font-size: 1em;
  background: #36aada url(../img/jouwzld/menu_dots.gif) repeat-y left top;
  overflow: hidden;
  cursor: pointer;
}


#navigatie ul li a
{
  display: block;
  position: relative;
  width: 95%;
  height: 109px;
  margin: 0;
  padding: 0 0 0 10px;
  font-family: Arial;
  font-size: 1em;
  font-weight: bold;
  text-decoration: none;
  text-align: left;
  cursor: pointer;
}

#navigatie ul li.hover 
{
  background: #0f4789;  
}

#navigatie ul li.selected
{
  background: #c01e4c url(../../img/jouwzld/menu_dots.gif) repeat-y left top;
}

#navigatie ul ul
{
  display: block;
  position: relative;
  padding: 0;
  float: left;
  width: 120px;
  height: auto;
  z-index: 0;
  background: #0f4789;
  overflow: hidden;
}

#navigatie ul li.selected ul
{
  background: #c01e4c;
}

#navigatie ul li.hover ul.group1,
#navigatie ul li.hover ul.group2,
#navigatie ul li.hover ul.group3,
#navigatie ul li.hover ul.group4
{
  display: block;
  position: absolute;
  line-height: 100%;
  width: 140px;
  top: 44px;
  z-index: 100;
  float: left;
}

.group1 { left: 0px; }
.group2 { left: 140px; }
.group3 { left: 280px; }
.group4 { left: 420px; }

#navigatie ul ul li
{
  display: block;
  float: left;
  position: relative;
  padding: 0 0 3px 20px;
  width: 120px !important;
  height: auto;
  line-height: 100%;
  background: #0f4789 url(../img/jouwzld/menu_bullet.png) no-repeat 10px 5px;
  z-index: 200;
  overflow: hidden;
}

#navigatie ul li.selected ul li
{
  background: #c01e4c url(../img/jouwzld/menu_bullet.png) no-repeat 10px 5px;
}

#navigatie ul ul li a
{
  display: block;
  position: relative;
  width: 120px;
  height: auto;
  padding: 0;
  font-size: 11px;
  font-weight: normal;
  text-transform: none !important;
  line-height: 100%;
  z-index: 0;
}

#navigatie ul ul li a:hover
{
  text-decoration: underline; 
}

li>ul {
  top: auto;
  left: auto;
}





.panelsubmenu
{
  padding: 20px 20px 20px 20px;
  background: #95be3d;
  width: 320px;
}

.panelsubmenu ul
{
  padding: 0;
  margin: 0;
  list-style: none;  
}

.panelsubmenu ul li
{
  position: relative;
  display: block;
  margin: 0;
  padding: 5px 0 5px 0;
  background: url(../../img/jouwzld/dots_horizontal.gif) repeat-x left bottom;
  list-style: none;
  clear: both;
  color: #FFFFFF;
}

.panelsubmenu ul li a
{
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
  font-family: Arial;
  font-size: 1.2em;
  font-weight: bold;  
  text-decoration: none;
  text-align: left;
  z-index: 0;
  color: #FFFFFF;
}

.panelsubmenu ul li a:hover
{
  color: #333333;
  text-decoration: none;
  position: relative;
}

.panelsubmenu ul li:hover > a 
{
  color: #333;
  text-decoration: none;
  position: relative;  
}

.panelsubmenu ul li.active
{
  color: #333333;
  text-decoration: none;
  position: relative;
  background: none;
}

.panelsubmenu ul li.active a
{
  color: #333333;
  padding: 0 0 0 12px;
  background: url(../../img/jouwzld/submenu_down.gif) no-repeat left 10px;
}

.panelsubmenu ul ul
{
  display: none;
  position: relative;
  clear: both;
}

.panelsubmenu ul li.active ul
{
  display: block !important;
  left: 0;
  padding: 0;
  background: url(../../img/jouwzld/dots_horizontal.gif) repeat-x left bottom;
}

.panelsubmenu ul ul li
{
  display: block;
  position: relative;
  padding: 0;
  width: 150px;
  float: left;
  height: auto;
  clear:none;
  background: none !important;  
}

.panelsubmenu ul ul li a
{
  display: block;
  position: relative;
  height: auto;  
  padding: 0 0 0 10px !important;
  font-size: 0.9em;
  font-weight: normal;
  color: #333333;
  text-decoration: underline;
  text-transform: none !important;
  background: url(../../img/jouwzld/submenu_bullet.png) no-repeat 2px 8px !important;
}

.panelsubmenu ul ul li a:hover
{
  text-decoration: underline;
  color: #FFFFFF;
}

.panelsubmenu ul li:hover ul ul,
.panelsubmenu ul li:hover ul ul ul
{
  display: none;
}

.panelsubmenu ul ul li:hover ul,
.panelsubmenu ul ul ul li:hover ul
{
  display: block;
  left: 0;
  top: 0;
}