/* ---------------------BASICS------------ */

body	{ font-size: 13px; font-family: lucida grande, arial, sans-serif; margin: 0; padding: 0; background: #eee; }
h1		{ font-size: 180%; font-weight: normal; margin: 0; }
h1 span { font-size: 12px;}
h2		{ font-size: 160%; font-weight: normal; margin-top: 2em;}
h2 span	{ font-size: 12px; float: right;}
h3		{ font-size: 140%; font-weight: normal;	padding: 3px 0px 5px 0; margin: 0; color: #333; }
h4		{ font-size: 120%; font-weight: normal; padding: 5px 0px 0px 0; margin: 35px 0 0 0;	 }
h5		{ font-size: 100%;	padding: 5px 0px 0px 0; margin: 25px 0 0 0;	 }
a		{ color: #08c; cursor: pointer; outline: none; text-decoration:none; }
a:hover	{ text-decoration:underline }
img		{ border: 0;}
ul		{ margin: 0 0 20px 20px; padding: 0; list-style:  square;}
ul li	{ margin: 0 0 10px 0px; }
ul a	{ text-decoration: none;}
.left	{ float: left; margin: 0 15px 15px 0; }
.right	{ float: right; margin: 0 0 15px 15px; }
.clear	{ clear: both; }
small	{ font-size: 10px; }
p.bu	{ border-top: 1px dashed #ccc;color: #333;font: italic 95%/1.6em Georgia,serif;margin: 0;padding-top: 5px;}


.button a	{ background: url(../images/button.png) repeat-x; padding: 10px 10px;margin: 0 0 15px 0;font-size: 12px;text-align: center; text-decoration:none; color:#fff; border:1px solid #638f12; border-radius: 5px;-moz-border-radius: 5px; }
.button a span	{ font-size: 16px;}

/* ---------------------TRIGGER + HIDING------------ */

.trigger	{ border:1px solid #ddd; background: #f8f8f8; border-radius:5px; -moz-border-radius:5px;  margin: 0 0 8px 0; text-decoration:none; font-size: 14px; color: #000; padding: 8px 1em 8px 1em; cursor: pointer;} 
.trigger a {	}

.toggle_container { padding: 0 1em 1em 1em; }

dl		{ list-style: square; }
dl dt	{ font-weight: bold; margin-top: 15px; margin-bottom: 5px; }
dl dd	{ display: list-item; margin-top: 2px; margin-bottom: 2px; }


/* ---------------------HEADER------------ */

div#header			{ padding: 1em 2em; margin-bottom: 15px; text-align: left; background: url(../images/header.jpg) bottom left;background: #666;color: #fff;position: relative;}
h1.pagetitle		{ font-size: 2em; font-weight: normal; margin: 0px 0 0 0; padding: 0;}
h1.pagetitle a		{ color: #fff; text-decoration: none;}
h2.pagesubtitle		{ font-size: 16px; font-style: italic;color: yellow;font-weight: normal;	margin: 0;	padding: 0;}

#footer				{ padding: 1em 2em; color: #666;}


/* ---------------------MAIN/SIDEBAR CONTAINER------------ */

#main_container		{  }


/* ---------------------MAINMENU------------ */

ul#mainmenu			{ position: absolute; right: 3em; bottom: 0px;font-size: 10px;list-style: none;margin: 0;padding: 0;}

ul#mainmenu li		{float: left;display: inline;margin: 0 0 0 2px; }
ul#mainmenu a		{display: block;background: #000  ;color: #fff; padding: 5px 10px 5px 10px;text-decoration: none;font-size: 16px; border-radius: 5px; -moz-border-radius: 5px; -moz-border-radius-bottomleft: 0px; -moz-border-radius-bottomright: 0px; }
ul#mainmenu a.active	{ background: #eee;color: #000; }


/* ---------------------SUBMNEU------------ */

ul#submenu			{ position: absolute; right: 3em; top: 15px; font-size: 10px; list-style: none; }
ul#submenu li		{ float: left; margin-left: 10px;  }

ul#submenu a 		{ color: #eee; }

/* ---------------------SIDEBARMENU------------ */
	
.sidebarmenu			{ list-style: none; margin: 0 0 15px 0; padding: 0;}
.sidebarmenu li			{ margin: 0 0 0px 0; }
.sidebarmenu a			{ display: block;padding: 5px 10px;background: #333;text-decoration:none; margin-bottom: 1px;font-size: 0.8em;color: #fff;border-radius: 5px;-moz-border-radius: 5px;}
.sidebarmenu a:hover	{ background: #000;}
.sidebarmenu a.active	{ color: yellow; }

/* ---------------------SIDEBAR------------ */

#boxes			{ float: right;	width: 19em; margin: 0 2em;}
.keybox			{ font-size: 12px;padding: 15px;margin-bottom: 15px;position: relative;border-radius: 5px;	-moz-border-radius: 5px;}
.bg-w			{ background: #fff; }
.bg-y			{ background: #ffe; }
.bg-r			{ background: #fee; }
.smaller		{ font-size: 11px; }

#boxes .button a		{ display: block }
#boxes .button a span	{ font-size: 18px;}

.boxtitle		{ padding-top: 20px; }

#boxes h3		{ font-weight: normal;	padding: 3px 0px 5px 0; margin: 0;}
#boxes h4		{ font-size: 110%; margin:0 0 0 1em; }
#boxes ul		{ margin-bottom:1em; }
#boxes li		{ margin: 0.5em 0.5em 0.5em 1em; }


/* ---------------------MAIN------------ */

/* for "overflow-y" see: http://stackoverflow.com/questions/12820889/ */
#main			{ overflow-y: hidden; /* margins match '#boxes': */ margin: 0 2em 0 1em; background: #fff;padding: 2em;border-radius: 5px;-moz-border-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px;	 }

#title			{ margin: /* match '#boxes'! */ 0 22em 0px 2em; padding: 1em 2em; background: #EDF3FE;  border-radius: 5px;-moz-border-radius: 5px; -moz-border-radius-bottomleft: 0px; -moz-border-radius-bottomright: 0px; }
div.os			{ position: absolute;	top: 10px;	right: 0px;border: 1px solid#ccc;	padding: 2px;background: #fff;}

.appbox			{ font-size: 80%;padding: 15px 0;margin-bottom: 15px;position: relative;}
#main .keybox	{ border: 1px solid #ccc; border-radius: 5px; -moz-border-radius: 5px; padding-bottom: 5px}
#main .appbox	{ border: 1px solid #ccc; border-width: 1px 0 0px 0; border-radius: 0px; -moz-border-radius: 0px;}
#main .right	{ width: 250px; }

/* --------------------- */

p.intro {margin-left:0px}
img.onright {float:right; margin-bottom:2em; margin-left:1.5em; margin-right:1em}

/* --- from: http://www.positioniseverything.net/easyclearing.html --- */
img.onright:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}