/* fonts */
.dropdowns {
	font-family: 'Roboto', sans-serif;
	font-size: 10pt;
}

/* colors */
/* ------ */
/* togle menu button for narrow screens */
.toggleMenu {
	background: #f8f8f8;
    color: #fff;
}

/* general navigation background colors */
.nav {
     background: #f8f8f8;
	 border: 1px solid #f0f0f0;
}

/* general navigation link font color */
.nav a {
    color:#444;
}

/* first level items borders */
.nav > li {

}

/* navigation hover colors */
.nav a:hover {
	background-color: #fff;
}

/* second level navigation colors */
.nav li li a {
    background: #eeeeee;
    border-bottom: 1px solid #c0c0c0;
	margin: 0 0 0 10px;
	min-width: 200px;
}

.nav li li li {
	overflow-x: hidden;
}
	
/* third level navigation colors */
.nav li li li a {
	background:#dddddd;
    border-bottom: 1px solid #c0c0c0;
	margin: 0 0 0 0;
	width: 350px;
	z-index: 1000;
}

/* ---------------- */
/*      layout      */
/* -----------------*/

/* main div */
.dropdowns {
	width:auto;
}

/* small screens menu button */
a.toggleMenu {
	padding: 4px 0 1px 0;
	width:100%;
	text-align: right;
	border-top: 1px solid #f0f0f0;
}

/* second and third level menus */



/* general paddings and other stuff */
.nav a {
	padding: 5px 10px;
}

/* parents that have submenus */
.nav > li > .parent {
	padding-right: 25px;
	background-position: 90% 50%;
}

/* small screen adjustments*/
@media screen and (max-width: 768px) {

	.dropdowns {
		border: 1px solid #f0f0f0;
	}
	.nav {
		border: 0px;
	}
	.nav ul {
		width: 100%;
	}
	.nav ul ul {
		width: 100%;
		margin: 0 0 0 0px;
	}
	.nav ul ul li {
		margin: 0 0 0 10px;
	}
	.nav li li li a {
		width: 100%;
	}
	
}