body > div.menu-top
{
	display: flex;
	flex-direction: row;
}
body > div.menu-top > :nth-child(1)
{
	flex-grow: 1;
}
body > div.menu-top > nav
{
	position: static;
	z-index: 3;
	box-sizing: border-box;
	margin: 0px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	opacity: 0.2;
	opacity: 1;
	display: flex;
	-webkit-transition-duration: 0.5s; /* Safari */
	transition-duration: 0.5s;
	transition-timing-function: ease;
}
body > div.menu-top > nav > *:nth-child(1)
{
	flex-grow: 1;
	width: 100%;
}
body > div.menu-top > nav:hover
{
	opacity: 1;	
	-webkit-transition-duration: 0.5s; /* Safari */
	transition-duration: 0.5s;
	transition-timing-function: ease;
}
body > div.menu-top > nav *
{
	display: block;
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
}
body > div.menu-top > nav p
{
	width: 100%;
	margin: 0px;
	padding: 0px;
}
body > div.menu-top > nav
{
	background-color: #ddd;
}
body > div.menu-top > nav > div > ul
{
	display: flex;
	flex-direction: row;
}
body > div.menu-top > nav li
{
	list-style-type: none;
}
body > div.menu-top > nav li li
{
	display: flex;
}
body > div.menu-top > nav li > div
{
	-webkit-transition-duration: 0.5s; /* Safari */
	transition-duration: 0.5s;
	transition-timing-function: ease;
	opacity: 0;
	filter: alpha(opacity=0);
	visibility: hidden;
	position: relative;
	z-index: 1;
}
body > div.menu-top > nav li:hover > div
{
	-webkit-transition-duration: 0.5s; /* Safari */
	transition-duration: 0.5s;
	transition-timing-function: ease;
	opacity: 1;
	filter: alpha(opacity=100);
	visibility: visible;
	z-index: 2;
}
body > div.menu-top > nav li > div > ul
{
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: #fff;
	box-shadow: 1px 1px 10px #999;
}
body > div.menu-top > nav span,
body > div.menu-top > nav a
{
	padding: 10px;
	color: #000;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}
body > div.menu-top > nav li:hover > p > span,
body > div.menu-top > nav li:hover > p > a
{
	background-color: #eeeeee;
	color: #000;
}
body > div.menu-top > nav li:hover > p > span:active,
body > div.menu-top > nav li:hover > p > a:active
{
	background-color: #ccc;
	color: #fff;
}
body > div.menu-top > nav li.start > p > a,
body > div.menu-top > nav li.osoby > p > a,
body > div.menu-top > nav li.komputery > p > a,
body > div.menu-top > nav li.firmy > p > a,
body > div.menu-top > nav li.faktury > p > a,
body > div.menu-top > nav li.dokumentacja > p > a,
body > div.menu-top > nav li.rozliczenie-pracy > p > a,
body > div.menu-top > nav li.logout > p > a
{
	padding-left: 30px;
	background-image: url(/pub/img/button-home.svg);
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: 5px center;
}
body > div.menu-top > nav li.osoby > p > a
{
	background-image: url(/pub/img/button-osoby.svg);
}
body > div.menu-top > nav li.komputery > p > a
{
	background-image: url(/pub/img/button-komputery.svg);
}
body > div.menu-top > nav li.firmy > p > a
{
	background-image: url(/pub/img/button-firmy.svg);
}
body > div.menu-top > nav li.faktury > p > a
{
	background-image: url(/pub/img/button-faktury.svg);
}
body > div.menu-top > nav li.dokumentacja > p > a
{
	background-image: url(/pub/img/button-dokumentacja.svg);
}
body > div.menu-top > nav li.rozliczenie-pracy > p > a
{
	background-image: url(/pub/img/button-rozliczenie-pracy.svg);
}
body > div.menu-top > nav li.logout > p > a
{
	background-image: url(/pub/img/button-logout.svg);
}
@media only screen and (max-width: 800px)
{
	body > div.menu-top > nav li.start > p > a,
	body > div.menu-top > nav li.osoby > p > a,
	body > div.menu-top > nav li.komputery > p > a,
	body > div.menu-top > nav li.firmy > p > a,
	body > div.menu-top > nav li.faktury > p > a,
	body > div.menu-top > nav li.dokumentacja > p > a,
	body > div.menu-top > nav li.rozliczenie-pracy > p > a,
	body > div.menu-top > nav li.logout > p > a
	{
		padding: 15px;
		padding-right: 0px;
		padding-left: 50px;
		background-position: 15px center;
		width: 0px;
		overflow: hidden;
	}
}

nav.local
{
	background-color: #447788;
}
nav.local ul
{
	display: flex;
	flex-direction: row;
	margin: 0px;
	padding: 0px;
}
nav.local li
{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
nav.local a
{
	display: block;
	padding: 10px;
	margin: 0px;
	text-decoration: none;
	color: #fff;
}
nav.local a.current,
nav.local a:hover
{
	background-color: #589;
}
