@charset "utf-8";
/* CSS Document */

#nav {
    display: block;
    position: relative;
	min-height: 38px;
	float:right;
}
#nav, #nav a {
    color: white;
    text-decoration: none;
}
#nav a {
    display: block;
    padding: 10px;
}
#nav a:hover {
	background-color:#FC6;	
}
#nav ul {
    padding:0;
    margin: 0;
}
#nav ul li {
    float:left;
    display:inline;
    position:relative;
	background-color:#0CF;
    border: 1px solid white;
	width: auto;
	min-width: 85px;
	padding:0px 0px;
	text-align:center;
	font-size: 0.7rem;
	font-weight: bold;
}
#nav ul li ul {
    left:0;
    top:100%;
}
#nav ul ul {
    display:none;
}
#nav li:hover > ul {
    display:block;
    position:absolute;
}
#nav ul ul li:hover > ul {
    right: -120px;
    top: 0;
    left: auto;
}
.active{
	background-color: #06F;
	color:white;	
}
.active2{
	background-color: #00B7B7;
	color: white;
}

/*Hide checkbox and label by default*/
#nav > input,
#nav > label {
  display: none;
  z-index:1900;
}

#nav > label {
  width: 100%;
  float: left;
  padding: 5px 0px 5px 0px;
  padding-right: 0;
  cursor: pointer;
  z-index:1900;
}

@media (max-width: 1000px) {
#nav {   
   	z-index:1950;
	float:none;	
}	

#nav a {
    display: block;
    padding: 8px 1px 8px 1px;
}	
#nav ul li {
    float:left;
    display:block;
    position:relative;
	background-color:#0CF;
	border:none;
    border-top: 1px solid white;	
	width:74px;
	margin-right:1px;
	padding:0px 0px;
	text-align:center;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
}	
	
}

@media (max-width: 481px) {
	
#nav {   
    background: black;   
    min-height: 25px;
	text-align:left;
	z-index:1950;
	float:none;	
}	
#nav a {    
    padding: 4px 5px 4px 10px;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
}	
	
#nav > label, #nav ul li ul {
	display: block;		
}
#nav > label{
	padding-left:10px;		
}

#nav > ul {
	display: none;
	clear: both;		
}
#nav > input:checked + ul {
	display: block;	
}
#nav ul ul li a:before {
	content:'↪ ';
	display: inline;	
}

#nav ul li {
        float: none;
        display: block;
        border: none;
        padding-left: 0px;
		width:100%;
		text-align:left;		
}

#nav li:hover ul {
        position: relative;
        width: auto;		
}
#nav ul ul li:hover > ul {
        right:auto;
        top: auto;
        left: auto;		
}

}