User:Lily/global.css

/************************************************************************/
/**********          classes and id's for bot nav bar          **********/
/************************************************************************/

/* I have learned from here: https://www.w3schools.com/css/css_dropdowns.asp*/

.has-children::after { padding-left: .5em; content: "\25B2\25BC" }  /* Pfeil auf/ab wird hinzugefügt */
.has-more-children::after { padding-left: .5em; content: "\25BA" }
/* The container <div> - needed to position the dropdown content */
.dropdown { position: relative; display: inline-block; white-space: nowrap; }
/* beim Editieren keine Klappmenüs anzeigen, die stören */
.action-edit .dropdown .has-children { display: none; }

/* der anklickbare "Button" in der Navigationsleiste */
.dropbtn { padding: 0 16px; border: none; cursor: pointer; height: 38px; }
/*	Inhalt des Dropdown Kastens (Hidden by Default); line-height: 2em; verringert die Zeilenhöhe für die Drop Down Boxen
	wird nicht angezeigt außer der darüberstehende Button wird gehovert
*/
.dropdown-content { display: none; position: absolute; background-color: #eee; min-width: 100%; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	border: 1px solid #fff;	border-top: none; line-height: 2em; color: MidnightBlue; cursor: pointer; 
	z-index: 1; text-shadow: none; }

/* Links inside the dropdown */
.dropdown-content a { display: block; padding: 0 16px; color: MidnightBlue; }

/* Change color of dropdown links on hover */
.dropdown:hover .dropdown-content { display: block; }

/* Definitionen für Submenu */
/* Links inside the dropdown */
.sub-menu a { display: block; padding: 0 16px; color: indigo; text-shadow: none; }

.dropdown-submenu { position: relative; }
.dropdown-submenu .sub-menu { background-color: #eee; display: none; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	border: 1px solid indigo; }
.dropdown-submenu:hover .sub-menu { display: block; } /* anzeigen wenn hover */


/* show goto save button only when editing */
#only-when-edit { display: none; } /* wenn nicht editieren dann nicht anzeigen */
.action-edit   #only-when-edit{ display: inline; }
.action-submit #only-when-edit{ display: inline; }

#botbar { position: fixed; margin-left: 0; margin-bottom: 0; top: 0; left: 13em; background-color: transparent ; }
/*
background-color: MidnightBlue;
background-image: linear-gradient(145deg, indigo 8%, red 8%, gold 11%, green 15%, MediumSpringGreen 20%, MediumTurquoise 22%, RoyalBlue 28%, MidnightBlue 28%, MidnightBlue 55%, rgba(25, 25, 112,0));
box-shadow: 0 3px 7px #888; } */
#botbar { height: 38px; line-height: 38px; vertical-align: middle; z-index: 100; cursor: pointer; }
#botbar { font-size: 90%; color: #eee; font-family: sans-serif; font-weight: bold; border-radius: 0 19px 19px 0; 
           text-shadow: -1px 0 MidnightBlue, 0 1px MidnightBlue, 1px 0 MidnightBlue, 0 -1px MidnightBlue, 0 0 5px MidnightBlue;; }
#botbar a { color: #eee; text-decoration: none; } /* alle Links weiß einfärben */

/* Change the background color of the dropdown button only when hover */
#botbar .dropbtn:hover { background-color: #eee; color: MidnightBlue; text-shadow: none; }
#botbar .dropbtn:hover a { color: MidnightBlue; }

#botbar .dropdown-content { top: 38px; }

/*	Inhalt des Dropdown Kastens (Hidden by Default); line-height: 2em; verringert die Zeilenhöhe für die Drop Down Boxen
	wird nicht angezeigt außer der darüberstehende Button wird gehovert
*/
#botbar .dropdown-content a { color: MidnightBlue }
#botbar .dropdown-content   { border: 1px solid indigo; }

/* Change color of dropdown links on hover */
#botbar .dropdown-content a:hover { background-color: MidnightBlue; color: #eee; }
.dropdown:hover .dropdown-content { display: block; }

/* Definitionen für Submenu */
#botbar .sub-menu a { color: indigo }
/* Change color of dropdown links on hover */
#botbar .sub-menu a:hover { background-color: indigo; color: #eee; }

#botbar .sub-menu { position: absolute; left: 100%; top: 0; margin-left: 1px }

/* create a separator line */
#botbar .separator-top { border-top: 1px solid indigo; }

/* extra CSS class for draggable navigation bar 
.bottombar { background-color: MidnightBlue;
	background-image: linear-gradient(125deg, magenta, blue, cyan, green, orange, red, magenta); } */
/* der Schatten soll immer bleiben, das schaut cool aus */
#botbar { box-shadow: 0 3px 3px 0 rgba(0,0,0,.35), 0 -1px rgba(25, 25, 112,.35), -1px 0 rgba(25, 25, 112,.35);; } /* 25, 25, 112 MidnightBlue */