/*#############################################################
based off work of:
author: viktor persson
description: a soft and bright two-column template.
url: http://templates.arcsin.se
#############################################################*/
/* Site Color Scheme : Blue - #005aab  Green - #7fc143  Gray - #777777 */
/****************** standard elements ************************/
html {min-height: 100%;}

* {
	margin: 0;
	padding: 0;
}

a {color: #005aab; text-decoration: none; font-weight: bold; }
a:hover {color: #7fc143; text-decoration: underline; font-weight: bold;}

body {
	background: #ffffff url(../images/bg.jpg) repeat-x top;
	color: #777777;
	font: normal 70% tahoma, sans-serif;
}

p,code,ul {padding-bottom: 1.2em;}

li {list-style: none;}

h1 {
	font: normal 2em tahoma,sans-serif;
	margin-bottom: 4px;
}
h2 {
	font: normal 1.5em tahoma,sans-serif;
	margin-bottom: 4px;
}
h3 {
	font: normal 1em tahoma,sans-serif;
	margin-bottom: 4px;
}

blockquote {
	background: #ffffff url(../images/quote.gif) no-repeat;
	display: block;
	font-weight: bold;
	padding-left: 28px;
}

h1,h2,h3 {
	padding-top: 6px;
}

.content h3 {
	padding-top: 6px;
	font-size: 12px;	
}

hr {color: #cccccc; }
/****************** misc ************************/
.clearer {clear: both;}

.left {float: left;}

.right {float: right;}

.content_left {
	float: left;
	width: 450px;
	}

.content_left ul{
	list-style-type: circle;
}

.content_right {
	float: right;
	width: 250px;
	}

.content_right a img{
	border: none;
	text-decoration: none;
	}

/****************** structure ************************/
.container {
	background: #fff;
	margin: 0 auto;
	padding: 0px;
	width: 1000px;
}

/****************** title ************************/
#header {
	background: #ffffff url(../images/header_trafo.jpg) no-repeat;
	height: 348px;
	margin: 0 auto;
	width: 100%;
}

#horznav {
padding: 2px 0;
clear: both;
}

#horznav h1{ 
width:738px; 
margin:1px; 
color:#4C1B1B; 
font-family: serif; 
font-size:24pt; 
overflow:hidden; 
padding:80px 0 0; 
vertical-align:middle; 
text-align:right; 
}

#horznav p{ 
margin:0; 
padding:1.2em; 
}
#horznav p a:link,
#horznav p a:visited,
#horznav p a:hover,
#horznav p a:active{ 
font-weight:bold; 
color:#ffffff; 
}
ul#navigation-1{ 
margin:2px 0; 
padding:1px 0; 
list-style:none; 
width:100%; 
height:25px; 
border-top:1px solid #005aab; 
font:bold 10pt verdana, arial, helvetica;
}

ul#navigation-1 li{ 
margin:0; 
padding:0; 
display:block; 
float:left; 
position:relative; 
width: 200px; 
}

ul#navigation-1 li a:link,
ul#navigation-1 li a:visited{ 
padding:4px 0; 
display:block; 
text-align:center; 
text-decoration:none; 
background:#7fc143; 
color:#ffffff; 
width: 200px;  
height:13px; 
}

ul#navigation-1 li:hover a,
ul#navigation-1 li a:hover,
ul#navigation-1 li a:active{ 
padding:4px 0; 
display:block; 
text-align:center; 
text-decoration:none; 
background:#005aab; 
color:#ffffff; 
/*width:146px;*/
width: 198px;
height:13px; 
border-left:1px solid #ffffff; 
border-right:1px solid #ffffff; 
}
	
ul#navigation-1 li ul.navigation-2{ 
margin:0; 
padding:1px 1px 0; 
list-style:none; 
display:none; 
background:#ffffff; 
width:198px; 
position:absolute; 
top:21px; 
left:-1px; 
border:1px solid #7fc143; 
border-top:none; 
}

ul#navigation-1 li:hover ul.navigation-2{ 
display:block; 
}
ul#navigation-1 li ul.navigation-2 li	{ 
width:198px; 
clear:left;  
}

ul#navigation-1 li ul.navigation-2 li a:link,
ul#navigation-1 li ul.navigation-2 li a:visited{ 
clear:left; 
background:#7fc143; 
padding:4px 0; 
width:198px; 
border:none; 
border-bottom:1px solid #ffffff; 
position:relative; 
z-index:1000; 
}

ul#navigation-1 li ul.navigation-2 li:hover a,
ul#navigation-1 li ul.navigation-2 li a:active,
ul#navigation-1 li ul.navigation-2 li a:hover{
 clear:left; 
 background:#005aab; 
 padding:4px 0; 
 width:198px; 
 border:none; 
 border-bottom:1px solid #ffffff; 
 position:relative; 
 z-index:1000; 
 }

ul#navigation-1 li ul.navigation-2 li ul.navigation-3{ 
display:none; 
margin:0; 
padding:0; 
list-style:none; 
position:absolute; 
left:198px; 
top:-2px; 
padding:1px 1px 0 1px; 
border:1px solid #7fc143; 
border-left:1px solid #7fc143; 
background:#ffffff; 
z-index:900; 
}
ul#navigation-1 li ul.navigation-2 li:hover ul.navigation-3{ 
display:block; 
}

ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:link,
ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:visited{ 
background:#7fc143; 
}

ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li:hover a,
ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:hover,
ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:active{ 
background:#005aab; 
}

ul#navigation-1 li ul.navigation-2 li a span{ 
position:absolute; 
top:0; 
left:132px; 
font-size:12pt; 
color:#fe676f; 
}

ul#navigation-1 li ul.navigation-2 li:hover a span,
ul#navigation-1 li ul.navigation-2 li a:hover span	{ 
position:absolute; 
top:0; 
left:132px; 
font-size:12pt; 
color:#ffffff; 
}

/****************** main */
.main {
	border-top: 4px solid #fff;
}

/****************** sub navigation */
.sidenav {
	float: left;
	width: 210px;
}
.sidenav h2 {
	color: #5a5a43;
	font-size: 1em;
	line-height: 30px;
	margin: 0;
	padding-left: 12px;
}
.sidenav ul {
	padding: 0;
	border-top: 1px solid #eaeada;
}
.sidenav li {border-bottom: 1px solid #eaeada;}
.sidenav li a {
	font-size: 1.1em;
	color: #554;
	display: block;
	padding: 8px 0 8px 5%;
	text-decoration: none;
	width: 95%;
}
.sidenav li a:hover {
	background: #005aab;
	color: #000000;	
}

/* content */
.content {
	float: right;
	margin: 10px 0;
	padding: 0 16px;
	width: 750px;
}
.content .descr {
	color: #664;
	font-size: 0.9em;
	margin-bottom: 6px;
}
.content li {
/*	list-style: url(../images/li.gif);*/
	margin-left: 18px;
}
.content .content_left li{
	list-style: circle;
}
.content p {font-family: "lucida sans unicode",sans-serif;}

/****************** footer ************************/
.footer {
	font: bold .9em sans-serif;
	line-height: 15px;
	text-align: center;
	width: 100%;
	clear: both;
}
.footer img {
	padding: 2px;	
}

#footer_top {
	height: 125px;
	width: 100%;
	padding: 5px 0 0 0;
	background: #ffffff url(../images/footer-bottom.jpg) no-repeat;
}

/****************** Image Popups ********************/

.thumbnail{
position: relative;
padding: 5px;
margin: 5px;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -900px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -100;
left: -600px; /*position where enlarged image should offset horizontally */

}