@import url("reset.css");

body {
	font: 13px/1.3 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
	color: #666;
}

/* default links */
a {
	color: #cc0000; /* same as body */
}
a:hover {
	color: #990000;
}


/* --- PAGE STRUCTURE --- */
header {
	padding: 100px 0 0.5em;
}

#main.height-auto, 
#main.height-auto #content, 
#main.height-auto #sidebar { height: auto; }
#main.height-auto #content { width: 400px; }
#main.height-auto #sidebar { width: 170px; font-size: 13px; }

#main {
	position: relative;
	height: 440px; /* no clearfloat needed */
	border: 1px solid #999;
	
	font-size: 16px;
}

	#content, 
	#sidebar {
		height: 300px;
	}

	#content, 
	#sidebar {
		padding: 100px 6% 40px;
    width: 38%;
	}

	#content {
		position: relative; /* for .logo */
		float: left;
	}
	
		#content .logo {
			position: absolute;
			top: 50%;
			left: 50%;
			margin: -40px 0 0 -118px;
			/*display: block;
			width: 236px;
			height: 80px;*/
		}
	
	#sidebar {
		float: right;
		background-color: #dad7d3;
	}

		.bookmark {
			position: absolute;
			right: 45px;
			top: -1px;

			/*width: 0px;
			height: 50px;*/
			/*border-bottom: 10px solid #dad7d3;*/ /* color same as #sidebar bg */
			/*border-right: 20px solid #cc0000;*/ /* bookmark color */
			/*border-left: 20px solid #cc0000;*/ /* bookmark color */

			width: 40px;
			height: 58px;
			background: url('../images/bookmark.png') no-repeat right top;
		}
	
footer {
	padding: 0.5em 0 2em;
}


/* page width settings */
.page-width { 
	position: relative;
	height: 100%;
	margin: 0 auto;
	width: 750px;
}
/* --- */



/* --- CONTENT & SIDEBAR --- */
/* default p and lists */
#main p,
#main ul,
#main ol,
#main table {
	margin-bottom: 1em;
}
	#main ul li {
		margin-left: 1.4em;
	  list-style: disc outside none;
	}
	#main ol li {
		margin-left: 1.4em;
		list-style: decimal outside none;
	}
	
#main ul,
#main ol,
#main table {
	clear: both;
}

	
/* default table */
#main table {
}

	#main th, 
	#main thead td {
		padding: 0.4em 0.6em;
		text-align: left;
		vertical-align: middle;
		border-bottom: 2px solid #999; 
	}
	
	#main td {
		padding: 0.2em 0.6em;
		border-bottom: 1px solid #999; 
	}


/* default headers and texts */
h1, h2, h3 {
	margin-top: 1.2em;
	margin-bottom: 0.8em;
	font-size: 24px;
	font-weight: normal;
	letter-spacing: 1.5px;
}
h1 { margin-top: 0; }
	
h1, h2, h3, 
#main th {
	color: #cc0000;
}

/* floating images */	
.image-float-left {
	float: left;
	margin: 0 1em 0.5em 0;
}

.image-float-right {
	float: right;
	margin: 0 0 0.5em 1em;
}


/* helpers */
.fl { float: left; }
.fr { float: right; }
.clear { clear: both; }

.ac { text-align: center; }
.al { text-align: left; }
.ar { text-align: right; }

strong, bold { font-weight: bold; }
em, italic { font-style: italic; }

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}

* html .clearfix {
	height: 1%;
}