/* ------------------------------------------ */
/* Webová galerie Azael --------------------- */
/* Základní styly --------------------------- */
/* ------------------------------------------ */



/* Reset css
----------------------------------------------- */
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;}
body {line-height: 1; color: black; background: #fff;}
ol, ul {list-style: none;}
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}



/* Basic formatting
----------------------------------------------- */
html {height: 100%;}
body {background: #000; font: 16px/1em arial, verdana; color: #d1d1d1; height: 100%;}
a, a:visited {color: #bababa; text-decoration: none;}
a:hover {color: #fff;}
p {margin: 20px 0;}
.clear {clear: both;}
.clear-10 {clear: both; padding: 8px 0 7px 0;}
strong {font-weight: bold;}
em {font-style: italic;}
.left {float: left;}
.right {float: right;}
.bold {font-weight: bold;}
.no-bold {font-weight: normal; padding-left: 17px;}





/* ------------------------------------------ */
/* Webová galerie Azael --------------------- */
/* Styly galerie ---------------------------- */
/* ------------------------------------------ */



/* Lista
----------------------------------------------- */
#lista {float: left; margin: 0 100px 30px 0; clear: both;}



/* Footer
----------------------------------------------- */
#footer {clear: both;}
#footer address {text-align: center; font-style: normal; font-size: 0.75em;}
#footer address dfn {border-bottom: 1px dashed; cursor: help; font-style: normal;}



/* Strankovani
----------------------------------------------- */
#pagination {clear: both; font-size: 0.75em; font-weight: bold;}
#pagination li {color: #ddd; display: block; float: left; border: 0px solid #695949; padding: 2px 4px; margin-right: 2px; font-size: 1.25em;}
#pagination li a:hover {color: #d57a43;}
#pagination .active {background: none; color: #d57a43; font-weight: bold;}
#pagination .active:hover {border: 0; border: 0px solid #c6d9e9; color: #d57a43;}

#pagination a, #pagination a:visited {text-decoration: none; color: #ddd;}
#pagination li:hover {border: 0px solid #695949; color: #ff0000;}

#pagination .dotty {text-decoration: none; border: 0;}
#pagination .dotty:hover {text-decoration: none; border: 0;}



/* Alerts
----------------------------------------------- */
.alert-bad {border: 1px solid red; width: 350px; font-size: 0.875em; padding: 5px 5px 5px 35px; font-weight: bold; background: url(../images/cancel.jpg) no-repeat 8px 4px #ffe3e3; margin: 10px 0 30px 0; color: #000;}
.alert-good {border: 1px solid green; width: 350px; font-size: 0.875em; padding: 5px 5px 5px 35px; font-weight: bold; background: url(../images/accept.jpg) no-repeat 8px 4px #d4ead4; margin: 10px 0 30px 0; color: #000;}
.center {position: relative; left: 50%; margin: 0 0 0 -175px; width: 350px; padding-bottom: 20px;}



/* Kniha navstev - editace
----------------------------------------------- */
#kniha {width: 520px;  border: 0px solid #000; font-size: 0.875em;}
#kniha input, #kniha textarea {background: #ddd; border: 1px solid #000;}
.posttop-comment {border: 1px solid #000; background: #ddd; color: #000;}
.posttext-comment {border: 1px solid #000; background: #eee; color: #000;}
.post-comment-reply .posttop-comment {background: #7b7b7b; color: #000;}
.post-comment-reply .posttext-comment {background: #929292; color: #000;}


/* Kniha navstev
----------------------------------------------- */
#kniha {padding: 20px 20px; margin: 0 0 40px 60px; height: 120px;}
#kniha .comment-input {width: 100%; margin-bottom: 4px; float: left;}
#kniha .comment-nadpis {width: 25%; float: left; text-align: right; padding-right: 5px; font-weight: bold;}
#kniha .comment-pole {width: 73%; float: left;}
#kniha .comment-pole input {width: 95%; font-size: 1.125em; padding: 2px;}
#kniha .comment-antispam {width: 31%; float: left;}
#kniha .comment-antispam input {width: 90%; font-size: 1.125em; padding: 2px;}
#kniha .comment-kod {width: 100px; float: left;}
#kniha .comment-bottom {width: 100%; float: left;}
#kniha .comment-smile {float: left; width: 140px; padding-top: 2px;}
#kniha .comment-button {float: right; font-weight: bold; width: 100px; text-align: right;}
#kniha .comment-button input {width: 100%;}

#kniha .prvni-sloupec {width: 50%; float: left;}
#kniha .druhy-sloupec {float: right; width: 49%;}
#kniha em {font-size: 1.125em; color: #d57b46;}
#kniha #antispam img {position: relative; top: 5px;}
#kniha textarea {width: 100%; height: 86px; margin-bottom: 10px; position: relative; top: -1px;}

.post-comment {margin: 0 0 16px 81px; width: 500px;}
.post-comment-reply {margin: 0 0 16px 111px; width: 470px;}
.posttop-comment {padding: 4px 4px 7px 4px ; height: 12px;}
.username-comment {font-weight: bold; width: auto; float: left;}
.userweb-comment {width: auto; float: left; margin-left: 10px;}
.userweb-image {width: 16px; height: 20px; border: 0;}
.posttext-comment {padding: 4px; border-top: 0; text-align: left;}
.postdate-comment {float: right; margin-right: 10px; font-size: 1.0em; padding: 1px 0 0 0;}

#vypis {width: 500px; position: relative; left: 50%; margin: 0 0 0 -290px; float: left;}



/* Thumbnail
----------------------------------------------- */
.big-box-text .thumbnail {width: 200px; height: 230px; float: left; text-align: center; font-size: 0.875em;}
.big-box-text .thumbnail img {border: 1px solid #000; margin: 0 0 5px 0;}



/* Thumbnail - zarovnani na stred vertikalne i horizontalne
----------------------------------------------- */
.thumbnail-back {border: 1px solid #7e7e7e; margin: 0 0 10px 10px; background: #a7a7a7;}
.thumbnail-back:hover {background: #cacaca;}
.posun {margin-top: 10px;}



/* Thumbnail - odkazy
----------------------------------------------- */
.thumbnail-link {width: 150px; height: 160px; float: left; text-align: center; font-size: 0.875em;}
.thumbnail-link img {border: 1px solid #000; margin: 0 0 5px 0; width: 100px; height: 100px;}

.thumbnail-link-list h3 {margin: 0; padding: 0 0 3px 0; font-weight: bold;}
.thumbnail-link-list h3 a, .thumbnail-link-list h3 a:visited {text-decoration: underline;}
.thumbnail-link-list h3 span a, .thumbnail-link-list h3 span a:visited {color: #828282; font-size: 0.75em; font-weight: normal; text-decoration: none;}
.thumbnail-link-list p {margin: 0 0 20px 0; padding: 0; font-size: 0.875em;}

.thumbnail-link-thumblist {clear: both;}
.thumbnail-link-thumblist img {float: left; border: 1px solid #000; margin: 0 15px 20px 0;}
.thumbnail-link-thumblist .thumbnail-link-list {float: left; width: 560px;}



/* Vlajky
----------------------------------------------- */
#flag {text-align: right; position: relative; top: 0; left: 0; float: right;}
#flag img {border: 1px solid #000; margin-right: 3px; padding: 0;}



/* Lightbox
----------------------------------------------- */
#lightbox {position: absolute; left: 0; width: 100%; z-index: 100;	text-align: center;	line-height: 0;}
#lightbox a img {border: none;}
#outerImageContainer {position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto;}
#imageContainer {padding: 10px;}
#loading {position: absolute;	top: 40%;	left: 0%;	height: 25%; width: 100%;	text-align: center;	line-height: 0;}
#hoverNav {position: absolute; top: 0; left: 0;	height: 100%;	width: 100%; z-index: 10;}
#imageContainer>#hoverNav {left: 0;}
#hoverNav a {outline: none;}
#prevLink, #nextLink {width: 49%;	height: 100%;	background: transparent url(../images/blank.gif) no-repeat; display: block;}
#prevLink {left: 0; float: left;}
#nextLink {right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover {background: url(../scripts/prev.gif) left 15% no-repeat;}
#nextLink:hover, #nextLink:visited:hover {background: url(../scripts/next.gif) right 15% no-repeat;}

#imageDataContainer {font: 10px Verdana, Helvetica, sans-serif;	background-color: #fff;	margin: 0 auto;	line-height: 1.4em;	overflow: auto;	width: 100%;}
#imageData {padding: 0 10px; color: #666;}
#imageData #imageDetails {width: 70%; float: left; text-align: left;}	
#imageData #caption {font-weight: bold;}
#imageData #numberDisplay {display: block; clear: left; padding-bottom: 1.0em;}			
#imageData #bottomNavClose {width: 21px; height: 19px; float: right;  padding-bottom: 0.7em;}	
#overlay {position: absolute;	top: 0;	left: 0; z-index: 90; width: 100%; height: 500px;	background-color: #000;}



/* Image
----------------------------------------------- */
#image {width: 100%; text-align: center;}
#image img {border: 1px solid #000;}
#image #sipky {width: 276px; margin: 20px auto; height: 25px;}
#image #sipky .vlevo {width: 90px; float: left; height: 23px; text-align: right;}
#image #sipky .vpravo {width: 90px; float: left; height: 23px; text-align: left;}
#image #sipky .zpet {width: 90px; float: left; height: 23px;}
#image #info {width: 650px; margin: 20px auto; text-align: left; padding-bottom: 30px;}
#image #info p {margin: 7px 0;}



/* Menu galerie
----------------------------------------------- */
#gallery-menu {margin-bottom: 20px;}
#gallery-menu .current {font-weight: bold;}
#gallery-menu li ul {margin: 5px 0 5px 15px;}
#gallery-menu li li {margin-left: 0px;}
#gallery-menu li li li {margin-left: 5px;}
#gallery-menu li li li li {margin-left: 5px;}
#gallery-menu li li li li li {margin-left: 5px;}



/* Menu kategorie
----------------------------------------------- */
#category-menu {margin-bottom: 20px;}
#category-menu .current {font-weight: bold;}
#category-menu li li {margin-left: 20px;}
#category-menu li li li {margin-left: 20px;}
#category-menu li li li li {margin-left: 20px;}
#category-menu li li li li li {margin-left: 20px;}





/* ------------------------------------------ */
/* Webová galerie Azael --------------------- */
/* Základní layout stránek ------------------ */
/* ------------------------------------------ */



#container {text-align: left; width: 958px; margin: 0 auto;}

#header {height: 248px; background: url("../images/header.jpg") #000; width: 958px;}

#header ul {width: 700px; height: 33px; float: left; position: relative; top: 201px; left: 65px;}
#header ul li {display: inline; float: left; display: block; width: 129px; height: 33px; margin-right: 2px;}
#header ul li a {color: #787878; font-weight: bold; padding-top: 6px; text-decoration: none; float: left; width: 129px; height: 27px; font-size: 0.875em; background: url("../images/menu.jpg") no-repeat; text-align: center;}
#header ul li a:visited {color: #787878;}
#header ul li a:hover, #header ul li a#current {color: #fff; background-position: 0 -33px;}

#header ul li.home {width: 43px;}
#header ul li.home a {width: 43px; background: url("../images/home.jpg") no-repeat;}
#header ul li.home a:hover {background-position: 0 0;}

#header ul#top-menu {width: 177px; height: 33px; float: right; position: relative; top: 14px; left: 0px;}
#header ul#top-menu li {width: 43px;}
#header ul#top-menu li a span {visibility: hidden;}

#header ul#top-menu li.rss a {width: 43px; background: url("../images/top-menu-rss.jpg") no-repeat;}
#header ul#top-menu li.cesky a {width: 43px; background: url("../images/top-menu-czech.jpg") no-repeat;}
#header ul#top-menu li.anglicky a {width: 43px; background: url("../images/top-menu-english.jpg") no-repeat;}

#header ul#top-menu li a:hover, #header ul#top-menu li a#current-top {background-position: 0 -33px;}

#content {float: left; width: 758px; font-size: 0.75em;}

#content .small-box {width: 364px; background: url("../images/small-box-content.jpg") #000; float: left; margin: 0 0 0 8px;}
#content .small-box .small-box-top {width: 364px; height: 50px; background: url("../images/small-box-top.jpg") #000; float: left;}
#content .small-box .small-box-top h2 {font-size: 1.7em; margin: 20px 0 0 65px;}
#content .small-box .small-box-text {padding: 5px 25px 0 30px; float: left; height: 243px;}
#content .small-box .small-box-text h4 {font-weight: bold; padding: 15px 0 0 0; margin: 0;}
#content .small-box .news-box p {margin: 10px 0 0 0;}
#content .small-box .news-box a, #content .small-box .news-box a:visited {text-decoration: underline;}

#content .small-box .small-box-bottom {width: 364px; height: 34px; background: url("../images/small-box-bottom.jpg") #000; float: left; text-align: right; margin-right: 25px;}
#content .small-box .small-box-bottom a, #content .small-box .small-box-bottom a:visited {margin-right: 25px;}

#content .big-box {width: 741px; background: url("../images/big-box-content.jpg") #000; float: left; margin: 10px 0 0 8px;}
#content .big-box .big-box-top {width: 741px; height: 50px; background: url("../images/big-box-top.jpg") #000; float: left;}
#content .big-box .big-box-top h2 {font-size: 1.7em; margin: 20px 0 0 65px;}
#content .big-box .big-box-text {padding: 5px 25px 0 30px; float: left;}

#content .big-box .big-box-text .thumbnail {width: 136px; height: 150px; float: left; text-align: center; font-size: 0.875em;} 
#content .big-box .big-box-text .thumbnail img {border: 1px solid #000; margin: 15px 0 3px 0; width: 100px; height: 100px;}

#content .big-box .big-box-bottom {width: 741px; height: 34px; background: url("../images/big-box-bottom.jpg") #000; float: left;}

#right {float: right; width: 200px; background: url("../images/sidebar-top.jpg") #000;}
#right ul {margin: 0 0 10px 35px;}
#right ul li {list-style: circle;}
#right a, #right a:visited {text-decoration: none; color: #d1d1d1; font-size: 0.75em;}
#right a:hover {color: #e9e9e9;}
#right .sidebar-center {float: right; width: 200px; height: 15px; background: url("../images/sidebar-center.jpg") #000;}
#right .sidebar-footer {float: right; width: 200px; background: url("../images/sidebar-footer.jpg") #000; text-align: center;}
#right .sidebar-footer p {font-size: 0.69em; padding: 5px 7px 0 7px;}
#right .sidebar-footer p img {margin-left: 38px;}
#right .sidebar-footer p a, #right .sidebar-footer p a:visited {font-size: 1.0em; text-decoration: underline;}
#right .sidebar-bottom {float: right; width: 200px; height: 27px; background: url("../images/sidebar-bottom.jpg") #000;}


#footer {height: 30px; clear: both; width: 100%;}

.blog {margin-top: 20px;}
.blog h3 {margin: 0; padding: 0 0 3px 0;}
.blog h3 a, .blog h3 a:visited {font-weight: bold; font-size: 1.25em; text-decoration: underline;}
.blog span {font-style: italic; padding-bottom: 7px; display: block;}
.blog p {margin: 0; padding: 0;}

#content .big-box .big-box-text h1 {font-weight: bold; font-size: 1.625em; line-height: 1.825em;}
#content .big-box .big-box-text h2 {font-weight: bold; font-size: 1.5em; line-height: 1.7em;}
#content .big-box .big-box-text h3 {font-weight: bold; font-size: 1.375em; line-height: 1.575em;}
#content .big-box .big-box-text h4 {font-weight: bold; font-size: 1.25em; line-height: 1.45em;}
#content .big-box .big-box-text h5 {font-weight: bold; font-size: 1.125em; line-height: 1.325em;}
#content .big-box .big-box-text h6 {font-weight: bold; font-size: 1.0em; line-height: 1.2em;}
