nav {
     width:954;
     margin: 0; 
	 text-align: center;

}
    nav ul {
      list-style: none;
      padding: 0 0;
      overflow: hidden;
      margin: 0 0;  }
    nav ul li {
      float: left;
      width: 10%;
      height:40px;
 }
    nav ul li a {
      text-align: center;
      padding: 4px 0;
      display: block;
      width: 100%;
      height:40px;
      font-size:8pt;
      font-family:Arial;
      font-weight:Bold;
      color:#555555;
      background: #CCCCCC; /* Old browsers */
      }
    nav ul li a,
    nav ul li a:focus,
    nav ul li a:visited,
    nav ul li a:hover,
    nav ul li a:active {
      color: #000;
      text-decoration: none; }
    nav ul li a:hover,
    nav ul li a:active {
      background: #CCCCCC; /* Old browsers */
      }

nav li a,
nav li a:hover,
nav li a:active {
  background: #323637;
  border-top: 3px solid #48a9c0;
}

nav li.active a, 
nav li.active a:hover, 
nav li.active a:active {
  background: #323637;
}
nav li.automation a, 
nav li.automation.active a {
  border-top-color: #A9CC7A;
background: #EEF5E4;
}
nav li.motion a, 
nav li.motion.active a {
  border-top-color: #C8CA66;
background: #EEF5E4;
}
nav li.safety a, 
nav li.safety.active a {
  border-top-color: #F2E06D;
background: #FCF9E2;
}
nav li.sensor a, 
nav li.sensor.active a {
  border-top-color: #939FD0;
background: #E9ECF6	;
}
nav li.control a, 
nav li.control.active a {
  border-top-color: #E5A35C;
background:#FAEDDE;
}

nav li.switch a, 
nav li.switch.active a {
  border-top-color: #C399CB;
background: #F3EBF5;
}
nav li.relay {
      width: 8%;}
nav li.relay a, 
nav li.relay.active a {
  border-top-color: #E58873;
background: #FAE7E3;
}

nav li.robotics {
      width: 11%;}
nav li.robotics a, 
nav li.robotics.active a {
  border-top-color: #208C5B;
background: #EEF6F2;
}


nav li.energy {
      width: 11%;}

nav li.energy a, 
nav li.energy.active a {
  border-top-color: #68BDEA;
background: #E9F2F6;
}
nav li.power a, 
nav li.power.active a {
  border-top-color: #BFBFBF;
background: #F2F2F2;
}