WebSVN - LCARS - Blame - Rev 179 - /branches/live/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
179	PointedEar	378	input,
		379	select
		380	{
		381	margin: 0 0.2em 0.2em 0;
		382	font-size: 1em;
		383	}
		384
		385	input
		386	{
		387	min-width: 4.875em;
		388	border: 1px solid #7d7d7d;
		389	padding: 0 0.125em;
		390	background-color: #000;
		391	color: #fff;
		392	}
		393
		394	input:focus
		395	{
		396	border-color: #f90;
		397	}
		398
		399	select
		400	{
		401	min-width: 5em;
		402	background-color: #7d7d7d;
		403	color: #000 !important;
		404	border: none;
		405	}
		406
		407	select:focus
		408	{
		409	background-color: #f90;
		410	color: #000;
		411	}
		412
		413	option {
		414	background-color: #000;
		415	color: #fff;
		416	}
		417
		418	option:checked {
		419	color: #fc6;
		420	}
		421
37	PointedEar	422	.button:visited,
		423	.button
		424	{
		425	position: relative;
		426	display: inline-block;
		427	margin-right: 0.2em;
		428	margin-bottom: 0.2em;
		429	width: 5em;
		430	height: 2em;
		431	background-color: #7d7d7d; /* c9c */
		432	color: #000 !important;
		433	text-decoration: none !important;
		434	text-transform: uppercase;
139	PointedEar	435	/* overflow: hidden; */
83	PointedEar	436	cursor: pointer !important;
37	PointedEar	437	}
		438
		439	.button .text {
		440	position: absolute;
		441	bottom: 0;
		442	right: 0.5em;
83	PointedEar	443	cursor: pointer !important;
37	PointedEar	444	}
		445
		446	.button.command {
		447	border-radius: 1.2em;
		448	}
		449
		450	.button.command .text {
		451	position: absolute;
		452	bottom: 0;
		453	right: 1em;
		454	}
		455
		456	.button:hover,
		457	.button:focus,
		458	.button.selected:hover,
		459	.button.selected:focus,
		460	.group .button:hover,
		461	.group .button:focus,
		462	.group .button:visited:hover,
		463	.group .button:visited:focus
		464	{
		465	background-color: #f90 !important;
		466	color: #000 !important;
		467	}
		468
		469	.button:active,
		470	.button.selected:active,
		471	.group .button:active,
		472	.group .button:visited:active
		473	{
		474	background-color: #fff !important;
		475	color: #000 !important;
		476	}
		477
175	PointedEar	478	.menu bow {
		479	width: 8em;
		480	}
		481
43	PointedEar	482	.menu .button {
37	PointedEar	483	display: block;
		484	width: 8em;
		485	height: 1em;
		486	line-height: 1;
		487	background-color: #9cf;
		488	color: #000 !important;
50	PointedEar	489	text-overflow: ellipsis;
		490	white-space: nowrap;
37	PointedEar	491	}
		492
58	PointedEar	493	#connectors {
		494	position: fixed;
		495	left: 8.4em;
		496	top: 5.6em;
		497	}
		498
119	PointedEar	499	#connectors div {
		500	position: absolute;
		501	}
		502
		503	#connectors .top {
		504	top: 0;
		505	height: 1em;
		506	}
		507
		508	#connectors .mid {
		509	top: 13.6em;
		510	height: 0.8em;
		511	}
		512
		513	#connectors .left {
		514	left: 0;
		515	width: 2em;
		516	}
		517
		518	#connectors .right {
		519	left: 2.2em;
		520	width: 0em;
		521	}
		522
37	PointedEar	523	.multi-display
		524	{
		525	position: fixed;
74	PointedEar	526	top: 2.6em;
119	PointedEar	527	left: 10.6em;
94	PointedEar	528	right: 0;
37	PointedEar	529	}
		530
		531	.multi-display .button
		532	{
		533	width: 5em !important;
		534	}
		535
179	PointedEar	536	#content.fixed {
		537	position: fixed;
		538	margin-right: 0.2em;
		539	top: 12em;
		540	right: 0;
		541	bottom: 0.2em;
		542	left: 16.8em;
		543	overflow: hidden;
		544	}
		545
37	PointedEar	546	.multi-display .upper
		547	{
		548	position: absolute;
		549	top: 0;
		550	left: 0;
		551	right: 0;
94	PointedEar	552	height: 7.5em;
37	PointedEar	553	padding-right: 0.2em;
		554	background-color: black;
		555	}
		556
74	PointedEar	557	.multi-display .upper .content
72	PointedEar	558	{
		559	position: absolute;
		560	top: 0;
74	PointedEar	561	left: 6em;
94	PointedEar	562	bottom: 1.3em;
72	PointedEar	563	right: 0.2em;
		564	background-color: black;
		565	color: white;
74	PointedEar	566	text-align: right;
		567	overflow: hidden;
		568	text-overflow: ellipsis;
		569	}
		570
		571	.multi-display .upper .content .title
		572	{
		573	position: absolute;
		574	top: 0;
94	PointedEar	575	left: 0;
74	PointedEar	576	height: 1em;
94	PointedEar	577	right: 0;
74	PointedEar	578	background-color: black;
		579	color: white;
72	PointedEar	580	font-size: 2.4em;
		581	text-transform: uppercase;
		582	text-align: right;
74	PointedEar	583	overflow: hidden;
72	PointedEar	584	}
		585
74	PointedEar	586	.multi-display .upper .content .title span
37	PointedEar	587	{
74	PointedEar	588	white-space: nowrap;
		589	}
		590
90	PointedEar	591	.multi-display .upper .content .analysis {
		592	position: absolute;
		593	top: 2.4em;
		594	bottom: 0;
		595	right: 11em;
		596	left: 0;
		597	overflow: hidden;
		598	text-align: left;
118	PointedEar	599	cursor: default;
90	PointedEar	600	}
		601
118	PointedEar	602	.multi-display .upper .content .analysis table {
		603	border-collapse: collapse;
		604	line-height: 1.2;
119	PointedEar	605	max-width: 100%;
118	PointedEar	606	}
148	PointedEar	607
118	PointedEar	608	.multi-display .upper .content .analysis th {
120	PointedEar	609	padding: 0 0.4em 0 0.1em;
118	PointedEar	610	font-weight: normal;
		611	text-align: left;
		612	text-transform: uppercase;
		613	white-space: nowrap;
		614	vertical-align: baseline;
		615	}
		616
		617	.multi-display .upper .content .analysis td {
120	PointedEar	618	padding: 0 0.1em 0 0.1em;
118	PointedEar	619	text-overflow: ellipsis;
		620	white-space: nowrap;
		621	vertical-align: baseline;
		622	text-overflow: ellipsis;
		623	}
		624
		625	.multi-display .upper .content .analysis td sup {
		626	line-height: 1;
		627	font-weight: 500;
		628	}
		629
92	PointedEar	630	.multi-display .upper .content .commands
74	PointedEar	631	{
		632	position: absolute;
92	PointedEar	633	margin: 0;
		634	padding: 0;
		635	top: 2.4em;
94	PointedEar	636	right: 0;
92	PointedEar	637	height: 3.8em;
		638	width: 10.2em;
		639	list-style: none;
		640	}
		641
		642	.multi-display .upper .content .commands li
		643	{
		644	position: absolute;
		645	margin: 0;
		646	width: 5em;
74	PointedEar	647	height: 1.8em;
92	PointedEar	648	}
		649
		650	.multi-display .upper .content .commands .button
		651	{
		652	position: absolute;
		653	top: 0;
		654	left: 0;
		655	margin: 0;
		656	height: 1.8em;
		657	border-radius: 0.9em;
74	PointedEar	658	text-transform: none;
		659	}
		660
92	PointedEar	661	.multi-display .upper .content .commands .button .text {
101	PointedEar	662	right: 1em;
74	PointedEar	663	}
		664
		665	.multi-display .upper .content #cmd1
		666	{
92	PointedEar	667	top: 0;
74	PointedEar	668	right: 5.2em;
		669	}
		670
		671	.multi-display .upper .content #cmd2
		672	{
92	PointedEar	673	top: 0;
74	PointedEar	674	right: 0;
		675	}
		676
		677	.multi-display .upper .content #cmd3
		678	{
92	PointedEar	679	top: 2em;
		680	right: 0;
74	PointedEar	681	}
		682
		683	.multi-display .upper .content #cmd4
		684	{
92	PointedEar	685	top: 2em;
		686	right: 5.2em;
74	PointedEar	687	}
		688
		689	.multi-display .upper .elbo-button
		690	{
		691	position: absolute;
		692	top: 0;
		693	left: 0;
		694	width: 5em;
		695	height: 4em;
37	PointedEar	696	background-color: #c9c !important;
72	PointedEar	697	color: #000 !important;
83	PointedEar	698	cursor: default;
37	PointedEar	699	}
		700
74	PointedEar	701	.multi-display .upper .elbo-button .text
72	PointedEar	702	{
		703	position: absolute;
		704	bottom: 0;
		705	right: 0.2em;
102	PointedEar	706	max-width: 4em;
72	PointedEar	707	max-height: 3.6em;
		708	text-align: right;
		709	overflow: hidden;
		710	}
		711
37	PointedEar	712	.multi-display .upper .elbo
		713	{
		714	position: absolute;
		715	left: 0;
74	PointedEar	716	top: 4.2em;
37	PointedEar	717	width: 6em;
		718	height: 3.2em;
		719	border-bottom-left-radius: 2em;
		720	background-color: #9cf;
72	PointedEar	721	color: #000;
37	PointedEar	722	}
		723
72	PointedEar	724	.multi-display .upper .elbo .text
		725	{
		726	position: absolute;
		727	top: 0;
		728	right: 1.2em;
102	PointedEar	729	max-width: 4em;
72	PointedEar	730	max-height: 2.2em;
		731	text-align: right;
		732	overflow: hidden;
83	PointedEar	733	cursor: default;
72	PointedEar	734	}
		735
101	PointedEar	736	.elbo [title],
		737	.button [title]
		738	{
		739	border-bottom: none;
		740	}
		741
37	PointedEar	742	.multi-display .upper .elbo .concave
		743	{
		744	position: absolute;
		745	left: 5em;
		746	top: 0;
103	PointedEar	747	width: 1.1em;
37	PointedEar	748	height: 2.2em;
		749	border-bottom-left-radius: 1em;
		750	background-color: black;
		751	}
		752
80	PointedEar	753	.multi-display .border
		754	{
		755	height: 1em;
		756	}
		757
37	PointedEar	758	.multi-display .upper .border
		759	{
94	PointedEar	760	position: absolute;
		761	top: 6.4em;
		762	left: 6em;
37	PointedEar	763	right: 0.2em;
79	PointedEar	764	}
		765
		766	.multi-display .border div
		767	{
		768	position: absolute;
		769	top: 0;
		770	height: 1em;
		771	}
		772
		773	.multi-display .upper .border div
		774	{
37	PointedEar	775	background-color: #9cf;
80	PointedEar	776	}
79	PointedEar	777
		778	.multi-display .upper .border .left
		779	{
		780	left: 0;
		781	right: 5.2em;
		782	height: 1em;
37	PointedEar	783	}
		784
79	PointedEar	785	.multi-display .upper .border .right
		786	{
		787	width: 5em;
		788	right: 0;
		789	}
		790
37	PointedEar	791	.multi-display .lower
		792	{
		793	position: absolute;
74	PointedEar	794	top: 7.5em;
37	PointedEar	795	left: 0;
94	PointedEar	796	height: 0.1em;
		797	right: 0;
37	PointedEar	798	background-color: black;
		799	}
		800
		801	.multi-display .lower .elbo
		802	{
94	PointedEar	803	position: absolute;
		804	top: 0.1em;
		805	left: 0;
37	PointedEar	806	width: 6em;
		807	height: 3em;
		808	border-top-left-radius: 2em;
		809	background-color: #fc6;
		810	}
		811
		812	.multi-display .lower .elbo .concave
		813	{
		814	position: absolute;
		815	left: 5em;
		816	top: 1em;
103	PointedEar	817	width: 1.1em;
		818	height: 2.1em;
37	PointedEar	819	background-color: black;
		820	border-top-left-radius: 1em;
		821	}
		822
		823	.multi-display .lower .bg
		824	{
		825	position: fixed;
		826	top: 13.4em;
119	PointedEar	827	bottom: 0.2em;
37	PointedEar	828	width: 5em;
		829	background-color: #fc6;
		830	}
		831
		832	.multi-display .lower .border-container
		833	{
94	PointedEar	834	position: absolute;
		835	top: 0.1em;
		836	left: 6em;
		837	right: 0;
37	PointedEar	838	height: 1.2em;
		839	background-color: black;
		840	}
		841
		842	.multi-display .lower .border
		843	{
80	PointedEar	844	position: absolute;
37	PointedEar	845	left: 0;
		846	right: 0.2em;
79	PointedEar	847	}
		848
		849	.multi-display .lower .border div
		850	{
37	PointedEar	851	background-color: #fc6;
		852	}
		853
79	PointedEar	854	.multi-display .lower .border .left
		855	{
		856	left: 0;
80	PointedEar	857	right: 5.2em;
79	PointedEar	858	}
		859
		860	.multi-display .lower .border .right
		861	{
		862	width: 5em;
80	PointedEar	863	right: 0;
79	PointedEar	864	}
		865
43	PointedEar	866	.menu .button.secondary,
		867	.multi-display .lower .elbo.secondary,
		868	.multi-display .lower .bg.secondary,
		869	.multi-display .lower .border.secondary
		870	{
		871	background-color: #f96;
		872	}
		873
		874	.menu .button.ancillary,
		875	.multi-display .lower .elbo.ancillary,
		876	.multi-display .lower .bg.ancillary,
		877	.multi-display .lower .border.ancillary
		878	{
		879	background-color: #c9c;
		880	}
		881
		882	.menu .button.database,
		883	.multi-display .lower .elbo.database,
		884	.multi-display .lower .bg.database,
		885	.multi-display .lower .border.database
		886	{
37	PointedEar	887	background-color: #c66;
		888	}
		889
43	PointedEar	890	.menu .button .text {
37	PointedEar	891	position: static;
		892	margin: 0 0.25em;
		893	}
		894
		895	.button.selected {
		896	background-color: #fc6 !important;
		897	color: #000 !important;
		898	}
		899
		900	.group {
		901	margin: 0 auto;
		902	position: relative;
38	PointedEar	903	width: 7.7em;
37	PointedEar	904	}
		905
		906	.group .separator {
		907	float: left;
		908	position: absolute;
38	PointedEar	909	top: 0;
		910	left: 0;
		911	width: 1.5em;
37	PointedEar	912	height: 100%;
		913	background-color: #c66;
		914	color: #000;
		915	}
		916
		917	.group .separator:after {
		918	position: absolute;
38	PointedEar	919	width: 0.8em;
		920	height: 0.5em;
		921	bottom: 0.25em;
		922	left: 0.25em;
37	PointedEar	923	background-color: #000;
		924	content: "\a0";
		925	}
		926
		927	.group ul {
38	PointedEar	928	margin-left: 1.7em;
37	PointedEar	929	}
		930
		931	.group li {
38	PointedEar	932	margin-bottom: 0;
37	PointedEar	933	}
		934
		935	.group .button:visited,
		936	.group .button
		937	{
38	PointedEar	938	display: block;
37	PointedEar	939	position: relative;
38	PointedEar	940	width: 6em;
37	PointedEar	941	background-color: #99f !important;
		942	}
		943
38	PointedEar	944	.group li:last-child .button
		945	{
		946	margin-bottom: 0;
37	PointedEar	947	}
		948
38	PointedEar	949	.button.right {
		950	border-top-right-radius: 1em;
		951	border-bottom-right-radius: 1em;
37	PointedEar	952	}
		953
38	PointedEar	954	.button.right .text {
		955	right: 1em;
		956	}
		957
		958	.button.left {
		959	border-top-left-radius: 1em;
		960	border-bottom-left-radius: 1em;
		961	}
		962
37	PointedEar	963	.group .button .key {
		964	display: inline-block;
		965	position: absolute;
38	PointedEar	966	left: 0.2em;
37	PointedEar	967	top: 0;
		968	bottom: 0;
38	PointedEar	969	padding: 0 0.1em;
37	PointedEar	970	background-color: #000;
		971	color: #f90;
38	PointedEar	972	font-size: 2.4em;
37	PointedEar	973	text-transform: uppercase;
38	PointedEar	974	line-height: 0.9;
119	PointedEar	975	}
		976
175	PointedEar	977	<?php require_once 'lcars-responsive.css'; ?>

Subversion Repositories LCARS

(root)/branches/live/styles/lcars22.css @ 268 - Rev 179