/* 	
	
	STYLESHEET
	(c) 2011 by niklasp.com 
	
*/


body {
	margin:0;
	padding:0;
	background: #222 url(img/bg.jpg) center center fixed;
	font-family: Tahoma, Arial, sans-serif;
	font-size:11px;
	color:#ccc;
	text-shadow: #333 1px 1px 0;
	text-align:center;
	line-height: 17px;
}

.container {
	left:0;
	top:0;
	width:100%;
	height:100%;
}

.layout {
	position:absolute;
	top:50%;
 	left:50%;
 	width:1000px;
	height:550px;
	margin:-275px 0px 0px -500px;
	background-image:url(img/layout.jpg);
	background-repeat:no-repeat;
	text-align:left;
}

a, a:active, a:visited { text-decoration:none;color:#ccc; }

a:hover { text-decoration:underline;color:#aaa; }

a:focus { outline:none; }

img { border:0; }

#menu {
	position:absolute;
	left:64px;
	top:0;
	width:136px;
	height:550px;
	text-shadow: #111 1px 1px 0;	
}

#logo {
	position:absolute;
	left:0;
	top:90px;
	width:82px;
	height:77px;
}

#menu ul.large {
	position: absolute;
	top:170px;
	font-size:12px;
	font-weight:bold;
	list-style-type:none;
	padding:0;
	margin:0;
}

#menu ul.large li a {
	padding:2px 10px;
	background:url(img/arrow2.gif) no-repeat;
	text-decoration:none;
	color:#aaa;
}

#menu ul.large li {
	margin: 7px 0;
}

#menu ul.large li a:hover {
	text-decoration:none;
	color:#ccc;
	background:url(img/arrow2h.gif) no-repeat;
}

#menu ul.first {
	position: absolute;
	top:345px;
	font-size:11px;
	font-weight:bold;
	list-style-type:none;
	padding:0;
	margin:0;
}

#menu ul.second {
	position: absolute;
	top:425px;
	font-size:11px;
	font-weight:bold;
	list-style-type:none;
	padding:0;
	margin:0;
}

#menu ul.small li {
	margin: 5px 0;
}

#menu ul.small li a {
	padding:2px 10px;
	text-decoration:none;
	color:#666;
}

#menu ul.small li a:hover {
	text-decoration:none;color:#888;
}

.slideshow, .gallery, .links, .about, .news, .test, .thumbs, .contact {
	position:absolute;
	left:236px;
	top:34px;
	width:720px;
	height:482px;
}

.gallery img { display: none }
.gallery img.first { display: block }

.thumbs {
	display: none;
	z-index:20;
	background: url(img/trans.png);
        color: #222;
	text-shadow: none;
}

.thumbs p {
	float:left;
	margin: 20px 0 0 20px;
}

.thumbs img {
	border: 2px solid #fff;
	padding:1px;
	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
     	   -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
	cursor: pointer;
	-webkit-border-radius: 3px;
           -moz-border-radius: 3px;
                border-radius: 3px 3px 3px 3px;
}

.thumbs img:hover {
	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.8);
     	   -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.8);
}

#nav {
	z-index:50;
	position:absolute;
}

#pager { 
	position:absolute;
	width:670px;
	font-size:14px;
	color:#999;
	left:250px;
	top:537px;
	text-align:right;
}

#pager li { 
	float:left;
	list-style:none;
}

#pager a { 
	margin:3px 2px;
	padding:1px 4px;
	text-decoration:none;
	color:#111;
	text-shadow: #333 1px 1px 0;
}

#pager a:hover { 
	color:#666;
	text-shadow: #111 1px 1px 0;
}

#pager a.activeSlide { 
	color:#333;
	text-shadow: #111 1px 1px 0;
}

#count {
	position:absolute;
	left:915px;
	top:538px;
	width:40px;
	font-size:9px;
	color:#444;
	text-shadow:none;
	text-align:right;
	text-shadow:#111 1px 1px 0;
}

#next {
	position:absolute;
	left:958px;
	top:242px;
}

#prev {
	position:absolute;
	left:214px;
	top:242px;
}

#root {
	position:absolute;
	top:534px;
	left:259px;
	padding: 2px 7px;
	font-size:11px;
	color:#999;
	text-shadow: #222 1px 1px 0;;
	background:#2f2f2f;
	-webkit-border-top-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	   -moz-border-radius-topright: 3px;
	   -moz-border-radius-bottomright: 3px;
	        border-top-right-radius: 3px;
	        border-bottom-right-radius: 3px;
}

#location {
	position:absolute;
	top:536px;
	left:345px;
	width:200px;
	padding:0 0 0 20px;
	font-size:11px;
	color:#666;
	text-shadow:#111 1px 1px 0;
	background:url(img/location.gif) no-repeat;
}

#toggle {
	position:absolute;
	top:534px;
	left:236px;
	width:17px;
	height: 17px;
	padding: 2px 2px 2px 3px;
	background:#292929 url(img/thumbs.gif) center center no-repeat;
	cursor: pointer;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	   -moz-border-radius-topleft: 3px;
	   -moz-border-radius-bottomleft: 3px;
	        border-top-left-radius: 3px;
	        border-bottom-left-radius: 3px;
}

#toggle:hover {
	background:#292929 url(img/thumbsh.gif) center no-repeat;
}

.about {
	width: 720px;
	height: 482px;
	background:url(img/about.jpg) top right;
	background-repeat: no-repeat;
}

.links {
	width: 720px;
	height: 482px;
	background:url(img/links.jpg) top right;
	background-repeat: no-repeat;
}

.news {
	width: 720px;
	height: 482px;
	background:url(img/news.jpg) top right;
	background-repeat: no-repeat;
}

.contact {
	width: 720px;
	height: 482px;
	background:url(img/contact.jpg) top right;
	background-repeat: no-repeat;
}

.test {
	width: 720px;
	height: 482px;
	background:url(img/news.jpg) top right;
	background-repeat: no-repeat;
}

.about p, .links p, .news p, .test p {
	width:275px;
	font-size:11px;
	margin: 6px 0;
}

.about span, .links span, .news span, .test span, .contact span {
	font-size:14px;
	color:#202020;
	font-weight:bold;
	text-shadow: #666 1px 1px 0;
}

.news strong, .test strong {
	background:url(img/arrow.gif) no-repeat;
	padding-left: 9px;
	color: #eee;
}

.news p a, .news p a:active, .news p a:visited { text-decoration:underline;color:#ccc; }

.news p a:hover { text-decoration:none;color:#aaa; }

.about ul, .news ul, .test ul {
	margin:5px 0;
	padding:0;
	font-size:11px;
	list-style-position:inside;
	list-style-image:url(img/arrow.gif);
}

.links ul {
	margin:5px 0 17px 0;
	padding:0;
	font-size:11px;
	list-style-position:inside;
	list-style-image:url(img/arrow.gif);
}

.about ul li, .links ul li, .news ul li, .test ul li {
	margin: 3px 0;
}

.contact form {
	margin: 10px 0;
}

input, textarea {
	border-top: 1px solid #292929;
	border-left: 1px solid #292929;
	border-bottom: 1px solid #555;
	border-right: 1px solid #555;
	background: #393939;
	color: #777;
	font-family: Tahoma, Arial, sans-serif;
	font-size: 11px;
	margin: 3px 0;
	padding: 5px;
	opacity: 0.8;
}

input:focus, textarea:focus {
	background: #353535;
	opacity: 1.0;
}

input.send {
	border-top: 1px solid #555;
	border-left: 1px solid #555;
	border-bottom: 1px solid #292929;
	border-right: 1px solid #292929;
	padding: 2px 5px;
	cursor: pointer;
	text-shadow: #222 1px 1px 0;
}

input.send:hover {
	opacity: 1.0;
	background: #353535;
	color: #999;
}

#scrollbar { width: 323px; clear: both; }

#scrollbar .viewport { width: 300px; height: 482px; overflow: hidden; position: relative; }

#scrollbar .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 18px 20px; }

#scrollbar .thumb .end, #scrollbar1 .thumb { background-color: #333; }

#scrollbar .thumb { background: #333 url(img/thumb.gif) center no-repeat; }

#scrollbar .scrollbar { position: relative; float: right; width: 11px; }

#scrollbar .track { background: #666 url(img/track.gif); height: 100%; width:11px; position: relative;}

#scrollbar .thumb { height: 20px; width: 11px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }

#scrollbar .thumb .end { overflow: hidden; height: 100px; width: 11px; }

#scrollbar .disable{ display: none; }

