* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.nav { width: 100%; background-color: #99ccff; font-size: 13px; z-index: 77;}

.nav ul { list-style: none; padding: 0px; margin: 0px; /*font-weight: bold;*/ position: relative; text-align: center; }
.nav > ul:after { content: ""; clear: both; display: block; }
.nav ul li { display: inline-block; text-align: left; zoom: 1; *display: inline; } /* Add "zoom: 1; *display: inline;" to make IE6 and IE7 display li horizontally. */ 
.nav ul li a { display: block; padding: 5px 10px; text-decoration: none; color: #444; }
.nav ul li a:hover { background-color: #ccc; }

.nav ul ul { display: none; position: absolute; top: 100%; background-color: #f4f4f4; }
.nav ul li:hover > ul { display: block; /**/position: absolute; top: auto; }
	
.nav ul ul li { float: none; display: block; position: relative; }
	
.nav ul ul ul { position: absolute; left: 100%; top:0; }
.selectnav { display: none; margin: 0px auto; }
	
@media screen and (max-width: 600px) {
    .js #ccmnav { display: none; }
    .js #ccmnav-1 { display: none; }
    .js #ccmnav-2 { display: none; }
    .js .selectnav { display: block; }
}