/* ------------------------------------------ */
/* Webova galerie Azael --------------------- */
/* Zakladni styly --------------------------- */
/* ------------------------------------------ */



/* Reset css
----------------------------------------------- */
html {scroll-behavior: smooth;}
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, b, u, i, center, 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: collapse; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
blockquote, q {quotes: none;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}



/* Basic formatting
----------------------------------------------- */
html {height: 100%;}
body {color: #000; font: 16px/1em "Inter", Arial, "Trebuchet MS", Verdana; height: 100%; background: #F5F5F5;}

a, a:visited {color: #000; text-decoration: underline; cursor: pointer;}
a:hover {color: #d9413a; text-decoration: none;}
p {margin: 20px 0;}
strong {font-weight: bold;}
em {font-style: italic;}

input[type="submit"] {cursor: pointer;}

.clear {clear: both;}
.clear-10 {clear: both; padding: 8px 0 7px 0;}
.clear-20 {clear: both; padding: 10px 0;}

.line-dashed {clear: both; border: 0; width: calc(100% - 150px); height: 1px; padding: 0; background: repeating-linear-gradient(to right, #B9C1C3, #B9C1C3 10px, transparent 10px, transparent 20px); margin: 50px 0 50px 75px;}
.line-dashed-inside {clear: both; border: 0; width: 1290px; max-width: 100%; height: 1px; padding: 0; background: repeating-linear-gradient(to right, #B9C1C3, #B9C1C3 10px, transparent 10px, transparent 20px); margin: 50px 0 50px 0;}
.line-dashed-clear {float: left; border: 0; width: 1290px; max-width: 100%; height: 1px; padding: 0; background: repeating-linear-gradient(to right, #B9C1C3, #B9C1C3 10px, transparent 10px, transparent 20px); margin: 0 0 50px 0;}
.line-dashed-100 {clear: both; border: 0; width: 100%; height: 1px; padding: 0; background: repeating-linear-gradient(to right, #B9C1C3, #B9C1C3 10px, transparent 10px, transparent 20px); margin: 0px 0 0px 0;}

.left {float: left;}
.right {float: right;}
.bold {font-weight: bold;}
.no-bold {font-weight: normal; padding-left: 17px;}

.height-1 {height: 1px;}
.height-15 {height: 15px;}
.margin-0 {margin: 0;}
.padding-0 {padding: 0;}

.black {color: black;}
.blue {color: blue;}
.green {color: green;}
.grey {color: grey;}
.orange {color: orange;}
.red {color: red;}



/* ------------------------------------------ */
/* Webova galerie Azael --------------------- */
/* Styly galerie ---------------------------- */
/* ------------------------------------------ */



/* Debug table
----------------------------------------------- */
#debug {border-spacing: 1px; font-size: 0.69em; position: absolute; left: 0; top: 0;}
#debug td {background: #d5d5d5; padding: 5px 8px;}
#debug th {background: #aaa; font-weight: bold; padding: 5px 8px;}
#debug tr.debug-red td {font-weight: bold; color: red;}

#debugdiv {width: 90%; margin-left: 5%;}
#debugdiv h3 {font-weight: bold; color: blue; font-size: 1.5em; display: block; width: 100%; margin: 20px 0 5px;}
#debugdiv h3 span {color: red;}
#debugdiv h3 span.green {color: green;}



/* Lista
----------------------------------------------- */
.lista {float: left; margin: 10px 0 15px 0; clear: both; width: 96%; font-size: 0.75em; line-height: 2.0em;}
.lista a, .lista a:visited {text-decoration: underline;}



/* Strankovani
----------------------------------------------- */
#centering {clear: both; width: 100%; overflow: hidden; padding: 15px 0;}

#pagination {padding: 0; margin: 0 auto; list-style-type: none; float: left; position: relative; left: 50%; font-size: 0.875em;}
#pagination li {float: left; position: relative; right: 50%;}
#pagination li a {width: auto; display: block; padding: 2px 4px; text-decoration: none;}
#pagination .active {padding: 2px 4px; color: #a00000;}



/* Alerts
----------------------------------------------- */
.alert-bad {border: 0; width: calc(100% - 20px); font-size: 1.0em; padding: 10px; font-weight: bold; font-family: "Jaldi"; background: #c01d1f; margin: 10px 0 12px 0; color: #fff; position: relative; z-index: 999;}
.alert-good {border: 0; width: calc(100% - 20px); font-size: 1.0em; padding: 10px; font-weight: bold; background: #356e27; margin: 10px 0 12px 0; color: #fff; position: relative; z-index: 999;}
.alert-sql {border: 1px dashed #f3c14a; width: 500px; font-size: 0.75em; line-height: 1.4em; padding: 5px 5px 5px 35px; background: #fffca2; margin: 10px 0 12px 0; color: #000; position: relative; z-index: 999;}
.alert-sql-highlight {border: 5px solid red;}
.alert-info {border: 0; width: 350px; font-size: 0.75em; padding: 10px; font-weight: bold; background: #ce6f00; margin: 10px 0 12px 0; color: #fff; position: relative; z-index: 999;}
.alert-bad a, .alert-good a, .alert-info a, .alert-bad a:visited, .alert-good a:visited, .alert-info a:visited {color: #fff; text-decoration: underline;}
.alert-bad a:hover, .alert-good a:hover, .alert-info a:hover {color: #ffff67;}
.align-center {position: relative; left: 50%; margin: 0 0 0 -195px; width: 410px; padding-bottom: 10px; clear: both;}
.align-left {width: 410px; padding-bottom: 10px; clear: both;}



/* Kniha navstev - editace
----------------------------------------------- */
#kniha {width: 650px; max-width: calc(100% - 50px); background: #f8f8f8; border: 5px solid #e8e8e8; font-size: 0.75em;}
#kniha input, #kniha textarea {background: #fff; border: 1px solid #ccc; color: #777;}
.posttop-comment {border: 1px solid #e3e3e3; background: #e3e3e3;}
.posttext-comment {border: 1px solid #f8f8f8; background: #f8f8f8; font-size: 0.75em;}
.post-comment-reply .posttop-comment {border: 1px solid #d5e0f6; background: #d5e0f6;}
.post-comment-reply .posttext-comment {border: 1px solid #eaf0fb; background: #eaf0fb; font-size: 0.75em;}



/* Kniha navstev
----------------------------------------------- */
#kniha {padding: 20px; margin: 10px auto 40px; overflow: hidden; position: relative; left: 0; clear: both;}
#kniha h4 {color: #7f7f7f; font-size: 1.5em; font-weight: bold; margin-bottom: 7px; padding-bottom: 0;}
#kniha p {color: #7f7f7f; font-size: 0.875em; margin: 0; padding: 0;}
#kniha p a, #kniha p a:visited {color: #525252;}
#kniha hr {border-width: 0; border-top: 1px solid #d9d9d9; height: 1px; margin: 20px 0 15px 0; padding: 0;}
#kniha .comment-input {width: 100%; margin-bottom: 4px;}
#kniha .comment-nadpis {width: calc(100% - 2px); text-align: left; padding: 7px 0 4px 2px; font-weight: bold; color: #777;}
#kniha .comment-nadpis span {margin-left: 5px; font-size: 1.25em; color: red;}
#kniha .comment-pole {width: 100%; float: left; margin-bottom: 10px;}
#kniha .comment-pole input {width: calc(100% - 10px); font-size: 1.0em; padding: 4px;}
#kniha .comment-pole input:focus {border: 1px solid #8c8c8c;}
#kniha .comment-pole-textarea textarea {height: 177px; padding: 4px; width: calc(100% - 10px);}
#kniha .comment-pole-textarea textarea:focus {border: 1px solid #8c8c8c;}
#kniha .comment-antispam {width: calc(100% - 112px); float: left;}
#kniha .comment-antispam input {width: calc(100% - 10px); font-size: 1.0em; padding: 4px;}
#kniha .comment-antispam input:focus {border: 1px solid #8c8c8c;}
#kniha .comment-kod {width: 100px; float: left; padding: 2px 0 0 5px;}
#kniha .comment-bottom {width: 100%; float: left;}
#kniha .comment-smile {float: left; width: 140px; padding: 8px 0 0 10px;}
#kniha .comment-button {float: right; font-weight: bold; width: 120px; text-align: right; margin-right: 2%;}
#kniha .comment-button input {width: 90%; padding: 5px; cursor: pointer;}
#kniha .comment-button input:hover {background: #e8e8e8; color: #c60000;}
#kniha .comment-button input:focus {color: #7e0000;}

#kniha .prvni-sloupec {width: 40%; float: left;}
#kniha .druhy-sloupec {float: right; width: 57%;}
#kniha #antispam img {position: relative; top: 5px;}
#kniha textarea {width: 100%; height: 86px; margin-bottom: 10px; position: relative; top: -1px; padding: 0;}

.slider-inbox-reply {width: 477px; font-size: 0.75em; margin: 10px;}
.slider-inbox-reply input, .slider-inbox-reply textarea {background: #fff; border: 1px solid #ccc; color: #777;}
.slider-inbox-reply .comment-input {width: 100%; margin-bottom: 4px;}
.slider-inbox-reply .comment-nadpis {width: 40%; text-align: left; padding: 7px 0 4px 2px; font-weight: bold; color: #777;}
.slider-inbox-reply .comment-nadpis span {margin-left: 5px; font-size: 1.25em; color: red;}
.slider-inbox-reply .comment-pole {width: 90%; float: left; margin-bottom: 10px;}
.slider-inbox-reply .comment-pole input {width: 98%; font-size: 1.0em; padding: 4px;}
.slider-inbox-reply .comment-pole input:focus {border: 1px solid #8c8c8c;}
.slider-inbox-reply .comment-pole-textarea textarea {}
.slider-inbox-reply .comment-pole-textarea textarea:focus {border: 1px solid #8c8c8c;}
.slider-inbox-reply .prvni-sloupec-reply {width: 40%; float: left;}
.slider-inbox-reply .druhy-sloupec-reply {float: right; width: 59%;}
.slider-inbox-reply textarea {width: 97%; height: 86px; margin-bottom: 10px;}

.slider-inbox-reply .comment-bottom {width: 100%; float: left;}
.slider-inbox-reply .comment-button {float: right; font-weight: bold; width: 136px; text-align: right;}
.slider-inbox-reply .comment-button input {width: 90%; padding: 5px; cursor: pointer;}
.slider-inbox-reply .comment-button input:hover {background: #e8e8e8; color: #c60000;}
.slider-inbox-reply .comment-button input:focus {color: #7e0000;}

.post-comment {margin: 0 0 16px 40px; width: 500px;}
.post-comment-reply {margin: 0 0 16px 70px; width: 470px; overflow: hidden;}
.posttop-comment {padding: 7px 7px 10px 7px; height: 12px;}
.username-comment {font-weight: bold; width: auto; float: left;}
.username-comment a {color: #8f8f8f; font-size: 0.75em; font-weight: normal; position: relative; top: -1px; cursor: pointer; margin-right: 2px; text-decoration: none;}
.username-comment a.order-reply {color: #9da8be;}
.username-comment a:hover {color: #000;}
.comment-reakce {color: #168ec6; text-decoration: none; display: block; padding-top: 10px; width: 150px;}
.comment-reakce-link, a.comment-reakce-link:visited {padding: 0 5px 0 9px; color: green; background: url("../img/reaction-down.gif") 0 4px no-repeat;}
.comment-reakce-who, a.comment-reakce-who:visited {color: #7f7f7f; padding-left: 9px; background: url("../img/reaction-up.gif") 0 4px no-repeat; margin-left: 5px;}
.userweb-comment {width: auto; float: left; margin-left: 10px;}
.userweb-comment-right {width: auto; float: right;}
.userweb-image {height: 20px; border: 0;}
.posttext-comment {padding: 7px; border-top: 0; text-align: left; overflow: hidden;}
.postdate-comment {float: right; margin-right: 10px; font-size: 0.75em; padding: 1px 0 0 0;}

.postimg-comment {width: 40px; float: left;}
.postbody-comment {width: 425px; float: right;}

#vypis {width: 500px; position: relative; left: 50%; margin: 0 0 0 -290px; float: left;}



/* Thumbnail
----------------------------------------------- */
.thumbnail {width: 23.5%; height: auto; float: left; text-align: left; font-size: 0.75em; position: relative; margin: 0 2% 2% 0;}
.thumbnail:nth-child(4n) {margin-right: 0;}
.thumbnail a, .thumbnail a:visited {width: 100%; height: 100%; display: block;}
.thumbnail span {width: 100%; display: block; float: left; text-align: center; padding: 0; position: absolute; bottom: 0; background: rgba(255,255,255,0.85); font-size: 1.0em; color: #000; font-weight: 400;}
.thumbnail span a, .thumbnail span a:visited {display: block; width: 100%; text-align: center; height: all; text-decoration: none; padding: 10px 0; text-transform: uppercase; transition: 0.3s;}
.thumbnail span a:hover {color: #aaa;}
.thumbnail img {width: 100%; border: 0px solid #000; margin: 0 0 0 0;}
.thumbnail a img, .thumbnail a:visited img {transition: 0.3s; opacity: 1;}
.thumbnail a:hover img {opacity: 0.7;}

.star {color: red; font-weight: bold;}
.star img {border: 1px solid red;}

.shadow img {border: 0;}
.shadow a, .shadow a:visited {background: #fff; border-left: 1px solid #e0e0e0; border-top: 1px solid #e0e0e0; padding: 8px 8px 3px 8px; display: block; float: left; -moz-box-shadow: 0px 1px 10px #b7b7b7; -webkit-box-shadow: 0px 1px 10px #b7b7b7; box-shadow: 0px 1px 10px #b7b7b7; -o-box-shadow: 0px 1px 10px #b7b7b7; -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#d1d1d1')"; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#d1d1d1');}
.shadow span {width: 161px; display: block; float: left; text-align: center; padding-left: 1px; padding-top: 7px;}

.thumbnail-all-span {width: 500px; display: block; float: left; font-weight: bold; font-size: 0.75em; padding-top: 5px;}
.thumbnail-all-p {width: 500px; display: block; float: left; font-size: 0.75em; margin-top: 0; padding-top: 3px;}

.gallery-info {font-size: 0.75em; width: 95%; margin: 0 0 15px 2%;}



/* Vypis poslednich komentaru
----------------------------------------------- */
.comments-list {overflow: hidden; float: left; width: 600px; margin: 0 0 15px 2%;}
.comments-list-re {padding-left: 75px; width: 540px;}

.comments-list .comments-list-img {float: left; margin: 0 15px 0 0;}
.comments-list .comments-list-img img {border: 1px solid #000; width: 60px;}
.comments-list .comments-list-text {float: left; width: 520px;}
.comments-list .comments-list-text h4 {margin: 0; padding: 0 0 3px 0; font-weight: bold; font-size: 0.75em;}
.comments-list .comments-list-text h4 span {color: #aaa; font-weight: normal;}
.comments-list .comments-list-text p {margin: 0; padding: 0; font-size: 0.75em;}



/* Thumbnail - zarovnani na stred vertikalne i horizontalne
----------------------------------------------- */
.thumbnail-back {border: 1px solid #d2d2d2; margin: 0 0 10px 10px; background: #ebebeb;}
.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.75em;}
.thumbnail-link img {border: 1px solid #000; margin: 0 0 5px 0;}

.thumbnail-link-list {width: 96%; margin-left: 2%;}
.thumbnail-link-list h4 {margin: 0; padding: 0 0 3px 0; font-weight: bold;}
.thumbnail-link-list h4 a, .thumbnail-link-list h4 a:visited {text-decoration: underline; font-size: 0.75em;}
.thumbnail-link-list h4 span a, .thumbnail-link-list h4 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; color: #494949;}

.thumbnail-link-thumblist {width: 90%; margin: 0 0 15px 2%; float: left;}
.thumbnail-link-thumblist .thumbnail-link-list-img {float: left; margin: 0 15px 20px 0;}
.thumbnail-link-thumblist .thumbnail-link-list-img img {border: 1px solid #000;}
.thumbnail-link-thumblist .thumbnail-link-list-text {float: left; width: 480px;}
.thumbnail-link-thumblist .thumbnail-link-list-text h4 {margin: 0; padding: 0 0 3px 0; font-weight: bold;}
.thumbnail-link-thumblist .thumbnail-link-list-text h4 a, .thumbnail-link-thumblist .thumbnail-link-list-text h4 a:visited {text-decoration: none;}
.thumbnail-link-thumblist .thumbnail-link-list-text h4 span a, .thumbnail-link-thumblist .thumbnail-link-list-text h4 span a:visited {color: #828282; font-size: 0.75em; font-weight: normal; text-decoration: none;}
.thumbnail-link-thumblist .thumbnail-link-list-text p {margin: 0 0 20px 0; padding: 0; font-size: 0.875em;}

#links {clear: both; float: left; margin: 0; width: 95%;}
#links h3 {margin: 0 0 0 2%; padding-top: 0.3em; font-weight: bold; line-height: 2.5em; display: block; clear: both;}
#links h3.first {padding-top: 0em;}



/* Seznam uzivatelu
----------------------------------------------- */
.userlist-img {float: left; width: 160px; margin-left: 2%; padding: 0 10px 10px 0;}
.userlist-img img {border: 1px solid #000;}
.userlist-text {float: right; width: 490px; padding: 0 20px 20px 0;}
.userlist-text h1 {font-size: 1.0em; font-weight: bold; padding-bottom: 7px;}
.userlist-text h1 a, .userlist-text h1 a:visited {text-decoration: none;}
.userlist-text ul li {font-size: 0.75em; display: block; padding-bottom: 5px;}



/* Article
----------------------------------------------- */
.article {width: 100%; margin-left: 0; clear: both;}

.article h1 {font-weight: bold; font-size: 1.125em; padding: 0.31em 0 0.75em 0; line-height: 1.25em;}
.article h2 {font-weight: bold; font-size: 1.125em; padding: 1.0em 0 0.75em 0; line-height: 1.25em;}
.article h3 {font-weight: bold; font-size: 1.0em; padding: 1.0em 0 0.75em 0; line-height: 1.25em;}
.article h4 {font-weight: bold; font-size: 0.875em; padding: 1.0em 0 0.75em 0; line-height: 1.25em;}
.article h5 {font-weight: bold; font-size: 0.875em; padding: 1.0em 0 0.75em 0; line-height: 1.25em; text-decoration: underline;}
.article h6 {font-weight: bold; font-size: 0.875em; padding: 1.0em 0 0.75em 0; line-height: 1.25em; font-style: italic;}
.article p {font-size: 1.0em; line-height: 1.5em; margin: 0 0 1.1em 0;}
.article img {max-width: 100%;}
.article pre {border: 1px dotted #000; margin: 0.75em 0; padding: 0.63em 0.94em; background: #fff; font-size: 0.75em; font-family: "courier new"; line-height: 1.4em; display: block; overflow-x: auto; white-space: pre-wrap; white-space: -moz-pre-wrap !important; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word;}
.article blockquote {border-left: 1px dashed #000; margin: 0.75em 0; background: #d7d7d7; display: block;}
.article blockquote p {font-size: 0.875em; line-height: 1.6em; padding: 0.63em 0.94em;}

.article ul {margin: 0.75em 0 1.25em 1.56em; font-size: 0.875em; list-style: disc; float: left; display: block; width: calc(100% - 1.56em);}
.article ul li {line-height: 1.38em; float: left; width: 100%;}
.article ul li ul {margin-top: 0; margin-bottom: 0; font-size: 1.0em; list-style: circle; width: calc(100% - 1.56em);}
.article ul li ul li ul {margin-top: 0; margin-bottom: 0; font-size: 1.0em; list-style: square;}

.article ol {margin: 0.75em 0 1.25em 1.56em; font-size: 0.875em; list-style: decimal; float: left; display: block; width: calc(100% - 1.56em);}
.article ol li {line-height: 1.38em; float: left; width: 100%;}
.article ol li ol {margin-top: 0; margin-bottom: 0; font-size: 1.0em; width: calc(100% - 1.56em);}
.article ol li ol li ol {margin-top: 0; margin-bottom: 0; font-size: 1.0em; list-style: lower-latin;}

.article table {width: auto; border-collapse: collapse; font-size: 0.75em; margin: 1.0em 0 2.5em 0; border: 1px solid #888; border-right: 0;}
.article table caption {font-variant: small-caps; padding-bottom: 0.63em;}
.article table.full {width: 100%;}
.article table th {background: #e0e0e0; color: #333; padding: 0.5em; border-bottom: 1px solid #888; text-align: left; font-weight: bold; border-right: 1px solid #888;}
.article table td {border-bottom: 1px solid #888; border-right: 1px solid #888; padding: 0.5em;}

.article .table-title {padding-top: 10px; float: left; width: 100%;}
.article .table-desc, .article .table-title {font-size: 0.75em;}

.article .article-vlevo {float: left; margin: 10px; margin-left: 0; border: 1px solid #000;}
.article .article-vpravo {float: right; margin: 10px 5px 10px 10px; border: 1px solid #000;}
.article .article-text-vlevo {text-align: left;}
.article .article-text-vpravo {text-align: right;}
.article .article-text-center {text-align: center;}
.article .article-text-justify {text-align: justify;}
.article .youtube {text-align: center; padding: 20px 0;}

.article .hover-vlevo {float: left; margin: 0 10px 3px 0;}
.article .hover-vpravo {float: right; margin: 0 0 3px 10px;}
.article span.hover-vlevo {float: left; margin: 0 10px 3px 0; display: block;}
.article span.hover-vpravo {float: right; margin: 0 0 3px 10px; display: block;}
.article span.hover-vlevo span, .article span.hover-vpravo span {font-size: 0.75em; font-style: italic; display: block; padding-top: 4px;}

.article .article-img {padding: 0 0 9px 0; background: none; border: 0; color: #000; font-style: italic; font-size: 0.75em; margin: 20px 0; width: 100%;}
.article .article-img img {margin-bottom: 7px; border: 0; width: 100%; border-radius: 11px;}
.article .article-img span {clear: both; display: block; margin-left: 4px; display: none; visibility: hidden;}

.article .article-img-fly-left {float: left; margin: 0 10px 3px 0;}
.article .article-img-fly-left img {border-radius: 11px;}

.article .article-img-fly-right {float: right; margin: 0 0 3px 10px;}
.article .article-img-fly-right img {border-radius: 11px;}

.article .article-column-2 {column-count: 2;}
.article .article-column-3 {column-count: 3;}
.article .article-column-4 {column-count: 4;}

.social {position: relative; left: -4px; margin-top: 10px; float: left;}
.social .st_fblike_hcount {padding-right: 15px;}
.social .st_twitter_hcount {padding-right: 7px;}

.social-article {margin-left: 2%;}
.social-article span.st_fblike_hcount {position: relative; top: -3px;}
.social-article span.st_fblike_hcount, .social-article span.st_plusone_hcount, .social-article span.st_twitter_hcount, .social-article span.st_pinterest_hcount {margin-bottom: 5px; display: block; float: left; height: 22px;}

.social-foto span.st_fblike_hcount {position: relative; top: -3px;}
.social-foto span.st_fblike_hcount, .social-foto span.st_plusone_hcount, .social-foto span.st_twitter_hcount, .social-foto span.st_pinterest_hcount {margin-bottom: 5px; display: block; float: left; height: 22px;}




/* Struktura formularu v clanku
----------------------------------------------- */
form.formik {font-size: 0.875em; margin: 20px 0 30px;}
.formik label, .formik .div-checkbox, .formik .div-radio	{float: left; width: 95%; display: block; clear: left; text-align: left; cursor: pointer; font-size: 0.75em; margin-top: 10px;}
.formik label.label-checkbox, .formik label.label-radio {clear: none; width: 80%; padding-left: 5px; margin-top: 3px;}
.formik .div-checkbox, .formik .div-radio {width: 100%; padding: 0 0 7px 3px; color: #333; font-weight: bold;}

.formik textarea, .formik input, .formik select, .formik button, .formik optgroup {margin-top: 0px; padding-left: 3px;}
.formik select {margin-top: 5px; margin-left: 3px;}
.formik textarea, .formik input.input-input {padding: 3px; width: 300px;}
.formik textarea, .formik input.input-antispam {padding: 3px; width: 150px; margin-right: 7px;}
.formik textarea, .formik input.input-checkbox, .formik input.input-radio {float: left; margin-top: 4px;}


.formik textarea {height: 80px; width: 97%; margin-bottom: 7px;}
.formik label.input-text {padding: 3px 0 1px 3px;}
.formik input.button {cursor: pointer; font-weight: bold; position: relative; left: 0em; margin-top: 15px;}
.formik img {position: relative; top: 5px;}
.formik h3 {font-size: 1.0em; padding-top: 25px;}
.formik p {font-size: 1.0em;}



/* Barvy formularu v clanku
----------------------------------------------- */
.formik label	{color: #333; font-weight: bold;}
.formik label span, .formik div span {color: red; font-size: 1.5em;}	
.formik input.input-input, .formik textarea {border: 1px solid #aaa;}
.formik textarea:focus, .formik input.input-input:focus {border: 1px solid #000;}
.formik select {background: #fff; color: #000; border: 1px solid #aaa;}
.formik option {background: #fff; color: #000;}
.formik optgroup {background: #ccc; color: #000;}



/* Uprava typografie
----------------------------------------------- */
.uprava-typografie {font-size: 1.0em;}



/* Anketa
----------------------------------------------- */
.poll {border: 1px dashed #aaa; padding: 10px; width: 300px; margin: 7px 0 20px 0; float: left; font-size: 0.875em;}
.poll strong {line-height: 1.4em;}
.poll .voted {color: red; font-size: 0.75em; line-height: 2.0em;}
.poll hr {border-width: 0; border-top: 1px dashed #aaa; height: 1px;}
.poll ul {margin-left: 0;}
.poll ul li {display: block; list-style: none; margin-bottom: 10px;}
.poll .poll-img {border: 0; display: block; height: 10px; margin: 2px 0 10px 0; width: 1%;}
.poll form input {border: 0; background: none; border-bottom: 1px solid #000; cursor: pointer; padding: 0; margin: 0; font-size: 1.0em; font-family: Arial, "Trebuchet MS", Verdana; overflow: visible; width: auto; text-align: left;}
.poll form input:hover {border: 0; margin-bottom: 1px;}

.poll-sidebar {width: 190px; font-size: 0.75em;}
.poll-sidebar strong {margin-bottom: 10px; display: block; float: left; font-size: 1.0em;}
.poll-sidebar ul {clear: both;}
.poll-sidebar hr {border-width: 0; border-top: 1px dashed #aaa; height: 1px;}
.poll-sidebar .voted {font-size: 0.875em;}



/* Blog titulka
----------------------------------------------- */
.container-blog-header h3 {font-family: "Jaldi"; color: #1B3A4B; font-size: 40px; display: inline-block; font-weight: 700; margin: 0 28px 46px 75px;}
.container-blog-header a, .container-blog-header a:visited {font-family: "Inter"; color: #A99951; border-bottom: 1px solid #A99951; text-decoration: none; font-size: 22px; display: inline-block; font-weight: 400; padding: 0 0 6px 0; position: relative; top: -2px;}
.container-blog-header a:hover {color: #1B3A4B; border-bottom: 1px solid #1B3A4B;}

.container-blog {display: flex; gap: 30px; width: calc(100% - 150px); margin: 0 75px 53px; font-family: "Jaldi"; flex-wrap: wrap; justify-content: space-between;}

a.blog {text-decoration: none; color: #1B3A4B; background-color: #ffffff; border-radius: 10px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease; width: 24%; display: flex; flex-direction: column; flex: 1 1 calc(25% - 30px); box-sizing: border-box;}
a.blog img {width: 100%; height: 214px; object-fit: cover;}
a.blog:hover {box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);}
a.blog:nth-child(4) {margin-right: 0;}

.blog-title {padding: 17px 15px; font-size: 22px; line-height: 24px; font-weight: bold;}



/* Blog výpis článků
----------------------------------------------- */
.container-blog-list {display: flex; gap: 57.2px; width: calc(100% - 150px); margin: 0 75px 53px; font-family: "Jaldi"; flex-wrap: wrap;}

.container-blog-list a.blog-list {text-decoration: none; color: #1B3A4B; background-color: #ffffff; border-radius: 10px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease; flex: 0 1 calc(33% - 35px); box-sizing: border-box; display: flex; flex-direction: column; position: relative;}
.container-blog-list a.blog-list img {width: 100%; height: 279px; object-fit: cover;}
.container-blog-list a.blog-list:hover {box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);}
.container-blog-list a.blog-list:nth-child(3) {margin-right: 0;}

.container-blog-list .blog-list-text {padding: 17px 24px; overflow: hidden;}
.container-blog-list .blog-list-title {font-size: 30px; line-height: 32px; font-weight: 700; color: #1B3A4B; font-family: "Jaldi"; margin: 0 0 2px 0;}
.container-blog-list .blog-list-info {font-size: 18px; line-height: 1.5em; color: #2C2C2C; font-family: "Inter"; display: block; width: 100%;}
.container-blog-list .blog-list-date {font-size: 16px; line-height: 30px; color: #2C2C2C; font-family: "Inter"; display: block; width: auto; float: left; margin-left: 10px;}
.container-blog-list .blog-list-divider {font-size: 16px; line-height: 30px; color: #2C2C2C; font-family: "Inter"; display: block; width: auto; float: left; margin-left: 10px;}

.container-blog-list hr {border-width: 0; border-top: 1px solid #E7E6E6; height: 1px; margin: 12px 0 10px 0; padding: 0;}

.container-blog-list a.blog-list .blog-list-autor {margin-right: 0; display: block; float: left; color: #2c2c2c; font-family: "Inter"; font-size: 16px; line-height: 30px;}
.container-blog-list a.blog-list .blog-list-autor img {width: 30px; height: 30px; border-radius: 50%; object-fit: cover; border: 0; float: left; margin-right: 14px;}


/* Workshop
----------------------------------------------- */
.container-workshop-header h2 {font-family: "Jaldi"; color: #1B3A4B; font-size: 40px; display: inline-block; font-weight: 700; margin: 0 28px 33px 75px;}
.container-workshop-header h3 {font-family: "Jaldi"; color: #1B3A4B; font-size: 40px; display: inline-block; font-weight: 700; margin: 0 28px 33px 75px;}
.container-workshop-lector-header h3 {font-family: "Jaldi"; color: #1B3A4B; font-size: 40px; display: inline-block; font-weight: 700; margin: 0 28px 52px 75px;}

.container-workshop-header-more {padding-top: 65px;}
.container-workshop-header-more h2 {font-size: 35px; display: block; width: calc(100% - 150px); font-size: 35px; display: inline-block; font-family: "Jaldi"; color: #1B3A4B; font-weight: 400; line-height: 1.5em;}
.container-workshop-header-more h2 span {font-size: 60px; display: inline-block; float: left; font-family: "Jaldi"; color: #1B3A4B; font-weight: 700; padding-right: 33px; position: relative; top: -8px;}

.container-workshop {display: flex; gap: 57.2px; width: calc(100% - 150px); margin: 0 75px 53px; font-family: "Jaldi"; flex-wrap: wrap;}

.container-workshop a.workshop {text-decoration: none; color: #1B3A4B; background-color: #ffffff; border-radius: 10px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease; width: calc(33% - 35px); display: flex; flex-direction: column; position: relative;}
.container-workshop a.workshop img {width: 100%; height: 279px; object-fit: cover;}
.container-workshop a.workshop:hover {box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);}
.container-workshop a.workshop:nth-child(3) {margin-right: 0;}

.container-workshop .workshop-text {padding: 17px 24px; overflow: hidden;}
.container-workshop .workshop-title {font-size: 30px; line-height: 32px; font-weight: 700; color: #1B3A4B; font-family: "Jaldi"; margin: 0 0 2px 0;}
.container-workshop .workshop-type {font-size: 16px; line-height: 24px; color: #2C2C2C; font-family: "Inter"; display: block; width: 100%;}
.container-workshop .workshop-term {font-size: 16px; line-height: 24px; color: #2C2C2C; font-family: "Inter"; display: block; width: auto; float: left;}
.container-workshop .workshop-term span.obsazenost-green strong {color: #51B387;}
.container-workshop .workshop-term span.obsazenost-orange strong {color: #d39129;}
.container-workshop .workshop-term span.obsazenost-red strong {color: #D9413A;}
.container-workshop .workshop-price {font-size: 16px; line-height: 24px; font-weight: 700; color: #2C2C2C; font-family: "Inter"; display: block; width: auto; float: right;}
.container-workshop .red {color: #d9413a;}

.container-workshop hr {border-width: 0; border-top: 1px solid #E7E6E6; height: 1px; margin: 12px 0 10px 0; padding: 0;}

.container-workshop a.workshop .lektors {position: absolute; width: calc(100% - 66px); height: 279px; padding: 0 33px; display: flex; flex-wrap: wrap; align-items: flex-end; align-content: flex-end; justify-content: flex-start;}
.container-workshop a.workshop .lektor {background-color: #354B4E; padding: 2px 10px 3px 20px; border-radius: 10px; color: #fff; width: auto; position: relative; font-family: "Inter"; margin-right: 20px; margin-bottom: 15px; box-sizing: border-box;}
.container-workshop a.workshop .lektor:nth-child(2) {margin-right: 0;}
.container-workshop a.workshop .lektor-photo {margin-right: 10px; position: absolute; left: -15px; top: -5px;}
.container-workshop a.workshop .lektor-photo img {width: 30px; height: 30px; border-radius: 50%; object-fit: cover; border: 0;}
.container-workshop a.workshop .lektor-name {font-size: 12px; font-weight: 300; color: #fff; margin-left: 5px;}



/* Workshopy bez termínu
----------------------------------------------- */
.container-workshop-noterm-header {display: flex; gap: 57.2px; width: calc(100% - 150px); margin: 0 75px 20px; font-family: "Jaldi"; flex-wrap: wrap;}
.container-workshop-noterm-header h2 {font-family: "Jaldi"; color: #1B3A4B; font-size: 40px; display: inline-block; font-weight: 700; margin: 0 0 33px 0; line-height: 1.0em;}

.container-workshop-noterm {display: flex; gap: 57.2px; width: calc(100% - 150px); margin: 0 75px 53px; font-family: "Jaldi"; flex-wrap: wrap;}

.container-workshop-noterm a.workshop {text-decoration: none; color: #1B3A4B; background-color: #ffffff; border-radius: 10px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease; width: calc(33% - 35px); display: flex; flex-direction: column; position: relative;}
.container-workshop-noterm a.workshop img {width: 100%; height: 279px; object-fit: cover; opacity: 0.5;}
.container-workshop-noterm a.workshop:hover {box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);}
.container-workshop-noterm a.workshop:nth-child(3) {margin-right: 0;}

.container-workshop-noterm .workshop-text {padding: 17px 24px; overflow: hidden;}
.container-workshop-noterm .workshop-title {font-size: 30px; line-height: 32px; font-weight: 700; color: #1B3A4B; font-family: "Jaldi"; margin: 0 0 2px 0;}
.container-workshop-noterm .workshop-type {font-size: 16px; line-height: 24px; color: #2C2C2C; font-family: "Inter"; display: block; width: 100%;}

.container-workshop-noterm a.workshop .lektors {position: absolute; z-index: 100; width: calc(100% - 66px); height: 279px; padding: 0 33px; display: flex; flex-wrap: wrap; align-items: flex-end; align-content: flex-end; justify-content: flex-start; opacity: 0.8;}
.container-workshop-noterm a.workshop .lektor {background-color: #354B4E; padding: 2px 10px 3px 20px; border-radius: 10px; color: #fff; width: auto; position: relative; font-family: "Inter"; margin-right: 20px; margin-bottom: 15px; box-sizing: border-box;}
.container-workshop-noterm a.workshop .lektor:nth-child(2) {margin-right: 0;}
.container-workshop-noterm a.workshop .lektor-photo {margin-right: 10px; position: absolute; left: -15px; top: -5px;}
.container-workshop-noterm a.workshop .lektor-photo img {width: 30px; height: 30px; border-radius: 50%; object-fit: cover; border: 0; opacity: 0.8;}
.container-workshop-noterm a.workshop .lektor-name {font-size: 12px; font-weight: 300; color: #fff; margin-left: 5px;}

/*
.container-workshop-noterm .workshop > img {
  filter: grayscale(60%) brightness(90%);
  transition: filter 0.3s ease;
}
*/


/* Fotokosik
----------------------------------------------- */
.fotokosik p {font-size: 0.75em; margin-top: 0; line-height: 1.5em;}
.fotokosik .thumbnail span a, .fotokosik .thumbnail span a:visited {color: red; text-decoration: none;}
.fotokosik .thumbnail span a:hover {color: #000;}

.fotokosik label {width: 100%; display: block; float: left; padding: 0 0 4px 0;}
.fotokosik input, .fotokosik textarea {width: 90%; border: 1px solid #8f8f8f; margin-bottom: 15px; padding: 2px;}
.fotokosik input:focus, .fotokosik textarea:focus {border: 1px solid #000;}
.fotokosik textarea {height: 130px; position: relative; top: -1px; width: 100%;}

.fotokosik input.button {font-weight: bold; border: 1px solid #514743; padding: 5px 10px; width: 170px; float: right;}
.fotokosik input.button:hover {cursor: pointer;}

.fotokosik .fotokosik-left {width: 40%; float: left; font-size: 0.75em;}
.fotokosik .fotokosik-right {width: 57%; float: left; font-size: 0.75em;}

#box-fotokosik {background: url("../img/basket.png") 0 5px no-repeat #d3ffbf; border: 1px dashed #7ef24b; padding: 10px 10px 10px 46px; margin: 0 0 10px 0; float: left; width: 157px; font-size: 0.75em;}



/* Socialni site
----------------------------------------------- */
.addthis_toolbox {padding: 7px 0 15px 4px;}
.addthis_button_tweet {margin-right: 16px;}

#twtr-widget-1 {float: left; overflow: hidden;}

#twtr-widget-1 .twtr-hd {padding-bottom: 0;}
#twtr-widget-1 .twtr-hd a.twtr-profile-img-anchor {float: left;}
#twtr-widget-1 .twtr-hd h3 {margin: 0; display: block; float: left; visibility: hidden;}

#socialmenu {position: fixed; left: 50%; top: 53px; width: 120px; margin: 0 0 0 529px; text-align: center; z-index: 999; transition: top 0.3s ease-in-out;}
#socialmenu #socialmenuin {margin: 0; width: 100%;}
#socialmenu #socialmenuin div {margin-left: 3px; float: right; position: relative; z-index: 6;}
#socialmenu #socialmenuin div a {padding: 0;}
#socialmenu #socialmenuin div a img {width: 36px; opacity: 1.0; transition: 0.3s;}
#socialmenu #socialmenuin div a:hover img {opacity: 0.7;}



/* Vlajky
----------------------------------------------- */
#flag {position: absolute; left: 50%; top: 89px; width: 54px; margin: 0 0 0 539px; text-align: center; z-index: 500;}
#flag #flagin {margin: 0; padding: 0; width: 100%;}
#flag #flagin a, #flag #flagin a:visited {display: block; margin-right: 3px; float: right; position: relative; z-index: 6;}



/* Image
----------------------------------------------- */
#image {width: 100%; text-align: center;}
#image img {border: 0px solid #000; max-height: 85vh; max-width: 96%;}
#image img.photography {border: 0; width: 662px;}
#image img.photography-small {border: 0;}
#image #sipky {width: 276px; margin: 20px auto; height: 25px; font-size: 0.875em;}
#image #sipky a, #image #sipky a:visited {text-decoration: none;}
#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;}

#info {width: 660px; margin: 20px auto; text-align: left; padding-bottom: 30px; overflow: hidden;}
#info h1 {float: left; display: block; font-weight: bold; line-height: 1.5em; margin: 7px 0; border-bottom: 0px dashed #aaa; width: 100%; padding: 0 0 5px 0; font-size: 1.125em;}
#info p {margin: 7px 0; line-height: 1.5em; font-size: 0.875em;}
#info p .image-facebook {background: url("../img/facebook.png") no-repeat; padding: 0 15px 0 22px;}
#info p .image-twitter {background: url("../img/twitter.png") no-repeat; padding: 0 15px 0 22px;}
#info p .image-delicious {background: url("../img/delicious.png") no-repeat; padding: 0 15px 0 22px;}
#info p .image-gplus {float: right; overflow: hidden; display: block; width: 202px; position: relative; top: 3px;}





/* Plynula zmena pozadi
----------------------------------------------- */
.barvy {clear: both; cursor: pointer; margin: 0 auto;}
.barvy td {width: 20px; height: 20px;}





/* Google mapa
----------------------------------------------- */
#map_canvas {width: 640px; height: 600px; border: 1px solid #000; width: 96%; margin-left: 2%; margin-bottom: 20px;}
#map_canvas strong {color: #000;}
#map_canvas p {color: #000;}




/* Cluster
----------------------------------------------- */
#map {width: 100%; height: 700px;}

#cluster-panel {width: 0; height: 0; visibility: hidden;}
#cluster-markerlist {height:0; margin:0; overflow: auto;}

.cluster-info {width: 170px;}
.cluster-info h3 {font-weight: bold; display: block; padding-bottom: 7px; font-size: 0.75em; width: 150px; line-height: 1.5em;}
.cluster-info img {border: 0;}
.cluster-info .cluster-info-img {height: 150px; width: 150px;}




/* Menu galerie
----------------------------------------------- */
.gallery-menu {font-size: 0.75em; padding-bottom: 1px; border: 0; background: none; margin-bottom: 10px; float: left; width: 100%;}

.gallery-menu li {border: 0;}
.gallery-menu li.last {border: 0;}
.gallery-menu li a {text-decoration: none; display: block; padding: 6px 0; padding-left: 0;}
/*.gallery-menu li li a:before {content:  "– ";}*/
.gallery-menu li a:hover {color: #000;}
.gallery-menu li a.current, .gallery-menu li a.current-up {font-weight: bold;}

.gallery-menu li li a {padding-left: 20px;}
.gallery-menu li li li a {padding-left: 40px;}
.gallery-menu li li li li a {padding-left: 60px;}
.gallery-menu li li li li li a {padding-left: 80px;}



/* Menu galerie - background
----------------------------------------------- */
.menu-content {width: 172px; float: left; overflow: hidden; background: url("../images/menu-content.jpg") repeat-y #33f3ff;}
.menu-content .menu-top {width: 172px; height: 21px; float: left; background: url("../images/menu-top.jpg") no-repeat #fffd33;}
.menu-content .menu-bottom {width: 172px; height: 21px; float: left; background: url("../images/menu-bottom.jpg") no-repeat #85ff33;}



/* Barevne kategorie
----------------------------------------------- */
#box-color {float: left;}
#box-color a, #box-color a:visited {width: 15px; height: 15px; float: left; margin-right: 2px; display: block; text-decoration: none;}



/* Mracno klicovych slov
----------------------------------------------- */
#cloud {width: 193px; padding: 7px 10px 7px 7px; float: left; line-height: 1.6em; font-size: 1.0em;}
#cloud a {float: left; display: block; padding: 0 3px;}
#cloud a.key-low {font-size: 0.69em;}
#cloud a.key-middle {font-size: 1.0em;}
#cloud a.key-high {font-size: 1.25em;}



/* Prilohy k clankum
----------------------------------------------- */
#kontakty-right #attach {width: 100%; margin: 15px 0 0 0; float: left; font-size: 18px;}
#kontakty-right #attach li {line-height: 2.0em; float: left; width: auto; padding: 50px 10px 25px 10px; width: calc(50% - 20px); text-align: center;}
#kontakty-right #attach li span {color: grey;}
#kontakty-right #attach li a {padding: 0 0 0 0; color: #A99951;}

#kontakty-right #attach li.ext-pdf {background: url("../img/ext_pdf2.png") center 0 no-repeat;}

#attach-article {width: calc(100% - 150px); margin: 0 75px 20px; float: left;}
#attach-article #attach {width: 100%; margin: 0; float: left; font-size: 18px;}
#attach-article #attach li {line-height: 2.0em; float: left; width: auto; height: 47px; padding: 3px 0 0 60px;}
#attach-article #attach li span {color: grey;}
#attach-article #attach li a {padding: 0 0 0 0; color: #A99951;}

#attach-article #attach li.ext-pdf {background: url("../img/ext_pdf2.png") 0 0 no-repeat;}



/* Registrace
----------------------------------------------- */
#registrace fieldset {border: 1px solid #aaa; width: 703px; padding: 10px 10px 20px 10px; margin: 0 0 25px 0; float: left;}
#registrace legend {padding: 0 3px; text-align: center; font-weight: bold; margin-bottom: 0.1em;}
#registrace .registrace-left {float: left;}
#registrace .registrace-left .change-checkbox {font-size: 0.75em; padding: 0 0 7px 103px; clear: both;}
#registrace .registrace-left .change-checkbox label {position: relative; top: -2px;}
#registrace .registrace-left .change-checkbox a {text-decoration: none;}
#registrace .registrace-left .change-checkbox img {position: relative; top: 4px; padding-left: 5px;}
#registrace .registrace-left .change-checkbox strong {padding-left: 5px;}
#registrace .registrace-left .change-checkbox img.edit-adress {position: relative; top: 7px;}
#registrace .registrace-left .change-checkbox img.delete-adress {position: relative; top: 3px; padding: 0;}
#registrace .registrace-left .change-checkbox img.primary-adress {position: relative; top: 3px;}
#registrace .registrace-help {float: left; border: 1px solid #e2d64d; background: #fff9b1; width: 270px; padding: 7px; margin: 5px 0 15px 0; font-size: 0.75em;}
#registrace .registrace-help p {padding-bottom: 10px; margin: 0;}
#registrace .registrace-vop {float: left; border: 1px solid #769bea; background: #cbd9f7; width: 708px; padding: 7px; margin: 5px 0 15px 0; font-size: 0.75em;}
#registrace .registrace-newsletter {float: left; border: 1px solid #f6d240; background: #ffe88e; width: 708px; padding: 7px; margin: 5px 0 15px 0; font-size: 0.75em;}
#registrace .registrace-newsletter input {position: relative; top: 2px; margin-right: 10px;}



/* Formulare
----------------------------------------------- */
.form .input-cell {width: 400px; text-align: left;}
.input-cell-login {border: 1px solid red; width: 195px;}
.form .input-textarea {width: 400px; text-align: left;}
.form .input-text, .form .input-text-selectbox {width: 100px; float: left; text-align: right; position: relative; top: 9px; font-size: 0.75em; font-weight: bold; padding: 0 7px 0 0;}

.form .input-input {width: 270px; float: left; text-align: left;}
.form .input-input input {height: 20px; border: 1px solid #aaa; background: #efefef; padding: 3px 3px 0 3px; width: 270px;}
.form .input-input select {border: 1px solid #aaa; background: #efefef; width: 200px; margin: 7px 0;}
.form .input-input textarea {height: 150px; width: 370px; border: 1px solid #aaa; background: #efefef; padding: 3px 3px 0 3px}

.form .em-upozorneni {color: red; margin: 10px 0; float: left; font-size: 0.75em; width: 640px;}
.form .input-input input.field {border: 1px solid #666; margin: 5px 0;}
.form .input-input input.obligatory {background: #fcffad; border: 1px solid #666; margin: 5px 0;}
.form .input-input input:focus {border: 1px solid #000;}
.form .input-input input.obligatory:focus {border: 1px solid #000; background: #fbff87;}

.form-login .input-cell {width: 190px; float: left;}
.form-login .input-text {width: 50px; font-size: 1.0em; font-weight: normal;}
.form-login .input-input {width: 125px;}
.form-login .input-input input {width: 115px; background: #fff;}
.form-login .input-button {width: 125px; float: left;}
.form-login .input-button input {float: right; margin-right: 7px; margin-top: 3px;}

.input-confirmation {display: none;}



/* Password form
----------------------------------------------- */
#password-form fieldset {border: 1px solid #aaa; width: 90%; padding: 10px; margin: 0 0 25px 2%; float: left;}
#password-form legend {padding: 0 3px; text-align: center; font-weight: bold; margin-bottom: 0.1em;}

#password-form .registrace-left {float: left; width: 40%; padding-right: 15px;}

#password-form .registrace-left .input-cell {float: left; width: 100%;}
#password-form .registrace-left .input-text {width: 28%; padding: 0; padding-right: 2%;}
#password-form .registrace-left .input-input {width: 70%; padding: 0;}
#password-form .registrace-left .input-button {width: 70%; padding: 0; float: right;}
#password-form .registrace-left .input-input input {position: relative; top: 6px; width: 95%;}
#password-form .registrace-left .input-button input {float: right; margin: 15px 6% 0 0; cursor: pointer; width: 100px;}

#password-form .registrace-help {float: left; border: 1px solid #e2d64d; background: #fff9b1; width: 53%; padding: 7px; margin: 5px 0 15px 0; font-size: 0.75em;}
#password-form .registrace-help p {padding-bottom: 10px; margin: 0;}



/* Search box
----------------------------------------------- */
#box-search {background: #d3ffbf; border: 1px dashed #7ef24b; padding: 10px; margin: 0 0 10px 0; float: left; width: 193px;}
#box-search input.search-input {height: 18px; border: 1px solid #aaa; padding: 0 3px; width: 115px; background: #fff; margin-right: 3px; float: left;}
#box-search input.search-button, .search-where input.where-submit {border: 1px solid #aaa; background: #efefef; cursor: pointer;}
#box-search input.search-button:hover, .search-where input.where-submit:hover {background: #aaa; color: #fff;}

.search-lista {float: left;}
.search-where {float: right; line-height: 1.5em;}
.search-where label {margin-left: 10px;}

.search-where .where-nadpis {font-weight: bold; margin-right: 10px;}
.search-where .where-submit {margin-left: 10px; padding: 0 5px;}

.search-where #where_foto {position: relative; top: 2px;}
.search-where #where_article {position: relative; top: 2px;}

.openBtn {background: none; border: none; cursor: pointer; position: absolute; left: 50%; top: 6px; margin: 0 0 0 400px; padding: 0; width: 24px; height: 24px; opacity: 0.5; transition: 0.3s; display: block;}
.openBtn img {width: 24px; height: 24px;}
.openBtn:hover {background: none; opacity: 1;}
.overlay {height: 100%; width: 100%; display: none; position: fixed; z-index: 999; top: 0; left: 0; background-color: rgb(0,0,0); background-color: rgba(0,0,0, 0.9);}
.overlay-content {position: relative; top: 46%; width: 80%; text-align: center; margin-top: 30px; margin: auto;}
.overlay .closebtn {position: absolute; top: 55px; right: 45px; font-size: 60px; cursor: pointer; color: white;}
.overlay .closebtn:hover {color: #ccc;}
.overlay input[type=text] {padding: 15px; font-size: 17px; border: none; float: left; width: calc(80% - 30px); background: white;}
.overlay input[type=text]:hover {background: #f1f1f1;}
.overlay button {float: left; width: calc(20% - 30px); padding: 15px; background: #ddd; font-size: 17px; border: none; cursor: pointer;}
.overlay button:hover {background: #bbb;}



/* Subscribe box
----------------------------------------------- */
#box-subscribe {background: #d3ffbf; border: 1px dashed #7ef24b; padding: 5px 10px; margin: 0 0 10px 0; float: left; width: 193px;}
#box-subscribe p {font-size: 0.75em; padding: 5px 5px 10px 0; margin: 0;}
#box-subscribe input.subscribe-input {height: 18px; border: 1px solid #aaa; background: #efefef; padding: 0 3px; width: 95px; background: #fff; margin-right: 3px;}
#box-subscribe input.subscribe-button {border: 1px solid #aaa; background: #efefef; cursor: pointer}
#box-subscribe input.subscribe-button:hover {background: #aaa; color: #fff;}



/* Stitky
----------------------------------------------- */
.label {font-style: normal; padding: 1px 4px; background: #000; margin-right: 7px; display: block; float: left;}
a.label, a.label:visited {text-decoration: none;}



/* Kontaktni informace
----------------------------------------------- */
#kontakt {width: calc(100% - 670px); margin-left: 0; float: right; font-size: 40px; line-height: 1.5em; padding: 18px 0 0 70px; font-family: "Jaldi"; font-weight: 700;}
#kontakt ul li {padding-left: 93px; font-size: 1.0em; line-height: 2.0em;}
#kontakt ul li.kontakt-email {background: url("../images/kontakt-gold-email.png") 0 12px no-repeat; background-size: 61px 61px; color: #A99951;}
#kontakt ul li.kontakt-email a, #kontakt ul li.kontakt-email a:visited {color: #A99951; text-decoration: none;}
#kontakt ul li.kontakt-phone {background: url("../images/kontakt-gold-mobil.png") 0 9px no-repeat; background-size: 61px 61px; color: #1B3A4B;}
#kontakt ul li.kontakt-phone a, #kontakt ul li.kontakt-phone a:visited {color: #1B3A4B; text-decoration: none; transition: 0.3s}
#kontakt ul li.kontakt-phone a:hover {color: #A99951;}

#kontakt .kontakt-img {margin: 30px 0 0 34px; max-width: 100%;}



/* Kontaktni mailovy formular - barvy
----------------------------------------------- */
#formular input, #formular textarea {border: 1px solid #E7E6E6; font-size: 1.0em; background: #fff; color: #000; border-radius: 10px;  font-family: "Inter";}
#formular input:focus, #formular textarea:focus {border: 1px solid #000;}



/* Kontaktni mailovy formular
----------------------------------------------- */
#formular {width: 600px; float: left; margin: 0; font-size: 0.875em; background: none;}
#formular form {padding: 27px 0 0 0; float: left; width: 100%;}

#formular form .formular-input {width: 100%; text-align: left; height: auto; margin: 0 0 17px 0; padding: 0 0 10px 0; float: left;}
#formular form .formular-input label {width: 104px; height: auto; float: left; text-align: left; padding: 25px 0 5px 0; font-size: 18px; font-weight: 700;}
#formular form .formular-input input.field {width: calc(100% - 146px); padding: 20px;}

#formular form .formular-confirmation {display: none; visibility: hidden;}

#formular form .formular-antispam {width: 100%; text-align: left; height: auto; margin: 0; padding: 0 0 10px 0; float: left;}
#formular form .formular-antispam label {width: 104px; height: auto; float: left; text-align: left; padding: 25px 0 5px 0;  font-size: 18px; font-weight: 700;}
#formular form .formular-antispam input.field {width: calc(100% - 246px); padding: 20px;}
#formular form .formular-antispam img {position: relative; top: 4px; left: 5px;}
#formular form .formular-antispam span {font-size: 0.875em; position: relative; top: -2px; left: 8px; color: red; font-style: italic;}

#formular form .formular-textarea {width: 100%; height: auto; text-align: left; margin: 0 0 34px 0; float: left;}
#formular form .formular-textarea label {width: 100%; height: auto; float: left; text-align: left; padding: 0 0 5px 0;}
#formular form .formular-textarea textarea {width: calc(100% - 42px); height: 160px; padding: 20px; margin: 0 0 0 0; resize: none;}

#formular form .formular-button {width: 100%; text-align: left; height: auto; margin: 0 0 7px 0; padding: 10px 0 0 0; float: left;}
#formular form .formular-button input {width: auto; min-width: 190px; padding: 18px; background: #a99951; color: #fff; float: left; transition: 0.3s; border: none; border-radius: 9px; font-size: 20px; font-weight: 500; cursor: pointer; transition: background-color 0.3s; font-family: "Inter"; box-shadow: 0px 2px 4px 0px #00000040; margin: 12px 0 0 104px;}
#formular form .formular-button input:hover {cursor: pointer; background: #988947;}

#formular .alert-bad, #formular .alert-good {margin: 30px 0 0 0; width: calc(100% - 20px);}

#formular .newsletter-info {font-size: 14px; color: #2C2C2C; width: calc(100% - 104px); font-family: "Inter"; line-height: 1.55em; padding: 0px 0 29px 104px; float: left;}
#formular .newsletter-info a, #formular .newsletter-info a:visited {color: #A99951; text-decoration: underline;}
#formular .newsletter-info a:hover {color: #000;}

#kontakty-left {float: left; width: 430px; margin: 0 0 38px 0;}
#kontakty-left .article {margin: 0; padding: 0;}
#kontakty-left .article h3 {color: #1B3A4B; font-family: "Jaldi"; font-size: 40px; font-weight: 700; padding-top: 0;}
#kontakty-left .article p {color: #2C2C2C; font-family: "Inter"; font-size: 20px;}

#kontakty-right {float: right; width: 580px; margin: 0 0 38px 0;}
#kontakty-right .article {margin: 0; padding: 0;}
#kontakty-right .article h3 {color: #1B3A4B; font-family: "Jaldi"; font-size: 40px; font-weight: 700; padding-top: 0;}
#kontakty-right .article p {color: #2C2C2C; font-family: "Inter"; font-size: 20px;}



/* Checkbox list
----------------------------------------------- */
.checkbox-list span {width: 180px; font-size: 0.75em; padding-top: 2px;}
.checkbox-list .checkbox-disabled {font-weight: bold;}



/* Mega box
----------------------------------------------- */
ul#menumap  {width: 100px; display: block; float: left; margin: 0 0 15px 14px;}
ul#menumap li.mega a {background: url(../img/map.gif) 0 4px no-repeat; display: block; font-size: 0.75em; text-decoration: none; padding: 0 0 0 11px;}
ul#menumap li.mega a:hover {background-position: 0 -40px;}
ul#menumap div {display: none;}
ul#menumap li.mega div {position: relative; border: 1px solid #dda; padding: 10px; background: #ffc; margin: 5px 0 10px 0; font-size: 0.75em; width: 200px;}
ul#mega-gallery div {z-index: 5;}
ul#mega-category div {z-index: 10;}
ul#menumap li.mega label {position: relative; top: -2px;}
ul#menumap li.hovering div {display: block;}
ul#menumap li.mega div span {width: 180px; font-size: 0.75em; padding-top: 2px;}
ul#menumap li.mega div .checkbox-disabled {font-weight: bold;}

ul#menumap li.mega div .map-button {margin-top: 10px; width: 170px; border: 1px solid #aaa; background: #efefef; cursor: pointer;}
ul#menumap li.mega div .map-button:hover {background: #dbdbdb; color: #000;}



/* Naseptavac
----------------------------------------------- */
.naseptavac {position: relative; font-size: 0.75em;}
.naseptavac ul {position: absolute;	background: #86bac7; top: 0; left: 0;}
.naseptavac li {padding: 0;	list-style: none;}
.naseptavac li a {display: block; text-indent: 5px; color: #fff; text-decoration: none; padding: 3px;}
.naseptavac li.selected a {background: #3d91a5;}

.naseptavac_inactive {color: #aaa;}
.naseptavac_active {color: #000;}
.naseptavac_text {color: #000;}



/* RSS sidebar
----------------------------------------------- */
#sidebar-rss li {line-height: 2.0em; font-size: 0.75em; clear: both; padding-left: 6px;}
#sidebar-rss li a {padding-left: 17px; text-decoration: none;}
#sidebar-rss li.ext-rss {background: url("../img/ext_rss.png") 6px 7px no-repeat;}



/* Scroll top
----------------------------------------------- */
.scrolltop {width: 30px; height: 30px; padding: 0; text-align: center; text-decoration: none; position: fixed; bottom: 87px; right: 20px; display: none; background: url("../images/scrolltop.png") no-repeat 0 0; opacity: 0.2; transition: 0.3s;}
.scrolltop:hover {opacity: 1;}



/* Compare
----------------------------------------------- */
/*.container { margin: 150px auto; max-width: 600px;}*/
.beforeAfter { height: auto;}
.beforeAfter img {max-width: none;}



/* Pohlednice
----------------------------------------------- */
#postcard {float: left; font-size: 0.75em; width: 470px; margin-left: 15px;}
#postcard #postcard-left {float: left; width: 45%;}
#postcard #postcard-right {float: left; width: 54%;}

#postcard label {width: 90%; display: block; float: left; text-align: left; margin: 0 5px 4px 0;}
#postcard label span {color: red;}

#postcard #postcard-left input {width: 90%; float: left; text-align: left; border: 1px solid #aaa; color: #000; padding: 3px; margin-bottom: 10px;}
#postcard #postcard-left input:focus {border: 1px solid #000;}

#postcard #postcard-right textarea {width: 90%; height: 124px; float: left; text-align: left; border: 1px solid #aaa; color: #000; padding: 3px; margin-bottom: 10px;}
#postcard #postcard-right textarea:focus {border: 1px solid #000;}
#postcard #postcard-right label {margin-bottom: 3px;}
#postcard #postcard-right input {float: right; margin-right: 17px;}



/* EU cookies
----------------------------------------------- */
.eu-cookies {position: fixed; left: 0; bottom: 0; width: calc(100% - 20px); color: #fff; background-color: #444; z-index: 998; padding: 4px 10px; text-align: center; line-height: 1.5em; font-size: 0.875em;}
.eu-cookies button, .button-cookies {background: #45ae52; border: medium none; border-radius: 3px; color: #fff; cursor: pointer; font-weight: 700; margin: 0 10px; padding: 4px 12px;}
.button-cookies-selected {background: #E9E9ED; border: medium none; border-radius: 3px; color: #949494; cursor: pointer; font-weight: 400; margin: 0; padding: 4px 12px;}
.eu-cookies a, .eu-cookies a:visited {color: #fff; text-decoration: none;}
.eu-cookies a:hover {text-decoration: underline;}

.modal-cookies {display: none; position: fixed; z-index: 999999; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.6);}
.modal-cookies-content {background-color: #fefefe; margin: 0 auto 100px; padding: 20px; border: 1px solid #888; width: 80%; max-width: 600px; position: relative;}
.modal-cookies-content form {overflow: hidden;}
.modal-cookies-content h5 {font-weight: 700; font-size: 1.125em; width: 90%; display: block; float: left; margin: 0 0 10px 0; line-height: 1.35em;}
.modal-cookies-content h6 {font-weight: 700; font-size: 1.0em; width: 100%; display: block; float: left; margin: 0 0 10px 0; line-height: 1.35em;}
.modal-cookies-content p {font-size: 0.75em; line-height: 1.25em; width: 100%; display: block; float: left; margin-top: 0;}
.modal-cookies-row {width: 100%; float: left; font-size: 0.75em; margin: 5px 0;}
.modal-cookies-row label {width: calc(100% - 110px); display: block; float: left;}
.modal-cookies-row span {width: 110px; display: block; float: left; text-align: right; color: #45ae52;}
.modal-cookies-row-button {margin-top: 15px;}
.modal-cookies-close {color: #aaa; font-size: 28px; font-weight: bold; position: absolute; top: 15px; right: 15px;}
.modal-cookies-close:hover, .modal-cookies-close:focus {color: #000; text-decoration: none; cursor: pointer;}



/* Titulni slideshow
----------------------------------------------- */
#slideshow {margin-left: 0;}





/* ------------------------------------------ */
/* Webova galerie Azael --------------------- */
/* Zakladni layout stranek ------------------ */
/* ------------------------------------------ */



/* Layout
----------------------------------------------- */
#container {text-align: left; width: 100%; max-width: 1440px; margin: 0 auto; padding-top: 137px; background: #FCFBF7;}



/* Header
----------------------------------------------- */
#header {width: 100%; height: 137px; background: #fff; overflow: hidden; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.2); position: fixed; z-index: 500; transition: height 0.3s ease;}

h1#h1, h2#h1 {width: 84px; height: 84px; position: fixed; z-index: 900; left: 50%; top: 26px; margin: 0 0 0 -649px; background: url("../images/h1.png") no-repeat; background-size: 84px 84px; transition: width 0.3s ease, height 0.3s ease, background-size 0.3s ease; overflow: hidden;}
h1#h1 a, h2#h1 a {display: block; width: 84px; height: 84px; text-decoration: none; transition: width 0.3s ease, height 0.3s ease;}
h1#h1 a span, h2#h1 a span {visibility: hidden;}

#hero {width: 100%; height: 693px; margin: 0 0 52px 0; background-image: url("../images/header.jpg"); background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; overflow: hidden; font-family: "Jaldi"; color: #fff;}
#hero .hero-bubble {position: absolute; z-index: 10; left: 50%; top: 34px; margin: 0 0 0 -481px; max-width: 962px; width: 100%; height: 100%; background-image: url("../images/hero-bubble.png"); background-repeat: no-repeat;}
#hero .hero-map-1 {position: absolute; z-index: 10; left: 68px; top: 284px; margin: 0 0 0 0; width: 130px; height: 144px; background-image: url("../images/hero-map-1.png"); background-repeat: no-repeat;}
#hero .hero-map-2 {position: absolute; z-index: 10; right: 26px; top: 306px; margin: 0 0 0 0; width: 74px; height: 193px; background-image: url("../images/hero-map-2.png"); background-repeat: no-repeat;}

#hero .hero-overlay {padding: 0; margin: 0; text-align: center;}
#hero .hero-overlay h1 {font-size: 80px; line-height: 86px; font-weight: 700; margin: 70px 0 0 0; width: 100%; text-align: center; text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);}
#hero .hero-overlay h1 span {font-weight: 300; font-size: 60px; line-height: 86px;}

#hero .hero-icons {margin: 56px 0 0 0; text-align: left; float: left;}
#hero .hero-icons-item {width: calc(100% - 184px); float: left; margin: 0 0 0 184px;}
#hero .hero-icons-item img {width: 69px; height: 69px; margin-bottom: 10px; float: left;}
#hero .hero-icons-item p {margin: 0; font-size: 35px; float: left; display: block; width: calc(100% - 96px); padding: 22px 0 0 27px;}

#hero .hero-button {background: #a99951; color: #fff; text-decoration: none; padding: 21px 31px; border-radius: 9px; transition: 0.3s; font-weight: 400; font-size: 25px; box-shadow: 0px 2px 4px 0px #00000040; margin: 8px auto 0; display: inline-block;}
#hero .hero-button:hover {background: #988947;}



/* Menu
----------------------------------------------- */
#menu {position: fixed; left: 0; top: 61px; width: 100%; padding: 0; text-align: center; z-index: 600; background: none; transition: top 0.3s ease;}



/* Menu - zarovnane vlevo
----------------------------------------------- */
#menu nav {margin: 0 auto; width: 100%; max-width: 1440px; font-family: "Jaldi";}
#menu nav ul {background: none; width: 900px; margin-left: 230px;}
#menu nav ul ul {width: 150px;}



/* Content
----------------------------------------------- */
#content {float: left; width: 100%; padding: 0; background: #FCFBF7; overflow: hidden;}
#content-workshops {float: left; width: 100%; padding: 0; background: url("../images/bubble-workshops.png") #FCFBF7 100% -32px no-repeat; overflow: hidden;}
#content-workshop {float: left; width: 100%; padding: 0; background: url("../images/bubble-workshop.png") #FCFBF7 100% -32px no-repeat; overflow: hidden;}
#content-page {float: left; width: 100%; padding: 0; background: url("../images/bubble-page.png") #FCFBF7 100% -32px no-repeat; overflow: hidden;}



/* Footer
----------------------------------------------- */
#footer {clear: both; text-align: center; font-style: normal; font-size: 16px; line-height: 1.5em; color: #fff; width: 96%; height: auto; margin: 0; padding: 39px 2%; background: #1B3A4B; font-weight: 300;}
#footer a, #footer a:visited {text-decoration: none; color: #fff;}
#footer dfn {border-bottom: 1px dashed; cursor: help; font-style: normal;}



/* Nophotographer
----------------------------------------------- */
#nophotographer {background: #f4f0df; border-radius: 10px; width: 1160px; float: left; margin: 0 0 55px 75px; padding: 40px 65px 43px; font-family: "Jaldi";}
#nophotographer .article {overflow: hidden; margin-bottom: 20px;}
#nophotographer .article h1 {color: #1B3A4B; font-size: 40px;}
#nophotographer .article p {color: #2C2C2C; font-size: 22px; line-height: 27px; margin-bottom: 32px;}

#nophotographer a.nophotographer-button, #nophotographer a.nophotographer-button:visited {background: #1B3A4B; border-radius: 9px; color: #fff; text-decoration: none; font-size: 25px; margin-right: 13px; display: block; float: left; transition: 0.3s; padding: 31px 36px; box-shadow: 0px 2px 4px 0px #00000040;}
#nophotographer a.nophotographer-button:hover {background: #254b60;}
#nophotographer a.nophotographer-button-1, #nophotographer a.nophotographer-button-1:visited {background: url("../images/nophotographer-button-1.png") 35px 25px no-repeat #1B3A4B; padding: 31px 36px 31px 95px;}
#nophotographer a.nophotographer-button-1:hover {background: url("../images/nophotographer-button-1.png") 35px 25px no-repeat #254b60;}
#nophotographer a.nophotographer-button-2, #nophotographer a.nophotographer-button-2:visited  {background: url("../images/nophotographer-button-2.png") 23px 20px no-repeat #1B3A4B; padding: 31px 36px 31px 82px;}
#nophotographer a.nophotographer-button-2:hover {background: url("../images/nophotographer-button-2.png") 23px 20px no-repeat #254b60;}



/* Služby
----------------------------------------------- */
#sluzby {clear: both; text-align: left; font-style: normal; font-size: 16px; color: #fff; width: calc(100% - 188px); height: auto; margin: 0 0 0 0; padding: 39px 94px; background: #FCFBF7; font-weight: 300;}
#sluzby .article {color: #6b6b6b; text-align: left; width: 100%;}
#sluzby .article p {font-size: 16px; line-height: 21px; margin: 0;}
#sluzby .article a, #sluzby .article a:visited {color: #6b6b6b; text-decoration: underline;}
#sluzby .article a:hover {text-decoration: none;}

.sluzby-text, .sluzby-text-more {display: inline; color: #6b6b6b; text-align: left; font-size: 16px; line-height: 21px; margin: 0;}

a.sluzby-show-more, a.sluzby-show-more:visited {color: #1B3A4B; cursor: pointer; text-decoration: none; display: none; transition: 0.3s;}
a.sluzby-show-more:hover {color: #A99951;}



/* Partneři
----------------------------------------------- */
#partneri {color: #fff; clear: both; text-align: left; font-family: "Jaldi"; font-style: normal; font-size: 40px; color: #fff; width: calc(100% - 140px); height: auto; margin: 0 0 0 0; padding: 44px 70px; background: #8B9AA0; font-weight: 600; overflow: hidden;}
#partneri h3 {width: 100%; display: block; float: left; line-height: 40px}
#partneri #partneri-left {float: left; width: 75%;}
#partneri #partneri-left a, #partneri #partneri-left a:visited {display: block; float: left; margin: 32px 50px 0 0;}
#partneri #partneri-right {float: right; width: 25%;}
#partneri #partneri-right a, #partneri #partneri-right a:visited {margin: 30px 0 0 0; display: block; float: left;}
#partneri #partneri-right img {max-height: 93px;}



/* Subscribe
----------------------------------------------- */
#subscriber {width: calc(100% - 140px); height: auto; margin: 0 0 0 0; padding: 0 70px 44px; overflow: hidden; background: url("../images/subscriber.png") 50% 100% no-repeat;}
#subscriber #subscriber-left {width: 75%; float: left;}
#subscriber #subscriber-left .newsletter-container {font-family: "Inter"; width: 100%; margin: 0 auto; text-align: left;}
#subscriber #subscriber-left .newsletter-container h2 {font-family: "Jaldi"; font-size: 40px; line-height: 40px; color: #1B3A4B; font-weight: 700;}
#subscriber #subscriber-left .newsletter-form input[type="email"] {width: calc(100% - 40px); max-width: 370px; padding: 20px; font-size: 14px; margin: 24px 0 13px; border: 1px solid #ccc; border-radius: 9px; font-family: "Inter";}
#subscriber #subscriber-left .newsletter-form button {background-color: #a99951; color: #fff; width: calc(100% - 40px); max-width: 410px; padding: 18px 0; border: none; border-radius: 9px; font-size: 20px; font-weight: 400; cursor: pointer; transition: background-color 0.3s; font-family: "Inter"; box-shadow: 0px 2px 4px 0px #00000040;}
#subscriber #subscriber-left .newsletter-form button:hover {background-color: #988947;}

#subscriber #subscriber-left .newsletter-info {font-size: 12px; color: #757575; width: 100%; max-width: 410px;}
#subscriber #subscriber-left .newsletter-info a, #subscriber #subscriber-left .newsletter-info a:visited {color: #757575; text-decoration: underline;}
#subscriber #subscriber-left .newsletter-info a:hover {color: #000;}

#subscriber #subscriber-right {width: 25%; float: right;}
#subscriber #subscriber-right ul {font-size: 18px; font-weight: 500; margin: 9px 0 20px 17px;}
#subscriber #subscriber-right ul li {list-style: disc; margin: 0 0 10px 0;}
#subscriber #subscriber-right ul li a, #subscriber #subscriber-right ul li a:visited {line-height: 24px; text-decoration: none; color: #05073C;}

#subscriber #subscriber-right a.button-kontakty, #subscriber #subscriber-right a.button-kontakty:visited {background: url("../images/kontakty-email.png") 18px 20px no-repeat #a99951; color: #fff; width: 170px; display: block; padding: 22px 0 22px 64px; border: none; border-radius: 9px; font-size: 20px; font-weight: 400; cursor: pointer; transition: background-color 0.3s; font-family: "Inter"; box-shadow: 0px 2px 4px 0px #00000040; text-decoration: none;}
#subscriber #subscriber-right a.button-kontakty:hover {background-color: #988947;}



/* Last minute
----------------------------------------------- */
.container-lastminute-header h3 {font-family: "Jaldi"; color: #1B3A4B; font-size: 40px; line-height: 1.0em; display: inline-block; font-weight: 700; margin: 0 28px 48px 75px;}

.container-lastminute {width: calc(100% - 150px); margin: 0 75px; font-family: "Jaldi";}

.container-lastminute .lastminute-box {border-bottom: 1px solid #b9c1c3; overflow: hidden; float: left; width: calc(50% - 32px); margin: 0 0 24px 0; font-family: "Inter"; padding: 0 0 25px 0;}
.container-lastminute .lastminute-box:nth-child(odd) {margin-right: 64px;}
.container-lastminute .lastminute-box:nth-child(even) {margin-right: 0;}

.container-lastminute .lastminute-box:nth-last-child(-n+3) {border: 0; margin-bottom: 0;}

.container-lastminute .lastminute-box-last {border: 0; margin: 0 0 2px 0; }

.container-lastminute .lastminute-image {float: left; width: 131px; height: 87px;}
.container-lastminute .lastminute-image img {width: 100%; height: 100%; object-fit: cover; border-radius: 10px;}

.container-lastminute .lastminute-content {float: left; padding: 0px 16px; width: calc(100% - 323px);}
.container-lastminute .lastminute-content h3 {margin: 4px 0 0 0; font-size: 22px; line-height: 1.0em; font-weight: 700; color: #1B3A4B; font-family: "Jaldi"; letter-spacing: 1.2pt;}
.container-lastminute .lastminute-content h3 a, .container-lastminute .lastminute-content h3 a:visited {color: #1B3A4B; text-decoration: none;}
.container-lastminute .lastminute-content p {margin: 15px 0 13px; color: #000; font-size: 18px; line-height: 1.25em;}
.container-lastminute .lastminute-content p span {color: #636363;}
.container-lastminute .lastminute-content p.lastminute-price {font-size: 18px; color: #1B3A4B; font-weight: 700;}

.container-lastminute .lastminute-availability {width: 160px; margin: 19px 0 0 0; float: left;}
.container-lastminute .lastminute-availability a, .container-lastminute .lastminute-availability a:visited {font-size: 16px; line-height: 1.25em; color: #1B3A4B; text-decoration: none; background: #cfd5d5; padding: 12px 14px; display: block; border-radius: 10px; text-align: center; transition: 0.3s;}
.container-lastminute .lastminute-availability a:hover {background: #bfc3c3;}

.container-lastminute a.button-lastminute, .container-lastminute a.button-lastminute:visited {background: url("../images/lastminute-arrow.png") 20px 25px no-repeat #a99951; color: #fff; width: 184px; display: block; padding: 22px 0 22px 56px; border: none; border-radius: 9px; font-size: 25px; font-weight: 400; cursor: pointer; transition: background-color 0.3s; font-family: "Jaldi"; box-shadow: 0px 2px 4px 0px #00000040; text-decoration: none; position: relative; left: 50%; margin: 0 0 0 -120px;}
.container-lastminute a.button-lastminute:hover {background-color: #988947;}



/* Filtr
----------------------------------------------- */
.filter-box {/*display: flex; align-items: center;*/ overflow: hidden; padding: 26px 24px; background-color: #F4F0DF; border-radius: 10px; border: 1px solid #DBD8C8; width: calc(100% - 202px); margin: 7px 0 36px 75px;}
.filter-box-inner {width: calc(100% - 362px); display: flex; align-items: center; gap: 8px; float: left;}
.filter-button {padding: 5px 24px 6px; margin: 0 8px 8px 0; background-color: #fff; border: 1px solid #fff; border-radius: 10px; cursor: pointer; font-size: 18px; color: #1B3A4B; font-weight: 700; font-family: "Jaldi"; transition: background-color 0.3s, color 0.3s; box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.15);}
.filter-button:hover {border: 1px solid #0F1F1E;}
.filter-button.active {background-color: #1B3A4B; border: 1px solid #1B3A4B; color: #fff;}
.filter-button.news-button {border: 1px solid #0F1F1E; color: #0F1F1E;}

.filter-dropdown {position: relative; padding: 10px; background-color: #fff; border: 1px solid #D1D1D1; border-radius: 5px; cursor: pointer; display: flex; align-items: center; gap: 5px;}
.filter-dropdown-icon {width: 20px; height: 20px;}

/* Základní styly modálního okna */
.modal {
  display: none; /* Skryté ve výchozím stavu */
  position: absolute; 
  z-index: 9999; 
  left: 0; 
  top: 0;
  width: 100%; 
  height: 100%; 
  overflow: auto; 
  background-color: rgba(0,0,0,0);
}

.modal-content {
  
  
  
  position: absolute; z-index: 1000; width: 108px; padding: 23px 18px 10px 18px; background: #fff; border: 1px solid #CCCBCB; border-radius: 10px; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); font-family: "Inter";
}

.modal-content button.filter-button {width: 100%;}

/* Tlačítko pro otevření modálního filtru */
.filter-open-btn {
  display: none;
  background: url("../images/modal-arrow.png") #fff no-repeat;
  background-position: right 20px top 16px;
  color: #546B78; font-weight: 400; padding: 11px 42px 13px 17px; transition: 0.3s;
  border: 1px solid #CCCBCB; border-radius: 10px; box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.15);
  font-size: 14.53px;
  
}

.filter-open-btn:hover {color: #000; cursor: pointer;}

/* Velká rozlišení - NEchceme modal ani tlačítko */
@media screen and (min-width: 891px) {

.modal {display: none !important;}
.filter-open-btn {display: none;}
.filter-box-inner {display: block;}

}

.filter-button-news {display: none;}


/* Dle lektora */
.modal-link-container {display: inline-flex; align-items: center; cursor: pointer; font-family: "Inter"; font-size: 14.53px; background: url("../images/modal-users.png") #fff 11px 11px no-repeat; border: 1px solid #CCCBCB; border-radius: 10px; box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.15);}
.modal-link-container-active {background-color: #ffe3e2;}
a.modal-link, a.modal-link:visited {text-decoration: none; color: #546B78; font-weight: 400; padding: 13px 5px 13px 48px; transition: 0.3s;}
.modal-link-container:hover a.modal-link {color: #000;}
.dropdown-arrow {width: 13px; height: 9px; background: url("../images/modal-arrow.png") 0 0 no-repeat; display: inline-block; margin-left: 5px; margin-right: 20px;}

/* Okno pro výběr lektorů */
.modal-users {display: none; position: absolute; z-index: 1000; width: 200px; padding: 23px 18px 10px 18px; background: #fff; border: 1px solid #CCCBCB; border-radius: 10px; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); font-family: "Inter";}
.modal-users label {display: block; margin-bottom: 5px; color: #546B78; font-size: 15px;}
.modal-users input[type="checkbox"] {margin-right: 8px;}
.modal-users button {margin: 20px 0 8px 0; padding: 8px 0; width: 100%; background: #a99951; color: #fff; border: none; border-radius: 9px; cursor: pointer; transition: 0.3s; font-weight: 700; font-size: 18px; font-family: "Jaldi";}
.modal-users button:hover {background: #988947;}

/* Dle termínu */
.modal-link-container-time {display: inline-flex; align-items: center; cursor: pointer; font-family: "Inter"; font-size: 14.53px; background: url("../images/modal-time.png") #fff 11px 10px no-repeat; border: 1px solid #CCCBCB; border-radius: 10px; box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.15);}
.modal-link-container-time-active {background-color: #ffe3e2;}
a.modal-link-time, a.modal-link-time:visited {text-decoration: none; color: #546B78; font-weight: 400; padding: 13px 5px 13px 48px; transition: 0.3s;}
.modal-link-container-time:hover a.modal-link-time {color: #000;}
.dropdown-arrow-time {width: 13px; height: 9px; background: url("../images/modal-arrow.png") 0 0 no-repeat; display: inline-block; margin-left: 5px; margin-right: 20px;}

/* Okno pro výběr časového rozmezí */
.modal-time {display: none; position: absolute; z-index: 1000; width: 200px; padding: 23px 18px 10px 18px; background: #fff; border: 1px solid #CCCBCB; border-radius: 10px; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); font-family: "Inter";}
.modal-time p {font-size: 14px; line-height: 1.25em; text-align: center; margin: 0; padding: 0;}
.modal-time label {display: block; margin-bottom: 5px;}
.modal-time input[type="checkbox"] {margin-right: 8px;}
.modal-time button {margin: 20px 0 8px 0; padding: 8px 0; width: 100%; background: #a99951; color: #fff; border: none; border-radius: 9px; cursor: pointer; transition: 0.3s; font-weight: 700; font-size: 18px; font-family: "Jaldi";}
.modal-time button:hover {background: #988947;}

.dropdown-container {display: flex; gap: 16px; margin-left: auto; width: 354px; float: right;}


/* Volné termíny checkbox */
.checkbox-volne-terminy {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  font-family: "Jaldi", sans-serif;
  font-size: 18px; /* Odpovídá velikosti okolních prvků */
  color: #1B3A4B;
  font-weight: 700;
  position: relative;
  padding-left: 32px; /* Místo pro vlastní vzhled checkboxu */
  user-select: none;
}

/* Skrytí původního systémového checkboxu */
.checkbox-volne-terminy input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Vzhled nového čtverečku */
.checkbox-volne-terminy .checkmark {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  height: 22px;
  width: 22px;
  background-color: #fff;
  border: 1px solid #1B3A4B;
  border-radius: 4px;
  transition: all 0.2s ease-in-out;
}

/* Tmavě modré pozadí při zaškrtnutí */
.checkbox-volne-terminy input:checked ~ .checkmark {
  background-color: #1B3A4B;
  border-color: #1B3A4B;
}

/* Vytvoření ikonky "fajfky" */
.checkbox-volne-terminy .checkmark:after {
  content: "";
  position: absolute;
  display: none;
  left: 7px;
  top: 3px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* Zobrazení fajfky po zaškrtnutí */
.checkbox-volne-terminy input:checked ~ .checkmark:after {
  display: block;
}

.modal-free-terms {margin: 0 0 0 10px; padding: 0; display: flex; align-items: center;}







/* Galerie u zajezdu
----------------------------------------------- */
.gallery-container {display: flex; width: calc(100% - 150px); margin: 0 75px; overflow: hidden; gap: 10px; position: relative;}
.gallery-item {overflow: hidden;}
.gallery-item img {width: 100%; height: 100%; object-fit: cover;}
.large-item {flex: 60%; position: relative;}
.large-item img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 10px 0 0 10px;}
.right-item {flex: 40%; display: flex; flex-direction: column;}
.horizontal-item {margin: 0 0 10px 0;}
.horizontal-item img {border-radius: 0 10px 0 0;}
.bottom-item {display: flex; gap: 10px;}
.small-right-item img {border-radius: 0 0 10px 0;}
.item-noround-left img {border-radius: 10px 0 0 0;}
.item-noround img {border-radius: 0;}
a.button-all-picture, a.button-all-picture:visited {background: #A99951; color: #fff; text-decoration: none; font-family: "Inter"; border-radius: 10px; font-size: 14px; display: block; padding: 14px 22px 16px; position: absolute; bottom: 20px; right: 20px; transition: 0.3s; box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.3);}
a.button-all-picture:hover {background: #988947; color: #fff; box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.3);}
.icon-video {width: 72px; height: 72px; position: relative; left: calc(50% - 36px); top: 44%;}
.icon-video img {width: 72px; height: 72px;}

#mygallery {width: calc(100% - 130px); margin: 0 75px; position: relative; left: -10px;}
#mygallery img {border-radius: 11px;}

#workshop-item {width: calc(100% - 150px); min-height: 700px; margin: 70px 75px 0; display: flex; flex-wrap: wrap; position: relative; padding-bottom: 50px;}

#workshop-item-1 {order: 1; width: calc(100% - 500px); padding-right: 300px; font-family: "Inter"; font-size: 20px; color: #2c2c2c; line-height: 1.5em;}
#workshop-item-1 h2 {font-family: "Jaldi"; font-size: 40px; line-height: 1.125em; color: #1B3A4B; font-weight: 700;}

#workshop-item-2 {order: 2; width: calc(100% - 500px); padding-right: 300px; margin: 66px 0 0 0;}
#workshop-item-2 h2 {font-family: "Jaldi"; font-size: 40px; color: #1B3A4B; font-weight: 700; margin: 0 0 45px 0;}

#workshop-item-2 .lektor {width: 50%; float: left;}
#workshop-item-2 .lektor:nth-child(2) {margin-right: 0;}
#workshop-item-2 .lektor-more {margin-top: 30px;}
#workshop-item-2 .lektor-photo {width: 88px; margin-right: 17px; float: left;}
#workshop-item-2 .lektor-photo img {width: 80px; height: 80px; border-radius: 50%; object-fit: cover; border: 4px solid #A99951;}
#workshop-item-2 .lektor-name {width: calc(100% - 105px); float: left; padding: 3px 0 0 0; line-height: 1.83em;}
#workshop-item-2 .lektor-name h3 {font-family: "Jaldi"; font-size: 30px; color: #1B3A4B; font-weight: 700; margin: 0 0 2px 0;}
#workshop-item-2 .lektor-name h3 a, #workshop-item-2 .lektor-name h3 a:visited {color: #1B3A4B;}
#workshop-item-2 .lektor-name a, #workshop-item-2 .lektor-name a:visited {color: #A99951;}
#workshop-item-2 .lektor-name a:hover {color: #D9413A;}

#workshop-item-3 {order: 3; width: calc(100% - 500px); padding-right: 300px;}
#workshop-item-3 #workshop-item-3-inner {display: flex; gap: 20px;}
#workshop-item-3 #workshop-item-3-inner .workshop-item-included {width: 50%; float: left; border-radius: 10px; background: #EBF4EC; flex: 1; padding:  20px 20px 20px 28px; display: flex; flex-direction: column;}
#workshop-item-3 #workshop-item-3-inner .workshop-item-not-included {width: 50%; float: left; border-radius: 10px; background: #F4F5F6; flex: 1; padding: 20px 20px 20px 28px; display: flex; flex-direction: column;}
#workshop-item-3 #workshop-item-3-inner h2 {color: #1B3A4B; font-family: "Jaldi"; font-size: 40px; font-weight: 700; margin: 23px 0 43px 0;}
#workshop-item-3 #workshop-item-3-inner ul {font-family: "Inter"; font-size: 18px; color: #2C2C2C;}
#workshop-item-3 #workshop-item-3-inner ul li {margin: 0 0 19px 0; padding: 0 0 0 37px; min-height: 25px; line-height: 1.35em;}

#workshop-item-3 #workshop-item-3-inner .workshop-item-included ul li {background: url("../images/icon-included.png") 0 0 no-repeat;}
#workshop-item-3 #workshop-item-3-inner .workshop-item-included ul li ul {margin: 20px 0;}
#workshop-item-3 #workshop-item-3-inner .workshop-item-included ul li ul li {background: none; margin: 0 0 12px 20px; list-style: disc; padding-left: 0;}

#workshop-item-3 #workshop-item-3-inner .workshop-item-not-included ul li {background: url("../images/icon-not-included.png") 0 0 no-repeat;}
#workshop-item-3 #workshop-item-3-inner .workshop-item-not-included ul li ul {margin: 20px 0;}
#workshop-item-3 #workshop-item-3-inner .workshop-item-not-included ul li ul li {background: none; margin: 0 0 12px 20px; list-style: disc; padding-left: 0;}

#workshop-item-4 {order: 4; width: calc(100% - 500px); padding-right: 300px; font-family: "Inter"; font-size: 20px; color: #2c2c2c; line-height: 1.5em;}
#workshop-item-4 h2 {font-family: "Jaldi"; font-size: 40px; line-height: 1.125em; color: #1B3A4B; font-weight: 700;}
#workshop-item-4 ul {width: calc(100% - 30px); margin-left: 30px;}
#workshop-item-4 ul li {list-style: disc;}

#workshop-item-5 {order: 5; width: 500px; position: absolute; right: 0; top: 0; bottom: 0; padding: 29px 0 0 0; font-family: "Inter";}
#workshop-item-5 #sidebar {width: 378px; padding: 20px; background: #fff; border-radius: 10px; border: 1px solid #bbc4c9; float: right;}
#workshop-item-5 #sidebar #sidebar-inner {width: calc(100% - 40px); padding: 20px; background: #f3f5f6; border-radius: 10px;}

.workshop-line {clear: both; border: 0; width: 100%; height: 1px; padding: 0; background: repeating-linear-gradient(to right, #B9C1C3, #B9C1C3 10px, transparent 10px, transparent 20px); margin: 50px 0 50px;}

.expedition-summary {display: flex; flex-direction: column; gap: 20px; max-width: 400px; margin: 0; padding: 0;}
.expedition-item {display: flex; align-items: center; gap: 28px; margin-bottom: 11px;}
.expedition-item-top {align-items: flex-start;}
.expedition-item img {width: 40px; height: 40px; border-radius: 50%;}
.expedition-item p {margin: 0; font-size: 18px; color: #333; line-height: 1.5em;}
.expedition-item p.red {color: red;}
.expedition-item p span {font-size: 15px; display: block; margin: 12px 0 0 0; line-height: 1.35em;}

#sidebar h4 {color: #1B3A4B; font-family: "Jaldi"; font-size: 50px; font-weight: 700; line-height: 1.0em;}

#sidebar-bottom {width: calc(100% - 25px); padding: 24px 0 0 25px;}

#sidebar-bottom .sidebar-bottom-green {color: #51B387; font-weight: 700; line-height: 1.35em; margin: 10px 0 0 0;}
#sidebar-bottom .sidebar-bottom-red {color: #D9413A; line-height: 1.35em; margin: 27px 0 0 0;}

a.button-order, a.button-order:visited {border: 1px solid #B2342E; background: #D9413A; display: block; float: left; width: 100%; border-radius: 10px; font-family: "Jaldi"; font-size: 35px; font-weight: 700; text-align: center; padding: 28px 0 27px; margin: 40px 0 0 0; color: #fff; transition: 0.3s; text-decoration: none; box-shadow: 0px 2px 4px 0px #00000040;}
a.button-order:hover {color: #fff; border: 1px solid #B2342E; background: #B2342E;}

a.button-interest, a.button-interest:visited {border: 1px solid #357ac8; background: #448cdc; display: block; float: left; width: 100%; border-radius: 10px; font-family: "Jaldi"; font-size: 35px; font-weight: 700; text-align: center; padding: 28px 0 27px; margin: 40px 0 0 0; color: #fff; transition: 0.3s; text-decoration: none; box-shadow: 0px 2px 4px 0px #00000040;}
a.button-interest:hover {color: #fff; border: 1px solid #357ac8; background: #357ac8;}

a.button-alternate, a.button-alternate:visited {border: 1px solid #548d35; background: #63a042; display: block; float: left; width: 100%; border-radius: 10px; font-family: "Jaldi"; font-size: 35px; font-weight: 700; text-align: center; padding: 28px 0 27px; margin: 40px 0 0 0; color: #fff; transition: 0.3s; text-decoration: none; box-shadow: 0px 2px 4px 0px #00000040;}
a.button-alternate:hover {color: #fff; border: 1px solid #548d35; background: #548d35;}



/* Filtr data
----------------------------------------------- */
.custom-box {background: url("../images/modal-arrow.png") #fff no-repeat; background-position: right 17px top 50%; border: 1px solid #E7E6E6; border-radius: 17px; padding: 19px 15px 15px; cursor: pointer; width: 100%; text-align: left; position: relative; font-family: "Inter";}
.custom-box .selected {font-size: 22px; font-weight: 700; color: #1B3A4B; margin: 0 0 13px 0;}
.custom-box .subtext {font-size: 18px; color: #575757;}

.custom-box-term {background: none; border: 0; border-radius: 0; padding: 19px 15px 15px 0; width: 100%; text-align: left; position: relative; font-family: "Inter";}
.custom-box-term .selected-term {font-size: 22px; font-weight: 700; color: #1B3A4B; margin: 0 0 13px 0;}
.custom-box-term .subtext-term {font-size: 18px; color: #575757;}

.dropdown {display: none; position: absolute; top: 100%; left: 0; width: 100%; background: #fff; border: 1px solid #E7E6E6; border-radius: 8px; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); z-index: 100;}
.dropdown a {display: block; padding: 10px; text-decoration: none; color: #333;}
.dropdown a:hover {background-color: #f0f0f0;}



/* Tabs
----------------------------------------------- */
#tab-1, #tab-2, #tab-3 {scroll-margin-top: 160px; width: 100%;}

.nav-tab-wrapper a.nav-tab-noactive, .nav-tab-wrapper a.nav-tab-noactive:visited {color: #fff; background: #1B3A4B; font-weight: 400; font-family: "Jaldi"; font-size: 25px; border-radius: 10px 10px 0 0; margin: 0 9px 0 0; padding: 26px; text-decoration: none; float: left;}
.nav-tab-wrapper a.nav-tab-active, .nav-tab-wrapper a.nav-tab-active:visited {color: #1B3A4B; background: #F4F0DF; font-weight: 700; font-family: "Jaldi"; font-size: 25px; border-radius: 10px 10px 0 0; margin: 0 9px 0 0; text-decoration: none;}

.nav-tab-wrapper {height: 68px; width: calc(100% - 140px); margin: 0 auto;}

#program {display: flex; gap: 58px; padding: 8px 71px; flex-wrap: wrap; justify-content: flex-start; box-sizing: border-box;}

.program {flex: 1 1 calc((100% - (2 * 58px) - (2 * 71px)) / 3); display: flex; flex-direction: column; align-items: flex-start; border: 0; border-radius: 10px; padding: 0px; background-color: #f9f9f9; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); transition: 0.3s; max-width: 394px;}
.program:hover {box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);}

.program-img {width: 100%;}
.program-text {background: #fff; padding: 30px; width: calc(100% - 60px); margin: 263px 0 0 0; border-radius: 0 0 10px 10px;}
.program-text h3 {font-size: 0.75em; line-height: 1.0em; font-weight: 400; font-size: 25px; color: #1B3A4B; font-family: "Jaldi"; margin: 0 0 20px 0; padding: 0 0 0 0;}
.program-text p {color: #2C2C2C; font-family: "Inter"; font-size: 16px; margin: 0 0 0 0; padding: 0 0 0 0; line-height: 1.4em;}

.program-change {color: #919191; font-style: italic; width: calc(100% - 142px); padding: 8px 71px; line-height: 1.25em;}

.tab-content {display: none;}
.tab-content.active {display: block; width: 100%; background: #F4F0DF; overflow: hidden; padding: 50px 0;}



/* Typy zajezdu
----------------------------------------------- */
/*
.container-type {width: calc(100% - 150px); margin: 0 75px 36px; float: left; overflow: hidden;}

.container-type .container-type-expedice {border: 1px solid #BBC4C9; border-radius: 10px; background: url("../images/icon-expedice.png") 29px 35px no-repeat #fff; width: calc(33.3% - 21px); padding-right: 10px; float: left; margin: 0 8px 0 0; min-height: 97px;}
.container-type .container-type-expedice:hover {cursor: pointer; border: 1px solid #000;}
.container-type .container-type-expedice h3 {width: calc(100% - 92px); padding: 34px 0 0 92px; display: block; float: left; font-weight: 700; font-size: 24px; color: #1B3A4B; font-family: "Jaldi"; line-height: 1.27em;}
.container-type .container-type-expedice p {width: calc(100% - 233px); display: block; float: left; color: #2C2C2C; font-size: 14px; font-style: italic; font-family: "Inter"; line-height: 1.55em;}
.container-type .container-type-expedice-active {background: url("../images/icon-expedice.png") 29px 41px no-repeat #ffe3e2;}

.container-type .container-type-zajezd {border: 1px solid #BBC4C9; border-radius: 10px; background: url("../images/icon-zajezd.png") 28px 28px no-repeat #fff; width: calc(33.3% - 21px); padding-right: 10px; float: left; margin: 0 0 0 8px; min-height: 97px;}
.container-type .container-type-zajezd:hover {cursor: pointer; border: 1px solid #000;}
.container-type .container-type-zajezd h3 {width: calc(100% - 92px); padding: 34px 0 0 92px; display: block; float: left; font-weight: 700; font-size: 24px; color: #1B3A4B; font-family: "Jaldi"; line-height: 1.27em;}
.container-type .container-type-zajezd p {width: calc(100% - 264px); display: block; float: left; color: #2C2C2C; font-size: 14px; font-style: italic; font-family: "Inter"; line-height: 1.55em;}
.container-type .container-type-zajezd-active {background: url("../images/icon-zajezd.png") 28px 32px no-repeat #ffe3e2;}

.container-type .container-type-zajezdnamiru {border: 1px solid #BBC4C9; border-radius: 10px; background: url("../images/icon-zajezdnamiru.png") 28px 25px no-repeat #fff; width: calc(33.3% - 21px); padding-right: 10px; float: left; margin: 0 0 0 8px; min-height: 97px;}
.container-type .container-type-zajezdnamiru:hover {cursor: pointer; border: 1px solid #000;}
.container-type .container-type-zajezdnamiru h3 {width: calc(100% - 110px); padding: 34px 0 0 110px; display: block; float: left; font-weight: 700; font-size: 24px; color: #1B3A4B; font-family: "Jaldi"; line-height: 1.27em;}
*/

.container-type {width: calc(100% - 150px); margin: 0 75px 36px; float: left; overflow: hidden;}

/* --- 1. Fotografická expedice --- */
.container-type .container-type-expedice {
    display: flex; flex-direction: column; justify-content: center; /* Flexbox pro centrování */
    border: 1px solid #BBC4C9; border-radius: 10px; 
    background: url("../images/icon-expedice.png") 29px center no-repeat #fff; /* Pozice Y změněna na center */
    width: calc(33.3% - 21px); padding-right: 10px; float: left; margin: 0 8px 0 0; min-height: 97px;
}
.container-type .container-type-expedice:hover {cursor: pointer; border: 1px solid #000;}
.container-type .container-type-expedice h3 {
    width: calc(100% - 92px); 
    padding: 0 0 0 92px; /* Zrušen horní padding */
    margin: 0; /* Vynulování výchozího odsazení */
    display: block; font-weight: 700; font-size: 24px; color: #1B3A4B; font-family: "Jaldi"; line-height: 1.27em;
}
.container-type .container-type-expedice p {
    width: calc(100% - 233px); margin: 0; display: block; color: #2C2C2C; font-size: 14px; font-style: italic; font-family: "Inter"; line-height: 1.55em;
}
.container-type .container-type-expedice-active {background: url("../images/icon-expedice.png") 29px center no-repeat #ffe3e2;}

/* --- 2. Poznávací zájezd s focením --- */
.container-type .container-type-zajezd {
    display: flex; flex-direction: column; justify-content: center; /* Flexbox pro centrování */
    border: 1px solid #BBC4C9; border-radius: 10px; 
    background: url("../images/icon-zajezd.png") 28px center no-repeat #fff; /* Pozice Y změněna na center */
    width: calc(33.3% - 21px); padding-right: 10px; float: left; margin: 0 0 0 8px; min-height: 97px;
}
.container-type .container-type-zajezd:hover {cursor: pointer; border: 1px solid #000;}
.container-type .container-type-zajezd h3 {
    width: calc(100% - 92px); 
    padding: 0 0 0 92px; /* Zrušen horní padding */
    margin: 0; 
    display: block; font-weight: 700; font-size: 24px; color: #1B3A4B; font-family: "Jaldi"; line-height: 1.27em;
}
.container-type .container-type-zajezd p {
    width: calc(100% - 264px); margin: 0; display: block; color: #2C2C2C; font-size: 14px; font-style: italic; font-family: "Inter"; line-height: 1.55em;
}
.container-type .container-type-zajezd-active {background: url("../images/icon-zajezd.png") 28px center no-repeat #ffe3e2;}

/* --- 3. Zájezdy na míru --- */
.container-type .container-type-zajezdnamiru {
    display: flex; flex-direction: column; justify-content: center; /* Flexbox pro centrování */
    border: 1px solid #BBC4C9; border-radius: 10px; 
    background: url("../images/icon-zajezdnamiru.png") 28px center no-repeat #fff; /* Pozice Y změněna na center */
    width: calc(33.3% - 21px); padding-right: 10px; float: left; margin: 0 0 0 8px; min-height: 97px;
}
.container-type .container-type-zajezdnamiru:hover {cursor: pointer; border: 1px solid #000;}
.container-type .container-type-zajezdnamiru h3 {
    width: calc(100% - 110px); 
    padding: 0 0 0 110px; /* Zrušen horní padding */
    margin: 0; 
    display: block; font-weight: 700; font-size: 24px; color: #1B3A4B; font-family: "Jaldi"; line-height: 1.27em;
}















/* Texty
----------------------------------------------- */
.text-procsnami {width: calc(100% - 144px); min-height: 470px; background: url("../images/proc-jet-s-nami.png") 90% 28px no-repeat; padding: 84px 0 0 72px;}
.text-procsnami h2 {color: #1B3A4B; font-size: 40px; font-weight: 700; font-family: "Jaldi"; margin: 0 0 21px 0; padding: 0 0 0 0;}
.text-procsnami ul {font-size: 18px; font-family: "Inter"; width: 580px;}
.text-procsnami ul li {margin-bottom: 26px; color: #2C2C2C;}

.text-vybaveni {width: calc(100% - 750px); min-height: 600px; background: url("../images/doporucene-vybaveni.png") 106px -6px no-repeat; padding: 61px 0 0 750px;}
.text-vybaveni h2 {color: #1B3A4B; font-size: 40px; font-weight: 700; font-family: "Jaldi"; margin: 0 0 21px 0; padding: 0 0 0 0;}
.text-vybaveni ul {font-size: 18px; font-family: "Inter"; width: 580px;}
.text-vybaveni ul li {margin-bottom: 26px; color: #2C2C2C;}
.text-vybaveni ul li a, .text-vybaveni ul li a:visited {color: #A99951;}



/* Related workshopy
----------------------------------------------- */
.container-related {background: #CFD5D5; width: 100%; overflow: hidden; margin: 38px 0 0 0;}
.container-related h3 {margin: 59px 0 25px 75px;}



/* Other
----------------------------------------------- */
.space-57 {width: 100%; float: left; height: 57px;}
.article-img-fly-1 {display: none; visibility: hidden;}



/* Podstránky
----------------------------------------------- */
.container-page {padding-top: 41px; width: calc(100% - 150px); margin: 0 75px 0; overflow: visible;}
.container-page h2 {width: calc(100% - 150px); display: block; line-height: 1.25em; font-size: 60px; float: left; font-family: "Jaldi"; color: #1B3A4B; font-weight: 700;}



/* Lektoři
----------------------------------------------- */
#lector-container {display: flex; flex-wrap: wrap; gap: 58px; justify-content: center; max-width: 100%; margin: 26px auto 68px;}

.lector {display: block; width: calc(50% - 69px); background: white; border: 0; border-radius: 10px; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.1); transition: transform 0.3s ease, box-shadow 0.3s ease; padding: 20px;}
.lector:hover {box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.15);}

.lector-img {width: 155px; margin-right: 0px; float: left; padding: 18px 0 28px 18px;}

.lector img {width: 120px; height: 120px; border-radius: 50%; object-fit: cover; border: 4px solid #A99951;}

.lector-content {width: calc(100% - 173px); float: left;}
.lector-text {margin-bottom: 33px;}
.lector-text h3 {font-size: 18px; margin: 24px 0 10px; color: #1B3A4B;}
.lector-text h3 a, .lector-text h3 a:visited {text-decoration: none; color: #1B3A4B; font-size: 30px; font-family: "Jaldi"; font-weight: 700; transition: 0.3s;}
.lector-text h3 a:hover {color: #b29544; text-decoration: none;}
.lector-text p {font-size: 18px; line-height: 1.5em; color: #2C2C2C; font-family: "Inter"; margin: 20px 0 9px;}
.lector-text a.lector-link, .lector-text a.lector-link:visited {font-size: 16px; color: #A99951; text-decoration: underline; transition: 0.3s; font-family: "Inter";}
.lector-text a.lector-link:hover {text-decoration: underline; color: #2C2C2C;}

.lector-tags {margin: 25px 0 0 3px; font-family: "Jaldi"; float: left; width: calc(100% - 153px); overflow: visible;}

a.lector-tag, a.lector-tag:visited {display: inline-block; width: auto; padding: 10px 12px 12px; margin: 0 10px 10px 0; background-color: #fff; border: 1px solid #000; border-radius: 10px; cursor: pointer; font-size: 16px; color: #1B3A4B; font-weight: 700; font-family: "Jaldi"; transition: background-color 0.3s, color 0.3s; box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.25); text-decoration: none;}
a.lector-tag:hover {border: 1px solid #A99951; color: #A99951;}

.lector-other-expeditions {width: 130px; margin: 34px 5px 0 0; white-space: nowrap; text-align: right; font-size: 14px; color: #b29544; float: right;}
.lector-other-expeditions a, .lector-other-expeditions a:visited {color: inherit; transition: 0.3s; font-size: 16px; color: #A99951; text-decoration: underline;}
.lector-other-expeditions a:hover {text-decoration: underline; color: #2C2C2C;}



/* Lektor
----------------------------------------------- */
.lector-detail {overflow: hidden; margin: 26px 0 37px 0;}

.container-page h2.lektor-h2 {width: 100%;}

.container-page h2.lektor-h2 a, .container-page h2.lektor-h2 a:visited {font-weight: 400; font-size: 0.4em; padding: 0 0 0 50px; background: url("../images/youtube.png") 0 6px no-repeat; background-size: 40px 28px; margin-left: 30px; position: relative; top: -7px; text-decoration: none; color: #A99951; transition: 0.3s;}
.container-page h2.lektor-h2 a:hover {color: #000;}

.lector-detail-img {float: left; width: 310px;}
.lector-detail-img img {width: 250px; height: 250px; border-radius: 50%; object-fit: cover; border: 4px solid #A99951;}

.lector-detail-text {width: calc(100% - 310px); float: left; margin: 0 0 0 0;}
.lector-detail-text p {font-size: 20px; font-family: "Inter"; color: #2C2C2C; line-height: 1.5em; width: 100%; max-width: 785px;  margin: 4px 0 33px 0;}

.lector-detail-social {width: 100%; float: left; overflow: hidden; min-height: 50px;}
.lector-detail-social a, .lector-detail-social a:visited {display: inline-block; padding: 15px 49px 0 67px; min-height: 50px; color: #A99951; text-decoration: underline; font-size: 18px; font-family: "Inter";}

a.lector-detail-social-web, a.lector-detail-social-web:visited {background: url("../images/icon_web.png") 0 0 no-repeat;}
a.lector-detail-social-facebook, a.lector-detail-social-facebook:visited {background: url("../images/icon_facebook.png") 0 0 no-repeat;}
a.lector-detail-social-instagram, a.lector-detail-social-instagram:visited {background: url("../images/icon_instagram.png") 0 0 no-repeat;}

.container-awards {width: calc(100% - 150px); margin: 0 75px 53px; font-family: "Inter"; display: flex; flex-wrap: wrap;}

.award {margin: 0 20px 45px 0; flex: 0 1 calc(33.333% - 20px);}
.award-icon {width: 50px; height: 50px; background: url("../images/icon_award.png") no-repeat 0 0; float: left; padding-right: 28px;}
.award-text {float: left; width: calc(100% - 78px); padding: 2px 0 0 0; font-size: 18px; color: #2C2C2C; line-height: 1.25em;}
.award-text h3 {margin: 0; font-weight: 700;}
.award-text p {margin: 5px 0 0;}



/* O nás
----------------------------------------------- */
.container-about {width: 100%; float: left;}

.about-text {width: calc(100% - 540px); max-width: 730px; margin: 24px 0 0 0; float: left; font-size: 20px; font-family: "Inter"; line-height: 1.5em; color: #2C2C2C;}
.about-text a, .about-text a:visited {color: #A99951; text-decoration: underline;}
.about-img {width: 540px; float: right; position: relative; top: -66px; right: 39px; text-align: right;}

.container-wheretogo {width: 100%; float: left;}

.wheretogo-text {width: calc(100% - 500px); margin: 27px 0 0 0; float: right; font-size: 18px; font-family: "Inter"; line-height: 1.5em; color: #2C2C2C;}
.wheretogo-text .article {max-width: 630px;}
.wheretogo-text h3 {font-family: "Jaldi"; color: #1B3A4B; font-weight: 700; font-size: 40px; padding: 0 0 20px 0;}
.wheretogo-img {width: 500px; float: left; position: relative; top: 12px; left: 41px; text-align: left; margin: 0 0 63px 0;}

.row {float: left; margin: 24px 0 0 0; width: 100%;}
.row .col {text-align: left; padding: 0; border: 0; float: left; width: 33%;}
.row .col1 {width: 300px;}
.row .col2 {width: 200px;}
.row .col3 {width: 100px;}
.row .col:last-child {border-right: 0 solid #000;}
.row .col h3 {font-family: "Jaldi"; font-weight: 700; font-size: 40px; margin-bottom: 10px; color: #1B3A4B;}
.row .col h4 {font-family: "Inter"; font-weight: 400; font-size: 20px; color: #2C2C2C;}

.container-why {width: 100%; float: left; margin: 0 0 0 0;}
.container-why h3 {font-weight: 700; font-family: "Jaldi"; font-size: 40px; color: #1B3A4B; margin: 4px 0 44px 0; width: 100%; float: left; display: block; line-height: 1.0em;}

.why-item {float: left; width: 16.2%; height: 350px; text-align: center; padding: 0 1.9% 0;}

.why-item .why-item-img {height: 70px; margin: 0 0 19px 0;}
.why-item h4 {font-weight: 700; font-size: 22px; font-family: "Jaldi"; color: #1B3A4B; margin: 0 0 17px 0; padding: 0; display: block; width: 100%; line-height: 1.125em;}
.why-item p {font-size: 18px; font-family: "Inter"; color: #2C2C2C; margin: 0; padding: 0; display: block; width: 100%; line-height: 1.5em;}

.container-why h3.zajezdnamiru-h3 {text-align: center; margin-top: 20px;}
.zajezdnamiru-item {width: 29.5%; text-align: center;}
.zajezdnamiru-item .why-item-img {height: auto; margin: 0 0 30px 0;}
.zajezdnamiru-item p {max-width: 230px; display: inline-block;}

.vouchers-item-container {width: 800px; margin: 0 auto 70px; overflow: hidden;}
.vouchers-item {width: 350px; height: auto; text-align: left; padding: 0 0 0 50px;}
.vouchers-item .why-item-img {height: auto; margin: 0 0 30px 0;}
.vouchers-item p {max-width: 280px; display: inline-block;}



/* Timeline
----------------------------------------------- */
.container-page h2.timeline-h2 {width: 100%; text-align: center; font-size: 40px;}

.timeline {position: relative; margin: 142px auto 27px; padding: 0; max-width: 1200px;}
.timeline::before {content: ''; position: absolute; top: 0; left: 50%; width: 4px; height: calc(100% - 130px); background: #A99951; transform: translateX(-50%);}
.timeline-item {position: relative; width: 50%; padding: 15px 50px; box-sizing: border-box;}
.timeline-item:nth-child(odd) {left: 0; text-align: right;}
.timeline-item:nth-child(even) {left: 50%;}
.timeline-item::before {content: ''; position: absolute; top: 0; width: 30px; height: 30px; background: #A99951; border: 0; border-radius: 50%;}
.timeline-item:nth-child(odd)::before {right: -15px;}
.timeline-item:nth-child(even)::before {left: -15px;}
.timeline-content {display: flex; align-items: center; justify-content: space-between; position: relative; top: -40px;}
.timeline-item:nth-child(odd) .timeline-content {flex-direction: row;}
.timeline-item:nth-child(even) .timeline-content {flex-direction: row-reverse;}
.timeline-content h3 {margin: 0 0 16px; font-size: 18px; line-height: 1.0em; color: #1B3A4B; font-size: 40px; font-weight: 700; font-family: "Jaldi";}
.timeline-content p {margin: 0; color: #2C2C2C; font-family: "Inter"; font-size: 20px; line-height: 1.125em;}
.timeline-content img {width: 113px; height: auto; margin: 0 4px; border: 3px solid #fff; border-radius: 10px; box-shadow: -1px 1px 5px 0px rgba(0, 0, 0, 0.12);}
.timeline-text {width: calc(100% - 157px); padding: 5px 0 0 0;}



/* Detail článku
----------------------------------------------- */
.container-article {width: calc(100% - 150px); margin: 23px 75px 53px;}

.container-article .blog-list-header {margin: 0 0 48px 0; display: block; float: left;}
.container-article .blog-list-autor {margin-right: 0; display: block; float: left; color: #2c2c2c; font-family: "Inter"; font-size: 16px; line-height: 30px;}
.container-article .blog-list-autor img {width: 30px; height: 30px; border-radius: 50%; object-fit: cover; border: 0; float: left; margin-right: 14px;}
.container-article .blog-list-date {font-size: 16px; line-height: 30px; color: #2C2C2C; font-family: "Inter"; display: block; width: auto; float: left; margin-left: 10px;}
.container-article .blog-list-divider {font-size: 16px; line-height: 30px; color: #2C2C2C; font-family: "Inter"; display: block; width: auto; float: left; margin-left: 10px;}

.container-article .article {max-width: 870px;}
.container-article .article h1 {font-size: 60px; line-height: 1.25em; font-family: "Jaldi"; color: #1B3A4B; font-weight: 700; padding: 10px 0 17px 0;}
.container-article .article h2 {font-size: 40px; line-height: 1.25em; font-family: "Jaldi"; color: #1B3A4B; font-weight: 700; padding: 10px 0 17px 0;}
.container-article .article h4 {font-size: 20px; line-height: 1.25em; font-family: "Inter"; color: #1B3A4B;}
.container-article .article p {font-size: 18px; line-height: 1.5em; font-family: "Inter"; color: #2c2c2c;}

.container-article .article ul {font-size: 18px; font-family: "Inter"; color: #2c2c2c;}
.container-article .article ul li {line-height: 1.25em; margin-bottom: 10px;}

.container-article .article ol {font-size: 18px; font-family: "Inter"; color: #2c2c2c;}
.container-article .article ol li {line-height: 1.25em; margin-bottom: 10px;}



/* Workshop modal
----------------------------------------------- */
.workshop-modal {display: none; position: fixed; z-index: 999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.7);}
.workshop-modal-content {background-color: #fefefe; margin: 15% auto; padding: 20px; border: 0; width: 80%; max-width: 442px;}
.workshop-modal-content h2 {font-family: "Jaldi"; font-size: 30px; line-height: 1.125em; color: #1B3A4B; font-weight: 700; margin: 0 0 0 2px; width: calc(100% - 2px);}
.workshop-modal-close {color: #aaa; float: right; font-size: 28px; font-weight: bold;}
.workshop-modal-close:hover, .workshop-modal-close:focus {color: black; text-decoration: none; cursor: pointer;}

.workshop-modal-content input {width: calc(100% - 42px); max-width: 400px; margin-top: 10px; padding: 20px; border: 1px solid #E7E6E6; font-size: 1.0em; background: #fff; color: #000; border-radius: 10px; font-family: "Inter";}

.workshop-modal-content input.button-interest {border: 1px solid #357ac8; background: #448cdc; display: block; width: 100%; max-width: 100%; border-radius: 10px; font-family: "Jaldi"; font-size: 30px; font-weight: 700; text-align: center; padding: 15px 20px 14px; margin: 10px 0 0 0; color: #fff; transition: 0.3s; text-decoration: none; box-shadow: 0px 2px 4px 0px #00000040;}
.workshop-modal-content input.button-interest:hover {color: #fff; border: 1px solid #357ac8; background: #357ac8;}

.workshop-modal-content input.button-alternate {border: 1px solid #548d35; background: #63a042; display: block; width: 100%; max-width: 100%; border-radius: 10px; font-family: "Jaldi"; font-size: 30px; font-weight: 700; text-align: center; padding: 15px 20px 14px; margin: 10px 0 0 0; color: #fff; transition: 0.3s; text-decoration: none; box-shadow: 0px 2px 4px 0px #00000040;}
.workshop-modal-content input.button-alternate:hover {color: #fff; border: 1px solid #548d35; background: #548d35;}

.workshop-modal-content .alert-good, .workshop-modal-content .alert-bad {margin-top: 30px;}



/* Zajezdy na miru
----------------------------------------------- */
.zajezdynamiru-text {width: calc(100% - 585px); float: left; margin-bottom: 30px;}
.zajezdynamiru-text h2 {font-size: 40px; width: 100%;}
.zajezdynamiru-text p {font-size: 20px; max-width: 90%}
.zajezdynamiru-text a.zajezdynamiru-button,.zajezdynamiru-text a.zajezdynamiru-button:visited {background-color: #a99951; color: #fff; width: auto; max-width: 410px; padding: 22px 40px; border: none; border-radius: 9px; font-size: 20px; font-weight: 500; cursor: pointer; transition: background-color 0.3s; font-family: "Inter"; box-shadow: 0px 2px 4px 0px #00000040; text-decoration: none; margin: 40px 0 0 0; display: inline-block;}
.zajezdynamiru-text a.zajezdynamiru-button:hover {background-color: #988947;}
.zajezdynamiru-img {width: 570px; float: right;}
.zajezdynamiru-img img {position: relative; top: -70px;}

.container-zajezdnamiru .container-workshop-header h3 {line-height: 1.0em;}
.workshop-text-zajezdynamiru p {font-size: 16px; font-family: Inter; line-height: 1.5em;}

#kontakt-zajezdynamiru {width: calc(100% - 70px); margin-left: 0; float: left; font-size: 40px; line-height: 1.5em; padding: 35px 0 35px 70px; font-family: "Jaldi"; font-weight: 700; background: #fff;}
#kontakt-zajezdynamiru ul li {padding-left: 93px; font-size: 1.0em; line-height: 2.0em; float: left;}
#kontakt-zajezdynamiru ul li.kontakt-email {background: url("../images/kontakt-gold-email.png") 0 12px no-repeat; background-size: 61px 61px; color: #A99951; margin-left: 60px;}
#kontakt-zajezdynamiru ul li.kontakt-email a, #kontakt-zajezdynamiru ul li.kontakt-email a:visited {color: #A99951; text-decoration: none;}
#kontakt-zajezdynamiru ul li.kontakt-phone {background: url("../images/kontakt-gold-mobil.png") 0 9px no-repeat; background-size: 61px 61px; color: #1B3A4B;}
#kontakt-zajezdynamiru ul li.kontakt-phone a, #kontakt ul li.kontakt-phone a:visited {color: #1B3A4B; text-decoration: none; transition: 0.3s}
#kontakt-zajezdynamiru ul li.kontakt-phone a:hover {color: #A99951;}

#formular-poptavka {background-color: #f2f3f1; padding: 30px; width: 100%; box-sizing: border-box; overflow: hidden; scroll-margin-top: 50px;}
#formular-poptavka .formular-zajezdynamiru-left {width: calc(100% - 610px); max-width: 750px; float: left; padding: 30px 0 0 38px;}
#formular-poptavka .formular-zajezdynamiru-right {width: 550px; float: right; text-align: center;}
#formular-poptavka .formular-zajezdynamiru-right img {position: relative; top: 80px; max-width: 100%;}
#formular-poptavka h2 {color: #1e3646; font-size: 40px; margin-top: 0; margin-bottom: 45px; font-weight: bold; font-family: "Jaldi"; line-height: 1.0em;}
#formular-poptavka .form-row {display: grid; grid-template-columns: 200px 1fr; align-items: center; margin-bottom: 20px; gap: 15px;}
#formular-poptavka .form-row.align-top {align-items: flex-start;}
#formular-poptavka .form-row.align-top label {padding-top: 15px; line-height: 1.5em;}
#formular-poptavka label {font-size: 18px; color: #3b4b57; font-weight: 500; padding: 0 0 0 0;}
#formular-poptavka .req {color: #d9534f;}
#formular-poptavka input.field, #formular-poptavka textarea {width: 100%; padding: 12px 15px; border: 1px solid #e2e4e1; border-radius: 8px; font-size: 15px; background-color: #ffffff; box-sizing: border-box; outline: none; transition: border-color 0.2s; }

#formular-poptavka input.field:focus, #formular-poptavka textarea:focus {border-color: #a79c5b;}
#formular-poptavka input.field-small {width: 120px;}
#formular-poptavka input.field-middle {width: calc(100% - 120px);}

#formular-poptavka textarea {height: 130px; resize: vertical;}
#formular-poptavka .formular-confirmation {display: none;}

#formular-poptavka form .formular-button {width: 100%; text-align: left; height: auto; margin: 0 0 7px 0; padding: 10px 0 0 0; float: left;}
#formular-poptavka form .formular-button input {width: auto; min-width: 190px; padding: 18px; background: #a99951; color: #fff; float: left; transition: 0.3s; border: none; border-radius: 9px; font-size: 20px; font-weight: 500; cursor: pointer; transition: background-color 0.3s; font-family: "Inter"; box-shadow: 0px 2px 4px 0px #00000040; margin: 12px 0 0 215px;}
#formular-poptavka form .formular-button input:hover {cursor: pointer; background: #988947;}

#formular-poptavka .newsletter-info {font-size: 14px; color: #2C2C2C; width: calc(100% - 114px); font-family: "Inter"; line-height: 1.55em; padding: 0px 0 29px 215px; float: left;}
#formular-poptavka .newsletter-info a, #formular-poptavka .newsletter-info a:visited {color: #A99951; text-decoration: underline;}
#formular-poptavka .newsletter-info a:hover {color: #000;}

#formular-poptavka input[type="submit"] {grid-column: 2; background-color: #b3a15f; color: #ffffff; border: none; padding: 14px 35px; font-size: 16px; font-weight: bold; border-radius: 6px; cursor: pointer; width: max-content; transition: background-color 0.3s ease;}
#formular-poptavka input[type="submit"]:hover {background-color: #9c8c50;}

#zajezdy-reference {padding: 10px 20px 50px;}

.reference-container {margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 60px;}
.reference-item {display: flex; align-items: center; gap: 25px;}
.reference-img-wrap {width: 140px; height: 140px; border-radius: 50%; border: 3px solid #b3a15f; overflow: hidden; flex-shrink: 0;}
.reference-img-wrap img {width: 100%; height: 100%; object-fit: cover;}
.reference-content {flex: 1; margin-left: 30px;}
.reference-quote {font-size: 18px; font-weight: 600; color: #2c2c2c; margin: 0 0 15px 0; line-height: 1.5;}
.reference-author {font-size: 18px; color: #555555; margin: 0;}

.zajezdynamiru-odkaz {box-sizing: border-box; background-color: #1b3a4b; color: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0 110px 0 80px; border-radius: 12px; overflow: hidden; min-height: 340px; margin: 0 0 0 0; width: calc(100% - 4px);}
.zajezdynamiru-odkaz-content {flex: 1; z-index: 2;}
.zajezdynamiru-odkaz-title {font-size: 2.2rem; line-height: 1.0; margin: 0 0 35px 0; font-weight: 700; font-family: Jaldi; font-size: 40px;}
.zajezdynamiru-odkaz-text {font-size: 1.2rem; line-height: 1.4; margin-bottom: 35px; color: rgba(255, 255, 255, 0.9); font-family: Inter; font-size: 21px;}

a.zajezdynamiru-odkaz-button, a.zajezdynamiru-odkaz-button:visited {display: inline-block; background-color: #ae9f63; color: white; text-decoration: none; padding: 22px 37px; border-radius: 8px; font-weight: 600; transition: all 0.3s ease; font-size: 20px; font-family: Inter;}
a.zajezdynamiru-odkaz-button:hover {background-color: #948754; box-shadow: 0 4px 12px rgba(0,0,0,0.2);}

.zajezdynamiru-odkaz-image-wrapper {flex: 1; display: flex; justify-content: flex-end;}
.zajezdynamiru-odkaz-image {max-width: 110%; height: auto; display: block;}

.darkovepoukazy-odkaz {margin: 0 0 50px 75px; width: calc(100% - 150px);}



/* FAQ
----------------------------------------------- */
.container-page h2.faq-h2 {font-size: 40px; margin-bottom: 20px;}
.faq-item {margin-bottom: 15px;}
.faq-question {width: 100%; text-align: left; background: none; border: none; font-size: 22px; line-height: 1.1em; font-weight: 700; color: #1a3646; cursor: pointer; display: flex; align-items: center; padding: 10px 0; font-family: Jaldi;}
.faq-icon {display: inline-flex; justify-content: center; align-items: center; min-width: 20px; height: 20px; background-color: #1a3646; color: white; margin-right: 15px; font-size: 18px; font-weight: bold; line-height: 1; border-radius: 2px; transition: background-color 0.2s;}
.faq-icon::before {content: '+'; position: relative; top: -1px;}
.faq-item.active .faq-icon::before {content: '−';}
.faq-answer {max-height: 0; overflow: hidden; transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out, padding-bottom 0.3s ease-in-out; opacity: 0; padding-left: 0; padding-bottom: 0; color: #333; font-size: 18px; line-height: 1.5em; font-family: Inter;}
.faq-answer ul {margin: 0.75em 0 1.25em 1.56em; list-style: disc; float: left; display: block; width: calc(100% - 1.56em);}
.faq-answer ul li {line-height: 1.38em; float: left; width: 100%;}
.faq-item.active .faq-answer {opacity: 1; padding-bottom: 15px;}
.faq-question:focus {outline: none;}