
@font-face {font-family: 'SkyhookMono';font-weight: bold;font-style: normal;src: url('webfonts/294A5D_0_0.eot');src: url('webfonts/294A5D_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/294A5D_0_0.woff') format('woff'),url('webfonts/294A5D_0_0.ttf') format('truetype');}
 
  
@font-face {font-family: SkyhookMono;font-weight: normal;font-style: normal;src: url('webfonts/294A5D_1_0.eot');src: url('webfonts/294A5D_1_0.eot?#iefix') format('embedded-opentype'),url('webfonts/294A5D_1_0.woff') format('woff'),url('webfonts/294A5D_1_0.ttf') format('truetype');}
 

body, html, table {
margin: 0px; padding: 0px; font-family: SkyhookMono,Courier,mono; font-size:18px; font-weight : normal; line-height: 1.4em;}


body { background: #000; color: #000; text-align: center; overflow-x:hidden;}
table { text-align: left;}
h1,h2,h3, h4, h5 {margin: 0px; padding: 0px 0px 15px 0px; color: #000; font-size: 34px; font-family: 'SkyhookMono',Courier,mono; line-height: 100%; font-weight: bold;}
h1 {font-size: 24px; line-height: 32px;}
h2 {font-size: 13px;}
h3 {font-size: 13px;}
h4 {font-size: 13px;}
h5 {font-size: 13px;}
p {padding: 0px; margin: 20px 0px 20px 0px;}
a img {border: 0px solid; display: block;}
a {text-decoration: none; color: #fff;}
a:hover {color: #000;}
a.disko {color: Black; text-decoration: underline;}
a.disko:hover {color: Black; text-decoration: none;}

.right {float: right; text-align: right;}
.left {float: left; text-align: left;}
.center {text-align: center;}
.justify {text-align: justify;}
.skrejt {display: none;}
.error {color: red;}
.clear {width: 100%; clear: both;}

#site {position: relative; margin: 0px auto; width: 750px; text-align: left;}
    #head {float: left; padding-left: 12px; height: 18px; margin-top: 45px; padding-bottom: 45px; text-transform: lowercase;}
        #head a {text-decoration: none; font-size: 14px; position: relative; line-height: 1.4em;}
        #head strong {float: left; display: inline-block; padding: 0 17px; text-align: center; font-weight: normal;}
        #head a:hover, #head a.active {color: #64ff00; font-size: 18px; font-weight: bold;}
        #head a.active2 {color: #64ff00;}
        #head strong a {white-space: nowrap;}
        
       #content {float: left; width: 750px;}
        .datum {float: left; width: 160px;}
        .novinka {float: left; width: 400px; padding-bottom: 20px; font-weight: normal;}
        .novinka p {margin: 0 !important;}
        .novinka b {font-weight: bold;}
        .novinka-popis {font-size:14px; line-height:1.4em;}
        .stare_koncerty {font-size: 12px !important;}
    .content {float: left; width: 750px;
        /*background: #64ff00;*/}
    a#various1 {position: relative; margin: 0px auto; height: 111px; width: 90px; background: url("pictures/jukebox.png") no-repeat; display: block; line-height: 111px; font-size: 14px; padding-left: 10px; color: #000; font-weight: normal;}
    a#various1:hover {background-position: 0px -1000px; color: #fff;}
    .video {float: left; width: 330px; height: 240px; padding: 0 0px 30px 0px;}
    
    
		.contentbox-wrapper{			
			position:relative; 
			left:0; 
			width:30000px; 
			height:100%;
		}
		
		.contentbox{
			float:left; 
              width: 750px;
              margin-right: 30px;              
              color: #B4B4B4;
              position: relative;
              font-size: 14px;
              line-height: 1.4em;
		} 
    
        .contentbox .flash {
              display: block;
              width: 100%;
              overflow-x: hidden;
              padding-bottom: 30px;
            }
        
        .contentbox .obsah {
                display: block;
                width: 690px;
                padding: 0px 30px;
            }
    
        .contentbox h2 {
                text-transform: uppercase;
                font-size: 14px;
                color: #fff;
                margin: 20px 0;
                padding: 0;
                font-weight: bold;
            }
        
         .contentbox h3, .contentbox h4 {
                font-size: 14px;
                color: #fff;
                margin: 20px 0 0 0;
                padding: 0;
                font-weight: bold;
            }
        
        .contentbox a {
               color: #FFF; /*#B4B4B4;*/
               text-decoration: none;
            }
        
        .contentbox a:hover {
               color: #64FF00;
               /*text-decoration: underline;*/
            }
            
        .contentbox ul {
          list-style-type: square;
        }
        
        .contentbox li{
            padding-top: 0.5em;
        }
              
    
        .prekryvac {
              position: absolute;
              left: 0;
              top: 0;
              opacity: 0.8; filter:alpha (opacity=80);
              background: #000;
              cursor: Hand;
              cursor: pointer;
              width: 750px;
              height: 100%;
              z-index: 10;
              
            }
        
        .contentbox.active .prekryvac {
                display: none;
            }
    
        .contentbox .perex {
                float: left;
                height: 240px;
                overflow: hidden;
                padding: 30px 150px 30px 30px;
                width: 570px;
                background: #fff;
                margin-bottom: 45px;
                color: #000;
                position: relative;
                font-size: 18px;
                line-height: 1.4em;
                font-weight: bold;
            }
    
        .contentbox.active .perex {
                background: #64ff00;
            }
        
        .contentbox .perex a {
                color: #fff;
                text-decoration: none;
            }
        .contentbox .perex a:hover {
                color: #000;
            }
        
        .contentbox .perex p {margin: 0px 0px 20px 0px;}
        .prehravac {text-align: center; font-size: 14px; font-weight: normal; padding-top: 20px;}
        
        .contentbox.active {
                opacity: 1; filter:alpha (opacity=100);  
                cursor: Default;
            }
        
        .contentbox.foo {visibility: hidden;}
        
        .contentbox .perex .next {
               position: absolute;
               padding-top: 120px;
               text-align: center;
               background: url("pictures/sipka.png") no-repeat center 60px;
               bottom: 30px;
               right: 10px;
               z-index: 2;
               color: #fff;
               cursor: Hand;
               cursor: pointer;
               font-weight: normal;
               font-size: 14px;
               width: 135px;
            
            }
        
        .contentbox .perex .previous {
               position: absolute;
               padding-bottom: 120px;
               text-align: center;
               background: url("pictures/sipka2.png") no-repeat center 0px;
               top: 25px;
               right: 10px;
               z-index: 2;
               color: #fff;
               cursor: Hand;
               cursor: pointer;
               font-weight: normal;
               font-size: 14px;
               width: 135px;
            
            }        
        
        .contentbox .perex .next:hover{
            background-position: center -485px;
            color: #000;
            
            }
        
        .contentbox .perex .previous:hover{
            background-position: center -557px;
            color: #000;
            
            }        
        
        #prekryvac {
                position: absolute;
                z-index: 11;
                left: -10000px;
                height: 100%;
                width: 10000px;
                background: black;
            }
    
        .uvidea {float: right; margin-right: 10px; width: 120px; display: block; font-size: 14px; line-height: 18px; color: #000; font-weight: normal;}
    
    
div#galerka{
  clear: both;
  padding-top: 30px;
};

#galerka .album_text {float: left; width:149px; height: 175px; overflow: hidden;  margin: 10px 14px 5px 13px;  line-height: 100%; display: inline; text-align: center;}
#galerka h3 a, #galerka h3 {text-align: center !important; line-height: 150%; color: #315e90; font-weight: bold;}
#galerka .album_text  h3  {padding: 0px; margin: 0px; text-decoration: none;}
#galerka .album_text a {text-decoration: none;}
#galerka .album_text  h3 a:hover {text-decoration: underline;}
#galerka .album {float: left; width:125px; padding-left: 12px; padding-right: 12px; height: 106px; overflow: hidden; background-image: url("pictures/album.png"); background-position: bottom center; background-repeat: no-repeat;}
#galerka div.image {position:relative; height: 84px; width: 111px; border: none;  overflow: hidden;} /* position relative aby fungovalo overflow v IE */
#galerka div.image a{	
		position:relative;
	display: table-cell;
	vertical-align: middle;
	width: 111px;
	height: 84px;
	text-align: center;
}
#galerka .image img {display: block;}
#galerka .album_text  a span {float: left; position: relative; top: -15px; cursor: hand; width:160px; text-decoration: none;}
#galerka .album_text span {position: relative; top: -10px;}

#galerka .fotka2 {float: left; width:150px; height: 121px; overflow: hidden; margin: 10px 10px 5px 10px; display: inline;background-image: url("pictures/album.png"); background-position: bottom center; background-repeat: no-repeat;}
 #galerka .fotka2 .image {width:136px; height: 100px;}
#galerka .fotka2 .image a {width:136px; height: 100px;}	

#galerka2 #galerka .fotka2 {float: left; width:275px; height: 151px; overflow: hidden; margin: 0; background-image: url("pictures/album.png"); background-position: bottom center; background-repeat: no-repeat;}
#galerka2 #galerka .fotka2 .image {width:251px; height: 130px;}
#galerka2 #galerka .fotka2 .image a {width:251px; height: 130px;}	
#galerka2 #galerka h3 a, #galerka h3 {text-align: left !important; line-height: 150%; color: #660033; font-weight: bold; font-size: 15px;}
#galerka2 #galerka .obal {float: left; width:275px;margin: 10px 20px 5px 40px; display: inline;}
		

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;} 
#lightbox a img{ border: none; display: inline;}

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 9000; width: 100%; height: 500px; background-color: #000; }
	