/*
    Project: CrystalX
    URL: http://www.nuvio.cz
    
    Output device: screen, projection
    
    Author: Vit Dlouhy (vit.dlouhy@nuvio.cz); Nuvio (www.nuvio.cz)
    Last revision: 2006-12-05, 12:00 GMT+1

    Structure:
        display | position | float | overflow | width | height | border | margin | padding | background | align | font
*/

/** { min-height: 1px; }*/

/* IE PNG Fix */
img, div, a, input { behavior: url(/iepngfix.htc) }

body { border: 0; margin: 0; padding: 0; background: #F2F5FE url( "../IMG/bg.gif" ) 0 0 repeat-x; font: 75%/160% "trebuchet ms" ,sans-serif; color: #192666; _text-align: center; }

a { color: #192666; }
a:hover { color: #4F6AD7; }

p { border: 0; margin: 15px 0; padding: 0; }

div { display: block; border: 0; margin: 0; padding: 0; }

h1, h2, h3, h4, h5 { border: 0; margin: 15px 0 10px 0; padding: 0; font-weight: bold; }
h1 { font-size: 200%; line-height: 100%; font-weight: normal; }
h2 { font-size: 140%; line-height: 100%; font-weight: normal; }
h3 { font-size: 120%; line-height: 100%; font-weight: bold; clear:both; }
h4 { font-size: 120%; }
h5 { font-size: 100%; }

table { display: table; border-collapse: collapse; margin: 15px 0; padding: 0; border: 1px solid #B7CAF6; font-size: 100%; }
tr { display: table-row; }
th, td { display: table-cell; border: 1px solid #B7CAF6; margin: 0; padding: 5px; vertical-align: top; text-align: left; }
th { background: #E7ECFD; text-align: center; color: #192666; font-weight: bold; }


dl { border: 0; margin: 15px 0; padding: 0; }
dt { border: 0; margin: 0; padding: 0; font-weight: bold; }
dd { border: 0; margin: 0 0 0 30px; padding: 0; }

fieldset { border: 1px solid #ccc; margin: 15px 0; padding: 10px; }
legend { margin-left: 10px; font-size: 100%; font-weight: bold; color: #008; }

hr { display: block; height: 1px; margin: 10px 0; padding: 0; background: #CCC; border: 0 solid #CCC; color: #CCC; }

a, img, span { border: 0; margin: 0; padding: 0; }
abbr, acronym { border-bottom: 1px dotted #CCC; cursor: help; }

del, .through { text-decoration: line-through; }
strong, .strong { font-weight: bold; }
cite, em, q, var { font-style: italic; }
code, kbd, samp { font-family: monospace; font-size: 110%; }

/* Floating */
.f-left { float: left; }
.f-right { float: right; }

/* Text align */
.t-left { text-align: left; }
.t-center { text-align: center; }
.t-right { text-align: right; }

.va-middle { vertical-align: middle; }

.clear { clear: both; }
.box { min-height: 1px; _height: 1px; }
.box:after { content: "."; display: block; line-height: 0px; font-size: 0px; visibility: hidden; clear: both; }

.nom { margin: 0; }
.noscreen { display: none; }

/* -----------------...........--------------------------------------------------------------------------------------- */

#main { width: 770px; margin: 40px auto 0 auto; _text-align: left; }

/* Header */
#header { position: relative; width: 770px; height: 100px; margin: 0; padding: 0; background: #233C9B url( "../IMG/header.jpg" ) 0 0 no-repeat; color: #FFF; }

/* Header - logo */
#header #logo { position: absolute; top: 25px; left: 25px; height: 75px; margin: 0; background: url(../IMG/Logo.png) top left no-repeat; }

#header #sitename a { color: #FFF; margin: 0; margin-left: 75px; text-decoration: none; }
#header #sitename a:hover { color: #B5C4E3; text-decoration: underline; }
#header #slogan { color: #FFF; margin: 0; margin-left: 75px; font-size: 100%; font-style: italic; }
#header #sitephone {color: #fff; font-size:90%; float:right;clear:both; width:720px; margin:0;padding:0; text-align:right;margin-right:10px;}

/* Header - Search */
#header #search { position: absolute; top: 35px; right: 20px; }
#header #search form { position: relative; }
#header #search #search-input-out { position: absolute; top: 0; right: 45px; width: 155px; height: 28px; margin: 0; padding: 0; border: 0; background: url( "../IMG/search_input.gif" ) 0 0 no-repeat; font: bold 90%/100% "verdana" ,sans-serif; color: #192666; }
#header #search #search-input { width: 140px; margin: 5px 8px; padding: 3px 0; border: 0; background: #FFF; font: bold 100%/100% "verdana" ,sans-serif; color: #192666; }
#header #search #search-submit { position: absolute; top: 0; right: 0px; }
#header #search fieldset { margin: 0; padding: 0; border: 0; }
#header #search fieldset { width: 200px; }
#header #search legend { display: none; }

/* Main menu (tabs) */
#tabs { background: #192666; margin: 0 5px; padding: 10px 0 0 0; _height: 1px; min-height: 1px;}

#tabs ul { margin: 0 10px; padding: 0; list-style: none; }
#tabs ul li { margin: 0 5px 0 0; padding: 0; float: left; }
#tabs ul li a { display: block; position: relative; padding: 7px 15px; border: 0; background: url( "../IMG/tab_link.gif" ) 0 0 repeat-x; color: #B5C4E3; font-weight: bold; text-decoration: none; cursor: pointer; }

/* Main menu (tabs - link) */
#tabs ul li a span.tab-l, #tabs ul li a:hover span.tab-l { position: absolute; top: 0; left: 0; _left: -15px; width: 8px; height: 8px; background: url( "../IMG/tab_link_l.gif" ) 0 0 no-repeat; }
#tabs ul li a span.tab-r, #tabs ul li a:hover span.tab-r { position: absolute; top: 0; right: 0; _right: -1px; width: 8px; height: 8px; background: url( "../IMG/tab_link_r.gif" ) 100% 0 no-repeat; }

/* Main menu (tabs - hover) */
#tabs ul li a:hover { background: url( "../IMG/tab_hover.gif" ) 0 0 repeat-x; color: #FFF; }
#tabs ul li a:hover span.tab-l { background: url( "../IMG/tab_hover_l.gif" ) 0 0 no-repeat; }
#tabs ul li a:hover span.tab-r { background: url( "../IMG/tab_hover_r.gif" ) 100% 0 no-repeat; }

/* Main menu (tabs - active) */
#tabs ul li#active a { background: #FFF; color: #FF9000; }
#tabs ul li#active a span.tab-l { position: absolute; top: 0; left: 0; _left: -15px; width: 8px; height: 8px; background: url( "../IMG/tab_active_l.gif" ) 0 0 no-repeat; }
#tabs ul li#active a span.tab-r { position: absolute; top: 0; right: 0; width: 8px; height: 8px; background: url( "../IMG/tab_active_r.gif" ) 100% 0 no-repeat; }

/* Page (2 columns) */
#page { width: 770px; min-height: 1px; background: #FFF url( "../IMG/bg_page.gif" ) 0 0 repeat-y; _height: 1px; }
#page-in { min-height: 1px; padding: 10px 0; background: url( "../IMG/bg_page_in.jpg" ) 0 0 no-repeat; _height: 1px; }

/* Strip */
#strip { position: relative; clear: both; padding: 3px 20px 10px 20px; color: #6182D1; }
#strip p { margin: 0; }
#strip a { color: #6182D1; }
#strip a:hover { color: #192666; }

/* Strip - breadcrumbs */
#strip #breadcrumbs { width: 520px; margin: 0; padding: 0; }

/* Strip - RSS */
#strip #rss { float: right; width: 175px; _width: 200px; margin: 0; padding-left: 25px; background: url( "../IMG/ico_rss.gif" ) 0 50% no-repeat; }

/* Content */
#content { float: left; width: 530px; _width: 550px; margin: 0; padding: 0 0 0 20px; }

/* Content - article */
#content .article { clear: both; margin: 0; padding: 20px; background: url( "../IMG/content_article_bg.jpg" ) 0 0 no-repeat; }
#content .article h2 { margin: 0 -20px; padding: 10px; font-size: 110%; background: #DEE5FD url( "../IMG/content_title_bg.gif" ) 0 0 repeat-y; color: #192666; }
#content .article h2 span { background: url( "../IMG/ico_list.gif" ) 0 50% no-repeat; padding-left: 25px; }
#content .article p { text-align: justify; }

/* Content - page */
#content .page { clear: both; margin: 0; padding: 20px; background: url( "../IMG/content_article_bg.jpg" ) 0 0 no-repeat; }
#content .page h2 { margin: 0 -20px; padding: 10px; background: #DEE5FD url( "../IMG/content_title_bg.gif" ) 0 0 repeat-y; color: #192666; }
#content .page h2 span { background: url( "../IMG/ico_list.gif" ) 0 50% no-repeat; padding-left: 25px; }
#content .page p {}
#content .page .home {width:448px; margin:10px auto 20px auto;}
#content .page .home div {float:left;}
#content .page .home img {padding:5px;}
#content .info { margin: 10px 0; padding-bottom: 8px; border-bottom: 1px solid #DEE5FD; color: #6685CC; }
#content .info a { color: #6685CC; }
#content .info a:hover { color: #FF9000; }
#content .info span.date, #content .info span.cat, #content .info span.user, #content .info span.comments { padding-left: 15px; }
#content .info span.date { background: url( "../IMG/ico_date.gif" ) 0 50% no-repeat; }
#content .info span.cat { background: url( "../IMG/ico_cat.gif" ) 0 50% no-repeat; margin-left: 8px; }
#content .info span.user { background: url( "../IMG/ico_user.gif" ) 0 50% no-repeat; margin-left: 8px; }
#content .info span.comments { background: url( "../IMG/ico_comments.gif" ) 0 50% no-repeat; margin-left: 8px; }
#content .btn-more { margin: 0 0 15px 0; padding: 0; border: 0; position: relative; clear:both; }
#content .btn-more a { display: block; position: absolute; top: 0; right: 0; width: 67px; _width: 95px; height: 21px; margin: 0; padding: 0 0 0 28px; background: url( "../IMG/btn_more.gif" ) 0 0 no-repeat; color: #FFF; text-decoration: none; }
#content .btn-more a:hover { background: url( "../IMG/btn_more.gif" ) -95px 0 no-repeat; }
#content .btn-more a.full {width:100%;}
#content .basic-table {background:#fff;}
#content .basic-table tr.heading-row { background-color: #93AAF9; font-weight: bold; font-size: 110%; border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #000000; }
#content .basic-table tr.alt-row { background-color: #DEE5FD; }
#content .basic-table td {}

/* Right column */
#col { float: left; width: 200px; margin: 0; padding: 0; background: #CEDBF9 url( "../IMG/col_bg.gif" ) 0 0 repeat-y; }
#col-in { padding: 20px 10px; background: url( "../IMG/col_top.gif" ) 0 0 no-repeat; }
#col h3 { padding: 13px 15px 14px 15px; margin: 0 -10px 15px -10px; background: #A0B9F3 url( "../IMG/col_title_bg.gif" ) 0 0 repeat-y; color: #192666; }

/* Right column - About me */
#col #about-me { margin-bottom: 15px; line-height: 130%; }
#col #about-me p { margin: 0; }
#col #about-me #me { float: right; background: #fff; padding: 5px; border: 2px solid #ccc; width: 55px; height: 56px; margin-right: 7px; }

/* Right column - Category */
#col ul#category { margin: 15px 0; padding: 0; list-style: none; }
#col ul#category li { margin: 0; padding: 0; border-bottom: 1px solid #E0E8FA; }
#col ul#category li a, #col ul#category li span { display: block; padding: 3px 0 3px 22px; background: url( "../IMG/ico_archive.gif" ) 5px 6px no-repeat; text-decoration: none; }
#col ul#category li a:hover { background-color: #D3DFF8; color: #192666; }
#col ul#category li#category-active a { background: #E0E8FA url( "../IMG/ico_archive2.gif" ) 5px 50% no-repeat; font-weight: bold; }

/* Right column - Archive */
#col ul#archive { margin: 15px 0; padding: 0; list-style: none; }
#col ul#archive li { margin: 0; padding: 0; border-bottom: 1px solid #E0E8FA; }
#col ul#archive li a { display: block; padding: 3px 0 3px 22px; background: url( "../IMG/ico_archive.gif" ) 5px 50% no-repeat; text-decoration: none; }
#col ul#archive li a:hover { background-color: #D3DFF8; color: #192666; }
#col ul#archive li#archive-active a { background: #E0E8FA url( "../IMG/ico_archive2.gif" ) 5px 6px no-repeat; font-weight: bold; }

/* Right column - Links */
#col ul#links { margin: 15px 0; padding: 0; list-style: none; }
#col ul#links li { margin: 0; padding: 0; border-bottom: 1px solid #E0E8FA; }
#col ul#links li a { display: block; padding: 3px 0 3px 22px; background: url( "../IMG/ico_links.gif" ) 5px 6px no-repeat; text-decoration: none; }
#col ul#links li a:hover { background-color: #D3DFF8; color: #192666; }

/* Footer */
#footer { position: relative; clear: both; width: 770px; height: 60px; margin-bottom: 50px; background: url( "../IMG/footer.jpg" ) 0 0 no-repeat; color: #6685CC; }
#footer a { color: #6685CC; }
#footer a:hover { color: #192666; }
#footer p#copyright { position: absolute; top: 10px; left: 40px; margin: 0; }

/* Footer - "back on top" */
#top { position: absolute; top: 55px; left: 550px; }
#top p { position: relative; width: 30px; height: 25px; margin: 0; overflow: hidden; }
#top p span { display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 30px; height: 25px; background: url( "../IMG/ico_top.gif" ) 0 0 no-repeat; cursor: pointer; }
#top a:hover span { background: url( "../IMG/ico_top.gif" ) -30px 0 no-repeat; }

/* Footer - created by */
#createdby { position: absolute; top: 10px; left: 562px; margin: 0; color: #8CA3D8; }
#createdby a { color: #8CA3D8; }

/* Web Forms */
#webform fieldset { clear: both; font-size: 100%; border-color: #FF9000; border-width: 2px 0 0 0; border-style: solid none none none; padding: 10px; margin: 0 0 0 0; }
#webform fieldset legend { font-size: 125%; font-weight: normal; color: #000; margin: 0 0 0 0; padding: 0 5px; }
#webform label { font-size: 100%; }
#webform label u { font-style: normal; text-decoration: underline; }
#webform input, select, textarea { font-family: Tahoma, Arial, sans-serif; font-size: 100%; color: #000000; }
#webform textarea { overflow: auto; }
#webform div { clear: left; display: block; width: 354px; zoom: 1; margin: 5px 0 0 0; padding: 1px 3px; }
#webform fieldset div.notes { float: right; width: 158px; height: auto; margin: 0 0 10px 10px; padding: 5px; border: 1px solid #666666; background-color: #ffffe1; color: #666666; font-size: 88%; }
#webform fieldset div.notes h4 { background-image: url(/images/icon_info.gif); background-repeat: no-repeat; background-position: top left; padding: 3px 0 3px 27px; border-width: 0 0 1px 0; border-style: solid; border-color: #666666; color: #666666; font-size: 110%; }
#webform fieldset div.notes p { margin: 0em 0em 1.2em 0em; color: #666666; }
#webform fieldset div.notes p.last { margin: 0em; }
#webform div fieldset { clear: none; border-width: 1px; border-style: solid; border-color: #666666; margin: 0 0 0 144px; padding: 0 5px 5px 5px; width: 197px; }
#webform div fieldset legend { font-size: 100%; padding: 0 3px 0 9px; }
#webform div.required fieldset legend { font-weight: bold; }
#webform div label { display: block; float: left; width: 130px; padding: 3px 5px; margin: 0 0 5px 0; text-align: right; }
#webform div.optional label, label.optional { font-weight: normal; }
#webform div.required label, label.required { font-weight: bold; color: #990000; }
#webform div label.labelCheckbox, #webform div label.labelRadio { float: none; display: block; width: 300px; zoom: 1; padding: 0; margin: 0 0 5px 142px; text-align: left; }
#webform div fieldset label.labelCheckbox, #webform div fieldset label.labelRadio { margin: 0 0 5px 0; width: 170px; }
#webform div.submit { text-align: center; }
#searchform .search-box { border: 1px solid #FF9933; font-size: 110%; padding: 5px; color: #6699FF; }
#searchform .search-button { color: #FFFFFF; background-color: #FF9933; font-weight: bold; font-size: 110%; padding: 4px; border: 0; }

#tab-container .Menu {list-style:none; clear:none; margin:0;}
#tab-container .Menu li {list-style:none; clear:none; margin:0}

#topic-list {line-height:1.2em;}
#topic-list .topic-item { padding: 10px; margin: 10px; border-bottom: 1px solid #6699FF; display:block; }
#topic-list .topic-title {display:block; font-weight:bold;}
#topic-list .topic-title a {padding: 5px 5px 0px 20px; display:block; background: url(/IMG/ico_links.gif) .5em .5em no-repeat; color: #FF6600; text-decoration:none;}
#topic-list .topic-title a:hover {color: #3E5AAE; }
#topic-list .topic-description {display:block; font-size:90%; padding: 0 0 0px 20px;}

/* Video Players */

.smallPlayer {width:180px; margin:0 10px 10px 10px; padding:10px ; background:#fff; border:1px solid #ccc; float:right;}
    .smallPlayer .video-title { font-size: 11px; display: block; clear: both; line-height: .9em; padding: 5px; text-align: center; color: #FF6600; }
    .smallPlayer .video-player {height:170px;}
    
.mediumPlayer {width:240px; margin:0 10px 10px 10px; padding:10px ; background:#fff; border:1px solid #ccc; float:right;}
    .mediumPlayer .video-title { font-size: 11px; display: block; clear: both; line-height: .9em; padding: 5px; text-align: center; color: #FF6600; }
    .mediumPlayer .video-player {height:200px; border:1px solid #000;}
    
.largePlayer {width:300px; margin:auto; padding:10px ; background:#fff; border:1px solid #ccc;}
    .largePlayer .video-title { font-size: 12px; font-weight:bold; display: block; clear: both; line-height: 1em; padding: 5px; text-align: center; color: #FF6600; }
    .largePlayer .video-player {height:260px;}
    
#tag-cloud {text-align:center; font-family: Tahoma; margin:10px;font-size:100%;}
#tag-cloud a {text-decoration:none;}
#tag-cloud .tag-1 a { font-size: 80%; color: #FF9933;}
#tag-cloud .tag-2 a { font-size: 120%; color: #FF9933;}
#tag-cloud .tag-3 a { font-size: 160%; color: #FF9900; }
#tag-cloud .tag-4 a { font-size: 200%; color: #FF9900;}
#tag-cloud .tag-5 a { font-size: 240%; color: #CC6600; }
#tag-cloud .tag-6 a { font-size: 280%; color: #CC3300;}
#tag-cloud .tag-7 a { font-size: 320%; color: #FF9900; }
#tag-cloud .tag-8 a { font-size: 360%; color: #993300; }