/* Main menu settings */
#mainMenu {
  clear:both;
  float:left;
  margin:0;
  padding-bottom:1px;
  width:100%;
  font-family:Arial,Helvetica,sans-serif; /* Menu font */
  font-size:14px; /* Menu text size */
  z-index:1000; /* This makes the dropdown menus appear above the page content below */
  position:relative;
  border-bottom:1px #fff solid;
}

/* Top menu items */
#mainMenu ul {
  margin:0;
  padding:0;
  list-style:none;
  float:left;
  position:relative;
  /*right:50%;*/
}
#mainMenu ul li {
  margin:0 0 0 1px;
  padding:0;
  float:left;
  position:relative;
  /*left:50%;*/
  top:1px;
}
#mainMenu ul li a {
  display:block;
  margin:0;
  padding:.6em 1.4em .4em;
  font-size:14px;
  line-height:1.2em;
  /*background:#ddd;*/
  background-color:#C3DAF4;
  text-decoration:none;
  color:#000;
  font-weight:lighter;
  border-right:1px #fff solid;
}




/*set up the downward arrow for top level items*/
#mainMenu  ul li > a:after {content: '▼'; }
 /*clear the content if a is only child*/
#mainMenu  ul li > a:only-child:after {content: ''; }




#mainMenu ul li.active a {
  color:#000;
  background:#C3DAF4;
}
#mainMenu ul li a:hover {
  /*background:#36f; /* Top menu items background colour */
  color:#fff;font-family:Arial,Helvetica,sans-serif;text-decoration:none;
  /*-webkit-border-radius:5px;
  -moz-border-radius:5px;
    border-radius:5px;*/
}
#mainMenu ul li:hover a,
#mainMenu ul li.hover a { /* This line is required for IE 6 and below */
  /*background:#36f; /* Top menu items background colour */
  background:#2F8DCB;
  background-color: rgba(47,141,203,.9);
  color:#fff;
  
  font-family:Arial,Helvetica,sans-serif;text-decoration:none;
  /*-webkit-border-radius:5px;
  -moz-border-radius:5px;
    border-radius:5px;*/
}

/* Submenu items */
#mainMenu ul ul {
  display:none; /* Sub menus are hidden by default */
  position:absolute;
  /*list-style-type: square;*/
  top:2.1em;
  left:0;
  float:left;
  right:auto; /*resets the right:50% on the parent ul */
  width:10em; /* width of the drop-down menus */
}

#mainMenu ul ul li {
  left:auto;  /*resets the left:50% on the parent li */
  margin:0; /* Reset the 1px margin from the top menu */
  clear:left;
  float:left;
  width:100%;
  color:#000;
}

#mainMenu ul ul li a,
#mainMenu ul li.active li a,
#mainMenu ul li:hover ul li a,
#mainMenu ul li.hover ul li a { /* This line is required for IE 6 and below */
  font-size:12px;
  font-weight:normal; /* resets the bold set for the top level menu items */
  /*background:#eee;*/
  background:#2F8DCB;
    background-color: rgba(195,218,244,.9);
  color:#000;
  line-height:1.4em; /* overwrite line-height value from top menu */
    /*-webkit-border-radius:0px;
  -moz-border-radius:0px;
    border-radius:0px;*/
    border-left:1px #000 solid;
    border-right:1px #000 solid;
    border-bottom:1px #000 solid;
  float:left;
  width:100%;
}
#mainMenu ul ul li a:hover,
#mainMenu ul li.active ul li a:hover,
#mainMenu ul li:hover ul li a:hover,
#mainMenu ul li.hover ul li a:hover { /* This line is required for IE 6 and below */
  background:#2F8DCB;
  color:#fff;
  float:left;
}

/* Flip the last submenu so it stays within the page */
#mainMenu ul ul.last {
  left:auto; /* reset left:0; value */
  right:0; /* Set right value instead */
}
#mainMenu ul ul.last li {
  float:right;
  position:relative;
  right:.8em;
}

/* Make the sub menus appear on hover */
#mainMenu ul li:hover ul,
#mainMenu ul li.hover ul { /* This line is required for IE 6 and below */
  display:block; /* Show the sub menus */
}