/* kaizerfish.srv.if.ua - Joomla 6 port (2026) of the 2010 Joomla 1.5 Artisteer template "kaizerfish".
   Same colours, fonts, page texture, header picture, title bars, bullets and footer picture. The sprite-built
   shadows/corners of the Artisteer boxes are replaced by borders, rounded corners and box-shadow; the fixed 900px
   float layout by a grid that also works on phones. */

/* ---- page */
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	padding: 0 0 20px;
	background: #fff url("../images/Page-BgTexture.jpg") repeat fixed top left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 1.35;
	color: #33351D;
}
body::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0; left: 0; right: 0;
	height: 500px;
	background: url("../images/Page-BgGradient.jpg") repeat-x top left;
}
*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; height: auto; border: 0; }
.visually-hidden {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
	clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

a, a:link { color: #70733F; text-decoration: underline; letter-spacing: 1px; }
a:visited { color: #232414; }
a:hover, a:focus { color: #BD9B2E; text-decoration: none; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; font-style: normal; margin: .5em 0; }
h1 { font-size: 28px; color: #907623; }
h2 { font-size: 24px; color: #907623; }
h3 { font-size: 22px; color: #70733F; }
h4 { font-size: 18px; color: #423610; }
h5 { font-size: 16px; color: #423610; }
h6 { font-size: 14px; color: #423610; }
p { margin: 0 0 .9em; }

/* ---- sheet (900px white sheet with soft shadow), header 898x250: photo Header.jpg + Header.png overlay */
.art-Sheet {
	max-width: 900px;
	margin: 20px auto 0;
	border: 1px solid #c9c9b4;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 0 12px rgba(80, 80, 40, .25);
	overflow: hidden;
}
.art-Header {
	position: relative;
	aspect-ratio: 898 / 250;
	/* as in the old template: the photo (Header.jpg) is drawn over the frame picture (Header.png) */
	background: url("../images/Header.jpg") center center / cover no-repeat, url("../images/Header.png") left top / 100% auto no-repeat;
}
.art-Logo, .art-Logo:link, .art-Logo:visited, .art-Logo:hover {
	position: absolute;
	left: 0; right: 0;
	top: 27%;
	display: block;
	text-align: center;
	text-decoration: none;
	letter-spacing: 0;
	color: #30311B;
}
.art-Logo-name { display: block; font-size: 41px; font-weight: bold; text-transform: uppercase; line-height: 1.15; }
.art-Logo-text { display: block; font-size: 20px; font-weight: bold; text-transform: uppercase; }
.menu-link { display: none; }

/* ---- layout: content 672px on the left, right column 224px (art-sidebar2) */
.art-contentLayout { display: grid; grid-template-columns: minmax(0, 1fr); padding: 10px 6px 0 10px; }
.art-contentLayout.has-sidebar { grid-template-columns: minmax(0, 1fr) 224px; }
.art-content { min-width: 0; }

/* ---- sidebar blocks (art-Block: #EFEFE6 with a shadow) */
.art-Block {
	margin: 5px 5px 10px;
	padding: 11px;
	border: 1px solid #dcdccb;
	background: #EFEFE6;
	box-shadow: 1px 2px 4px rgba(80, 80, 40, .22);
}
.art-BlockHeader { margin: 0 0 6px; font-size: 14px; font-weight: bold; color: #000; }
.art-BlockContent { font-size: 12px; color: #5D5F35; overflow-wrap: anywhere; }
.art-BlockContent a:link { color: #636638; text-decoration: underline; }
.art-BlockContent a:visited { color: #636638; }
.art-BlockContent a:hover, .art-BlockContent a:focus { color: #AC8E2A; text-decoration: none; }
.art-BlockContent ul { list-style: none; margin: 0; padding: 0; color: #434526; }
.art-BlockContent ul li { margin: 0; padding: 1px 0; font-size: 11px; line-height: 1.1em; }
.art-BlockContent li.current > a, .art-BlockContent li.active > a { color: #A5AA64; }
/* the two "-----" separators of the old menu */
.art-BlockContent li.divider { padding: 0; }
.art-BlockContent li.divider .separator, .art-BlockContent li.divider > span {
	display: block; height: 0; margin: 6px 0; overflow: hidden; border-top: 1px dashed #A5AA64; font-size: 0;
}

/* ---- post (content): article title in the #E2E4CE bar, justified text */
.art-Post { margin: 5px 10px 10px 5px; padding: 0; color: #33351D; overflow-wrap: break-word; }
.art-component::after { content: ""; display: block; clear: both; }
.justify, .art-component .com-content-article__body, .art-component .item-content { text-align: justify; }
.art-component .page-header h1, .art-component .page-header h2, .art-component .item-title {
	margin: 0 0 12px;
	padding: 1px 2px;
	background: #E2E4CE;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2;
	text-transform: uppercase;
	color: #3D3F22;
}
.art-component .page-header h2 a, .art-component .item-title a,
.art-component .page-header h2 a:visited, .art-component .item-title a:visited { color: #4D4F2B; text-decoration: none; letter-spacing: 0; }
.art-component .page-header h2 a:hover, .art-component .item-title a:hover { color: #A48728; }
.art-component .blog-item { margin-bottom: 2.2em; }
.art-component .blog-item::after, .art-component .com-content-article__body::after { content: ""; display: block; clear: both; }

/* pictures of the articles (were floated by inline styles) */
.img-left { float: left; margin: 0 10px 6px 0; }
.img-right { float: right; margin: 0 0 6px 10px; }
.img-frame { border: 1px solid #000; }
.art-component table { border-collapse: collapse; }
.art-component td { vertical-align: top; padding: 0 10px 10px 0; }

.art-component ul { list-style: none; margin: 1em 0 1em 12px; padding: 0; color: #83874A; }
.art-component ul li { padding-left: 14px; background: url("../images/PostBullets.png") 0 3px no-repeat; color: #13140B; line-height: 1.2em; }
.art-component ol li, .art-component ul.kf-gallery li { background: none; padding-left: 0; }
blockquote {
	margin: 10px 10px 10px 50px;
	padding: 5px 5px 5px 28px;
	background: #E2E4CE url("../images/PostQuote.png") left top no-repeat;
	color: #13140B;
}

/* "Read more" links (Joomla 6 prints them as buttons) */
.readmore { clear: both; margin: .3em 0 0; }
.readmore a, .readmore a.btn { display: inline; padding: 0; border: 0; background: none; color: #70733F; text-decoration: underline; font-size: 12px; }
.readmore a:hover { color: #BD9B2E; text-decoration: none; }
.readmore [class^="icon-"], .readmore .icon-chevron-right { display: none; }

/* pagination */
.com-content-blog__navigation, .pagination__wrapper, nav.pagination__wrapper { clear: both; margin: 1em 0 0; text-align: center; }
.art-component ul.pagination { display: inline-flex; flex-wrap: wrap; gap: 2px; margin: .5em 0; padding: 0; list-style: none; }
.art-component ul.pagination li { margin: 0; padding: 0; background: none; }
.pagination .page-link { display: inline-block; min-width: 1.8em; padding: 2px 5px; border: 1px solid #c9c9b4; border-radius: 3px; background: #fff; text-decoration: none; letter-spacing: 0; }
.pagination .active .page-link { background: #70733F; border-color: #70733F; color: #fff; }
.pagination .disabled .page-link { color: #a8a88f; }
.pagination [class^="icon-"]::before { content: none; }
.pagination .icon-angle-left::after { content: "\2039"; }
.pagination .icon-angle-right::after { content: "\203A"; }
.pagination .icon-angle-double-left::after { content: "\00AB"; }
.pagination .icon-angle-double-right::after { content: "\00BB"; }
.counter, .com-content-blog__counter { color: #5D5F35; font-size: 11px; }
.art-component [class^="icon-"]:empty { display: none; }
.art-component .pagination [class^="icon-"]:empty { display: inline; }

/* ---- forms: search box (mod_finder) and Smart Search page */
input, select, textarea, button { font: inherit; color: inherit; }
.art-BlockContent .mod-finder input[type="search"], .art-BlockContent .mod-finder input[type="text"], .art-BlockContent .js-finder-search-query {
	width: 100%; margin: 4px 0; padding: 2px 3px; border: 1px solid #aaa; background: #fff; font-size: 11px; font-weight: bold;
}
.art-BlockContent .mod-finder label, .art-BlockContent .awesomplete > ul:empty { display: none; }
.art-BlockContent .awesomplete > ul { background: #fff; border: 1px solid #ccc; padding: 0; z-index: 5; }
.art-BlockContent .awesomplete > ul li { padding: 2px 4px; margin: 0; }
.com-finder .form-control, .com-finder input[type="text"], .com-finder input[type="search"] { padding: 3px 4px; border: 1px solid #c9c9b4; background: #fff; min-width: 15em; }
.btn, button.btn {
	display: inline-block; padding: 3px 10px; border: 1px solid #70733F; border-radius: 4px;
	background: linear-gradient(#bcbf8c, #8a8d52); color: #fff; cursor: pointer; text-decoration: none; letter-spacing: 0;
}
.btn:hover { background: linear-gradient(#a5a873, #70733F); color: #fff; }
.com-finder .input-group { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.com-finder__results-list, .art-component .com-finder__results-list { margin: 1em 0; padding: 0; }
.com-finder__results-list li, .art-component .com-finder__results-list li { margin: 0 0 1em; padding: 0; background: none; }
.result__title { margin: 0 0 .2em; font-size: 15px; }
.result__title-url { display: none; }
.com-finder__explained { margin: .5em 0; color: #5D5F35; }
mark, .highlight { background: #fffebb; color: inherit; }

/* ---- system messages, error page */
joomla-alert, .alert { display: block; margin: 0 0 1em; padding: 8px 12px; border: 1px solid #d5d5c5; border-radius: 4px; background: #f9f9f3; color: #c30; }
joomla-alert .joomla-alert--close, joomla-alert button.joomla-alert--close { float: right; border: 0; background: none; font-size: 18px; cursor: pointer; }
.error-code { font-size: 64px; line-height: 1; color: #c9c9b4; font-weight: bold; }

/* ---- footer (Footer.png: the light olive band at the bottom of the sheet), text right, italic */
.art-Footer {
	margin-top: 10px;
	padding: 20px 20px 18px;
	background: url("../images/Footer.png") left bottom / 100% 100% no-repeat;
	text-align: right;
}
.art-Footer-text { color: #5D5F35; font-size: 11px; font-style: italic; }
.art-Footer-text p { margin: 0; }
.art-Footer-text a:link { color: #202112; text-decoration: underline; }
.art-Footer-text a:visited { color: #606336; }
.art-Footer-text a:hover { color: #606336; text-decoration: none; }

/* ---- narrow screens: one column, the sidebar below the content, a "Menu" link in the header jumps to it */
@media (max-width: 760px) {
	.art-Sheet { margin: 0; border-radius: 0; border: 0; }
	.art-contentLayout, .art-contentLayout.has-sidebar { grid-template-columns: minmax(0, 1fr); padding: 6px; }
	.art-Logo-name { font-size: 6vw; }
	.art-Logo-text { font-size: 3.2vw; }
	.menu-link {
		display: block; position: absolute; right: 8px; bottom: 8px; padding: 4px 10px; border-radius: 4px;
		background: rgba(48, 49, 27, .8); color: #fff !important; text-decoration: none; font-weight: bold;
	}
	.art-Post { margin: 4px; }
	.art-component .page-header h1, .art-component .page-header h2, .art-component .item-title { font-size: 19px; }
	.img-left, .img-right { max-width: 45%; }
	.art-component table, .art-component tbody, .art-component tr, .art-component td { display: block; width: auto !important; }
	blockquote { margin: 10px 0; }
}
@media (max-width: 420px) {
	.justify, .art-component .com-content-article__body, .art-component .item-content { text-align: left; }
	.img-left, .img-right { float: none; display: block; max-width: 100%; margin: 0 auto 8px; }
}

/* ---- print */
@media print {
	body { background: none; }
	body::before, .art-Header, .art-sidebar2, .art-Footer { display: none; }
	.art-Sheet { border: 0; box-shadow: none; }
	.art-contentLayout.has-sidebar { display: block; }
}