[bse.git] / t-js / menu.css

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

html {
    text-align: center;
    width: 100%;
}
body {
	width: 100%;
    text-align: left;
    margin: 0 auto;
    padding: 0;
    background-color: #666;
    font: normal normal 0.75em/1.5 "Lucida Sans Unicode", "Lucida Grande", "Helvetica Neue", Helvetica, Arial, Helvetica, sans-serif;
    text-shadow: 0 0.083em 0 #fff;
    color: #585858;
	position: relative;
}


#menu {
	margin: 0;
	padding: 0;
	line-height: 1;
	width: 100%;
	height: 4em;
	
	-webkit-box-shadow: 0 0.1em 0.5em rgba(0,0,0,0.4);
	-moz-box-shadow: 0 0.1em 0.5em rgba(0,0,0,0.4);
	box-shadow: 0 0.1em 0.5em rgba(0,0,0,0.4);

	background: #8b8b8b; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#a9a9a9', endColorstr='#7a7a7a'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#a9a9a9), to(#7a7a7a)); /* for webkit browsers */
	background: -moz-linear-gradient(top, #a9a9a9, #7a7a7a); /* for firefox 3.6+ */

	border-bottom: solid 0.1em #6d6d6d;
	
	z-index: 1000;
	position: fixed;
	top: 0;
	overflow: visible;
}
#nav {
	position: relative;
	z-index: 1001;
	overflow: visible;
}
#nav li {
	margin: 0 0 0 1em;
	padding: 0.75em 0;
	float: left;
	position: relative;
	list-style: none;
}
#nav li li.separate {
	border-bottom: 0.1em solid #b4b4b4;
}
#nav li li.separate+li {
	border-top: 0.1em solid #fff;
}
/* main level link */
#nav a {
	position: relative;
	line-height: 1.5;
	font-weight: bold;
	color: #e7e5e5;
	text-decoration: none;
	display: block;
	margin: -0.1em 0;
	padding: 0.5em 1.5em;
	-webkit-border-radius: 1.5em;
	-moz-border-radius: 1.5em;
	border-radius: 1.5em;
	text-shadow: 0 0.1em 0.1em rgba(0,0,0,0.5);
}
/* main level link hover */
#nav .current > a, #nav li:hover > a {
	background: #d1d1d1; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ebebeb', endColorstr='#a1a1a1'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#a1a1a1)); /* for webkit browsers */
	background: -moz-linear-gradient(top, #ebebeb, #a1a1a1); /* for firefox 3.6+ */

	color: #444;
	border-top: solid 0.1em #f8f8f8;
	-webkit-box-shadow: 0 0.1em 0.1em rgba(0,0,0,0.2);
	-moz-box-shadow: 0 0.1em 0.1em rgba(0,0,0,0.2);
	box-shadow: 0 0.1em 0.1em rgba(0,0,0,0.2);
	text-shadow: 0 0.1em 0.1em rgba(255,255,255,1);
}
/* sub levels link hover */
#nav ul li:hover a, #nav li:hover li a {
	background: none;
	border: none;
	color: #666;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	margin: 0;
}
#nav ul a:hover {
	background: #0399d4 !important; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#04acec', endColorstr='#0186ba'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba)) !important; /* for webkit browsers */
	background: -moz-linear-gradient(top, #04acec, #0186ba) !important; /* for firefox 3.6+ */

	color: #fff !important;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	text-shadow: 0 0.1em 0.1em rgba(0,0,0,0.1);
}
/* level 2 list */
#nav ul {
	background: #ddd; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cfcfcf'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#cfcfcf)); /* for webkit browsers */
	background: -moz-linear-gradient(top, #fff, #cfcfcf); /* for firefox 3.6+ */

	z-index: 100;
	display: none;
	margin: 0;
	padding: 0;
	width: 18em;
	position: absolute;
	top: 3.75em;
	left: 0;
	border: solid 0.1em #b4b4b4;
	-webkit-border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-o-border-radius: 0.5em;
	border-radius: 0.5em;
	-webkit-box-shadow: 0 0.16em 0.5em rgba(0,0,0,0.3);
	-moz-box-shadow: 0 0.16em 0.5em rgba(0,0,0,0.3);
	box-shadow: 0 0.16em 0.5em rgba(0,0,0,0.3);
}
#nav ul ul {
	max-height: 30.16em;
	overflow-y: auto;
	overflow-x: visible;
}
#nav ul.full {
	width: 27em;
}

/* @group widgets */

#nav li>a>span {
	position: absolute;
	top: 0;
	left: 0;
	width: 1.2em;
	height: 100%;
	text-indent: -9999em;
	background: transparent url(../images/move_dk.png) no-repeat 50% 50%;
	background-size: 1.2em;
	display: none;
}
#nav li>a>span+span {
	background-image: url(../images/delete_dk.png);
	background-size: 1.5em;
	width: 1.5em;
	left: auto;
	right: 0.5em;
}
#nav li:hover>a>span {
	display: block;
}

/* @end */

/* @group dropdown */

#nav li:hover > ul {
	display: block;
}
#nav ul li {
	float: none;
	margin: 0;
	padding: 0;
}
#nav ul a {
	font-weight: normal;
	text-shadow: 0 0.1em 0.1em rgba(255,255,255,0.9);
}

/* @end */

/* @group level 3+ list */

#nav ul ul {
	left: 17.5em;
	top: -0.1em;
}
/*#nav ul ul.full {
	left: 35.5em;
}*/

/* @end */

/* @group rounded corners for first and last child */

#nav ul li:first-child > a {
	-webkit-border-top-left-radius: 0.5em;
	-moz-border-radius-topleft: 0.5em;
	border-top-left-radius: 0.5em;
	-webkit-border-top-right-radius: 0.5em;
	-moz-border-radius-topright: 0.5em;
	border-top-right-radius: 0.5em;
}
#nav ul li:last-child > a {
	-webkit-border-bottom-left-radius: 0.5em;
	-moz-border-radius-bottomleft: 0.5em;
	border-bottom-left-radius: 0.5em;
	-webkit-border-bottom-right-radius: 0.5em;
	-moz-border-radius-bottomright: 0.5em;
	border-bottom-right-radius: 0.5em;
}

/* @end */

/* @end */

#nav input { 
  border: none;
  padding: 0px;
}

#tests { margin-top: 10em; }
Commit	Line	Data
0c3d2fc5 TC	1	html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}
	2
	3	html {
	4	text-align: center;
	5	width: 100%;
	6	}
	7	body {
	8	width: 100%;
	9	text-align: left;
	10	margin: 0 auto;
	11	padding: 0;
	12	background-color: #666;
	13	font: normal normal 0.75em/1.5 "Lucida Sans Unicode", "Lucida Grande", "Helvetica Neue", Helvetica, Arial, Helvetica, sans-serif;
	14	text-shadow: 0 0.083em 0 #fff;
	15	color: #585858;
	16	position: relative;
	17	}
	18
	19
	20	#menu {
	21	margin: 0;
	22	padding: 0;
	23	line-height: 1;
	24	width: 100%;
	25	height: 4em;
	26
	27	-webkit-box-shadow: 0 0.1em 0.5em rgba(0,0,0,0.4);
	28	-moz-box-shadow: 0 0.1em 0.5em rgba(0,0,0,0.4);
	29	box-shadow: 0 0.1em 0.5em rgba(0,0,0,0.4);
	30
	31	background: #8b8b8b; /* for non-css3 browsers */
	32	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a9a9a9', endColorstr='#7a7a7a'); /* for IE */
	33	background: -webkit-gradient(linear, left top, left bottom, from(#a9a9a9), to(#7a7a7a)); /* for webkit browsers */
	34	background: -moz-linear-gradient(top, #a9a9a9, #7a7a7a); /* for firefox 3.6+ */
	35
	36	border-bottom: solid 0.1em #6d6d6d;
	37
	38	z-index: 1000;
	39	position: fixed;
	40	top: 0;
	41	overflow: visible;
	42	}
	43	#nav {
	44	position: relative;
	45	z-index: 1001;
	46	overflow: visible;
	47	}
	48	#nav li {
	49	margin: 0 0 0 1em;
	50	padding: 0.75em 0;
	51	float: left;
	52	position: relative;
	53	list-style: none;
	54	}
	55	#nav li li.separate {
	56	border-bottom: 0.1em solid #b4b4b4;
	57	}
	58	#nav li li.separate+li {
	59	border-top: 0.1em solid #fff;
	60	}
	61	/* main level link */
	62	#nav a {
	63	position: relative;
	64	line-height: 1.5;
65	font-weight: bold;
66	color: #e7e5e5;
67	text-decoration: none;
68	display: block;
69	margin: -0.1em 0;
70	padding: 0.5em 1.5em;
71	-webkit-border-radius: 1.5em;
72	-moz-border-radius: 1.5em;
73	border-radius: 1.5em;
74	text-shadow: 0 0.1em 0.1em rgba(0,0,0,0.5);
75	}
76	/* main level link hover */
77	#nav .current > a, #nav li:hover > a {
78	background: #d1d1d1; /* for non-css3 browsers */
79	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ebebeb', endColorstr='#a1a1a1'); /* for IE */
80	background: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#a1a1a1)); /* for webkit browsers */
81	background: -moz-linear-gradient(top, #ebebeb, #a1a1a1); /* for firefox 3.6+ */
82
83	color: #444;
84	border-top: solid 0.1em #f8f8f8;
85	-webkit-box-shadow: 0 0.1em 0.1em rgba(0,0,0,0.2);
86	-moz-box-shadow: 0 0.1em 0.1em rgba(0,0,0,0.2);
87	box-shadow: 0 0.1em 0.1em rgba(0,0,0,0.2);
88	text-shadow: 0 0.1em 0.1em rgba(255,255,255,1);
89	}
90	/* sub levels link hover */
91	#nav ul li:hover a, #nav li:hover li a {
92	background: none;
93	border: none;
94	color: #666;
95	-webkit-box-shadow: none;
96	-moz-box-shadow: none;
97	box-shadow: none;
98	margin: 0;
99	}
100	#nav ul a:hover {
101	background: #0399d4 !important; /* for non-css3 browsers */
102	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#04acec', endColorstr='#0186ba'); /* for IE */
103	background: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba)) !important; /* for webkit browsers */
104	background: -moz-linear-gradient(top, #04acec, #0186ba) !important; /* for firefox 3.6+ */
105
106	color: #fff !important;
107	-webkit-border-radius: 0;
108	-moz-border-radius: 0;
109	border-radius: 0;
110	text-shadow: 0 0.1em 0.1em rgba(0,0,0,0.1);
111	}
112	/* level 2 list */
113	#nav ul {
114	background: #ddd; /* for non-css3 browsers */
115	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cfcfcf'); /* for IE */
116	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#cfcfcf)); /* for webkit browsers */
117	background: -moz-linear-gradient(top, #fff, #cfcfcf); /* for firefox 3.6+ */
118
119	z-index: 100;
120	display: none;
121	margin: 0;
122	padding: 0;
123	width: 18em;
124	position: absolute;
125	top: 3.75em;
126	left: 0;
127	border: solid 0.1em #b4b4b4;
128	-webkit-border-radius: 0.5em;
129	-moz-border-radius: 0.5em;
130	-o-border-radius: 0.5em;
131	border-radius: 0.5em;
132	-webkit-box-shadow: 0 0.16em 0.5em rgba(0,0,0,0.3);
133	-moz-box-shadow: 0 0.16em 0.5em rgba(0,0,0,0.3);
134	box-shadow: 0 0.16em 0.5em rgba(0,0,0,0.3);
135	}
136	#nav ul ul {
137	max-height: 30.16em;
138	overflow-y: auto;
139	overflow-x: visible;
140	}
141	#nav ul.full {
142	width: 27em;
143	}
144
145	/* @group widgets */
146
147	#nav li>a>span {
148	position: absolute;
149	top: 0;
150	left: 0;
151	width: 1.2em;
152	height: 100%;
153	text-indent: -9999em;
154	background: transparent url(../images/move_dk.png) no-repeat 50% 50%;
155	background-size: 1.2em;
156	display: none;
157	}
158	#nav li>a>span+span {
159	background-image: url(../images/delete_dk.png);
160	background-size: 1.5em;
161	width: 1.5em;
162	left: auto;
163	right: 0.5em;
164	}
165	#nav li:hover>a>span {
166	display: block;
167	}
168
169	/* @end */
170
171	/* @group dropdown */
172
173	#nav li:hover > ul {
174	display: block;
175	}
176	#nav ul li {
177	float: none;
178	margin: 0;
179	padding: 0;
180	}
181	#nav ul a {
182	font-weight: normal;
183	text-shadow: 0 0.1em 0.1em rgba(255,255,255,0.9);
184	}
185
186	/* @end */
187
188	/* @group level 3+ list */
189
190	#nav ul ul {
191	left: 17.5em;
192	top: -0.1em;
193	}
194	/*#nav ul ul.full {
195	left: 35.5em;
196	}*/
197
198	/* @end */
199
200	/* @group rounded corners for first and last child */
201
202	#nav ul li:first-child > a {
203	-webkit-border-top-left-radius: 0.5em;
204	-moz-border-radius-topleft: 0.5em;
205	border-top-left-radius: 0.5em;
206	-webkit-border-top-right-radius: 0.5em;
207	-moz-border-radius-topright: 0.5em;
208	border-top-right-radius: 0.5em;
209	}
210	#nav ul li:last-child > a {
211	-webkit-border-bottom-left-radius: 0.5em;
212	-moz-border-radius-bottomleft: 0.5em;
213	border-bottom-left-radius: 0.5em;
214	-webkit-border-bottom-right-radius: 0.5em;
215	-moz-border-radius-bottomright: 0.5em;
216	border-bottom-right-radius: 0.5em;
217	}
218
219	/* @end */
220
221	/* @end */
222
223	#nav input {
224	border: none;
225	padding: 0px;
226	}
227
228	#tests { margin-top: 10em; }