@charset "UTF-8";
@import "common.css";

body {	
	background-color:#fff;
	background-image:url(clementine/body.jpg);
	background-position:top;
	background-repeat:repeat-x;
	font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif;
	/*font-size:78%;*/
	font-size:82%;
	color:#666;
	margin:0;
}

/*
	TITLE
*/
#title {
	width:816px;
	padding:12px 25px 15px 25px;
	background-image:url(clementine/top_resize.png);
	background-position:top;
	background-repeat:no-repeat;
	color:#fff;
	margin:0 auto;
	text-align:right;
}
#title strong {
	float:left;
}
#title a {
	padding:0 10px 0 10px;
	color:#fff;
	border:none;
}
#title a:hover {
	text-decoration:none;
}

#container {
	width:866px;
	margin:0 auto;
	background-image:url(clementine/header_resize.png);
	background-position:top;
	background-repeat:no-repeat;
	padding:30px 0 0 0;
}

/*
	NAVI
*/
#nav {
	width:807px;
	margin:0 auto;
	text-align:right;
	background-image:url(clementine/menu.jpg);
	background-position:top;
	background-repeat:repeat-x;
}
#nav ul {
	margin:0;
	padding:0;
	float:right;
}
#nav ul li {
	margin:0;
	padding:0;
	list-style:none;
	float:left;
}
#nav ul li a {
	display:block;
	width:100px;
	text-align:center;
	margin:0 0 0 1px;
	background-image:url(clementine/menu_link2.png);
	background-position:left;
	background-repeat:no-repeat;
	color:#ccc;
	font-family:'Trebuchet MS', Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	text-transform:uppercase;
	font-weight:bold;
	text-decoration:none;
	padding:55px 0 23px 0;
	border:none;
}
#nav ul li a em {
	font-style:normal;
	text-decoration:underline;
}
#nav ul li a.last, #nav ul li a.first {
	margin:0;
}
#nav ul li a:hover, #nav ul li a.menus {
	background-position:right;
	color:#fff;
	text-shadow:0 1px 2px rgba(0, 0, 0, 0.3);
}

/*
	SIDEBAR
*/
#sidebar {
	width:262px;
	float:right;
	background-image:url(clementine/sidebar.jpg);
	background-position:top;
	background-repeat:no-repeat;
	margin:0 29px 0 0;
	padding:7px 20px 20px 20px;
	color:#777;
	line-height:18px;
	font-size:90%;
	word-spacing:-1px;
}
#sidebar h1 {
	font-family:Century Gothic, Verdana, Arial, Helvetica, sans-serif;
	font-size:20px;
	color:#F2C21C;
	font-weight:normal;
	margin:10px 0 10px 0;
	text-shadow:0 1px 2px rgba(242, 194, 28, 0.5);
}
#sidebar h1.first {
	color:#fff;
	margin:10px 0 35px 0;
}
#sidebar .linkroll {
	margin:10px 0 10px 0;
	padding:0;
	border-top:1px solid #eee;
}
.linkroll li {
	margin:1px;
	padding:0 !important;
	padding:1px;
	list-style:none;
}
.linkroll li a {
	padding:2px 2px 2px 18px;
	display:block;
	margin:0;
	color:#777;
	text-decoration:none;
	border-bottom:1px solid #eee;
	background-image:url(clementine/document.gif);
	background-position:left;
	background-repeat:no-repeat;
}
.linkroll li a:hover, .linkroll li a.menus {
	border-bottom:1px solid #ccc;
	background-color:#fbfbfb;
	color:#444;
	
}

/*
	CONTENT
*/
#content {
	margin:0 331px 0 20px;
	background-image:url(clementine/content.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	padding:10px 20px 10px 20px;
}
#content {
	line-height:20px;
	word-spacing:2px;
}
#content h1 {
	font-family:Trebuchet MS, sans-serif;
	font-size:24px;
	color:#333;
	font-weight:normal;
	margin:30px 0 35px 0;
	letter-spacing:-2px;
	border-bottom:2px solid #F4C833;
	padding:0 0 2px 0;
	text-shadow:0 1px 2px rgba(0, 0, 0, 0.3);
}
#content h1 a {
	color:#333;
	text-decoration:none;
	border:none;
}
#content h1 a:hover {
	color:#666;
}
#content p {
	text-indent:15px;
}
#content h1 > a.plink  {
	background-image:url(permalink.png);
	background-repeat:no-repeat;
	background-color:transparent;
	background-position:center;
	padding-right:12px;
	margin-left:0.3em;
	visibility:hidden;
}
#content h1:hover > a.plink {
	visibility:visible;
}

/*
	FOOTER
*/
#footer {
	padding:10px;
	border-top:2px solid #f6f6f6;
	text-align:center;
	margin:20px 0 0 0;
}

/*
	diverser kram
*/
.heading {
	display:none;
}
h2 {
	font:140% Verdana;
	color:#333;
	border-bottom:1px dotted #ccc;
	text-shadow:0 1px 2px rgba(0, 0, 0, 0.3);
}
h2 a {
	border:none;
}
h3 {
	font:bold 105% Verdana;
}
h3 a {
	border:none;
}
h4 {
	margin-bottom:0px;
}
blockquote {
	margin:0;
	padding:5px 15px 5px 15px;
	background:#f6f6f6;
}
a {
	color:#333;
	border-bottom:1px solid #ccc;
	text-decoration:none;
}
a:hover {
	border-bottom:1px solid #999;
}

@media (max-width: 480px) {
	#title .subtitle {
		display:none;
	}
	#title {
		height:17px;
	}
}
@media (max-device-width: 768px) {
	#title, #container, #nav {
		width:auto;
	}
	#nav {
		background-image:none;
		text-align:inherit;
		padding:0 20px;
	}
	#nav ul {
		float:none;
	}
	#nav ul li {
		display: inline-block;
		float:none;
	}
	#nav ul li a {
		background-image:none;
		display:inline;
		width:auto;
		padding:0;
		color:#999;
	}
	#nav ul li a:hover, #nav ul li a.menus {
		color:#777;
	}
	#nav > br  {
		display:none;
	}
	#sidebar {
		width:auto;
		float:none;
		background-image:none;
		margin:0;
		padding-bottom:7px;
	}
	#sidebar > p, #sidebar h1.first {
		display:none;
	}
	#sidebar .linkroll li {
		display: inline-block;
	}
	#sidebar .linkroll li a {
		display: inline;
	}
	#content {
		margin:0;
	}
}