/*
Theme Name: Knowledge Applied
Description: WordPress theme for Knowledge Applied association, bilingual Czech/English
Version: 1.0
Author: Generated from static site
Text Domain: knowledge-applied
*/

/* ================================================== */
/* KnowledgeApplied.cz, 11/2011, screen styles
/* styled by Jan Sochor
/* ================================================== */

html {overflow: -moz-scrollbars-vertical;}
html, body {height: 100%;}
body {margin: 0; padding: 0; background: #f2d959 url(images/bgd.jpg) top center no-repeat; text-align: center;}

/* ================================================== */
/* reset
/* -------------------------------------------------- */

p, a, em, ul, li, h1, h2, h3, h4, h5, h6, img, input, textarea, select {font-family: Georgia, "Times New Roman", Times, serif; font-weight: normal; text-decoration: none; margin: 0; padding: 0;}
img, fieldset, hr {margin: 0; padding: 0; border: none;}
a:active, a:focus, input {outline: 0; outline-style: none; outline-width: 0;}

/* ================================================== */
/* helpers
/* -------------------------------------------------- */

.clear {clear: both;}
.nodisplay {display: none;}

/* ================================================== */
/* layout containers
/* -------------------------------------------------- */

#mainCont {margin: 0 auto; width: 960px; text-align: left;}

/* ================================================== */
/* header
/* -------------------------------------------------- */

#headerCont {width: 960px; height: 200px; position: relative; overflow: hidden; z-index: 1;}

#headerCont h1#logoKA {width: 460px; height: 75px; position: absolute; top: 35px; left: 0px; z-index: 3;}
#headerCont h1#logoKA a {width: 460px; height: 75px; display: block; background: url(images/logo-KA.png) 0 0 no-repeat; text-indent: -3000px;}

#headerCont h5#sublogoKAcz, #headerCont h5#sublogoKAen {width: 960px; height: 50px; margin: 110px 0 0 0; display: block; text-indent: -3000px;}
#headerCont h5#sublogoKAcz {background: url(images/sub-logo-KA-cz.png) 0 0 no-repeat;}
#headerCont h5#sublogoKAen {background: url(images/sub-logo-KA-en.png) 0 0 no-repeat;}

#animaCont {width: 960px; height: 60px; position: absolute; top: 50px; left: 0px; z-index: 2;}
#animaCont h3 {width: 960px; height: 60px; background: url(images/anima-bgd.png) 0 0 no-repeat;}
#animaCont h3, #animaCont h4, #animaCont h5 {display: block; float: left; text-indent: -3000px;}

#datumCont {width: 960px; height: 40px; margin: 0; background: url(images/datum-bgd.png) 0 0 no-repeat; text-align: right;}
#datumCont p {font-size: 10px; text-transform: uppercase; color: #DD3800; padding: 0 20px 0 0; letter-spacing: 2px;}
#datumCont p span {font-size: 12px; color: #603813; letter-spacing: 1px;}

#langCont {width: 200px; height: 40px; position: absolute; top: 15px; left: 50px; z-index: 2;}
#langCont p {font-size: 10px; text-transform: uppercase; color: #bc9d77; padding: 0 20px 0 0; letter-spacing: 2px;}
#langCont p a {color: #bc9d77;}
#langCont p, #langCont p a {font-family: Arial, Helvetica, Geneva, sans-serif;}
#langCont p a:hover {color: #DD3800;}

/* ================================================== */
/* navigace
/* -------------------------------------------------- */

#menuCont {width: 200px; margin: 0 0 0 50px; float: left;}

.menu {width: 200px; height: 400px; margin: 69px 0 0 0; text-transform: uppercase; letter-spacing: 2px;}

.menu .menuheader {font-size: 15px; height: 40px; line-height: 40px; font-weight: bold; color: #603813; display: block; border-bottom: 1px solid #eabd4c; padding: 0 0 0 0; text-decoration: none; cursor: pointer;}
.menu .openheader {color: #603813;} /*CSS class to apply to expandable header when it's expanded*/

.menu p a {color: #603813; font-weight: bold;}
.menu p:hover, .menu p a:hover {color: #DD3800;}

.menu ul, .menu ul li {list-style-type: none;}
.menu ul li {font-size: 15px; line-height: 40px; border-bottom: 1px solid #eabd4c;}
.menu ul li a {color: #603813; display: block; padding: 0 0 0 20px; text-decoration: none; cursor: pointer;}
.menu ul li a:hover {color: #DD3800;}

.menu p a.selected, .menu ul li a.selected {color: #DD3800;}

/* WordPress submenu formatting (e.g. Hospodaření, Stanovy, ...) */
.menu ul.categoryitems {
	margin: 0;
	padding: 0;
}
.menu ul.categoryitems li {
	font-size: 15px;
	line-height: 40px;
	height: auto;
	border-bottom: 1px solid #eabd4c;
}
.menu ul.categoryitems li a {
	padding: 0 0 0 20px;
	font-weight: normal;
	letter-spacing: 2px;
}

/* WordPress active menu classes */
.menu .current-menu-item > a,
.menu .current_page_item > a,
.menu .current-menu-ancestor > a,
.menu .current-page-ancestor > a,
.menu .current_page_parent > a {
	color: #DD3800;
}

/* ================================================== */
/* obsah
/* -------------------------------------------------- */

#midCont {width: 960px; margin: 0;}
#obsahCont {width: 600px; margin: 0 20px 0 0; float: right;}

#headline {width: 600px; height: 110px; margin: 0 0 20px 0; background: url(images/headline-bgd.png) left bottom  no-repeat;}
#headline h1.chapter {height: 60px; font-size: 46px; color: #DD3800; font-style: italic;}
#headline h3.er404 {font-size: 25px; color: #DD3800; font-style: italic; margin: 10px 0 10px 0;}

#welcome {width: 650px; height: 230px; margin: -10px 0 20px -30px;}

#obsahCont h2 {font-size: 25px; color: #F75E00; margin: 0 0 10px 0; font-style: italic;}
#obsahCont h5 {font-size: 10px; text-transform: uppercase; color: #F75E00; letter-spacing: 1px; margin: 0 0 10px 0;}
#obsahCont h5 span {font-size: 12px; text-transform: none;}

/* kontakt */
#mapaBox {width: 520px; height: 350px; background: url(images/mapa-bgd.png) 0 0 no-repeat; padding: 50px 50px 50px 50px; margin: 0 0 25px -50px;}
#mapaBox iframe {display: block;}
#mapaBox p {margin: 8px 0 0 0; font-size: 11px;}
#mapaBox p a {color: #42210B; border-bottom: 1px dotted #DD3800;}
#mapaBox p a:hover {color: #DD3800;}

#obsahCont p {width: 600px; font-size: 13px; color: #42210B; line-height: 28px; margin: 0 0 16px 0;}
#obsahCont p.topMarg {margin: 80px 0 0 0;}
#obsahCont p a {color: #42210B; border-bottom: 1px dotted #DD3800;}
#obsahCont p a:hover {color: #DD3800; border-bottom: 1px dotted #DD3800;}
#obsahCont ul,
#obsahCont ol {line-height: 28px; margin: 0 0 16px 0;}

#obsahCont ul.let {list-style-type: lower-latin; font-size: 13px; color: #42210B;}

#obsahCont ul.num,
#obsahCont ol {
	list-style-type: upper-roman;
	font-size: 25px;
	color: #dd9c23;
	padding: 0 0 0 28px;
	margin-left: 0;
}

#obsahCont ul.num li,
#obsahCont ol > li {padding: 32px 0 0 0;}

#obsahCont ul.num li:first-child,
#obsahCont ol > li:first-child {padding-top: 0;}

#obsahCont ul.wp-block-list,
#obsahCont ul.disc,
#obsahCont ul ul,
#obsahCont ol ul {
	list-style-type: disc;
	font-size: 13px;
	color: #42210B;
	padding: 0 0 0 40px;
	margin: 8px 0 16px 0;
}

#obsahCont ul.wp-block-list li,
#obsahCont ul.disc li,
#obsahCont ul ul li,
#obsahCont ol ul li {padding: 0;}

/* section headings used in page content (e.g. Stanovy) */
#obsahCont h2.wp-block-heading {
	font-size: 25px;
	color: #F75E00;
	font-style: italic;
	margin: 32px 0 10px 0;
}
#obsahCont h2.wp-block-heading:first-child {margin-top: 0;}

/* WordPress file / PDF attachment block */
.wp-block-file {
	display: flex;
	align-items: center;
	gap: 16px;
	border-top: 1px dashed #eabd4c;
	padding: 20px 0 0 0;
	margin: 20px 0 0 0;
}
.wp-block-file::before {
	content: '';
	display: block;
	flex-shrink: 0;
	width: 43px;
	height: 90px;
	background: url(images/file-bgd.png) 0 0 no-repeat;
	background-size: auto;
}
.wp-block-file a:not(.wp-block-file__button) {
	display: block;
	width: 43px;
	height: 90px;
	position: absolute;
	text-indent: -3000px;
	background: url(images/icon-pdf.png) center center no-repeat;
}
.wp-block-file .wp-block-file__button {
	background: none;
	border: none;
	border-bottom: 1px dotted #DD3800;
	border-radius: 0;
	padding: 0;
	color: #42210B;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 13px;
	text-decoration: none;
}
.wp-block-file .wp-block-file__button:hover {
	color: #DD3800;
}

/* ================================================== */
/* footer
/* -------------------------------------------------- */

#footerCont {width: 960px; margin: 20px 0 0 0; text-align: center; clear: both;}
#footerCont p {font-size: 12px; color: #42210B; line-height: 20px;}
#footerCont p a {color: #42210B; border-bottom: 1px dotted #DD3800;}
#footerCont p a:hover {color: #DD3800; border-bottom: 1px dotted #DD3800;}
#footerCont p.fb {display: inline-block; text-align: left; background: url(images/icon-FB.png) 0 50% no-repeat; min-height: 24px; padding: 0 0 0 30px; margin: 0 0 10px 0;}
#footerCont p.fb span {display: none;}

/* ================================================== */
/* news
/* -------------------------------------------------- */

.newsBox {margin: 0 0 30px 0; border-bottom: 1px solid #eabd4c; padding: 0 0 20px 0;}
.newsBox h6 {font-size: 10px; text-transform: uppercase; color: #F75E00; letter-spacing: 1px; margin: 0 0 5px 0;}
.newsBox h2 {font-size: 25px; color: #F75E00; margin: 0 0 10px 0; font-style: italic;}
.newsBox p {width: 600px; font-size: 13px; color: #42210B; line-height: 28px; margin: 0 0 16px 0;}
.newsBox .fileBox {margin: 10px 0 0 0;}
.newsBox .fileBox a {color: #42210B; border-bottom: 1px dotted #DD3800; font-size: 12px;}
.newsBox .fileBox a:hover {color: #DD3800; border-bottom: 1px dotted #DD3800;}

/* ================================================== */
/* photogallery
/* -------------------------------------------------- */

#lightbox {position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img {width: auto; height: auto;}
#lightbox a img {border: none;}

#outerImageContainer {position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto;}
#imageContainer {padding: 10px;}
#loading {position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0;}
#hoverNav {position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10;}
#imageContainer > #hoverNav {left: 0;}
#hoverNav a {outline: none;}

#prevLink, #nextLink {width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */}
#prevLink {left: 0; float: left;}
#nextLink {right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover {background: url(images/prevlabel.gif) left 15% no-repeat;}
#nextLink:hover, #nextLink:visited:hover {background: url(images/nextlabel.gif) right 15% no-repeat;}

#imageDataContainer {font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%;}

#imageData {padding: 0 10px; color: #666;}
#imageData #imageDetails {width: 70%; float: left; text-align: left;}
#imageData #caption {font-weight: bold;}
#imageData #numberDisplay {display: block; clear: left; padding-bottom: 1.0em;}
#imageData #bottomNavClose {width: 66px; float: right; padding-bottom: 0.7em; outline: none;}

#overlay {position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000;}

/* ================================================== */
/* WordPress specific
/* -------------------------------------------------- */

.alignleft {float: left; margin: 0 20px 10px 0;}
.alignright {float: right; margin: 0 0 10px 20px;}
.aligncenter {display: block; margin: 0 auto;}
.wp-caption {border: 1px solid #ddd; background: #f3f3f3; padding: 4px; margin: 10px;}
.wp-caption-text {font-size: 11px; margin: 5px;}

#obsahCont .ka-modula-gallery-item {margin: 0 0 38px 0;}
#obsahCont .ka-modula-gallery-item:last-child {margin-bottom: 0;}

#obsahCont .ka-modula-pagination {margin: 12px 0 8px 0;}
#obsahCont .ka-modula-pagination ul.page-numbers {list-style: none; margin: 0; padding: 0;}
#obsahCont .ka-modula-pagination ul.page-numbers li {display: inline-block; margin: 0 6px 6px 0;}
#obsahCont .ka-modula-pagination a.page-numbers,
#obsahCont .ka-modula-pagination span.page-numbers {
	display: inline-block;
	min-width: 24px;
	padding: 2px 6px;
	font-size: 13px;
	line-height: 20px;
	color: #42210B;
	border-bottom: 1px dotted #DD3800;
}
#obsahCont .ka-modula-pagination a.page-numbers:hover {color: #DD3800;}
#obsahCont .ka-modula-pagination .current {
	color: #DD3800;
	border-bottom: 1px solid #DD3800;
}

/* ================================================== */
/* responsive
/* -------------------------------------------------- */

@media screen and (max-width: 980px) {
	#mainCont, #headerCont, #midCont, #footerCont {
		width: 94%;
		max-width: 960px;
	}

	#menuCont {
		width: 30%;
		margin-left: 0;
	}

	.menu {
		width: 100%;
	}

	#obsahCont {
		width: 66%;
		margin-right: 0;
	}

	#headline,
	#obsahCont p,
	.newsBox p {
		width: auto;
	}

	#welcome {
		width: auto;
		height: auto;
		margin: 0 0 20px 0;
	}

	#welcome img,
	#obsahCont img {
		max-width: 100%;
		height: auto;
		display: block;
	}

	#datumCont,
	#animaCont,
	#animaCont h3,
	#headerCont h5#sublogoKAcz,
	#headerCont h5#sublogoKAen {
		width: 100%;
	}
}

@media screen and (max-width: 768px) {
	body {
		text-align: left;
		background-position: center top;
	}

	#mainCont {
		width: auto;
		margin: 0 12px;
	}

	#headerCont {
		width: 100%;
		height: auto;
		overflow: visible;
		padding-bottom: 10px;
	}

	#headerCont h1#logoKA {
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		max-width: 460px;
		margin: 20px auto 10px auto;
	}

	#headerCont h1#logoKA a {
		margin: 0 auto;
		background-position: center top;
	}

	#langCont {
		position: relative;
		top: auto;
		left: auto;
		width: auto;
		height: auto;
		margin: 0 0 8px 0;
		text-align: left;
	}

	#datumCont {
		height: auto;
		padding: 8px 0;
		background: none;
		text-align: left;
	}

	#datumCont p,
	#langCont p {
		padding-right: 0;
		letter-spacing: 1px;
	}

	#animaCont,
	#headerCont h5#sublogoKAcz,
	#headerCont h5#sublogoKAen {
		display: none;
	}

	#midCont {
		width: 100%;
	}

	#menuCont,
	#obsahCont {
		float: none;
		width: auto;
		margin: 0;
	}

	.menu {
		height: auto;
		margin: 20px 0;
	}

	.menu .menuheader,
	.menu ul li {
		height: auto;
		line-height: 1.4;
		padding: 10px 0;
	}

	.menu ul li a {
		padding: 10px 0 10px 12px;
	}

	#headline {
		height: auto;
		background: none;
		margin-bottom: 10px;
	}

	#headline h1.chapter {
		height: auto;
		font-size: 34px;
		line-height: 1.2;
	}

	#obsahCont p,
	.newsBox p {
		line-height: 1.8;
	}

	#footerCont {
		width: 100%;
		margin-top: 30px;
		padding-bottom: 20px;
	}
}

@media screen and (max-width: 480px) {
	#headline h1.chapter {
		font-size: 28px;
	}

	#obsahCont h2,
	.newsBox h2 {
		font-size: 22px;
	}

	#obsahCont p,
	.newsBox p {
		font-size: 15px;
		line-height: 1.7;
	}

	.menu .menuheader,
	.menu ul li,
	.menu ul li a {
		font-size: 14px;
	}
}