/*Navigation*/
nav{background-color:#444; border-bottom-color:#a00019; border-bottom-style:solid; border-bottom-width:4px;width:100%; z-index:100; height:44px; display: -webkit-flex;   display: flex;	align-items: center}

/*alle Navigation Dropdowns*/
nav ul{padding-left:0px;list-style:none;margin:0px;}
nav li{position:relative;}

/*Titel*/
nav h1{margin: 7px 15px; color:#fff;flex:1}

/*Search & Searchdropdown*/
nav > div:first-child{margin:7; flex-shrink:1}
@media (max-width: 600px) {
   #savename {width:0px; visibility: hidden; transition: visibility 0.2s; flex: 0 0 auto; border:0; padding:0; background-color:transparent; border:none; color:#000; size:1.5em}
	#savebutton:hover, #savebutton:focus{fill:#444}
 	/*nav input:focus ~ #savebutton {fill:#444 !important} funktionert nicht, da savebutton vor dem input feld ist*/
	nav svg:focus ~ input, #savename:focus{visibility: visible !important; flex: 1 1 auto !important; margin:7px	}
	nav input:focus ~ div, nav svg:focus ~ div{visibility: visible !important;}
	nav svg:focus ~ h1, nav input:focus ~ h1{display:none;}	/*Überschrift ausblenden*/
}
@media (min-width: 600px) {
   #savename {width: 200px;	padding: 15px 20px; color:#000;}
}
#savename{outline:none;}
#savebutton{background-color: #a00019;	padding: 13px 10px; height: 18px; width: 24px; color: #FFF;	fill: #FFF;	flex-shrink: 0; outline: none;}
nav input:focus ~ div{visibility: visible !important;}
#neb{background:#444;color:#fff; overflow-y:scroll; padding:10; left:0; width:100%; visibility: hidden; transition: visibility 0.2s; position:absolute; top:48; z-index:100; max-height: calc( 100% - 48px );}
#neb li {padding:7px; color:#000; float:left}
#neb ul:after { content: "."; clear: both; display: block; visibility: hidden; height: 0px;}
#neb a {color: #fff}
#neb h4, #neb h3{color:#1283f0 }
@media (max-width: 600px) {
   #neb {width:100%; height:100%}
}

/*Menü Dropdown*/ 
#menu_button svg{margin:6}
#menu_button {padding:10; background-color:#a00019}
#menu_button:focus{pointer-events: none; outline:0}
#menu_button:focus #menu{opacity: 1; visibility: visible;  pointer-events: auto;}
#menu_button #path3100{fill:#fff}
#menu_button:hover #path3100, #menu_button:focus #path3100{fill:#444}
#menu{z-index: 100; visibility: hidden;   transition: visibility 0.2s; position:absolute; top:48; right:0; background-color:#444; color:#FFF; overflow:auto; max-height: calc( 100% - 48px );}
#menu button{background: transparent;  border: none;  color: inherit;  cursor: inherit;   outline: 0;   cursor: pointer;	width: 100%;	padding: 17px;	font-size: 18;}
#menu button:hover{color: #000;	background-color:#FFF}
@media (max-width: 600px) {
   #menu {width:100%; height:100%}
	#menu ul:after { content: "."; clear: both; display: block; visibility: hidden; height: 0px;}
	#menu li {float:left}
}
#menu button svg{fill:#fff}
#menu button:hover svg{fill:#444}
#menu ul:first-child{border-bottom:1px solid #fff}

#exit{
  display: none;
}

/*Sidebar*/
#sidebar_buttons{background-color:#444; width:40px}
#sidebar_buttons button{background: transparent;  border: none;  color: inherit;  cursor: inherit;   outline: 0;   cursor: pointer;	width: 100%; height:40px; padding: 6px;	font-size: 18;}
#sidebar_buttons button:hover{color: #000;	background-color:#7d7c7c}
#sidebar_buttons button svg{fill:#fff}
#sidebar_buttons button:hover svg{fill:#000}

.sidebar_button_aktiv {color: #000 !important;	background-color:#FFF !important}
.sidebar_button_aktiv svg{fill:#000 !important}

#sidebar_container{display:flex}
.sidebar_content{width:218px; display:none}
.vis{display:block; flex:1}

#sidebar_save{width:198px;padding:10px}
#sidebar_print{width:198px;padding:10px}
#sidebar_settings{width:198px;padding:10px}
#sidebar_graph p{padding-left:10px}
#sidebar_statistik{width:198px;padding:10px}

#sidebar_drag{height:100%; float:right; width:2px;cursor: col-resize;background-color:black}


/*Allgemeines*/
table{border-collapse: collapse;border:1px solid black;}
td,th{padding:6px;border:1px solid black;}
body, html{margin:0; padding:0;height:100%;overflow: hidden;}

#seite {/*overflow:auto;*/ height:100%;  height: calc(100% - 48px); box-sizing:content-box}
.page{display:none; height:100%;overflow-y:scroll;box-sizing:border-box;}
.pagevis{display:block}

#main{padding:0px;}
.main_container{display:flex; height:100%}

section {padding:20px; }

canvas{height:100%}


#graph_con{overflow-y: scroll; height:100%}

#main{overflow:hidden}


#graph_con_list, #module_container{
	height: 100%;
    box-sizing: border-box;
    margin-top: -110px;
    padding-top: 110px;
	width: 100%;
}

.graph_store{
	border-left: 0px !important;
	display:flex;
}
.graph_store p{
	margin: 0 0 0 10;
}

/*Editor*/
#module_container{
	display: flex;
    
}
#module_single_container{
	display: flex;
    height: 100%;
    box-sizing: border-box;
    margin-top: -110px;
    
	width: 100%;
}

#modul_single_liste img{
	width:100%;
}

#modul_single_liste{
	display:flex;
}
#module_container>div{
	height: 100%;
    overflow-y: scroll;
}
#module_container>div:last-child{
	flex:1;
	margin-left:20px;
}
#modul_single_left{
	overflow-y:scroll;
}
#modul_single_right{
	width:300px;
	overflow-y:scroll;
	min-width:300px;
}
#modul_single_right_gleise{
	padding-left:10px;
}
#modul_single_right_gleise>div>*{
	margin-left:20px;
}
#modul_single_right_gleise>div>h4{
	margin-left:0px;
}
#modul_single_right_gleise>div>h4:before{
	content: " - "
}
details{margin-bottom:5px; margin-top:5px;}


#nubs div {
	position: absolute;
    width: 6px;
    height: 6px;
    margin: -5px;
    background: #3F9FFF;
    background: -moz-linear-gradient(#7FBFFF, #007FFF);
    background: -webkit-gradient(linear, left top, left bottom, from(#7FBFFF), to(#007FFF));
    border: 2px solid white;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
    cursor: move;
}
#nubs div[data-aktiv="true"] {
    background: red;
}