/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 

	Typografie
	
	shorthand: 	style variant weight size/line-height family (proc nefunguje?)

   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* . . . . . . . . . . . . . . . . . . . . . . . . . 
	>> Blocks
   . . . . . . . . . . . . . . . . . . . . . . . . .  */

body {
	font-size: 62.5%;
	font-family: Arial, 'Lucida Grande CE', lucida, sans-serif;
}

ul, ul li {
    list-style: none; margin: 0; padding: 0; 
}

/* . . . . . . . . . . . . . . . . . . . . . . . . . 
	>> Headings
   . . . . . . . . . . . . . . . . . . . . . . . . .  */


/* . . . . . . . . . . . . . . . . . . . . . . . . . 
	>> Lines
   . . . . . . . . . . . . . . . . . . . . . . . . .  */

   
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 

	Layout

   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
 
body {
    margin: 0; padding: 10px;
    background-color: #000;
    color: white;
}

#page {
    
}

#header {
    border-bottom: 1px solid #3e4653;
    margin-bottom: 20px;
    min-height: 70px;
    _height: 70px;
    &height: 70px;
}
#header h1 {
    background: url('images/logo_black.png') no-repeat 0 0;
    margin: 0;
    min-height: 70px;
    _height: 70px;
    &height: 70px;
    float: left;
    font-size: 2em;
}
#header a {
    display: block;
    padding: 15px 20px 15px 180px;
    color: white; 
    }
#header a:hover {
    color: #d7d7d7;
}
#header a span {
    border-bottom: 1px solid #3e4653; 
}

#header form {
    float: left;
    padding: 14px 0 0 20px ;
}
form input.text {
    border: 1px solid #3e4653;
    background: #000;
    width: 300px;
    padding: 3px;
    font-size: 1.7em;
    color: white;
}
form input.button {
    padding: 2px 15px;
    margin-left: 3px;
    font-size: 1.6em;
}
form label {
    font-size: 1.7em;
}


#header a.menu_item_link {
    font-size: 1.4em;
    float: left;
    padding: 10px;
    margin: 10px 0 0 20px;
}
 

#header .download {
    float: left; 
    width: 50px;
    height: 50px;
    background: url('images/happy_32.png') no-repeat top left;
}

#content {
    font-size: 1.3em;
}

.inline_list { &clear: both; _clear: both; margin: 3em 3em 3em 0; border-top: 1px solid #3e4653; border-bottom: 1px solid #3e4653; font-size: 0.8em; _line-height: 1.8em; &line-height: 1.8em; }
.inline_list a { display: block; margin: 1px 2px; float: left; _display: inline; _float: none; &display: inline; &float: none; }


.imageCaption { position: relative; margin: 20px 0; }
.imageCaption h2 { margin: 2px 0; }

.imageLinks { }
.imageLinks span { display: block; padding: 3px 0 0 4px; float: left; color: inherit; }
.imageLinks a { display: block; margin: 1px 2px; float: left; }
#content .imageLinks li.tagLink a { background-color: #222; color: #C0C0C0}
#content .imageLinks li.tagLink a:hover { background-color: white; color: black; }
.imageLinks li { float: left; border-left: 1px dotted #3e4653; }
.imageLinks li.first { float: left; border-left: none; }

a.contrast { color: #FFFFFF !important; font-weight: bold; }
a.contrast:hover { color: black !important; font-weight: bold; }

div.foundItem, div.taggingItem { margin: 10px 0; }
div.foundItem img, div.taggingItem img { float: left; border: none; }
div.foundItem h3 { margin-left: 20px; border-bottom: 1px dotted #3e4653; float: left; }
#content div.foundItem a { display: block; color: #D2CFD4; background-color: inherit; min-height: 72px; _height: 72px; }
#content div.foundItem a:hover h3 { border-bottom: 1px dotted black; }

div.galleryItem { margin: 6px; width: 210px; height: 80px; float: left; }
div.galleryItem img { float: left; margin-right: 10px;}
div.galleryItem small { border-bottom: 1px dotted #3e4653; font-size: 11px; }
#content div.galleryItem a { display: block; color: #D2CFD4; background-color: inherit; min-height: 72px; _height: 72px; padding: 7px;}
#content div.galleryItem a:hover { background-color: #2E343D; color: white; }

div.taggingItem h3 { margin-left: 20px; border-bottom: 1px dotted #3e4653;  display: inline; line-height: 2.6em;}
#content div.taggingItem p { margin-left: 20px; float: left; margin-top: -2px; }
#content div.taggingItem input { display: block; width: 500px; }
#content div.taggingItem a { display: block; color: #D2CFD4; background-color: inherit; min-height: 72px; _height: 72px; padding: 7px; float: left;}
#content div.taggingItem a:hover { background-color: #2E343D; color: white; }

#content div.taggingItem { &clear: both; _clear: both; }
#content div.taglistItem { &clear: both; _clear: both; }
#content div.taglistItem img {  float: left; }
#content div.taglistItem h3 {  margin: 10px 20px; border-bottom: 1px dotted #3e4653;  display: block; float: left;  }
#content div.taglistItem a { display: block; color: #D2CFD4; background-color: inherit; min-height: 72px; _height: 72px; padding: 7px; float: left;}
#content div.taglistItem a:hover { background-color: #2E343D; color: white; }
#content div.taglistItem a.tagTitleBox { &float: left; }
#content div.taglistItem p { margin: 10px 0 0 10px; font-size: 0.8em; _line-height: 1.8em; &line-height: 1.8em; }
#content div.taglistItem p a { min-height: 1%; padding: 2px 2px; _display: inline; _float: none; &display: inline; &float: none; }

#content ul.rozcestnik a { font-size: 2em; }

#content .imageBox a, #content .imageBox a:hover { background: none; padding: 0; }
#content .imageBox { &clear: both; _clear: both }
#content a {
    color: #7E8AA2;
    background-color: black;
    padding: 2px;
    text-decoration: none;
}
#content a:hover {
    color: black;
    background-color: white;
}

a {
    color: #7E8AA2;
    background-color: inherit;
    text-decoration: none;
}

 
p {
    color: #A0A0A0;
}
 
 

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 

	Hacks

   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
 
/* ie7 -> & hack */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
 
 
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 

	Helpers

   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* . . . . . . . . . . . . . . . . . . . . . . . . . 
	>> Clearing, floating
   . . . . . . . . . . . . . . . . . . . . . . . . .  */
   
.clr, .clrBoth { clear: both !important; }
.floatLeft { float: left !important; }
.floatRight { float: right !important; }
.alignLeft { text-align: left !important; }	
.alignRight { text-align: right !important; }
.alignCenter { text-align: center !important; }
.hidden { display: none !important; }
.tiny { font-size: 0.8em !important; }
.bold { font-weight: bold !important; }

/* . . . . . . . . . . . . . . . . . . . . . . . . . 
	>> Sizes
   . . . . . . . . . . . . . . . . . . . . . . . . .  */

.width5 { width: 5% !important; }
.width10 { width: 10% !important; }
.width15 { width: 15% !important; }
.width20 { width: 20% !important; }
.width25 { width: 25% !important; }
.width30 { width: 30% !important; }
.width40 { width: 40% !important; }
.width50 { width: 50% !important; }
.width75 { width: 75% !important; }
.width100 { width: 100% !important; }

/* . . . . . . . . . . . . . . . . . . . . . . . . . 
	>> Links
   . . . . . . . . . . . . . . . . . . . . . . . . .  */


/* . . . . . . . . . . . . . . . . . . . . . . . . . 
	>> Error & Notices
   . . . . . . . . . . . . . . . . . . . . . . . . .  */

.errorMessage, .noticeMessage {
	width: auto;
	padding: 10px;
	margin-bottom: 10px;
	color: white;
	font-weight: bold;
	width: 900px;
}
.errorMessage {
	background: #8E142B;
}
.noticeMessage {
	background: #049E10;
}     
#systemMessages {
    margin: 0.5em 0;
}