/* ------------------------------------------------------------- */
/*                        typography.css                         */
/* ------------------------------------------------------------- */
/* 2007-05-08 13:08												 */

/* BARVY: 
pink			#fd3a76
light blue		#d4f2fa
darker blue		#20cefa
white 			#fafafa
bottom grey		#55656c
lines grey		#e1e1e1

text 222		#222
text 444		#444
text lighter	#595959
text light		#808080
bottom text 	#f2f2f2

page background #fcfcfc
*/

/* ----- Obecné ------------------------------------------------ */
body {
	font-size: 83%;
	font-family: 'Lucida Grande', Arial, sans-serif;
/*	font-family: Tahoma;*/
/*	font-size: 120%; font-family: 'Calibri', sans-serif;*/
	line-height: 135%;
	color: black;
	background-color: #fcfcfc;
}
span.replace { display:none;}

/* Barvy sekcí */
*.rails { color: #20cefa !important; }
*.webdesign { color: #f61d92 !important; }
*.ostatni { color: #10f345 !important; }

.homepage #bottom, .homepage #bottom * { color: #222 !important; background: #fcfcfc; }
.homepage #bottom .container { border-top: 2px solid #444 !important; padding-top: 0.8em; }
.homepage #bottom #floral { text-align: center; background: #fcfcfc url('../images/floral-onwhite.png') 50% 0 no-repeat !important; }

/* ----- Header ------------------------------------------------ */
#header { 	font-family: Helvetica, Arial, sans-serif; text-align: left; }
#header h3 {  
	font-size: 135%; 
/*	border-right: 1px solid #e0e0e0;  */
	background: url('../images/bg.header-vertical-line.png') center right no-repeat;
	padding-right: 0.8em; 
	margin-right: 0.8em;
}
#header h3 a { color: #f0f0f0; text-decoration: none;}
#header h3 .description { color: #e0e0e0; font-size: 80%; font-weight: normal; }

/* ----- Article ------------------------------------------------ */
/* List */
.article h2 { color: #20cefa; font: bold 155%/110% Helvetica, Arial, sans-serif; margin-top: 1em;}
.article h2 a { color: #20cefa; text-decoration: none; }
.article h2 a:hover { color: #222; text-decoration: underline; }
.article h2 .sipka { color: #616161; font-size: 70%; font-weight: normal; }
.article p { margin-bottom: 0.2em; }
body a { color: #20cefa; }

/* Detail */
#article h1 { color: #20cefa; font: bold 155%/110% Helvetica, Arial, sans-serif; }
#article .meta, .article .meta 
{ color: #616161; font-size: 80%; line-height: 130%;}
#article .meta a, .article .meta a  
{ color: #616161; text-decoration: none; }
#article .meta a:hover, .article .meta a:hover 
{ color: #222; text-decoration: underline; }
.article .meta .kolik_komentaru strong 
{ color: #20cefa; }
.article .meta .kolik_komentaru span { color: #7a7a7a; font-size: 95;  }
#article .meta .kolik_komentaru a { border-bottom: 1px dotted #595959; }
#article .meta .kolik_komentaru a:hover { border-bottom: 1px solid #595959; text-decoration: none; }

#article .body, .article { color: #222; line-height: 155%; }
#article .body p { margin-bottom: 0.8em; }
#article .body p.highlight, .article p.highlight
{ background-color: #f3f5f3; border-top: 1px dotted #c0c2c0; border-bottom: 1px dotted #c0c2c0; padding: 0.4em 0.8em; }

#article .body a, .article .anotace a
{ color: #222; text-decoration: none; border-bottom: 1px dotted #7a7a7a; }
#article .body a:hover, .article .anotace a:hover
{ color: #20cefa; text-decoration: none; border-bottom: 1px solid #20cefa; } 

#article .body h2 { color: #222; font: bold 115%/130% Helvetica, Arial, sans-serif; text-transform: uppercase; margin: 1.2em 0 0.6em 0; height: 1em; position: relative;}
#article .body h2 span { background: #fcfcfc; padding: 0 0.5em; position: absolute; top: 0; left: 1em; z-index: 100; }
#article .body h2 div { background: url('../images/bg.h2.png') center left repeat-x; width: 100%; position: absolute; left: 0; top: 0; z-index: 99;}
/*#article .body h2 span { background: url('../images/bg.h2.png') center left repeat-x; position: relative; left: 0; top: -1em; width: 100%; display: block; z-index: 99;}*/
#article .body h3 { color: #666; font: bold 100%/130% Helvetica, Arial, sans-serif; text-transform:uppercase; margin: 1.5em 0 0.3em 0; }

#article .body ol { margin: 0 0 0.2em 1.5em; }
#article .body li { margin-bottom: 0.3em; }

#article .body .note { font-size: 85%; color: #444; }

#article .body .editors-note { color: #999;font-size: 85%;margin-bottom:1em; }
#article .body .editors-note a { color: #999; }

/* BLockquote */
#article .body blockquote 
{ color: #09b9e6; font: italic 120%/140% Georgia, 'Palatino Linotype', Times, serif; margin: 1em 0; width: 115%; position: relative; left: -10%;}
#article .body blockquote p { margin: 0; }
#article .body blockquote .author { color: #5e5e5e; font: normal 80%/130% 'Lucida Grande', 'Lucida Sans Unicode', Tahoma, sans-serif; margin-top: 0.4em; }
#article .body blockquote .tilde {  }
#article .body blockquote .source { font-size: 95%; }
#article .body blockquote .source a { color: #5e5e5e; }
#article .body blockquote .source a:hover { color: #20cefa; }

/* Tables */
#article .body table { font-size: 95%; margin-bottom: 0.8em; border-collapse: collapse; width: 100%;}
#article .body table caption { color: #595959; text-align: left; padding-left: 8px; background: url('../images/dot.blue.png') left 50% no-repeat;}
#article .body th, #article .body td { text-align: left; border: 1px solid #e5e5e5; padding: 0.2em;}
#article .body th { color: #444; background: #e5e5e5; text-align: left; }

/* Code */
#article pre 
{ color: #222; font-size: 115%; text-align: left; background: #f5f5f5; padding: 1em 1em; margin: 1.2em 0; border-left: 4px solid #949494; position: relative; left: -4px;
word-wrap: break-word;
white-space: pre;
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -o-pre-wrap;	
}
#article code { font: normal 98%/120% 'Bitstream Vera Sans Mono', Monaco, monospace; background-color: #f5f5f5; padding: 0.2em 0.2em 0.1em 0.2em;}

#article .body ul { margin-left: 20px; margin-bottom: 1em; }

#article .body img { margin: 1.5em 0 1em 0;}

#article .floral { text-align: center; background: url('../images/floral.article.png') 50% 0 no-repeat; margin-top: 3em;}

/* Del.icio.us Tagometer */
#tagometer .delicious-blogbadge-line { color: #949494; font: normal 80%/130% 'Lucida Grande', 'Lucida Sans Unicode', Tahoma, sans-serif !important; }
#tagometer .save-to-link { border: none; color: #444 !important; padding-bottom: 0.5em !important;}
#tagometer .delicious-blogbadge-line .url-link .post-count { color: #949494 !important; background-color: #fcfcfc !important; }
#tagometer .delicious-blogbadge-line .top-tags li a { color: #616161 !important; }

/* ----- Komentáře ------------------------------------------------ */
#comments h2 { font-size: 95%; text-transform: uppercase; margin-bottom: 0.6em; }

#comments .comment { font-size: 95%; line-height: 170%; background: url('../images/bg.line-comment-divider.png') left bottom no-repeat;}
#comments .comment .author { background: url('../images/bg.author-line.png') left bottom no-repeat; padding-bottom: 0.4em; margin-bottom: 0.4em;}
#comments .comment .author a { color: #222; text-decoration: none; }
#comments .comment .author a:hover { text-decoration: underline; }

#comments .comment .number { color: #c0f0fc; font-family: 'Adobe Garamond Pro', 'Palatino', 'Times New Roman', serif; line-height: 100%; font-size: 10em; font-weight: bolder;}

#comments .comment p { margin-bottom: 0.6em; }
#comments .comment ul, #comment .comment ol { margin-left: 1.3em; }
#comments .comment .message a { color: #000; }
#comments .comment .message a:hover { color: #fd3a76; }
#comments .comment blockquote { font-size: 95%; border-left: 2px solid #55656C; padding-left: 0.5em;} 

#comment-form h3 { color: #444 !important; font: bold 100%/130% Helvetica, Arial, sans-serif; text-transform: uppercase; text-align: center; margin: 1.2em 0 0.6em 0; height: 1em; position: relative; margin-bottom: 1.6em;}
#comment-form h3 span { background: #9de7fa; padding: 0 0.5em; position: absolute; left: 40%; z-index: 100; }
#comment-form h3 div { background: url('../images/bg.line-header-add_comment.png') center left repeat-x; width: 100%; position: absolute; z-index: 99;}

#comment-form label { color: #444; font-size: 85%;}
#comment-form input.text, #comment-form textarea { 
  font-size: 95%;
  font-family: 'Lucida Grande', 'Lucida Sans Unicode', Tahoma, sans-serif;
}

#comment-form .syntax { font-size: 75%; color: #333; }
#comment-form .syntax a { color: #333; }
#comment-form .syntax p { line-height: 120%; padding: 0; margin: 0 0 0.2em 0; }

#comment-form .submit { padding: 0 1em; margin-top: 2em;}

#comment-errors { color: #f60b3c; margin: 1em 0;}
#comment-errors li { font-weight: bold; background: url('../images/icons/exclamation.png') 0 0 no-repeat; padding: 0 0 1em 24px;  list-style-type: none; }

#comment-message { color: #1f2b1c; font-size: 130%; font-weight: bold; background: url('../images/icons/accept.png') 0 25% no-repeat; padding-left: 24px;}

/* ----- Right Column ------------------------------------------------ */
#right_column { font-size: 85%; }
#right_column .subcontainer { border-top: 2px solid #444; }

#right_column .kolik_clanku { color: #ababab; font-size: 85%; line-height: 120%; border-bottom: 1px solid #eeeeee; padding: 0.8em 0;}
#right_column .kolik_clanku strong { color: #787878; font-size: 110%;  }

#right_column .clanky li 
{ color: #5e5e5e; line-height: 120%; list-style-type: none; border-bottom: 1px solid #eeeeee; padding: 0.6em 0;  }
#right_column .clanky li strong { color: #444; }
#right_column .clanky li a { color: #5e5e5e; text-decoration: none; }
#right_column .clanky li a:hover { text-decoration: underline; }

#right_column .about, #right_column .rss  { color: #616161; }
#right_column .about a { color: #616161; text-decoration: none;}
#right_column .about a:hover { text-decoration: underline; }

/* ----- Sidebar ------------------------------------------------ */
#right_column #kategorie, #right_column #search, #right_column .about 
{ color: #5e5e5e; line-height: 120%; border-bottom: 1px solid #eeeeee; padding: 0.6em 0;  }
#right_column h2 { color: #5e5e5e; font: normal 110%/100% Helvetica, Arial, sans-serif; }
#kategorie li { color: #444; list-style-type: none; }
#kategorie a { color: #444; }
#kategorie a:hover { color: #000; }
#kategorie a.rails { color: #20cefa; }
#kategorie a.webdesign { color: #f61d92; }
#kategorie a.ostatni { color: #10f345; }

/* ----- Ad ------------------------------------------------ */
#ad { 
  color: #999;
  background-color: #FDFFD6;
}
#ad .content {
  margin: 2em 0em;
  padding: 0.5em 1em;
  border-top: 1px solid #999;
  border-bottom: 1px solid #999;
}
#ad a {
  color: #999 !important;
  text-decoration: underline !important;
  border: none !important;
}
#ad a:hover {
  text-decoration: none !important;
  border: none !important;
}

/* ----- Search results ---------------------------------------- */
#search_results_header { width: 66%; }
#search_results_header h2 { color: #444; font-size: 110%; border-top: 1px solid #919191; padding-top: 0.6em;}
#search_results_header .kolik { color: #787878; font-size: 90%; }

#search_results .article h2 { color: #222; font-size: 125%; margin-top: 0.4em;}
#search_results .article h2 a { color: #222; text-decoration: none; }
#search_results .article h2 a:hover { color: #222; text-decoration: underline; }
#search_results .article h2 .sipka { color: #616161; font-size: 70%; font-weight: normal; }


/* ----- Bottom ------------------------------------------------ */
#bottom { text-align: left; }
#bottom p { color: #f2f2f2; font-size: 85%; line-height: 140%; margin-bottom: 1.2em; }
#bottom p.en, #bottom p.en a { color: #bcbcbc; }
#bottom #floral { text-align: center; background: #55656c url('../images/floral.png') 50% 0 no-repeat; }
#bottom a { text-decoration: none; }
#bottom a:hover { text-decoration: underline; }


/* ----- Dead ----- */
#dead 
  { color: #fff; 
    background-color: #FF0D61; 
    padding: 1em; 
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff; }

#dead a 
  { color: #fff !important;
    font-weight: bold; }

