/* Blue theme */
@dark: #00547F;
@medium_dark: #26617F;
@medium: #0087CC;
@medium_light: #00A8FF;
@light: #A2DFFF;

.raised {
	text-shadow: 0px 1px 3px rgba(0,0,0,0.8);
	
	mask-image: gradient(linear, left bottom, left top, color-stop(0, rgba(0,0,0,0.8)), color-stop(0.6, white));
	-webkit-mask-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, rgba(0,0,0,0.8)), color-stop(0.6, white));
	-moz-mask-image: -moz-gradient(linear, left bottom, left top, color-stop(0, rgba(0,0,0,0.8)), color-stop(0.6, white));
	-o-mask-image: -o-gradient(linear, left bottom, left top, color-stop(0, rgba(0,0,0,0.8)), color-stop(0.6, white));
}
.vignette(@color, @offset) {
	background: -moz-radial-gradient(center @offset, circle cover, @color, darken(@color, 18%));
	background: -webkit-radial-gradient(center @offset, circle cover, @color, darken(@color, 18%));
	background: radial-gradient(center @offset, circle cover, @color, darken(@color, 18%));
}

html {
	min-height: 100%;
}

body {
	background: lighten(@light, 10%);
	.vignette(lighten(@light, 10%), 0);
	color: @dark;
	font-family: Georgia, serif;
	font-size: 110%;
	padding: 1em;
	min-height: 100%;
}

code {
	background: darken(@light, 10%);
	padding: 0.1em 0.2em;
}

blockquote {
	color: @medium_dark;
	background: darken(@light, 10%);
	padding: 0.5em;
}

#container {
	a {
		color: @medium_dark;
		font-weight: bold;
		text-decoration: none;
		padding: 0.1em 0.2em;
		
		&:link {}
		&:visited { color: darken(@medium_dark, 20%); }
		&:hover { color: @light; background: @dark; }
		&:active {}
	}
}

#header {
	h1 {
		.raised;
		
		margin: 0.5em auto;
		font-family: Lobster, 'Trebuchet MS', 'Comic Sans MS', sans-serif;
		font-size: 4em;
		text-align: center;
		font-weight: bold;
		color: @dark;
	}
	h1 a {
		color: @dark;
		&:link {}
		&:visited { color: @dark; }
		&:hover { background: none; color: @dark; }
		&:active {}
	}
}

#content {
	#content-inner {
		margin: 1em 2em;
	}
	
	p a {
		border-bottom: 1px dotted @medium_dark;
	}
	
	h2 {
		font-family: 'Lobster', 'Trebuchet MS', sans-serif;
		letter-spacing: 0.07em;
		margin-bottom: 0.1em;
		color: darken(@dark, 20%);
	}
}

#footer {
	font-size: 0.8em;
	text-transform: lowercase;
	text-align: center;
	clear: both;
	
	p {
		margin: 1em;
	}
}

#menu {

	.menu {
		background: @dark;
		box-shadow: 0px 1px 3px rgba(0,0,0,0.8);
		border: 2px solid darken(@dark, 5%);
		border-radius: 8px;
		padding: 1em 0;
	}
	
	ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	ul li {
		
	}
	
	a {
		display: block;
		padding: 1em 2em;
		
		&:link, &:visited { color: @light; }
		&:hover { background: darken(@dark, 5%); }
		&:active {}
	}
}

.post {
	hr { background: @medium_dark; margin-bottom: 1.5em; }
}
.post-meta {
	text-transform: uppercase;
	font-size: 0.7em;
	font-family: Verdana, sans-serif;
	font-weight: bold;
	color: @medium_dark;
	margin: 0 0 1.5em 0.5em;
}
.post-more {
	margin-bottom: 1.5em;
}
