h1     {color: white; 
	font-family: arial;
	font-size: 15px;
 	margin: 0px 0px 0px 0px,
}


h2     {color: black; 
	font-family: arial;
	font-size: 15px;
 	margin: 0px 0px 0px 0px,
}
h3    { color: black; 
	font-family: arial;
	font-size: 11px;
 	margin: 0px 0px 0px 0px,

}

h4    { color: yellow; 
	font-family: arial;
	font-size: 10px;
 	margin: 0px 0px 0px 0px,
}

p    { color: black; 
	font-family: arial;
	font-size: 12px;
 	margin: 10px 0px 10px 0px,

}

#obsah       { 	position: absolute; 
		width: 500px; 
		top: 150px; 
		left: 230px; 
}

#patka       { 	width: 100%; 
		background-color: black; 
		border-style: none; 
		border-width: medium;
}



#hlavicka    { 	position: absolute; 
		width: 760px; 
		top: 0px; 
		left: 0px; 
		height: 120px; 
		background-color: black; 
		color: yellow; border-style: none; 
		border-width: medium;
}

#levy        { 	position: absolute; 
		width: 150px; 
		top: 120px; 
		left: 20px;
		background-color: black; 
		color: white; border-style: none; 
		border-width: medium;
}

 
#pravy       { 	background-color: green; 
		color: black; 
		border-style: none; 
		border-width: medium; 
}

a         {	text-decoration: none; color: white; 
		font-family: arial;
		font-size: 15px; }

a:link    {	color: white}

a:visited {	color: white}

a:active  {	color: white}
a:hover   {	color: yellow; text-decoration: underline}
#lightbox {	
		position: absolute;	
		left: 0; 
		width: 100%;
		z-index: 100; 
		text-align: center; 
		line-height: 0;}

#lightbox img	{ 	width: auto; 
		height: auto;}

#lightbox a img	{ border: none; }

#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: 90; width: 100%; height: 500px; background-color: #000; }

* {-moz-box-sizing: border-box; box-sizing: border-box;} /* pocitani marginu a paddingu jako v Exploreru */


#image {    /* background image block */

width : 800px;
height: 1000px;
background: url('../images/logo.jpg') top; left; no-repeat; /* obrázek na pozadí */}

#sardinie {    /* clickable area */
float: left;
width : 55px;
height: 17px;
margin-left: 22px;
margin-top: 146px;
}

#klima {    /* clickable area */
float: left;
width : 55px;
height: 17px;
margin-left: -55px;
margin-top: 163px;

}

#strediska {    /* clickable area */
float: left;
width : 120px;
height: 17px;
margin-left: -55px;
margin-top: 180px;

}

#flora {    /* clickable area */
float: left;
width : 55px;
height: 17px;
margin-left: -120px;
margin-top: 197px;
}

#fauna {    /* clickable area */
float: left;
width : 55px;
height: 17px;
margin-left: -120px;
margin-top: 214px;

}

#historie {    /* clickable area */
float: left;
width : 55px;
height: 17px;
margin-left: -120px;
margin-top: 231px;
}

#dejiny {    /* clickable area */
float: left;
width : 55px;
height: 17px;
margin-left: -120px;
margin-top: 248px;
}

#foto_sardinie {    /* clickable area */
float: left;
width : 75px;
height: 17px;
margin-left: -120px;
margin-top: 265px;
}

#costa {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 327px;
}

#porto {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 344px;
}

#stazzu {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 361px;
}

#canalone {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 378px;
}

#gavino {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 395px;
}

#niedda {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 412px;
}

#cruzitta {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 429px;
}

#coniglio {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 446px;
}

#grottoni {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 463px;
}

#foto_potapeni {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 480px;
}


#costelsardo {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 544px;
}

#jeskyne {    /* clickable area */
float: left;
width : 120px;
height: 17px;
margin-left: -120px;
margin-top: 562px;
}

#teresa {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 579px;
}

#mare{    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 597px;
}

#palau {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 614px;
}

#foto_vylety {    /* clickable area */
float: left;
width : 100px;
height: 17px;
margin-left: -120px;
margin-top: 631px;
}
