/* ************************************************* *\
           COMMON CSS styles for all templates
\* ************************************************* */

body {
	width: 100%; height: 100%;
	margin: 0; padding: 0;
	font-family: Verdana, Helvetica, Tahoma, Arial, Geneva, Cena, sans-serif;
	font-weight: normal;
	font-size: 13px; /* 13px - 0.9em; */
	background: #FFFFFF url(img/body_back.png) 0 0 repeat-x;
	color: #000;
}

@media screen {
	.screenonly { }
	.printonly  { visibility:hidden; display:none; }
}

@media print {
	.screenonly { visibility:hidden; display:none; }
	.printonly  { }
}

a, a:link, a:visited { text-decoration: underline; }
a:hover, a:active, a:focus { text-decoration: none; }

a.intext, a:link.intext, a:visited.intext { text-decoration: none; }
a:hover.intext, a:active.intext, a:focus.intext { text-decoration: underline; }

h1, h2, h3, h4, h5, h6, p, div, pre, ul, li, table, td, input { margin: 0; padding: 0; }
h1 { font-size: 190%; margin: 0.2em 0 0.2em 0; font-weight:bold; }
h2 { font-size: 125%; margin: 0.2em 0 0.6em 0; }
h3 { font-size: 115%; margin: 0.2em 0 0.5em 0; }
h4 { font-size: 110%; margin: 0.2em 0 0.4em 0; }
h5 { font-size: 100%; margin: 0.5em 0 0.2em 0; }
h6 { font-size:  85%; margin: 0.2em 0 0.2em 0; }

/* colors */
.col_back { color: #FFFFFF; }

.colbl30 { color: rgb( 32, 42,122); }	/* blue: L:30% */
.colbl40 { color: rgb( 42, 56,162); }	/* blue: L:40% */
.colbl50 { color: rgb( 54, 68,202); }	/* blue: L:50% */
.colbl60 { color: rgb( 94,105,212); }	/* blue: L:60% */
.colbl70 { color: rgb(135,143,223); }	/* blue: L:70% */
.colbl80 { color: rgb(175,179,233); }	/* blue: L:80% */
.colbl85 { color: rgb(196,199,238); }	/* blue: L:85% */
.colbl90 { color: rgb(216,218,244); }	/* blue: L:90% */

.bbl70 { background-color: rgb(135,143,223); }
.bbl80 { background-color: rgb(175,179,233); }
.bbl85 { background-color: rgb(196,199,238); }
.bbl90 { background-color: rgb(216,218,244); }

.colgr30 { color: rgb( 56,106, 48); }	/* green L:30% */
.colgr35 { color: rgb( 64,123, 55); }	/* green L:30% */
.colgr40 { color: rgb( 74,141, 63); }	/* green L:40% */
.colgr50 { color: rgb( 93,177, 79); }	/* green * L:50% */
.colgr55 { color: rgb(109,185, 94); }	/* green L:55% */
.colgr60 { color: rgb(124,193,113); }	/* green L:60% */
.colgr70 { color: rgb(157,211,147); }	/* green L:70% */

.colg4 { color: #444; }
.colg5 { color: #555; }
.colg6 { color: #666; }
.colg7 { color: #777; }
.colg8 { color: #888; }
.colg9 { color: #999; }
.colgA { color: #AAA; }
.colgB { color: #BBB; }
.colgC { color: #CCC; }
.colgD { color: #DDD; }

/* red colors */
.colr0 { color: #F00; }

/* float styles */
.clear   { clear: both; }
.fright  { float: right; }
.fleft   { float: left; }

/* paddings */
.padt4  { padding-top: 4px; }
.padt8  { padding-top: 8px; }
.padt16  { padding-top: 16px; }
.padt24  { padding-top: 24px; }

.padb4  { padding-bottom: 4px; }
.padb8  { padding-bottom: 8px; }

.padl8  { padding-left:  8px; }
.padl16 { padding-left: 16px; }
.padl24 { padding-left: 24px; }

.padr8  { padding-right:  8px; }
.padr16 { padding-right: 16px; }
.padr24 { padding-right: 24px; }

/* margins */
.marl8  { margin-left: 8px; }
.marl16 { margin-left: 16px; }
.marl20 { margin-left: 20px; }
.marl24 { margin-left: 24px; }
.marl28 { margin-left: 28px; }

.marr8  { margin-right:  8px; }
.marr16 { margin-right: 16px; }

.mart8  { margin-top: 8px; }
.mart16 { margin-top: 16px; }

.marb8  { margin-bottom:  8px; }
.marb16 { margin-bottom: 16px; }

/* text style */
.font095 { font-size:0.95em; }
.font090 { font-size:0.90em; }
.font085 { font-size:0.85em; }
.font080 { font-size:0.80em; }
.font070 { font-size:0.70em; }

.uline  { text-decoration: underline; }
.italic { font-style: italic; }
.center { text-align: center; }
.bold   { font-weight: bold; }
.right  { text-align: right; }
.left   { text-align: left; }
.just   { text-align: justify; }
.small  { font-size: 0.85em; }


/* -------------------------- *\
 *       TEMPLATE CLASS       *
\* -------------------------- */
/*
#container
{
	#bordertop
	#border
	{
		#content
		{
			#top
			#header {
				headerback
				#topnavi
				language
				logoleft
			}
			#middle {
				mainOuter {
					mainleft    mainright
					+-----------+-----------+
					| leftnavi  | mhead     |
					| mleft     | mright    |
					+-----------+-----------+
					mainbotlft  mainbotrgt
					+-----------+-----------+
					|           | copyright |
					+-----------+-----------+
				}
			}
		}
	}
	#borderbot
}
*/

div#container {
	margin: 0 auto 16px auto;
	width: 816px;
}

div#bordertop {
	margin-top: 12px;
}

div#border {
	position: relative;
	padding: 0 16px 0 0;
	background: transparent url(img/brd_rgt.png) right top no-repeat;
}

* html div#border { background: transparent url(img/brd_rgt.ie.gif) right top no-repeat; }

@media print {
	* html div#border { background-image: url(); }
}


div#content {
}

div#borderbot {
	clear: both;
	padding: 0 16px 0 0;
	height: 16px;
	background: transparent url(img/brd_bot.png) left bottom no-repeat;
}

* html div#borderbot { background: transparent url(img/brd_bot.ie.gif) left bottom no-repeat; }

@media print {
	* html div#borderbot { background-image: url(); }
}

/* --- #content -> #top - #header - #middle */

div#top {
	display: none; /* changed on printing */
	background-color: #fff; /* no shadow while printing */
}

div#header { /* contains: headerback - topnavi - language - logoleft */
	position: relative;	/* need this for absolute positioning of subelements and for z-index */
	z-index: 1;			/* need to be 1 or higher to allow other child divs above */
	height: 345px;		/* inner height same as header image height */
	background-color: rgb( 42, 56,162);
	color: #fff;
}


/* --- #content - #header --- */

div.headerback { /* surrounding container */
	position: absolute; top:0px; left:0px;
	width: 800px; height: 310px;
}

/* --- #content - #header --- */

div#topnavi {
	position: relative; top:0px; right:0px;
	padding: 3px 0 2px 0;
	height: 1.4em;
	text-align: right;
	font-size: 0.85em; font-weight: bold;
}

/* semitransparent background for topnavi (not MSIE 6.x compatible transparent PNG) */
span.topnavi_back {
	position: absolute; top:0px; right:0px;
	padding: 3px 0 2px 0;
	width: 800px; height: 1.4em;
	/* works for FF */
	background: transparent url(img/topnavi_back.png) left top repeat;
}

div.topnavi_front {
	position: absolute; top:0px; right:2px;
	padding: 3px 0 2px 0;
	height: 1.4em;
	overflow: hidden;
}


/* ----------------------- #content - #middle ------------------- */

div#middle {
	position: relative;
}

div#middle table.mainOuter {
	width:100%;
	table-layout:fixed;
}

div#middle table.mainOuter tr { vertical-align: top; }

div#middle td.mainleft {

/* Normal */
/*	width: 220px;
	background: rgb(109,185,94) url(img/leftnavi_back.png) left top repeat-x;
*/
/* 3D design */
	width: 228px; height: 500px;
	background: rgb(109,185,94) url(img/leftnavi_back3d.jpg) left top no-repeat;

	overflow: hidden;
}

div#middle td.mainright {
	padding: 0 1.0em 0 1.0em;
	background-color: #FFF;
	overflow: hidden;
}


div#middle td.mainbotlft {
	height: 12px;
	background: rgb(109,185,94) url(img/leftnavi_back_bot.png) left bottom no-repeat;
}

div#middle td.mainbotrgt {
}

/* --- mainbotrgt - copyright --- */

/* modified in common.print.css so we have it here instead of content.css */
div.copyright {
	padding: 12px 9px 6px 0;
	text-align: right;
	color: rgb(109,185,94);
	font-size: 0.85em;
	clear: both;
}


