/*
barvy
*/
/* reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;
}
:focus {outline: 0;} /* remember to define focus styles! */
body {line-height: 1; color: black; background: white;}
ol, ul {list-style: none;}
table {border-collapse: separate; border-spacing: 0;} /* tables still need 'cellspacing="0"' in the markup */
caption, th, td {text-align: left;font-weight: normal;}
blockquote:before, blockquote:after,
q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
/* reset end */
body {font-family: "Roboto", Arial, Helvetica, sans-serif; font-weight: 300; font-size: 16px; position: relative; background: #292929 url("img/bg.png") repeat-y 100% 0%; color: #fff;} /* 75.3% puvodni font size */
a {text-decoration: underline;}
a:hover {text-decoration: none;}
p, ul, ol, dl, address, blockquote {margin-bottom: 1em;}
ul, dl, ol {margin-top: 1em}
.hidden {position: absolute; top: -1024px;}
.bold, strong {font-weight: 400;}
.italic, em {font-style: italic;}
.valuelist .label {float: left;}
.bottomlinks {margin: 0px -30px; padding: 30px 30px 30px 30px; clear: both; border-top: 1px solid #555; margin-top: 30px;}
/* errors */
#alerts {margin-bottom: 1em;}
#alerts .alert ul li {background: none; padding: 0px;}
.alert {padding: 0.5em 1em; color: #fff;}
.error {background: red;}
.msg {background: green;}
.clause {border-top: 1px solid tomato; padding-top: 0.5em;}
.clauseData {background: tomato; padding: 0.5em 1em; font-size: 0.8em; color: #ffcccc;}
#dbg {position: absolute; right: 10px; top: 10px; font-family: Courier; background: #ffff99; padding: 15px; text-align: left; z-index: 1000; color: #333; font-size: 13px; max-width: 500px;}
#dbg a {position: absolute; text-decoration: none; height: 20px; line-height: 22px; width: 20px; text-align: center; background: darkorange; color: #fff; font-weight: bold; font-size: 20px; right: 0px; top: 0px;}
#dbg a:hover {background: transparent; color: #333;}
#page {position: relative; }
#header {position: fixed; top: 0; right: 0; width: 140px;; background: #fff; z-index: 10; }
#logo {position: fixed; left: 20px; top: 20px; background: #222; color: #fff; z-index: 999;}
#logo a {text-decoration: none; color: #fff; line-height: 45px; padding: 0px 20px; font-size: 24px;}
#header ul {position: relative; padding: 20px 15px; margin: 0px;}
#header ul li, #header ul a {float: left;}
#header ul li {margin: 0px 5px 5px 5px;}
#header h1 {margin: 0px; padding: 0px;}
#article {position: relative; float: right; width: 500px; background: #333; z-index: 5; margin-right: 140px; }
#text {margin: 20px 30px; line-height: 1.4em; color: #ddd;}
#text a {color: #F0E68C; text-decoration: none;}
#text a:hover {background: #F0E68C; color: #333;;}
#text h1 {font-size: 24px; line-height: 1.3em; font-weight: 400; margin: 0px 0px 1em 0px; color: #eee; padding-top: 10px;}
#text h1 small {display: block; color: #999;}
#text h2 {font-size: 24px; line-height: 1.3em; margin: 1em 0em .75em 0em; letter-spacing: 1px;}
#text h2 a, #text h3 a, #text h1 a {color: #eee;}
#text h3 {font-size: 20px; line-height: 1.3em; margin: 1em 0em .75em 0em; }
#text ul li {background: url("img/bullet.png") no-repeat 0px .45em; padding-left: 22px;}
#text ol {list-style-type: decimal; margin-left: 1.3em;}
.grayblock {background: #3d3d3d; position: relative; margin: 1em -30px; padding: 15px 30px 1px 30px; }
#promo {position: fixed; width: 100%; right: 640px; background: #222; z-index: 1; height: 100vh}
#promo .content {position: relative; margin-left: 640px; height: 100%;}
#promo a {height: 100%; display: block; position: relative; margin: 0px auto; overflow: hidden; }
#promo img {width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-fit: cover;}
#langs {position: absolute;}
#nav {position: fixed; width: 100px; right: 20px; top: 77px;}
#nav a {color: #333; text-decoration: none; display: block; line-height: 40px; position: relative;}
#nav li {}
#nav a:hover {margin: 0px -20px; padding: 0px 20px; background: #eee;}
#nav ul {margin: 0px;}
#footer {position: absolute;}
/* clear */
.clear:after {content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clear {display: inline-block;}
/* Hide from IE Mac \*/
.clear {display: block;}
* html .clear {height: 1px;}
/* End hide from IE Mac */
/* lightbox jquery */
#jquery-overlay{position:absolute;top:0;left:0;z-index:90;width:100%;height:500px}#jquery-lightbox{position:absolute;top:0;left:0;width:100%;z-index:100;text-align:center;line-height:0}#jquery-lightbox a img{border:none}#lightbox-container-image-box{position:relative;background-color:#fff;width:250px;height:250px;margin:0 auto}#lightbox-container-image{padding:10px}#lightbox-loading{position:absolute;top:40%;left:0%;height:25%;width:100%;text-align:center;line-height:0}#lightbox-nav{position:absolute;top:0;left:0;height:100%;width:100%;z-index:10}#lightbox-container-image-box >#lightbox-nav{left:0}#lightbox-nav a{outline:none}#lightbox-nav-btnPrev,#lightbox-nav-btnNext{width:49%;height:100%;zoom:1;display:block}#lightbox-nav-btnPrev{left:0;float:left}#lightbox-nav-btnNext{right:0;float:right}#lightbox-container-image-data{padding:0 10px;color:#666}#lightbox-image-details-caption{font-weight:bold}
/* the only edited style */
#lightbox-container-image-data-box{font:10px Verdana,Helvetica,sans-serif;background-color:#fff;margin:0 auto;line-height:1.4em;overflow:hidden;width:100%;padding:0 10px 0} /* auto >> hidden */
#lightbox-secNav {position:relative;}
#lightbox-secNav-btnClose{width:17px;height:14px;position: absolute; right: 0;top: 0;}
#lightbox-image-details-currentNumber{display:block;clear:left;} /* prehozenej padding odtud do nasledujiciho */
#lightbox-container-image-data #lightbox-image-details{width:70%;float:left;text-align:left;padding-bottom:1em;}
/* icons */
.icon {width: 24px; height: 24px; background: url("img/icons.png") no-repeat 0 0;}
.icon-twitter {background-position: -24px 0px;}
.icon-facebook {background-position: 0px 0px;}
.icon-gplus {background-position: -48px 0px;}
.icon-rss {background-position: -62px 0px;}
a:hover .icon {opacity: .5;}
/* arts */
.al-list {}
.ai-perex .date {float: left; padding-right: 10px; border-right: 1px dashed #888; margin-right: 10px;}
#text .art-item h2 {margin: 0px 0px 15px 0px; clear: left; padding-top: 15px;}
.art-item img {opacity: .5; float: left; width: 140px;}
.art-item {border-top: 1px dashed #666; margin: 0px -30px 0px -30px; padding: 30px 30px 10px 30px}
.pg-index .art-item:first-child {border-top: none; padding-top: 0px;}
.a-article .grayblock a.thumb {width: 500px; position: relative; margin: -15px -30px 10px -30px; display: block;}
.a-article .grayblock .thumb img { width: 100%; height: auto;}
/* book */
#text .book-item h2 {margin: 0px 0px 15px 0px; padding-top: 0px; font-size: 20px;}
.book-item {border-top: 1px dashed #666; margin: 0px -30px 0px -30px; padding: 25px 30px 15px 30px}
.book-item .date {float: left; padding-right: 10px; border-right: 1px dashed #888; margin-right: 10px;}
#text .book-item small {display: block; color: #999;}
.pg-book .more {border-top: 1px dashed #666; margin: 20px -30px 0px -30px; padding: 20px 30px 0px 30px}
/*
Colorbox Core Style:
The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
/*
User Style:
Change the following styles to modify the appearance of Colorbox. They are
ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{outline:0;}
#cboxContent{margin-top:20px;background: transparent; margin-bottom: 40px;}
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{border:5px solid transparent; background:transparent; padding: 28px;}
#cboxTitle{position:fixed; top:0; color:#ccc; line-height: 1.4em; width: 90%; left: 5%; height: 5%; text-align: center; padding-top: 5px;}
#cboxCurrent{position:fixed; top: 10px; right: 40px; color:#ccc; line-height: 1.4em; font-size: 12px;}
#cboxLoadingGraphic{background:url(img/loading.gif) no-repeat center center; background-size: 50px 50px;}
/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
#cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
#cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(img/controls.svg) no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
#cboxPrevious:hover{background-position:bottom left;}
#cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(img/controls.svg) no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
#cboxNext:hover{background-position:bottom right;}
#cboxClose{position:fixed; top:10px; right:0px; display:block; background:url(img/controls.svg) no-repeat top center; width:38px; height:19px; text-indent:-9999px;}
#cboxClose:hover{background-position:bottom center;}
/* gal */
.gal {position: relative; margin: 1em -30px;}
.gal a, .gal img {float: left; width: 125px; height: 125px;}
.gknihy .gal {margin-top: 2em; margin-bottom: -1em;}
#fb {position: fixed; bottom: 10px; right: 57px; width: 60px; opacity: .8}
@media only screen and (max-width: 996px) {
#article {
position: relative;
float: none;
width: auto;
background: #333;
z-index: 5;
margin-right: 140px;
margin-top: 85px;
}
#promo { display: none; }
body {background-color: #333}
.gal a {width: 25%; height: auto;}
.gal img {width: 100%; height: auto;}
#footer {color: silver; padding: 20px 30px 20px 30px; line-height: 1.4em; font-size: 14px;}
#footer a {color: silver;}
}
@media only screen and (max-width: 600px) {
#header{
position: relative; top: 0; right: auto; left: auto; width: auto;
padding: 15px 30px 15px 30px;
background: #222
}
#header ul {margin: 0px; float: right; padding: 0px; position: absolute; top: 17px; right: 15px;}
#logo{ position: relative; width: auto; top: auto; left: auto; background: transparent; }
#logo a {padding: 0; line-height: 1.2em;}
.gal a {width: 50%;}
#nav {position: relative; top: auto; left: auto; right: auto; margin: 0; padding: 0; background: #fff; width: auto; padding: 5px 30px;}
#ulnav {position: relative; top: auto; left: auto; right: auto; margin: 0; padding: 0; }
#fb {display: none;}
body {background: #333;}
#article {width: 100%; margin: 0; float: none; margin-top:30px;}
}
.badge {display: inline-block; background: darkred; padding: .25rem .5rem; vertical-align: top;}