WebSVN - LCARS - Blame - Rev 175 - /trunk/styles/lcars22.css

Rev	Author	Line No.	Line
50	PointedEar	1	<?php
125	PointedEar	2	@\header('Last-Modified: ' . gmdate('D, d M Y H:i:s', @filemtime(__FILE__)) . ' GMT');
50	PointedEar	3
116	PointedEar	4	/* Resource expires in HTTP/1.1 caches 24h after last retrieval */
125	PointedEar	5	@\header('Cache-Control: max-age=86400, s-maxage=86400, must-revalidate, proxy-revalidate');
58	PointedEar	6
116	PointedEar	7	/* Resource expires in HTTP/1.0 caches 24h after last retrieval */
125	PointedEar	8	@\header('Expires: ' . gmdate('D, d M Y H:i:s', time() + 86400) . ' GMT');
58	PointedEar	9
125	PointedEar	10	@\header('Content-Type: text/css; charset=UTF-8');
119	PointedEar	11
		12	require_once 'css/least/Mixins.php';
169	PointedEar	13	use de\pointedears\css\least\Mixins;
79	PointedEar	14	?>@charset "UTF-8";
37	PointedEar	15
58	PointedEar	16	<?php
		17	if (!isset($_GET['ani']) \|\| $_GET['ani'] !== '0')
		18	{
123	PointedEar	19	/* Optional general animations */
58	PointedEar	20	?>
79	PointedEar	21	@import url("/styles/lcars-ani.css");
58	PointedEar	22	<?php
		23	}
		24	?>
123	PointedEar	25
		26	<?php
		27	/* Non-optional content-specific animations */
		28	Mixins::keyframes('analysis', <<<CSS
		29	from, 74% {
		30	opacity: 0;
		31	}
		32
		33	75%, to {
		34	opacity: 1;
		35	color: #fc6;
		36	}
		37	CSS
		38	);
		39	?>
		40
		41	<?php
		42	Mixins::keyframes('analysis-scan', <<<CSS
		43	from, 25% {
		44	color: #fc6;
		45	}
		46
		47	26%, to {
		48	color: #fff;
		49	}
		50	CSS
		51	);
		52
		53	/* FIXME: :hover hides first row */
		54	/*
		55	.multi-display .upper .content .analysis:hover tr {
		56	<?php
		57	Mixins::animation('-play-state', 'paused');
148	PointedEar	58	?>
123	PointedEar	59	}
		60	*/
148	PointedEar	61	?>
		62
		63	.multi-display .upper .content .analysis tr:hover
		64	{
		65	color: #f90 !important;
		66	}
		67
123	PointedEar	68	/* Blink rate 1 Hz should be safe for people with photosensitive epilepsy */
148	PointedEar	69	.multi-display .upper .content .analysis tr:nth-child(1)
123	PointedEar	70	{
		71	<?php
		72	Mixins::animation('', 'analysis 1.5s linear 0s, analysis-scan 4s linear 2.0s infinite');
		73	?>
		74	}
		75
148	PointedEar	76	.multi-display .upper .content .analysis tr:nth-child(2)
123	PointedEar	77	{
		78	<?php
		79	Mixins::animation('', 'analysis 1.5s linear 0.25s, analysis-scan 4s linear 3.0s infinite');
		80	?>
		81	}
		82
148	PointedEar	83	.multi-display .upper .content .analysis tr:nth-child(3)
123	PointedEar	84	{
		85	<?php
		86	Mixins::animation('', 'analysis 1.5s linear 0.5s, analysis-scan 4s linear 4.0s infinite');
		87	?>
		88	}
		89
144	PointedEar	90	<?php
		91	Mixins::keyframes('analysis-offline', <<<CSS
		92	from, 33% {
		93	color: #300;
		94	}
		95
		96	34%, to {
		97	color: #f00;
		98	}
		99	CSS
		100	);
		101	?>
		102
		103	.offline {
		104	<?php
		105	Mixins::animation('', 'analysis-offline 3s linear 2.0s infinite');
		106	?>
		107	}
		108
37	PointedEar	109	body {
		110	margin-top: 12em;
119	PointedEar	111	margin-left: 16.8em;
37	PointedEar	112	margin-right: 0.2em;
		113	margin-bottom: 0.2em;
		114	}
		115
116	PointedEar	116	/* HTML5 elements */
		117
		118	nav
		119	{
		120	display: block;
		121	}
		122
37	PointedEar	123	/* Bow (main) and elbo (multi-view) */
		124
		125	#LCARS {
		126	position: fixed;
		127	left: 0;
		128	top: 0;
		129	right: 0;
		130	padding: 0.2em;
		131	background-color: #000;
		132	z-index: 1701;
		133	}
		134
		135	#bow {
		136	position: absolute;
		137	left: 0.2em;
		138	top: 0.2em;
		139	right: 0.2em;
		140	height: 2.4em;
		141	padding-bottom: 0.2em;
		142	background-color: #000;
		143	}
		144
		145	#bow-top {
		146	/* NOTE: position: absolute is needed for animation */
		147	position: absolute;
		148	top: 0;
		149	left: 0;
		150	right: 0;
		151	min-width: 15.4em;
		152	height: 2em;
		153	background-color: #999;
		154	border-top-left-radius: 2.4em;
		155	border-top-right-radius: 1.2em;
		156	border-bottom-right-radius: 1.2em;
		157	line-height: 0.9;
		158	}
		159
		160	.empty #bow-top {
		161	border-top-left-radius: 1.2em;
		162	border-bottom-left-radius: 1.2em;
38	PointedEar	163	min-width: 10em;
37	PointedEar	164	}
		165
		166
		167	#bow-top .text {
		168	position: absolute;
		169	margin: 0;
		170	left: 4.33em;
		171	top: 0;
40	PointedEar	172	right: 0.75em;
37	PointedEar	173	height: 1em;
		174	text-align: right;
		175	color: #fc0;
		176	font-size: 2.4em;
		177	padding-right: 0.1em;
		178	overflow: hidden;
		179	text-overflow: ellipsis;
		180	}
		181
38	PointedEar	182	.empty #bow-top .text {
		183	left: 0.93em;
		184	}
		185
37	PointedEar	186
		187
		188	#bow-top .text span {
		189	padding-right: 0.1em;
		190	background-color: #000;
		191	padding-left: 0.1em;
		192	text-transform: uppercase;
		193	white-space: nowrap;
		194	}
		195
38	PointedEar	196	.empty #footer-container {
		197	position: fixed;
		198	left: 0.2em;
		199	bottom: 0;
		200	right: 0.2em;
		201	min-height: 2.4em;
		202	padding-top: 0.2em;
		203	padding-bottom: 0.2em;
		204	background-color: #000;
		205	}
		206
40	PointedEar	207
38	PointedEar	208	.empty #footer {
		209	position: absolute;
		210	bottom: 0;
		211	left: 0;
		212	right: 0;
		213	height: 2em;
40	PointedEar	214	min-width: 10em;
38	PointedEar	215	margin-bottom: 0.2em;
		216	background-color: #999;
		217	border-radius: 1.2em;
40	PointedEar	218	line-height: 0.9;
38	PointedEar	219	}
		220
		221	.empty #footer .text {
		222	position: absolute;
40	PointedEar	223	margin: 0;
		224	left: 0.93em;
		225	top: 0;
		226	right: 0.75em;
		227	height: 1em;
		228	background-color: transparent;
38	PointedEar	229	color: #fc0;
40	PointedEar	230	font-size: 2.4em;
38	PointedEar	231	padding-right: 0.1em;
		232	overflow: hidden;
		233	text-overflow: ellipsis;
		234	}
		235
		236	.empty #footer .text span {
		237	padding-right: 0.1em;
40	PointedEar	238	background-color: #000;
38	PointedEar	239	padding-left: 0.1em;
		240	text-transform: uppercase;
		241	white-space: nowrap;
		242	}
		243
37	PointedEar	244	.empty .separator-left {
		245	position: absolute;
		246	left: 2em;
		247	height: 2em;
		248	width: 0.25em;
		249	background-color: #000;
		250	}
		251
		252	.empty .separator-right {
		253	position: absolute;
		254	right: 2em;
		255	height: 2em;
		256	width: 0.25em;
		257	background-color: #000;
		258	}
		259
58	PointedEar	260	.bow {
		261	background-color: #999;
		262	}
		263
37	PointedEar	264	#bow-top-left {
		265	position: absolute;
		266	top: 2em;
		267	left: 0;
		268	right: 0;
109	PointedEar	269	height: 4.4em;
37	PointedEar	270	width: 9.2em;
		271	background-color: #999;
109	PointedEar	272	overflow: hidden;
37	PointedEar	273	}
		274
		275	.empty #bow-top-left {
		276	display: none;
		277	}
		278
		279	#bow-top-left .concave {
		280	position: absolute;
		281	top: 0;
		282	left: 8em;
109	PointedEar	283	height: 4.4em;
37	PointedEar	284	width: 1.2em;
		285	background-color: #000;
		286	border-top-left-radius: 1.2em;
		287	}
		288
		289	.empty #bow-top-left-concave {
		290	display: none;
		291	}
		292
50	PointedEar	293	.menu-container {
43	PointedEar	294	position: fixed;
		295	left: 0.2em;
109	PointedEar	296	top: 6.8em;
43	PointedEar	297	width: 8em;
		298	bottom: 2.8em;
		299	background-color: #999;
37	PointedEar	300	overflow: auto;
109	PointedEar	301	overflow-x: hidden;
		302	overflow-y: auto;
37	PointedEar	303	}
		304
50	PointedEar	305	.menu
43	PointedEar	306	{
167	PointedEar	307	height: 23.6em;
43	PointedEar	308	background-color: #000;
		309	}
		310
		311	.menu ul {
103	PointedEar	312	margin: 0 0.2em 0 0;
37	PointedEar	313	padding: 0;
		314	}
		315
175	PointedEar	316	.menu ul:first-child {
		317	padding-top: 1em;
		318	}
		319
43	PointedEar	320	.menu li {
37	PointedEar	321	margin: 0;
		322	}
		323
		324	#bow #bottom
		325	{
		326	position: fixed;
		327	left: 0;
		328	bottom: 0;
119	PointedEar	329	width: 10.4em;
37	PointedEar	330	height: 2.4em;
		331	background-color: #000;
		332	z-index: 1701;
		333	}
		334
		335	#bow-bottom {
		336	position: absolute;
		337	bottom: 0.2em;
		338	left: 0.2em;
119	PointedEar	339	width: 8em;
167	PointedEar	340	height: 2.4em;
119	PointedEar	341	border-bottom-left-radius: 0em;
		342	border-bottom-right-radius: 0em;
37	PointedEar	343	background-color: #999;
		344	}
		345
		346	.empty #bow-bottom {
		347	display: none;
		348	}
		349
		350	#bow-bottom .concave {
		351	position: absolute;
		352	margin-left: 0.2em;
		353	margin-bottom: 0.2em;
		354	bottom: 0.3em;
		355	left: 7.8em;
		356	height: 2.1em;
119	PointedEar	357	width: 2.2em;
37	PointedEar	358	border-bottom-left-radius: 1.2em;
		359	border-bottom-right-radius: 1em;
		360	background-color: #000;
		361	}
		362
38	PointedEar	363	#bow-bottom .spacer {
37	PointedEar	364	position: absolute;
38	PointedEar	365	left: 10.2em;
94	PointedEar	366	bottom: 0;
38	PointedEar	367	width: 0.2em;
		368	height: 0.5em;
		369	background-color: black;
37	PointedEar	370	}
		371
38	PointedEar	372	.empty #bow-bottom-left-concave {
		373	display: none;
37	PointedEar	374	}
		375
		376	/* Controls */
		377
		378	.button:visited,
		379	.button
		380	{
		381	position: relative;
		382	display: inline-block;
		383	margin-right: 0.2em;
		384	margin-bottom: 0.2em;
		385	width: 5em;
		386	height: 2em;
		387	background-color: #7d7d7d; /* c9c */
		388	color: #000 !important;
		389	text-decoration: none !important;
		390	text-transform: uppercase;
139	PointedEar	391	/* overflow: hidden; */
83	PointedEar	392	cursor: pointer !important;
37	PointedEar	393	}
		394
		395	.button .text {
		396	position: absolute;
		397	bottom: 0;
		398	right: 0.5em;
83	PointedEar	399	cursor: pointer !important;
37	PointedEar	400	}
		401
		402	.button.command {
		403	border-radius: 1.2em;
		404	}
		405
		406	.button.command .text {
		407	position: absolute;
		408	bottom: 0;
		409	right: 1em;
		410	}
		411
		412	.button:hover,
		413	.button:focus,
		414	.button.selected:hover,
		415	.button.selected:focus,
		416	.group .button:hover,
		417	.group .button:focus,
		418	.group .button:visited:hover,
		419	.group .button:visited:focus
		420	{
		421	background-color: #f90 !important;
		422	color: #000 !important;
		423	}
		424
		425	.button:active,
		426	.button.selected:active,
		427	.group .button:active,
		428	.group .button:visited:active
		429	{
		430	background-color: #fff !important;
		431	color: #000 !important;
		432	}
		433
175	PointedEar	434	.menu bow {
		435	width: 8em;
		436	}
		437
43	PointedEar	438	.menu .button {
37	PointedEar	439	display: block;
		440	width: 8em;
		441	height: 1em;
		442	line-height: 1;
		443	background-color: #9cf;
		444	color: #000 !important;
50	PointedEar	445	text-overflow: ellipsis;
		446	white-space: nowrap;
37	PointedEar	447	}
		448
58	PointedEar	449	#connectors {
		450	position: fixed;
		451	left: 8.4em;
		452	top: 5.6em;
		453	}
		454
119	PointedEar	455	#connectors div {
		456	position: absolute;
		457	}
		458
		459	#connectors .top {
		460	top: 0;
		461	height: 1em;
		462	}
		463
		464	#connectors .mid {
		465	top: 13.6em;
		466	height: 0.8em;
		467	}
		468
		469	#connectors .left {
		470	left: 0;
		471	width: 2em;
		472	}
		473
		474	#connectors .right {
		475	left: 2.2em;
		476	width: 0em;
		477	}
		478
37	PointedEar	479	.multi-display
		480	{
		481	position: fixed;
74	PointedEar	482	top: 2.6em;
119	PointedEar	483	left: 10.6em;
94	PointedEar	484	right: 0;
37	PointedEar	485	}
		486
		487	.multi-display .button
		488	{
		489	width: 5em !important;
		490	}
		491
		492	.multi-display .upper
		493	{
		494	position: absolute;
		495	top: 0;
		496	left: 0;
		497	right: 0;
94	PointedEar	498	height: 7.5em;
37	PointedEar	499	padding-right: 0.2em;
		500	background-color: black;
		501	}
		502
74	PointedEar	503	.multi-display .upper .content
72	PointedEar	504	{
		505	position: absolute;
		506	top: 0;
74	PointedEar	507	left: 6em;
94	PointedEar	508	bottom: 1.3em;
72	PointedEar	509	right: 0.2em;
		510	background-color: black;
		511	color: white;
74	PointedEar	512	text-align: right;
		513	overflow: hidden;
		514	text-overflow: ellipsis;
		515	}
		516
		517	.multi-display .upper .content .title
		518	{
		519	position: absolute;
		520	top: 0;
94	PointedEar	521	left: 0;
74	PointedEar	522	height: 1em;
94	PointedEar	523	right: 0;
74	PointedEar	524	background-color: black;
		525	color: white;
72	PointedEar	526	font-size: 2.4em;
		527	text-transform: uppercase;
		528	text-align: right;
74	PointedEar	529	overflow: hidden;
72	PointedEar	530	}
		531
74	PointedEar	532	.multi-display .upper .content .title span
37	PointedEar	533	{
74	PointedEar	534	white-space: nowrap;
		535	}
		536
90	PointedEar	537	.multi-display .upper .content .analysis {
		538	position: absolute;
		539	top: 2.4em;
		540	bottom: 0;
		541	right: 11em;
		542	left: 0;
		543	overflow: hidden;
		544	text-align: left;
118	PointedEar	545	cursor: default;
90	PointedEar	546	}
		547
118	PointedEar	548	.multi-display .upper .content .analysis table {
		549	border-collapse: collapse;
		550	line-height: 1.2;
119	PointedEar	551	max-width: 100%;
118	PointedEar	552	}
148	PointedEar	553
118	PointedEar	554	.multi-display .upper .content .analysis th {
120	PointedEar	555	padding: 0 0.4em 0 0.1em;
118	PointedEar	556	font-weight: normal;
		557	text-align: left;
		558	text-transform: uppercase;
		559	white-space: nowrap;
		560	vertical-align: baseline;
		561	}
		562
		563	.multi-display .upper .content .analysis td {
120	PointedEar	564	padding: 0 0.1em 0 0.1em;
118	PointedEar	565	text-overflow: ellipsis;
		566	white-space: nowrap;
		567	vertical-align: baseline;
		568	text-overflow: ellipsis;
		569	}
		570
		571	.multi-display .upper .content .analysis td sup {
		572	line-height: 1;
		573	font-weight: 500;
		574	}
		575
92	PointedEar	576	.multi-display .upper .content .commands
74	PointedEar	577	{
		578	position: absolute;
92	PointedEar	579	margin: 0;
		580	padding: 0;
		581	top: 2.4em;
94	PointedEar	582	right: 0;
92	PointedEar	583	height: 3.8em;
		584	width: 10.2em;
		585	list-style: none;
		586	}
		587
		588	.multi-display .upper .content .commands li
		589	{
		590	position: absolute;
		591	margin: 0;
		592	width: 5em;
74	PointedEar	593	height: 1.8em;
92	PointedEar	594	}
		595
		596	.multi-display .upper .content .commands .button
		597	{
		598	position: absolute;
		599	top: 0;
		600	left: 0;
		601	margin: 0;
		602	height: 1.8em;
		603	border-radius: 0.9em;
74	PointedEar	604	text-transform: none;
		605	}
		606
92	PointedEar	607	.multi-display .upper .content .commands .button .text {
101	PointedEar	608	right: 1em;
74	PointedEar	609	}
		610
		611	.multi-display .upper .content #cmd1
		612	{
92	PointedEar	613	top: 0;
74	PointedEar	614	right: 5.2em;
		615	}
		616
		617	.multi-display .upper .content #cmd2
		618	{
92	PointedEar	619	top: 0;
74	PointedEar	620	right: 0;
		621	}
		622
		623	.multi-display .upper .content #cmd3
		624	{
92	PointedEar	625	top: 2em;
		626	right: 0;
74	PointedEar	627	}
		628
		629	.multi-display .upper .content #cmd4
		630	{
92	PointedEar	631	top: 2em;
		632	right: 5.2em;
74	PointedEar	633	}
		634
		635	.multi-display .upper .elbo-button
		636	{
		637	position: absolute;
		638	top: 0;
		639	left: 0;
		640	width: 5em;
		641	height: 4em;
37	PointedEar	642	background-color: #c9c !important;
72	PointedEar	643	color: #000 !important;
83	PointedEar	644	cursor: default;
37	PointedEar	645	}
		646
74	PointedEar	647	.multi-display .upper .elbo-button .text
72	PointedEar	648	{
		649	position: absolute;
		650	bottom: 0;
		651	right: 0.2em;
102	PointedEar	652	max-width: 4em;
72	PointedEar	653	max-height: 3.6em;
		654	text-align: right;
		655	overflow: hidden;
		656	}
		657
37	PointedEar	658	.multi-display .upper .elbo
		659	{
		660	position: absolute;
		661	left: 0;
74	PointedEar	662	top: 4.2em;
37	PointedEar	663	width: 6em;
		664	height: 3.2em;
		665	border-bottom-left-radius: 2em;
		666	background-color: #9cf;
72	PointedEar	667	color: #000;
37	PointedEar	668	}
		669
72	PointedEar	670	.multi-display .upper .elbo .text
		671	{
		672	position: absolute;
		673	top: 0;
		674	right: 1.2em;
102	PointedEar	675	max-width: 4em;
72	PointedEar	676	max-height: 2.2em;
		677	text-align: right;
		678	overflow: hidden;
83	PointedEar	679	cursor: default;
72	PointedEar	680	}
		681
101	PointedEar	682	.elbo [title],
		683	.button [title]
		684	{
		685	border-bottom: none;
		686	}
		687
37	PointedEar	688	.multi-display .upper .elbo .concave
		689	{
		690	position: absolute;
		691	left: 5em;
		692	top: 0;
103	PointedEar	693	width: 1.1em;
37	PointedEar	694	height: 2.2em;
		695	border-bottom-left-radius: 1em;
		696	background-color: black;
		697	}
		698
80	PointedEar	699	.multi-display .border
		700	{
		701	height: 1em;
		702	}
		703
37	PointedEar	704	.multi-display .upper .border
		705	{
94	PointedEar	706	position: absolute;
		707	top: 6.4em;
		708	left: 6em;
37	PointedEar	709	right: 0.2em;
79	PointedEar	710	}
		711
		712	.multi-display .border div
		713	{
		714	position: absolute;
		715	top: 0;
		716	height: 1em;
		717	}
		718
		719	.multi-display .upper .border div
		720	{
37	PointedEar	721	background-color: #9cf;
80	PointedEar	722	}
79	PointedEar	723
		724	.multi-display .upper .border .left
		725	{
		726	left: 0;
		727	right: 5.2em;
		728	height: 1em;
37	PointedEar	729	}
		730
79	PointedEar	731	.multi-display .upper .border .right
		732	{
		733	width: 5em;
		734	right: 0;
		735	}
		736
37	PointedEar	737	.multi-display .lower
		738	{
		739	position: absolute;
74	PointedEar	740	top: 7.5em;
37	PointedEar	741	left: 0;
94	PointedEar	742	height: 0.1em;
		743	right: 0;
37	PointedEar	744	background-color: black;
		745	}
		746
		747	.multi-display .lower .elbo
		748	{
94	PointedEar	749	position: absolute;
		750	top: 0.1em;
		751	left: 0;
37	PointedEar	752	width: 6em;
		753	height: 3em;
		754	border-top-left-radius: 2em;
		755	background-color: #fc6;
		756	}
		757
		758	.multi-display .lower .elbo .concave
		759	{
		760	position: absolute;
		761	left: 5em;
		762	top: 1em;
103	PointedEar	763	width: 1.1em;
		764	height: 2.1em;
37	PointedEar	765	background-color: black;
		766	border-top-left-radius: 1em;
		767	}
		768
		769	.multi-display .lower .bg
		770	{
		771	position: fixed;
		772	top: 13.4em;
119	PointedEar	773	bottom: 0.2em;
37	PointedEar	774	width: 5em;
		775	background-color: #fc6;
		776	}
		777
		778	.multi-display .lower .border-container
		779	{
94	PointedEar	780	position: absolute;
		781	top: 0.1em;
		782	left: 6em;
		783	right: 0;
37	PointedEar	784	height: 1.2em;
		785	background-color: black;
		786	}
		787
		788	.multi-display .lower .border
		789	{
80	PointedEar	790	position: absolute;
37	PointedEar	791	left: 0;
		792	right: 0.2em;
79	PointedEar	793	}
		794
		795	.multi-display .lower .border div
		796	{
37	PointedEar	797	background-color: #fc6;
		798	}
		799
79	PointedEar	800	.multi-display .lower .border .left
		801	{
		802	left: 0;
80	PointedEar	803	right: 5.2em;
79	PointedEar	804	}
		805
		806	.multi-display .lower .border .right
		807	{
		808	width: 5em;
80	PointedEar	809	right: 0;
79	PointedEar	810	}
		811
43	PointedEar	812	.menu .button.secondary,
		813	.multi-display .lower .elbo.secondary,
		814	.multi-display .lower .bg.secondary,
		815	.multi-display .lower .border.secondary
		816	{
		817	background-color: #f96;
		818	}
		819
		820	.menu .button.ancillary,
		821	.multi-display .lower .elbo.ancillary,
		822	.multi-display .lower .bg.ancillary,
		823	.multi-display .lower .border.ancillary
		824	{
		825	background-color: #c9c;
		826	}
		827
		828	.menu .button.database,
		829	.multi-display .lower .elbo.database,
		830	.multi-display .lower .bg.database,
		831	.multi-display .lower .border.database
		832	{
37	PointedEar	833	background-color: #c66;
		834	}
		835
43	PointedEar	836	.menu .button .text {
37	PointedEar	837	position: static;
		838	margin: 0 0.25em;
		839	}
		840
		841	.button.selected {
		842	background-color: #fc6 !important;
		843	color: #000 !important;
		844	}
		845
		846	.group {
		847	margin: 0 auto;
		848	position: relative;
38	PointedEar	849	width: 7.7em;
37	PointedEar	850	}
		851
		852	.group .separator {
		853	float: left;
		854	position: absolute;
38	PointedEar	855	top: 0;
		856	left: 0;
		857	width: 1.5em;
37	PointedEar	858	height: 100%;
		859	background-color: #c66;
		860	color: #000;
		861	}
		862
		863	.group .separator:after {
		864	position: absolute;
38	PointedEar	865	width: 0.8em;
		866	height: 0.5em;
		867	bottom: 0.25em;
		868	left: 0.25em;
37	PointedEar	869	background-color: #000;
		870	content: "\a0";
		871	}
		872
		873	.group ul {
38	PointedEar	874	margin-left: 1.7em;
37	PointedEar	875	}
		876
		877	.group li {
38	PointedEar	878	margin-bottom: 0;
37	PointedEar	879	}
		880
		881	.group .button:visited,
		882	.group .button
		883	{
38	PointedEar	884	display: block;
37	PointedEar	885	position: relative;
38	PointedEar	886	width: 6em;
37	PointedEar	887	background-color: #99f !important;
		888	}
		889
38	PointedEar	890	.group li:last-child .button
		891	{
		892	margin-bottom: 0;
37	PointedEar	893	}
		894
38	PointedEar	895	.button.right {
		896	border-top-right-radius: 1em;
		897	border-bottom-right-radius: 1em;
37	PointedEar	898	}
		899
38	PointedEar	900	.button.right .text {
		901	right: 1em;
		902	}
		903
		904	.button.left {
		905	border-top-left-radius: 1em;
		906	border-bottom-left-radius: 1em;
		907	}
		908
37	PointedEar	909	.group .button .key {
		910	display: inline-block;
		911	position: absolute;
38	PointedEar	912	left: 0.2em;
37	PointedEar	913	top: 0;
		914	bottom: 0;
38	PointedEar	915	padding: 0 0.1em;
37	PointedEar	916	background-color: #000;
		917	color: #f90;
38	PointedEar	918	font-size: 2.4em;
37	PointedEar	919	text-transform: uppercase;
38	PointedEar	920	line-height: 0.9;
119	PointedEar	921	}
		922
175	PointedEar	923	<?php require_once 'lcars-responsive.css'; ?>

Subversion Repositories LCARS

(root)/trunk/styles/lcars22.css @ 150 - Rev 175