/*
Theme Name: jankovarik.net  
Theme URI: http://jankovarik.net/
Description: Please,dont copy any graphics ! Thank you ...
Version: 0.1
Author: Jan Kovařík
Author URI:http://jankovarik.net/
*/

/* RESET */
html, body, ul, ol, li, h1, h2, h3, h4, h5, h6, img, table {margin:0;padding:0;border:0;}
 

/* TYPOGRAPHY & COLORS */
/* Default font settings. The font-size percentage is of 16px. (0.875 * 16px ~ 14px) */
body{margin:0 auto;min-width:960px;text-align:center;font-size:87.5%; background-image: url(img/pages/index.jpg); background-repeat: repeat-x; background-position: center top; background-color:#f2f2f2; color:#595959; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;line-height:1.429em; }
.cleaner,.post-edit-link{clear:both;display:block;width: 100%;}
a {color:#1bb4da;text-decoration:none;}
a:focus, button:focus {outline:medium none;}
a:hover{text-decoration:underline;}
a img{border:0;}
h1, h2, h3, h4, h5 {text-shadow:0px 1px 0px #ffffff;}
h1{font-size:2.25em;font-weight:bold;letter-spacing:-2px;line-height: 1.3em; margin: 2.5em 0 10px 0;border-bottom:1px #d9d9d9 solid; padding-bottom: 5px;}
.hentry h1 {padding-bottom: 0;border: 0;}
h1:first-letter{text-transform:capitalize}
h2{font-size:1.5em;font-weight:normal;letter-spacing:-1px;line-height: 1.3em; display: block; margin: 0 0 40px 0; padding: 0; width: 75%;}
h2 a{ color: #595959;}
h3{font-size:1.5em;font-weight:bold;letter-spacing:-1px; margin:30px 0 22px 0; border-bottom:1px #d9d9d9 solid; padding-bottom: 9px; width: 100%; display: block; clear: both;}
h4{font-size:1.125em;font-weight:bold;letter-spacing:-0.05em; margin:1.5em 0 0 0; clear: both;}
.postthumb h3 {font-size:1em; font-weight: bold;letter-spacing:0; margin: 0; padding: 0; border: 0; line-height: 26px; text-shadow: none!important; float: left;}
h5{font-size:2.5em;line-height:1.2em;letter-spacing:-0.04em;color:#FFFFFF;}
ul {padding-left: 0; list-style-type: none;}
ul li {margin-bottom: 1.62em;}
hr{display:none;}
p{margin-bottom:1.62em; }


/* ------ PAGE CONSTRUCTION ------ */
#page{margin:0 auto 0 auto;width:960px;text-align:left;}
#top{width:960px;height:55px;display:block;margin:0 0 0 0;padding:61px 0 0 0;}
#main{text-align:left; padding-bottom: 60px;}
.home #main {padding-bottom: 30px!important;}
#footer{width:100%;display:block;color:#8d8d8d;background:#333333 url(img/footer.jpg) repeat-x top;text-align:left;}


/* ------ PAGE ELEMENTS ------ */
/* logo img replacement */
#logo{width:238px;height:65px;margin:0; padding:0;position:relative;left:0;top:-6px;overflow:hidden;font-size:1em;}
#logo span{width:238px;height:66px;display:block;position:absolute; left:0; top:0; z-index:1;margin:0; padding:0;overflow:hidden;background:url(img/logo.gif) top left no-repeat;}
#menu{display:block;float:right;list-style:none;line-height:33px;vertical-align:middle;}
#ci_set{width:256px;height:333px;display:block;float:left;background:transparent url(img/ci_set.jpg) no-repeat left top;margin:27px 0 0 0;}
#footer_top{width:960px;height:330px;display:block;clear:both;margin:0 auto 0 auto;padding:160px 0 0 0;background:transparent url(img/footer_top.jpg) no-repeat center top;}
.footer_box{width:240px;margin:10px 90px 0 0;padding:0; display:block;float:left;}
.inner{display:block;height:280px;}
.ftbutton{display:block;clear:both;}
.icon {display: block; float: left; clear: both; padding: 0 0 0 30px; margin: 0 0 1.2em 0; width: 100%;}
#vcard{background:transparent url(img/vcard.gif) no-repeat left 5px;}
#email{background:transparent url(img/email.gif) no-repeat left 5px;}
#tel{background:transparent url(img/tel.gif) no-repeat left 5px;}
#loc{background:transparent url(img/loc.gif) no-repeat left 5px;}
#skype{background:transparent url(img/skype.gif) no-repeat left 5px;}
#twitter_icon{background:transparent url(img/twitter_icon.gif) no-repeat left 5px;} 
#icq{background:transparent url(img/icq.gif) no-repeat left 5px;}
#bank{background:transparent url(img/bank.gif) no-repeat left 5px;}
#ft_e-mail{background:transparent url(img/ft_email.gif) no-repeat left 5px;}
#ft_tel{background:transparent url(img/ft_tel.gif) no-repeat left 5px;}
#ft_vcard{background:transparent url(img/ft_vcard.gif) no-repeat left 5px;}


/* ------ TOP MENU ------ */
/* "float:left" - fix staircase effect in IE */
#menu li,.button{float:left;}
/* width and height of the menu item */
#menu,.button{margin:0; padding:0;list-style:none;text-align:center;line-height:36px;vertical-align:middle;height:36px;}
#footer .button{height:35px;}
/* must set it as relative,because .hover class top and left with absolute position will be positioned according to li.*/
#menu li{float:left;padding:0 13x 0 13px;margin:0 0 0 8px;position:relative;}
.button{float:left;padding:0 13x 0 13px;margin:0 0 0 0;position:relative;}
.button a:active{text-decoration:none!important;}
/* z-index must be higher than .hover class and display as block and set the height according to the height of the menu to make the whole LI clickable*/
#menu li a,.button a{z-index:20; display:block;position:relative;text-decoration: none!important;color:#4d4d4d;font-weight:bold;text-shadow:0px 1px 0px #ffffff;}
#menu li a:hover,.selected a,.button a:hover{color:#58deff;text-shadow:0px -1px 0px #333333!important;position:relative;left:0;top:0;text-decoration:none;}
#menu .selected a{color:#58deff;text-decoration:none;}
/* mouseover image, must be postion absolute, width,height,left and top to fill the whole LI item, display under the Anchor tag, hide it by default*/
#menu li .hover,.button .hover,.current_page_item a{ background:transparent url(img/menu_top.gif) no-repeat 0 0; position:absolute; width:100%;height:35px;left:0; top:0px;z-index:0;display:none;text-decoration:none;}
#menu li.page-item-2 .hover,#menu li.page-item-2.selected,#menu li.page-item-2.current_page_item a{background:transparent url(img/menu_top.gif) no-repeat 0 1px;color:#58deff;text-shadow:0px -1px 0px #333333!important;}
#menu li.page-item-6 .hover,#menu li.page-item-6.selected,#menu li.page-item-6.current_page_item a{background:transparent url(img/menu_top.gif) no-repeat -73px 1px;color:#58deff;text-shadow:0px -1px 0px #333333!important;}
#menu li.page-item-8 .hover,#menu li.page-item-8.selected,#menu li.page-item-8.current_page_item a{background:transparent url(img/menu_top.gif) no-repeat -226px 1px;color:#58deff;text-shadow:0px -1px 0px #333333!important;}
#menu li.page-item-10 .hover,#menu li.page-item-10.selected,#menu li.page-item-10.current_page_item a{background:transparent url(img/menu_top.gif) no-repeat -305px 1px;color:#58deff;text-shadow:0px -1px 0px #333333!important;}
.page-item-2{width:65px;background:transparent url(img/menu_top.gif) no-repeat 0 -35px;}
.page-item-6{width:145px;background:transparent url(img/menu_top.gif) no-repeat -73px -35px;}
.page-item-8{width:71px;background:transparent url(img/menu_top.gif) no-repeat -226px -35px;}
.page-item-10{width:83px;background:transparent url(img/menu_top.gif) no-repeat -305px -35px;}



/* FOOTER- blue links */
#footer a {color:#58deff;}
#footer a:hover{text-decoration:underline;}
#footer .button a{text-shadow:0px -1px 0px #292929;}
#footer .button a:hover,#footer .selected a{color:#2aa5c3;text-shadow:0px -1px 0px #000000 !important; text-decoration:none;}
#footer .selected a{text-decoration:none;position:relative;left:0;top:1px;}
#footer .button a:hover{position:relative;left:0;top:1px;}
.infobox {margin: 0 0 90px 90px;}
.button.chci-vic .hover,.button.chci-vic.selected{background:transparent url(img/info.gif) no-repeat 0 0; height: 27px;}
.chci-vic{width:99px;background:transparent url(img/info.gif) no-repeat 0 -26px; margin-bottom: 1em; font-size: 0.8em;line-height: 26px; height: 27px; text-align: center;}
.button.ukazky .hover,.button.ukazky.selected{background:transparent url(img/info.gif) no-repeat -99px 0; height: 27px;}
.ukazky{width:67px;background:transparent url(img/info.gif) no-repeat -99px -26px; margin-bottom: 1em; font-size: 0.8em;line-height: 26px; height: 27px; text-align: center;}
.button.more-link .hover,.button.more-link.selected{background:transparent url(img/detail.gif) no-repeat 0 0;}
.more-link{width:70px;background:transparent url(img/detail.gif) no-repeat 0 -26px; margin-bottom: 1em; font-size: 0.8em;line-height: 26px; height: 26px; text-align: left; float: right; display: block; display: none;}
.projekty {margin: 347px 0 0 0px;line-height: 28px}
.button.kdojsemft .hover,.button.kdojsemft.selected{background:transparent url(img/ftbuttons.gif) no-repeat 0 0;}
.kdojsemft{width:94px;background:transparent url(img/ftbuttons.gif) no-repeat 0 -35px;}
.button.nazoryft .hover,.button.nazoryft.selected{background:transparent url(img/ftbuttons.gif) no-repeat -100px 0;}
.nazoryft{width:111px;background:transparent url(img/ftbuttons.gif) no-repeat -100px -35px;}
.button.kontaktyft .hover,.button.kontaktyft.selected{background:transparent url(img/ftbuttons.gif) no-repeat -217px 0;}
.kontaktyft{width:148px;background:transparent url(img/ftbuttons.gif) no-repeat -217px -35px;}

/* header level 5 in footer - image replacement */
.header{position:relative;overflow:hidden;margin:0 0 30px 0; padding:0;}
.header span{display:block;position:absolute; left:0; top:0; z-index:1;margin:0; padding:0;}
#kdo_jsem{width:177px; height:40px;}
#kdo_jsem span{width:177px; height:40px;background:transparent url(img/ft_kdojsem.gif) no-repeat left top;}
#rekli_o_me{width:198px; height:40px;}
#rekli_o_me span{width:198px; height:40px;background:transparent url(img/ft_rekliome.gif) no-repeat left top;}
#kontakt{width:162px; height:40px;}
#kontakt span{width:162px; height:40px;background:transparent url(img/ft_kontakt.gif) no-repeat left top;}

.last{margin-right:0;padding-right:0;  }
.last strong, .icon strong{display:block;clear:both;}
#footer_bottom{width:960px;display:block;clear:both;background-color:#333333;margin:70px auto 0 auto;padding:3px 0 50px 0;font-size:0.79em !important;line-height:1.2em;text-align:center;border:1px #3e3e3e solid;border-bottom:0;border-left:0;border-right:0; color:#4c4c4c!important;}


/* Begin Images */
p img{padding:0;max-width:100%;margin:10px; }
/*Using 'class="alignright"' on an image will (who would'vethought?!) align the image to the right. And using 'class="centered', will of course center the image. This is much better than usingalign="center",being much more futureproof (and valid) */
img.centered{display:block;margin:15px auto 10px auto;}
img.alignright{margin:15px 0 10px 15px;display:inline;}
img.alignleft{margin:15px 15px 10px 0;display:inline;}
.alignright{float:right;}
.alignleft{float:left}
.alignnone{margin:0!important;padding:0!important;  }


.bigger{font-size:1.2em;}
.kontakt_left{width:480px;float:left;text-align:left;margin:0; padding:10px 120px 0 0; }
.kontakt_right{width:350px;float:right;text-align:left;margin:0;padding:10px 0 0 0 ;}
.postthumb {width:290px;height:220px;display:block;float:left; margin: 25px 0 10px 0;}
.postthumb img, .entry img, #photo{-moz-box-shadow: 2px 2px 2px #cacaca;}
.nazor_archiv {height: 100%;}
.first,.second{margin-right: 45px;}
.postthumb p{margin:0 0 5px 0;padding:0;  }
.category_descr p{font-size:1.2em;text-align:center; display: none;}
.gray{color:#949494;}
dl{margin-top:3em;}
dt{width:110px;display:block;clear:left; float:left; margin-bottom:1.25em;font-weight:bold;}
dd{margin-left:110px;margin-bottom:1.25em;}
dd ul{list-style-type:none; padding-left: 0;}
dd ul li,.ok li,.ko li{padding-left:25px;margin: 0;}
dd ul li,.ok li {background:transparent url(img/ok.gif) no-repeat left 5px;}
.ko li {background:transparent url(img/ko.gif) no-repeat left 5px;}
.obsah li{margin-bottom: 1.62em; }
.programs li {margin-bottom: 0.8em!important;}
.ok,.programs,.services,.time{list-style-type:none; margin-left: 0; padding-left: 0;}
.ok strong,.ko strong,.services strong,.time strong{display:block;clear:both;}
.info{display:block;}
.navigation{border-top:1px #d9d9d9 solid;padding-top:5px;margin:70px 0 50px 0;display:block;clear:both;}
.top{background:transparent url(img/top.gif) no-repeat left 8px;display:block;float:left;padding:0 0 0 14px}
.dalsi a{background:transparent url(img/right.gif) no-repeat left 7px;display:block;float:left;padding:0 0 0 10px;margin-left: 25px;}
.vyber a{background:transparent url(img/top.gif) no-repeat left 8px;display:block;float:left;padding:0 0 0 14px;}
.filtr ul{list-style-type:none;display:inline;}
.filtr ul li{display:inline;float:left;}
.filtr ul li a{background:transparent url(img/filtr_spacer.gif) no-repeat right 5px;display:block;padding:0 8px 0 8px;}
.filtr ul li:last-child a{padding-right:0;background-image:none;}
.nazor p{height:7.145em;overflow:hidden;margin-bottom:1.62em; }
.programs li{height:18px;padding:0 0 0 27px;margin:0 0 0 5px;}
.in{background:transparent url(img/apps/in.gif) no-repeat left center;}
.ps{background:transparent url(img/apps/ps.gif) no-repeat left center;}
.ai{background:transparent url(img/apps/ai.gif) no-repeat left center;}
.acrobat{background:transparent url(img/apps/acrobat.gif) no-repeat left center;}
.corel{background:transparent url(img/apps/corel.gif) no-repeat left center;}
.services {width:280px;float: left;clear:left;text-align:left;margin:0; padding:0;}
.services h4 {margin-left: 90px!important; margin-top: 0; padding-top: 0;}
.services ul, .services ul, .services p {padding:0 0 0 90px; margin: 11px 0 15px 0; }
.work {background: transparent url(img/apps/work.jpg) no-repeat left top;}
.work strong {display: inline;}
.webdesign {background: transparent url(img/apps/imac.jpg) no-repeat left top; display: block; clear: both;}
.uvodniul {padding-bottom: 60px;}
.graphic {background: transparent url(img/apps/tablet.jpg) no-repeat left top; display: block; clear: both;}
.suit  {background: transparent url(img/apps/suit.jpg) no-repeat left top}
.tools {background: transparent url(img/apps/tools.jpg) no-repeat left top}
.tools p {padding-top: 0; margin: 0 0 20px 0;}
#photo {width:960px;height: 271px;clear: both;margin: 0 0 10px 0;}
.nazor_archiv{width:100%;display:block;float:left; margin-top: 60px;border-top:1px #d9d9d9 solid;padding-top:5px;}
blockquote {margin: 0;padding: 0;}
.nazor_archiv blockquote {background: transparent url(img/quoright.gif) right bottom no-repeat;}
.nazor_archiv blockquote p {padding: 0 25px; background: transparent url(img/quoleft.gif) left 10px no-repeat;}
.nazor_archiv .jmeno {padding: 0 25px; display: block;} 

/* Page custom backgrounds */
.page-id-10 #main {background: transparent url(img/pages/contact.jpg) no-repeat 92% 97%}
#page {background: transparent url(img/pages/index.jpg) no-repeat center top}

/* hide image, wow :-D */
.fadein {}

#twitter {width:425px; height: 106px; float:left;text-align:left;margin:0; padding:65px 30px 0 30px; margin: 0!important;  background: transparent url(img/twitter.gif) no-repeat center top;}
#twitter_bottom {padding-left: 50px;}
.pripravujiright {font-weight: normal; font-size: 0.8em;}
.pripravuji {color: #9c9c9c;}


/* .kompletni {display: block; width: 100px; height: 101px; position: absolute; background-image: url(img/komplet.gif); margin: -5px 0 0 195px; } */
#ribbon {display: block; width: 172px; height: 171px; position: absolute; right:0;top:0; z-index: 200;}

.hide {display: none;}