djekl
2/21/2012 - 10:21 PM

CSS3 demo: City by night

CSS3 demo: City by night

{"view":"split-vertical","prefixfree":"1","page":"css"}
<section>
	<h1>City by night</h1>
	<p>This is just some example content. Don’t even bother reading it, you will just waste your time.
	Why do you keep reading? Do I have to use Lorem Ipsum to stop you from that? 
	Ok, here goes: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
	Still reading? Oh gosh, you’re impossible. I’ll stop here to save you from yourself.
</section>
/**
 * CSS3 demo: City by night
 * Multiple backgrounds, basic linear gradients
 */

html, body { 
	height: 100%;
}

html {
	background: linear-gradient(black, #444);	
	background-color: #222;
}

body {
	background: url("http://e-steki.gr/nem/images/onenightchat/moon.png") no-repeat 100% 1em,
		url("http://e-steki.gr/nem/images/onenightchat/stars.png") repeat-x 0 0,
		url("http://e-steki.gr/nem/images/onenightchat/city.png") repeat-x bottom;
	margin: 0;
}

section {
	max-width: 25em; 
	margin: 0 auto;
	padding-top: 100px;
	color: white;
	font: italic 100%/1.5 'Palatino Linotype', Georgia, serif;
}