html{
	height: 100%;
}
article, aside, canvas, details, figcaption, figure, footer, header, 
hgroup, menu, nav, section, summary {
  display: block;
}
body{
height: 100%;
margin: 0;
background: url('images/bg.png');
text-align: center;
}
strong{
color: #886c6c ;
}
img{
border: none;
}
a{
color:#656c72;
text-decoration: none;
}
a:hover{
color:#75789e;
text-decoration: none;
}
h4{
	margin: 7px 3px 4px;
}
#wrapper{
	height: 100%;
	position: relative;
}
#header{
position: absolute;
width: 100%;
height: 300px;
background: url('images/light.png');
margin: 0;
padding: 0;
text-align: left;
}
#header img{
margin: 20px 0 0 50px;
}
#main{
width: 1000px;
height: 650px;
margin: 0 auto;
text-align: left;
overflow: auto;
position: relative;
}
#footer{
width: 100%;
background: transparent url('images/footer.png');	
height: 65px;
position: absolute;
z-index: -100;
bottom: 0;
text-align: center;
color: white;
padding: 20px 0 0 0;
font-size:8pt;
}
#message{
position: absolute;
top: 150px;
height: 30px;
left: 340px;
color: white;
font-family: georgia, times, serif;
font-size: 15pt;
}
#downbar{
position: absolute;
top: 550px;
left: 340px;
padding: 6px 0 0 30px;
height: 94px;
width: 290px;
background-image: url('images/downbar.png');
}
#downbar a{
height: 50px;
width: 50px;
margin: 0 0 0 25px;
display: block;
float: left;
overflow: hidden;
}
#downbar a img{
margin: 0 0 0 0;
}
/*#downbar a img:hover{
margin: -50px 0 0 0;
}*/
.line{
position: absolute;
top: 392px;
}
#line_left{
left: 170px;
}
#line_mid{
left: 500px;
}
#line_right{
left: 568px;
}
.window{
position: absolute;
width: 245px;
height: 210px;
top: 207px;
background-image: url('images/window.png');
float: left;
color: #fffafa;
font-family: verdana;
font-size: 10pt;
}
.window h3{
position: absolute;
top: -10px;
left: 30px;
font-family: "museo sans 500","palatino linotype", georgia, times, serif;
font-size: 14pt;
letter-spacing: 1px;
}

.window div{
position: absolute;
top: 45px;
left: 30px;
width: 195px;
height: 125px;
}
.window#omnie{
left: 50px;
}
.window strong{
font-family: georgia;
font-size: 14pt;
color:white;
line-height: 200%;
}
.window#portfolio{
left: 380px;
}
.window#kontakt{
left: 700px;
}
#kontakt div ul, #portfolio div ul{
position: absolute;
top: 0;
left: 0;
list-style: none;
margin: 0;
padding: 0;
width: 195px;
height: 135px;
overflow: auto;
}
#kontakt li{
height: 44px;
width: 44px;
padding: 5px 2px 5px 1px;
float: left;
}
#portfolio li{
height: 60px;
width: 86px;
padding: 2px 2px 2px 1px;
float: left;
}
#kontakt li:hover{
cursor: pointer;
}
#kontakt img{
height: 44px;
width: 44px;
}
/* ##################### O MNIE ############## */
ul#omnie{
height: 290px;
width: 230px;
padding: 20px 0 20px 0;
position: relative;
top: 6px;
background: transparent url('images/line.jpg') top right repeat-y;
}
ul#omnie li{
height: 20px;
cursor: pointer;
padding: 13px;
width: 263px;

}
ul#omnie > li:hover, #omnie > li > ul:not(#languages) > li:hover{
/*background: url('images/select.png') no-repeat;*/
}

ul#omnie li:first-child{

}
ul#omnie ul{
display: none;
height: 290px;
width: 230px;
padding: 20px 0 20px 0;
position: absolute;
left: 255px;
top: -4px;
background: transparent url('images/line.jpg') top right repeat-y;
}
ul#omnie ul div{
display: none;
height: 290px;
width: 190px;
padding: 20px;
position: absolute;
left: 255px;
top: 0;
cursor: default;
}
.box{
width: 720px;
padding: 0 10px 10px 10px;
position: relative;
background-image: url('images/box_mid.png');
background-position: top left;
background-repeat: repeat-x;
height: 336px;
top: 125px;
margin:  auto;
color: white;
font-family: tahoma, verdana, arial, sans-serif;
font-size: 11pt;
}
.box_left{
position: absolute;
width: 75px;
height: 346px;
left: -75px;
background: url('images/box_left.png') top left no-repeat;
}
.box_right{
position: absolute;
width: 70px;
height: 346px;
right: -70px;
top:0;
background: url('images/box_right.png') top left no-repeat;
}
.box h3{
position: absolute;
top: -40px;
}
.box ul{
margin: 4px 0;
padding: 0 0 0 10px;
list-style: none;
}
.box ul li{
margin: 2px 0;
padding: 0;
}
.left_col{
margin: 25px 0 0 0;
float: left;
width: 565px;
height: 285px;
border-right: 2px solid #383535;
}
img.language{
	height: 40px;

}
.right_col{
margin: 20px 0 0 0;
float: right;
height:285px;
width: 135px;
}
.right_col img{
margin: 90px 0 0 0;
}
.left_col h3{
	margin: 10px 0 0 0;
}
.left_col ul{
width:  265px;
float: left;
}
.left_col ul li{
width:  245px;
border-bottom: 1px solid #383535;
padding: 7px 0 7px 0;
overflow: auto;
}
.left_col ul li img{
display: block;
float: left;
}
.left_col ul li a{
display: block;
float: left;
margin: 10px 0 0 7px;
font-size: 12pt;
color: white;
}
.simple_overlay { 
margin: 200px 0 0 0;
display:none; 
z-index:10000; 
background-color:#322e2f; 
width:auto;  
border: 1px solid #444444;   
height: auto;
padding: 30px;
-moz-box-shadow:0 0 40px 5px #000; 
-webkit-box-shadow: 0 0 40px #000; 
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
text-align: left;
} 
.simple_overlay img{
display: block;
}
.simple_overlay a{
font-size: 20pt;
color: white;
font-family: tahoma, verdana, sans-serif;
display: block;
margin: -40px 0 0 60px;
}
.simple_overlay .close { 
background-image:url(images/close.png); 
position:absolute; 
right:-15px; 
top:-15px; 
cursor:pointer; 
height:35px; 
width:35px; 
}

.tooltip { 
    display:none; 
    background:transparent url(/images/black_arrow.png); 
    font-size:16px; 
	 text-align: center;
	 font-family: tahoma, verdana, arial, sans-serif;
    height:25px; 
    width:160px; 
    padding: 35px 25px 25px 25px; 
    color:#fff;     
}
.scrollable {
position:absolute;
top:25px;
left: 17px;
overflow:hidden;
width: 705px;
height: 295px;
}

.scrollable .items {
width:20000em;
position:absolute;
}

.items div {
float:left;
width: 705px;
height: 295px;
width:
}

.next{
cursor: pointer;
position: absolute;
top: 125px;
right: -30px;
z-index: 100;
display: block;
width: 52px;
height: 95px;
background-image: url('images/right.png');
}
.prev{
cursor: pointer;
position: absolute;
top: 125px;
left: -30px;
display: block;
width: 52px;
height: 95px;
background-image: url('images/left.png');
}
.next:hover{
background-image: url('images/right_h.png');
}
.prev:hover{
background-image: url('images/left_h.png');
}
.items .thumb{
width: 464px;
height: 288px;
float: left;
border: 1px solid #222222;
padding: 1px;
}
.items .description{
height: 288px;
width: 225px;
float: right;
}
.items .description h4{
padding:0;
margin: 10px 0 3px -2px;
font-family: "museo 500";
}
.navi{
height: 10px;
position: absolute;
top: 325px;
left:17px;
z-index:0;
}
.navi a{
display: block;
height: 8px;
width: 8px;
background: url(http://flowplayer.org/tools/img/scrollable/arrow/navigator.png) no-repeat 0px 0px;
float: left;
margin: 1px 5px;
}
.navi a.active{
background-position: 0px -16px;
}