seigler.github.io/csszengarden/console/001/001.89ad508e.css

/* css Zen Garden new style by Joshua Seigler -http://www.seigler.net/ */
/* css released under Creative Commons License -http://creativecommons.org/licenses/by-nc-sa/1.0/  */

/* basic elements */
html {
	margin: 0;
	padding: 0;
	height: 100%;
}

body {
	color: #eee;
	text-shadow: #eee 0 0 2px;
	font-family: FreePixelCSSZenGarden,monospace;
	font-size: 24pt;
	line-height: 1.1em;
	padding: 0;
	margin: 0;
	height: 100%;
	border: none;
	cursor: default;

	/* gradient generated by http://www.colorzilla.com/gradient-editor/#05070c+10,4b574a+18,323c31+53,141817+82;Custom */
	background: #282E22;
	background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxMCUiIHN0b3AtY29sb3I9IiMwNTA3MGMiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxOCUiIHN0b3AtY29sb3I9IiM0YjU3NGEiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI1MyUiIHN0b3AtY29sb3I9IiMzMjNjMzEiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI4MiUiIHN0b3AtY29sb3I9IiMxNDE4MTciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+");
	background: -moz-linear-gradient(left, rgba(5,7,12,1) 10%, rgba(75,87,74,1) 18%, rgba(50,60,49,1) 53%, rgba(20,24,23,1) 82%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(10%,rgba(5,7,12,1)), color-stop(18%,rgba(75,87,74,1)), color-stop(53%,rgba(50,60,49,1)), color-stop(82%,rgba(20,24,23,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, rgba(5,7,12,1) 10%,rgba(75,87,74,1) 18%,rgba(50,60,49,1) 53%,rgba(20,24,23,1) 82%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, rgba(5,7,12,1) 10%,rgba(75,87,74,1) 18%,rgba(50,60,49,1) 53%,rgba(20,24,23,1) 82%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left, rgba(5,7,12,1) 10%,rgba(75,87,74,1) 18%,rgba(50,60,49,1) 53%,rgba(20,24,23,1) 82%); /* IE10+ */
	background: linear-gradient(to right, rgba(5,7,12,1) 10%,rgba(75,87,74,1) 18%,rgba(50,60,49,1) 53%,rgba(20,24,23,1) 82%); /* W3C */

	overflow-x: hidden;
}

header, section, div, aside {
	display: block;
}

header {
	margin: 25px 0;
	border-bottom: 3px solid rgba(239,239,239,0.5);
	clear: both;
}

h1,h2,h3 {
	font-weight: 400;
	font-family: pixChicagoCSSZenGarden,monospace;
	margin: 0;
	padding: 0;
	line-height: 1.5em;
}

h1 {
	font-size: 200%;
}

h2 {
	font-size: 16px;
	margin: 0 0 8px;
}

h3 {
	font-size: 100%;
	margin: 2em 0 0.8em;
}

a {
	color: inherit;
}

a:link {
	cursor: pointer;
}

a:link:hover {
	background-color: rgba(0,0,255,0.5);
}

a:visited:hover {
	background-color: rgba(127,0,127,0.5);
}

body:before {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: -2;

	background: -webkit-linear-gradient(-5deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 49.5%, rgba(255,255,255,0.125) 50%, rgba(255,255,255,0) 50.5%, rgba(255,255,255,0) 100%);
	background: -moz-linear-gradient(-5deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 49.5%, rgba(255,255,255,0.125) 50%, rgba(255,255,255,0) 50.5%, rgba(255,255,255,0) 100%);
	background: -o-linear-gradient(-5deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 49.5%, rgba(255,255,255,0.125) 50%, rgba(255,255,255,0) 50.5%, rgba(255,255,255,0) 100%);
	background: -ms-linear-gradient(-5deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 49.5%, rgba(255,255,255,0.125) 50%, rgba(255,255,255,0) 50.5%, rgba(255,255,255,0) 100%);
	background: linear-gradient(-5deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 49.5%, rgba(255,255,255,0.125) 50%, rgba(255,255,255,0) 50.5%, rgba(255,255,255,0) 100%);
	background-repeat: repeat;

	-webkit-background-size: 2000px 175px;
	-moz-background-size: 2000px 175px;
	background-size: 2000px 175px;

	-webkit-animation: drift 10s linear infinite;
	-moz-animation: drift 10s linear infinite;
	-ms-animation: drift 10s linear infinite;
	-o-animation: drift 10s linear infinite;
	animation: drift 10s linear infinite;
}

body::after {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 1;
	background: transparent url(monitor.5d3dfa3a.png);

	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	background-size: 100% 100%;
	background-position: center center;

	pointer-events: none;
}

abbr {
	text-decoration: none;
	border-bottom: 2px dotted rgba(239,239,239,0.25);
	cursor: help;
}

h1 abbr,h2 abbr,h3 abbr {
	border-bottom: none;
	line-height: inherit;
}

ul {
	padding: 0;
}

li {
	list-style: none;
}

footer {
	margin: 0 0 2em;
}

/* classes and IDs */

.page-wrapper {
	padding: 3em 10%;
	padding: 8vh 10%;
}

.design-selection > nav > ul {
	-webkit-column-width: 12em;
	-moz-column-width: 12em;
	column-width: 12em;
	-webkit-column-rule: 3px solid rgba(239,239,239,0.5);
	-moz-column-rule: 3px solid rgba(239,239,239,0.5);
	column-rule: 3px solid rgba(239,239,239,0.5);
}

.design-selection > nav > ul > li {
	display: inline-block;
	width: 100%;
	text-align: right;
}

.design-name {
	float: left;
	text-align: left;
}

.accesskey {
	text-decoration: none;
	color: #000;
	background: #eee;
	display: inline-block;
	line-height: 1.3;
}

/* pseudo-content changes */
#zen-summary > .p2::after {
	content: ".";
}

footer::before {
	content: "This design conforms to web standards: ";
	display: block;
}

/* resources */
@font-face {
	font-family: pixChicagoCSSZenGarden;
	src: url('pixChicago.9997891f.eot'),
	     url('pixChicago.9997891f.eot?#ieFix') format('embedded-opentype'),
	     url('pixChicago.fe66e41d.woff') format('woff'),
	     url('pixChicago.ab0ef53a.ttf') format('truetype');
}

@font-face {
	font-family: FreePixelCSSZenGarden;
	src: url('FreePixel.4a097a86.eot'),
	     url('pixChicago.9997891f.eot?#ieFix') format('embedded-opentype'),
	     url('FreePixel.525b04e9.woff') format('woff'),
	     url('FreePixel.f9a6db47.ttf') format('truetype');
}

@-moz-keyframes drift { from { background-position: 0 0; } to { background-position: 0 -175px; } }
@-webkit-keyframes drift { from { background-position: 0 0; } to { background-position: 0 -175px; } }
@-ms-keyframes drift { from { background-position: 0 0; } to { background-position: 0 -175px; } }
@-o-keyframes drift { from { background-position: 0 0; } to { background-position: 0 -175px; } }
@keyframes drift { from { background-position: 0 0; } to { background-position: 0 -175px; } }