#navholder {width: 100%; position: fixed; background-color: #8facc7; margin-top: 0px; z-index; 11111; left: 0; right: 0; top: 0; height: 40px;}
#nav { width: 80em; /* 1000 */ font-family: 'Open Sans', sans-serif; position: relative; font-weight: 300; font-size: 1.6rem; top: 0; /* 30 480 */ left: 50%; margin-left: -40em; }
#nav > a { display: none; }
#nav li { position: relative; }
#nav li div { float: left; width: 30px; padding-left: 10px;}
#nav li a { color: #005; display: block; padding-left: 0.75rem; }
#nav li a:active { background-color: #8facc7 !important; }
#nav span:after { width: 0; height: 0; border: 0.313em solid transparent; /* 5 */ border-bottom: none; border-top-color: #005; content: ''; vertical-align: middle; display: inline-block; position: relative; right: -0.313em; /* 5 */}
/* first level */
#nav > ul { height: 3.9rem; /* 60 */ background-color: #8facc7; list-style-type: none; margin-top: 0px; margin-left: 0px; }
#nav > ul > li { width: 22%; height: 100%; float: left; }
#nav > ul > li#first, #nav > ul > li#last { width: 5%; padding: 0px;}
#nav > ul > li > a { height: 100%; font-size: 1.6rem; /* 24 */ line-height: 3.9rem; /* 60 (24) */ text-align: left; }
#nav > ul > li:not( :last-child ) > a { border-right: 1px solid #888; }
#nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a { background-color: #888;}
/* second level */
#nav li ul { background-color: #888; display: none; position: absolute; top: 100%; list-style-type: none; padding-left: 0px;  z-index: 1111111;}
#nav li:hover ul { display: block; left: 0; right: 0; }
#nav li:not( :first-child ):hover ul { left: -1px; }
#nav li ul a { border-top: 1px solid #8facc7;  /* 15 (20) */ padding: 0.75rem; }
#nav li ul li a:hover, #nav li ul:not( :hover ) li.active a { background-color: #8facc7; }

@media only screen and ( max-width: 82.5em ) /* 1320 */ { 
	#nav  { width: 100%; position: static; margin: 0; }
}

@media only screen and ( max-width: 72.5em ) /* 1320 */ { 
	#nav  { width: 100%; position: static; margin: 0; }
	#container_div table tr td, #container_div table tr td div {font-size: 11px;}
}

@media only screen and ( max-width: 62.5em ) /* 1000 */ { 
	#nav  { width: 100%; position: static; margin: 0; }
	#nav > ul > li > a { font-size: 1.2rem;}
	#nav li ul a { font-size: 1.2rem; border-top: 1px solid #8facc7;  /* 15 (20) */ padding: 0.75rem; }
	#nav li div { font-size: 2.4rem; line-height: 3rem;}
	#nav li div#main { font-size: 2.4rem; line-height: 4rem;}
	#navholder {height: 30px;}
	#nav li#first div, #nav li#last div { padding-left: 0px;}
	#container_div table tr td, #container_div table tr td div {font-size: 11px;}
}

@media only screen and ( max-width: 52em ) /* 832 */ { 
	#nav  { width: 100%; position: static; margin: 0; }
	#nav > ul > li > a { font-size: 1.1rem;}
	#nav li ul a { font-size: 1.1rem; border-top: 1px solid #8facc7;  /* 15 (20) */ padding: 0.75rem; }
	#container_div {width: 100% !important; float: none !important; }
	#container_div table tr td, #container_div table tr td div {font-size: 11px;}
	div#stat_navi a, div#stat_navi a.visited, div#stat_navi a.selected, div#stat_navi a:hover {font-size: 1.2rem;}
	td, th, div {font-size: 1.2rem;}
	h3 {font-size: 0.8rem !important;}
	h6 {font-size: 0.8rem !important;}
    #paging_link {font-size: 0.9rem !important; font-weight: bold;}
	div#stat_navi {margin-left: 5px !important; }
	#OnlyDirectDebitButton {float: none !important; margin-top: 1.5rem; margin-left: 1rem;}
	#LeftEditColumn {width: 98% !important; float: none !important; margin-left: 5px;  }
	#MainEditColumn {width: 98% !important; float: none !important; margin-left: 5px;  margin-top: 20px;}
	#EditBreadcrumbLink {padding-left: 5px;}
	#sedcards_list {width: 100% !important;}
	h4, h5 {font-size: 0.9rem !important;}
    #table_menu_edit {width: 98% !important;}
    div.error {width: 100%;}
    div.success {width: 100%;}
}

@media only screen and ( max-width: 40em ) /* 640 */ {
	#navholder {height: 40px;}
	#nav { position: relative; top: auto; left: auto; }
	#nav div#mobilemenu{ margin-left: 10px; }
	#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type { display: block; }
	/* first level */
	#nav > ul { height: auto; display: none; position: absolute; left: 0; right: 0; }
	#nav:target > ul { display: block; }
	#nav > ul > li, #nav > ul > li#first, #nav > ul > li#last { width: 100%; }
	#nav > ul > li > a { height: 40px; text-align: left; padding: 0 0.833em; font-size: 1rem; /* 20 (24) */ }
	#nav > ul > li > div#main {font-size: 2rem; line-height: 3.4rem;}
	#nav > ul > li:not( :last-child ) > a { border-right: none; border-bottom: 1px solid #888; }
	/* second level */
	#nav li ul { position: static; padding: 1.25em; /* 20 */ padding-top: 0; }
	#nav > ul > li > ul > li > div {font-size: 1.7rem; line-height: 2.2rem; margin-left: 0px; padding-left: 10px;}
	#nav > ul > li > ul > li > a { height: 24px; padding: 0px; font-size: 1rem; padding-top: 6px;}
	.search {width: 90%; margin-left: 10px;}
	div#stat_navi a, div#stat_navi a.visited, div#stat_navi a.selected, div#stat_navi a:hover {font-size: 1rem;}
	td, th, div, input, textarea {font-size: 1rem !important;}
	h3 {font-size: 0.9rem !important;}
	h6 {font-size: 0.9rem !important;}
    #paging_link {font-size: 0.9rem !important; font-weight: bold;}
	div#stat_navi {margin-left: 5px !important; }
	#OnlyDirectDebitButton {float: none !important;}
	#LeftEditColumn {width: 98% !important; float: none !important; margin-left: 5px;  }
	#MainEditColumn {width: 98% !important; float: none !important; margin-left: 5px; margin-top: 20px;}
	#EditBreadcrumbLink {padding-left: 5px;}
    #MainEditColumn.table {width: 100% !important;}
    h4, h5 {font-size: 0.9rem !important;}
    #inv_text_field {width: 90px !important;}
    #inv_einzpreis_field {width: 30px !important;}
    #table_menu_edit {width: 98% !important;}
    div.error {width: 100%;}
    div.success {width: 100%;}
}