/**
 * Geliunamai theme styles (Nijolės gėlių namai).
 * Loaded after template/preset CSS and before css/custom.css,
 * so css/custom.css stays free for your own tweaks.
 */

:root {
	--gn-brown: #5b4037;
	--gn-red: #eb4947;
	--gn-red-dark: #e61c19;
	--gn-text: #333333;
	--gn-topbar: #4a4b4b;
	--gn-light: #e7e7e7;
	--gn-font: Tahoma, Geneva, Arial, Helvetica, sans-serif;
	--gn-serif: "Lora", Georgia, "Times New Roman", serif;
}

/* ---------- Base ---------- */
body {
	font-family: var(--gn-body-font, var(--gn-font));
	font-size: var(--gn-body-size, 14px);
	line-height: var(--gn-body-line-height, 24px);
	color: var(--gn-text);
	background: #fff;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: var(--gn-font);
	color: var(--gn-text);
}

h1, .h1 { font-size: 36px; font-weight: 500; }
h2, .h2 { font-size: 16px; margin-top: 5px; margin-bottom: 5px; }
h4, .h4 { font-size: 18px; font-weight: 500; }

a { color: var(--gn-brown); }
a:hover, a:focus, a:active { color: var(--gn-red-dark); }

@media (min-width: 1200px) {
	.container { max-width: var(--gn-container-width, 1170px); }
}

.btn-primary,
.sppb-btn-primary {
	background-color: var(--gn-brown);
	border-color: var(--gn-brown);
	color: #fff;
}
.btn-primary:hover, .btn-primary:focus,
.sppb-btn-primary:hover, .sppb-btn-primary:focus {
	background-color: #4a332c;
	border-color: #4a332c;
	color: #fff;
}

blockquote { border-color: var(--gn-red); }

/* ---------- Top bar ---------- */
/* Same as the old site: #4a4b4b at 80% opacity over white */
#sp-top-bar {
	background: var(--gn-topbar, #4a4b4b) !important;
	color: var(--gn-topbar-text, #fff) !important;
	opacity: 0.8;
	padding: 8px 0;
	font-size: 15px !important;
	line-height: 24px;
}

#sp-top-bar a {
	color: var(--gn-topbar-text, #f5f5f5);
}

#sp-top-bar a:hover,
#sp-top-bar a:focus {
	color: #fff;
}

#sp-top-bar ul.social-icons {
	margin: 0;
	padding: 0;
}

#sp-top-bar ul.social-icons > li {
	margin: 0 14px 0 0;
}

#sp-top-bar ul.social-icons > li a,
#sp-top-bar ul.social-icons > li a span {
	font-size: 22px;
	line-height: 24px;
	color: var(--gn-topbar-text, #f5f5f5);
}

#sp-top-bar ul.social-icons > li a:hover span {
	color: var(--gn-red);
}

#sp-top-bar .sp-contact-info {
	display: inline-block;
	margin: 0;
	padding: 0;
	list-style: none;
}

#sp-top-bar .sp-contact-info li {
	display: inline-block;
	margin: 0 0 0 20px;
	font-size: 13.5px;
	color: var(--gn-topbar-text, #f5f5f5);
}

#sp-top-bar .sp-contact-info li span {
	margin-right: 4px;
	opacity: .9;
}

#sp-top2 a:hover {
	text-decoration: underline;
}

#sp-top-bar .sp-module {
	display: inline-block;
	margin: 0 0 0 40px;
}

/* ---------- Header: logo + search ---------- */
#sp-header {
	height: var(--gn-header-height, 90px);
	background: var(--gn-header-bg, #fff);
	box-shadow: 0 3px 3px rgba(0, 0, 0, .05);
	z-index: 99;
}

#sp-header .container,
#sp-header .container-inner,
#sp-header .row {
	height: 100%;
}

#sp-header .logo {
	height: var(--gn-header-height, 90px);
	display: inline-flex;
	align-items: center;
	margin: 0;
}

#sp-header .logo img.logo-image {
	max-height: var(--gn-logo-height, 69px);
	width: auto;
}

#sp-header.header-sticky {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	animation: spFadeInDown .5s;
}

#sp-search .sp-module {
	margin: 0;
}

#sp-search form,
#sp-search .search,
#sp-search .mod-finder,
#sp-search .jshop_search {
	display: flex;
	align-items: center;
	margin: 0;
}

#sp-search input[type="text"],
#sp-search input[type="search"],
#sp-search .inputbox {
	width: 288px;
	height: 34px;
	padding: 6px 12px;
	font-size: 14px;
	color: #555;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 4px 0 0 4px;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

#sp-search input[type="text"]:focus,
#sp-search input[type="search"]:focus {
	border-color: var(--gn-brown);
	outline: 0;
}

#sp-search input[type="submit"],
#sp-search button,
#sp-search .button {
	height: 34px;
	padding: 6px 12px;
	font-size: 14px;
	color: #fff;
	background: var(--gn-brown);
	border: 1px solid var(--gn-red);
	border-radius: 0 4px 4px 0;
	margin-left: -1px;
	cursor: pointer;
}

#sp-search input[type="submit"]:hover,
#sp-search button:hover,
#sp-search .button:hover {
	background: #4a332c;
}

/* ---------- Menu row ---------- */
#sp-menu-row {
	background: var(--gn-header-bg, #fff);
	position: relative;
	z-index: 98;
}

#sp-menu-row .sp-megamenu-parent {
	float: none;
	margin: 0;
}

#sp-menu-row .sp-megamenu-parent > li > a,
#sp-menu-row .sp-megamenu-parent > li > span {
	display: inline-block;
	padding: 0 15px;
	font-family: var(--gn-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 40px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--gn-menu-text, #000);
}

#sp-menu-row .sp-megamenu-parent > li > a.boso,
#sp-menu-row .sp-megamenu-parent > li:nth-child(-n+2) > a {
	font-weight: 700;
}

#sp-menu-row .sp-megamenu-parent > li:hover > a,
#sp-menu-row .sp-megamenu-parent > li.active > a,
#sp-menu-row .sp-megamenu-parent > li.active:hover > a {
	color: var(--gn-brown);
	background: var(--gn-light);
}

#sp-menu-row .sp-megamenu-parent > li > a:hover {
	text-decoration: underline;
}

/* Dropdown: same as the old site (360px panel, 20px padding, thin row lines) */
#sp-menu-row .sp-megamenu-parent .sp-dropdown {
	margin-top: 0;
	padding-top: 0;
	text-align: left;
	z-index: 100;
}

#sp-menu-row .sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
	padding: 20px;
	background: #fff;
	border: 0;
	border-radius: 0;
	box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .2);
}

#sp-menu-row .sp-megamenu-parent .sp-dropdown.sp-dropdown-sub {
	top: -20px;
}

#sp-menu-row .sp-megamenu-parent .sp-dropdown.sp-dropdown-sub .sp-dropdown-inner {
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, .2);
}

#sp-menu-row .sp-megamenu-parent .sp-dropdown .sp-dropdown-items {
	margin: 0;
	padding: 0;
	list-style: none;
}

#sp-menu-row .sp-megamenu-parent .sp-dropdown li.sp-menu-item {
	display: block;
	margin: 0;
	padding: 0;
	line-height: 24px;
	position: relative;
}

#sp-menu-row .sp-megamenu-parent .sp-dropdown li.sp-menu-item > a,
#sp-menu-row .sp-megamenu-parent .sp-dropdown li.sp-menu-item > span {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 3px 5px;
	font-family: var(--gn-body-font, var(--gn-font));
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #141414;
	text-transform: none;
	letter-spacing: normal;
	white-space: normal;
	border-bottom: 1px solid #ececec;
	text-decoration: none;
	transition: background-color .15s, color .15s;
}

#sp-menu-row .sp-megamenu-parent .sp-dropdown li.sp-menu-item:last-child > a,
#sp-menu-row .sp-megamenu-parent .sp-dropdown li.sp-menu-item:last-child > span {
	border-bottom-color: #ececec;
}

#sp-menu-row .sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover,
#sp-menu-row .sp-megamenu-parent .sp-dropdown li.sp-menu-item:hover > a,
#sp-menu-row .sp-megamenu-parent .sp-dropdown li.sp-menu-item.active > a {
	color: var(--gn-brown);
	background: var(--gn-light);
	text-decoration: none;
}

/* Sub-menu arrow at the right edge, small and thin */
#sp-menu-row .sp-megamenu-parent .sp-dropdown .sp-dropdown-items .sp-has-child > a::after,
#sp-menu-row .sp-megamenu-parent .sp-dropdown .sp-dropdown-items .sp-has-child > span::after {
	content: "\f105";
	flex: 0 0 auto;
	float: none;
	margin-left: 10px;
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome;
	font-weight: 900;
	font-size: 11px;
	color: #555;
	transform: none;
}

/* Top level arrow: small chevron like the old site */
#sp-menu-row .sp-megamenu-parent > li.sp-has-child > a::after,
#sp-menu-row .sp-megamenu-parent > li.sp-has-child > span::after {
	margin-left: 5px;
	font-size: 10px;
	vertical-align: 1px;
}

#offcanvas-toggler .burger-icon > span {
	background-color: #000;
}

#offcanvas-toggler:hover .burger-icon > span {
	background-color: var(--gn-red);
}

/* ---------- Slider / page title ---------- */
#sp-slider {
	padding: 0;
}

#sp-slider .container,
#sp-slider .container-fluid {
	padding: 0;
}

#sp-slider a.item-container,
#sp-slider div.item-background {
	border-radius: 25px !important;
}

.sp-page-title,
#sp-page-title {
	padding: 20px 0;
	text-align: center;
}

/* 1.1.17: no !important - the colour / image set for a menu item
   (Helix page title, inline style) wins; the id beats the preset CSS. */
#sp-title .sp-page-title,
#sp-page-title {
	background-color: var(--gn-brown);
}
.gn-page-title-empty { padding: 12px 0; }

.sp-page-title .sp-page-title-heading,
.sp-page-title h2,
.sp-page-title h3 {
	color: #fff;
}

/* Automatic title bar (all pages except home), as on the old site */
.gn-page-title .sp-page-title-heading {
	margin: 5px 0 10px;
	padding: 0;
	font-family: var(--gn-body-font, var(--gn-font));
	font-size: 34px;
	font-weight: 500;
	line-height: 1.1;
	text-transform: uppercase;
	color: #fff;
}

.gn-page-title .mod-breadcrumbs__wrapper,
.gn-page-title nav[aria-label] {
	display: block;
}

.gn-page-title .breadcrumb {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin: 10px 0 0;
	padding: 0 !important;
	background: none !important;
	border: 0;
	font-size: 14px;
	line-height: 24px;
	--bs-breadcrumb-divider-color: #fff;
	--bs-breadcrumb-item-active-color: rgba(255, 255, 255, .8);
}

.gn-page-title .breadcrumb > li,
.gn-page-title .breadcrumb-item {
	float: none !important;
	color: #fff;
}

.gn-page-title .breadcrumb-item + .breadcrumb-item::before {
	color: #fff;
}

.gn-page-title .breadcrumb a,
.gn-page-title .breadcrumb a.pathway {
	color: #fff;
	text-decoration: none;
}

.gn-page-title .breadcrumb a:hover {
	color: #fff;
	text-decoration: underline;
}

.gn-page-title .breadcrumb .active,
.gn-page-title .breadcrumb li:last-child {
	color: rgba(255, 255, 255, .8);
}

/* Joomla breadcrumbs "location" icon -> home icon, like the old site */
.gn-page-title .breadcrumb .mod-breadcrumbs__divider {
	margin-right: 6px;
}

.gn-page-title .breadcrumb .icon-location::before {
	content: "\f015";
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome;
	font-weight: 900;
	color: #fff;
}

@media (max-width: 767.98px) {
	.gn-page-title .sp-page-title-heading {
		font-size: 24px;
	}
}

/* ---------- Main body / modules ---------- */
#sp-main-body {
	padding: 30px 0;
}

.sp-module ul > li > a {
	color: #000;
	line-height: 28px;
}

.sp-module ul > li > a:hover {
	color: var(--gn-red);
}

.sp-module ul.menu ul {
	margin-left: 10px;
}

.entry-header {
	margin-bottom: 5px;
}

.entry-header h2 {
	font-size: 18px;
}

article.item {
	margin-bottom: 20px;
}

/* 1.1.17: active menu item highlight only in menu modules of the page body
   (left / right / content). Footer, offcanvas and main menu are not affected. */
#sp-main-body .sp-module ul.menu li.current {
	background: var(--gn-brown);
	color: var(--gn-light);
}

#sp-main-body .sp-module ul.menu li.current > a,
#sp-main-body .sp-module ul.menu li.current > span {
	color: var(--gn-light);
}

.pagination > li > a,
.pagination > li > span,
.page-link {
	color: #000;
}

.pagination > .active > a,
.pagination > .active > span,
.page-item.active .page-link {
	color: #fff;
	background-color: var(--gn-red);
	border-color: var(--gn-red);
}

/* ---------- Bottom (footer columns) ---------- */
#sp-bottom {
	padding: 120px 0 50px;
	color: #fff;
	font-size: 14px;
	background-color: var(--gn-footer-bg, #000);
	background-repeat: no-repeat;
	background-position: 50% 0;
}

#sp-bottom .sp-module-title,
#sp-bottom h3 {
	margin-bottom: 20px;
	padding-bottom: 0;
	border-bottom: 0;
	font-size: 16px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: #fff;
}

#sp-bottom p,
#sp-bottom li {
	color: var(--gn-footer-text, #fff) !important;
}

#sp-bottom a,
#sp-bottom .sp-module ul > li > a {
	color: var(--gn-footer-link, var(--gn-footer-text, #fff)) !important;
}

#sp-bottom a:hover,
#sp-bottom a:focus {
	color: var(--gn-footer-link-hover, var(--gn-footer-link, #fff)) !important;
	text-decoration: underline;
}

#sp-bottom .sp-module ul > li {
	display: block;
	border: 0;
}

/* ---------- Footer (copyright) ---------- */
#sp-footer {
	padding: 20px 0;
	background: var(--gn-footer-bg, #000) !important;
	color: #fff;
	font-size: 14px;
	text-align: center;
}

#sp-footer .sp-copyright,
#sp-footer a {
	color: var(--gn-footer-text, #fff) !important;
}

#sp-footer .container-inner {
	border-top: 0;
	padding: 0;
}

/* ---------- Go to top ---------- */
.sp-scroll-up {
	background: #444;
	color: #fff;
	border-radius: 0;
}

.sp-scroll-up:hover {
	background: var(--gn-brown);
	color: #fff;
}

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
	#sp-top-bar .sp-contact-info li {
		margin: 0 8px;
	}

	#sp-top-bar ul.social-icons > li {
		margin: 0 7px;
	}
}

@media (max-width: 767.98px) {
	#sp-top-bar {
		font-size: 13px;
	}

	#sp-bottom {
		padding-top: 110px;
		text-align: center;
	}

	#sp-bottom .sp-module {
		margin-bottom: 25px;
	}
}

/* Keep the logo row and navigation in the same sticky group. */
#gn-header-wrapper { position: relative; z-index: 999; }
#gn-header-wrapper.header-sticky {
	position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
	animation: spFadeInDown .5s;
}
#gn-header-wrapper.header-sticky #sp-header { position: relative; animation: none; }
#gn-breadcrumbs { padding-top: 12px; padding-bottom: 12px; }
#sp-menu-row .sp-megamenu-parent > li.boso > a,
#sp-menu-row .sp-megamenu-parent > li > a.boso { font-weight: 700; }
/* Mobile/tablet header and logo - the only place for these heights (1.1.17).
   1.1.13: Helix template.css and the framework's inline CSS
   set other header/logo heights (50/60px) on small screens; the logo box became
   taller than the header and the "GĖLIŲ NAMAI" line was cut off. Stronger
   selectors keep header, logo box and toggler at the same height. */
@media (max-width: 991.98px) {
	#gn-header-wrapper #sp-header,
	#gn-header-wrapper #sp-header .logo,
	#gn-header-wrapper #sp-header #offcanvas-toggler {
		height: var(--gn-header-height, 90px); /* 1.1.21: as desktop, like the old site */
	}
	#gn-header-wrapper #sp-logo { min-width: 0; max-width: calc(100% - 60px); }
	#gn-header-wrapper #sp-header .logo { display: flex; align-items: center; }
	#gn-header-wrapper #sp-header .logo a { display: flex; align-items: center; height: 100%; }
	#gn-header-wrapper #sp-header .logo img.logo-image {
		height: var(--gn-logo-height, 69px); /* 1.1.21: as desktop, like the old site */
		max-height: calc(100% - 10px);
		width: auto;
		max-width: 100%;
		object-fit: contain;
	}
	#gn-header-wrapper #sp-header #offcanvas-toggler {
		display: inline-flex;
		align-items: center;
		line-height: normal;
	}
}
@media (max-width: 767.98px) {
	#gn-header-wrapper #sp-header,
	#gn-header-wrapper #sp-header .logo,
	#gn-header-wrapper #sp-header #offcanvas-toggler {
		height: var(--gn-header-height, 90px);
	}
	#gn-header-wrapper #sp-header .logo img.logo-image {
		height: var(--gn-logo-height, 69px);
	}
}

/* 1.1.13: space between the component (main body) and the footer columns
   (Helix > Basic > Body > "Space above footer", default 30px as before). */
#sp-main-body { padding-bottom: var(--gn-bottom-space, 30px); }

/* 1.1.14: layout row "Kontaktai" (position "contact") between Main Body and
   Bottom. Helix prints it only when the position has modules. */
/* 1.1.19: white space above the dark contacts block, as on the old site
   (~50px). Works with Main Body hidden or not (Main Body has no bottom
   padding when this row follows it). */
/* 1.1.20: the row is found by its "contact" column (#sp-contact), so the
   row name in the Layout Builder does not matter (unnamed -> #sp-section-N). */
#sp-kontaktai,
section:has(#sp-contact):not(#sp-header) { padding: 0; } /* 1.1.23: no space */
#sp-info .sp-module:last-child,
#sp-info .sp-module-content > :last-child { margin-bottom: 0; }
@media (max-width: 767.98px) {
	#sp-kontaktai,
	section:has(#sp-contact):not(#sp-header) { padding-top: 0; }
}
/* 1.1.17: Main Body hidden only when chosen explicitly: menu item Page Class
   "gn-no-mainbody" -> body.gn-hide-mainbody (see index.php). */
body.gn-hide-mainbody #sp-main-body { display: none; }
#sp-main-body:has(+ #sp-kontaktai),
#sp-main-body:has(+ section #sp-contact) { padding-bottom: 0; }
#sp-contact .sp-module,
#sp-contact .sp-module + .sp-module { margin: 0; }
#sp-contact .sp-module-title { margin: 30px 0 20px; text-align: center; }

/* 1.1.15: dark contacts block (Custom module, <div class="gn-contacts">)
   and Google map (<div class="gn-map" id="gn-map"><iframe ...></div>).
   Colour #021019 taken from the old site screenshot. */
.gn-contacts {
	background: #021019;
	color: #fff;
	padding: 60px 20px 80px;
	font-size: 14px;
	line-height: 24px;
}
.gn-contacts__inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0 60px;
	max-width: 820px;
	margin: 0 auto;
}
.gn-contacts__col { flex: 1 1 320px; max-width: 380px; }
.gn-contacts__item {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	margin-bottom: 30px;
}
.gn-contacts__item--noicon { padding-left: 62px; }
/* 1.1.16: icons are drawn by CSS (the editor cannot strip them).
   Classes: gn-ic-phone, gn-ic-map, gn-ic-clock, gn-ic-arrow.
   Old markup with <span class="gn-contacts__icon ..."> is ignored. */
.gn-contacts__icon { display: none !important; }
.gn-contacts__item::before {
	flex: 0 0 44px;
	width: 44px;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 44px;
	line-height: 1;
	text-align: center;
	color: #fff;
	-webkit-font-smoothing: antialiased;
}
.gn-contacts__item--noicon::before { content: none; }
.gn-contacts__item.gn-ic-phone::before { content: "\f098"; }
.gn-contacts__item.gn-ic-map::before { content: "\f5a0"; }
.gn-contacts__item.gn-ic-clock::before { content: "\f017"; font-weight: 400; }
.gn-contacts__item.gn-ic-arrow::before { content: "\f124"; }
/* Same icons for markup without gn-ic-* classes (as in 1.1.15 instructions) */
.gn-contacts__col:first-child > .gn-contacts__item:nth-child(1):not([class*="gn-ic-"]):not(.gn-contacts__item--noicon)::before,
.gn-contacts__col:first-child > .gn-contacts__item:nth-child(2):not([class*="gn-ic-"]):not(.gn-contacts__item--noicon)::before { content: "\f098"; }
.gn-contacts__col:first-child > .gn-contacts__item:nth-child(3):not([class*="gn-ic-"]):not(.gn-contacts__item--noicon)::before { content: "\f5a0"; }
.gn-contacts__col:first-child > .gn-contacts__item:nth-child(4):not([class*="gn-ic-"]):not(.gn-contacts__item--noicon)::before { content: "\f017"; font-weight: 400; }
.gn-contacts__col:nth-child(2) > .gn-contacts__item:nth-child(1):not([class*="gn-ic-"]):not(.gn-contacts__item--noicon)::before { content: "\f124"; }
.gn-contacts p { margin: 0; }
.gn-contacts a { color: #fff; }
.gn-contacts a:hover,
.gn-contacts a:focus { color: #fff; text-decoration: underline; }

.gn-map { line-height: 0; }
.gn-map iframe { display: block; width: 100%; height: 450px; border: 0; }

@media (max-width: 767.98px) {
	.gn-contacts { padding: 40px 15px 20px; }
	.gn-contacts__inner { gap: 0; }
	.gn-map iframe { height: 320px; }
}

#sp-header .logo > a:not(:has(img)) { font-size: clamp(16px, 3.5vw, 28px); }

/* ---------- Category tiles (SP Page Builder images + JoomShopping categories) ---------- */
/* Title under the picture: as on the old site (Tahoma 18px, 500, #333) */
#sp-main-body .sppb-addon-single-image .sppb-addon-title,
#sp-main-body .jshop_list_category .category_name,
#sp-main-body .jshop_list_category .category_name a {
	margin: 10px 0;
	font-family: var(--gn-body-font, var(--gn-font));
	font-size: var(--gn-cat-title-size, 18px) !important;
	font-weight: 500;
	line-height: 1.1;
	color: #333;
	text-align: center;
	text-transform: none;
	letter-spacing: normal;
}

#sp-main-body .sppb-addon-single-image .sppb-addon-title a:hover,
#sp-main-body .jshop_list_category .category_name a:hover {
	color: var(--gn-brown);
}

/* Slightly rounded corners on category pictures */
#sp-main-body .sppb-addon-single-image .sppb-addon-single-image-container,
#sp-main-body .sppb-addon-single-image img,
#sp-main-body .jshop_list_category .image img,
#sp-main-body .jshop_list_category img.jshop_img,
#sp-main-body .jshop_list_product .image_block img.jshop_img,
#sp-main-body .jshop_list_product .product .image img.jshop_img,
#sp-main-body .product .image_block a.product_link img {
	border-radius: var(--gn-image-radius, 10px);
}

#sp-main-body .sppb-addon-single-image .sppb-addon-single-image-container {
	overflow: hidden;
}

@media (max-width: 767.98px) {
	#sp-main-body .sppb-addon-single-image .sppb-addon-title,
	#sp-main-body .jshop_list_category .category_name,
	#sp-main-body .jshop_list_category .category_name a {
		font-size: 16px !important;
	}
}

/* JoomShopping images now carry width/height (no layout shift): keep proportions */
.jshop img.jshop_img,
.jshop img.jshop_img_thumb,
.jshop .image_middle img,
#sp-main-body .product .image_block img.jshop_img {
	max-width: 100%;
	height: auto;
}

/* ---------- Off-canvas "4-Geliunamai": dark panel like the old site ---------- */
.offcanvas-menu.gn-offcanvas {
	background: #3b3b3b;
	color: #fff;
	font-family: var(--gn-body-font, var(--gn-font));
	overflow-y: auto;
	box-shadow: -2px 0 10px rgba(0, 0, 0, .35);
}

.gn-offcanvas .gn-offcanvas-head {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 15px 15px 5px;
}

.gn-offcanvas .gn-offcanvas-head .logo {
	margin-right: auto;
}

.gn-offcanvas .gn-offcanvas-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border: 1px solid #fff;
	border-radius: 50%;
	color: #fff;
	font-size: 13px;
	line-height: 1;
	opacity: .9;
	transition: opacity .2s, background-color .2s;
}

.gn-offcanvas .gn-offcanvas-close:hover {
	opacity: 1;
	background: rgba(255, 255, 255, .12);
	color: #fff;
}

.gn-offcanvas .offcanvas-inner {
	padding: 0 0 30px;
}

.gn-offcanvas .offcanvas-inner .sp-module {
	margin: 0;
	padding: 0;
	border: 0;
}

.gn-offcanvas .offcanvas-inner .sp-module-title {
	display: none;
}

/* Search */
.gn-offcanvas .gn-offcanvas-search {
	padding: 10px 15px 15px;
	border-bottom: 1px solid #2a2a2a;
}

.gn-offcanvas .gn-offcanvas-search form,
.gn-offcanvas .gn-offcanvas-search .search,
.gn-offcanvas .gn-offcanvas-search .mod-finder,
.gn-offcanvas .gn-offcanvas-search .input-group {
	display: flex;
	align-items: stretch;
	gap: 0;
	margin: 0;
	width: 100%;
}

.gn-offcanvas .gn-offcanvas-search input[type="text"],
.gn-offcanvas .gn-offcanvas-search input[type="search"],
.gn-offcanvas .gn-offcanvas-search .inputbox {
	flex: 1 1 auto;
	min-width: 0;
	height: 34px;
	padding: 6px 10px;
	font-size: 14px;
	color: #fff;
	background: transparent;
	border: 1px solid #5f5f5f;
	border-radius: 4px 0 0 4px;
	box-shadow: none;
}

.gn-offcanvas .gn-offcanvas-search input::placeholder {
	color: rgba(255, 255, 255, .55);
}

.gn-offcanvas .gn-offcanvas-search input[type="submit"],
.gn-offcanvas .gn-offcanvas-search button,
.gn-offcanvas .gn-offcanvas-search .button {
	flex: 0 0 auto;
	height: 34px;
	padding: 6px 12px;
	margin-left: -1px;
	font-size: 13px;
	color: #fff;
	background: transparent;
	border: 1px solid #5f5f5f;
	border-radius: 0 4px 4px 0;
}

.gn-offcanvas .gn-offcanvas-search input[type="submit"]:hover,
.gn-offcanvas .gn-offcanvas-search button:hover {
	background: var(--gn-brown);
	border-color: var(--gn-brown);
}

/* Main menu */
.gn-offcanvas .offcanvas-inner ul.menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

.gn-offcanvas .offcanvas-inner ul.menu > li {
	border-bottom: 1px solid #2a2a2a;
}

.gn-offcanvas .offcanvas-inner ul.menu > li > a,
.gn-offcanvas .offcanvas-inner ul.menu > li > span {
	padding: 9px 40px 9px 15px;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	color: #fff;
	opacity: 1;
	text-transform: uppercase;
	letter-spacing: .3px;
}

.gn-offcanvas .offcanvas-inner ul.menu > li > a:hover,
.gn-offcanvas .offcanvas-inner ul.menu > li.active > a,
.gn-offcanvas .offcanvas-inner ul.menu > li.current > a {
	color: #fff;
	background: rgba(255, 255, 255, .06);
}


/* Arrows: small white triangle on the right */
.gn-offcanvas.offcanvas-arrow-right .offcanvas-inner ul.menu > li.menu-parent > a > .menu-toggler,
.gn-offcanvas.offcanvas-arrow-right .offcanvas-inner ul.menu > li.menu-parent > .menu-separator > .menu-toggler {
	right: 5px;
	color: #fff;
	font-size: 11px;
}

.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent .menu-toggler::after {
	color: #fff;
}

/* Sub-menus */
.gn-offcanvas .offcanvas-inner ul.menu > li ul {
	margin: 0;
	padding: 4px 0 6px;
	background: #333;
	list-style: none;
}

.gn-offcanvas .offcanvas-inner ul.menu > li ul > li > a,
.gn-offcanvas .offcanvas-inner ul.menu > li ul > li > span {
	display: block;
	padding: 6px 35px 6px 28px;
	font-size: 14px;
	line-height: 20px;
	color: rgba(255, 255, 255, .9);
	text-transform: none;
	opacity: 1;
}

.gn-offcanvas .offcanvas-inner ul.menu > li ul > li > a:hover {
	color: #fff;
	background: rgba(255, 255, 255, .06);
}

.gn-offcanvas .offcanvas-inner ul.menu > li ul ul > li > a {
	padding-left: 40px;
}

/* Extra menu under the main one (Apie mus, Kontaktai, ...) */
.gn-offcanvas .gn-offcanvas-extra {
	margin-top: 20px;
	border-top: 1px solid #2a2a2a;
}

/* 1.1.22: as on the old site - normal case, smaller rows (35px vs 39px) */
.gn-offcanvas .gn-offcanvas-extra ul.menu > li > a,
.gn-offcanvas .gn-offcanvas-extra ul > li > a {
	display: block;
	padding: 8px 15px;
	font-size: 14px;
	line-height: 19px;
	color: #fff;
	text-transform: none;
	letter-spacing: normal;
	opacity: 1;
}

/* 1.1.22: text shadow of the old site (0 1px 2px #000) - more contrast */
.gn-offcanvas .offcanvas-inner a,
.gn-offcanvas .offcanvas-inner .menu-separator,
.gn-offcanvas .offcanvas-inner .menu-toggler {
	text-shadow: 0 1px 2px #000;
}

.gn-offcanvas .gn-offcanvas-extra ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.gn-offcanvas .gn-offcanvas-extra ul > li {
	border-bottom: 1px solid #2a2a2a;
}

/* Contact / social in the panel */
.gn-offcanvas .gn-offcanvas-contact,
.gn-offcanvas .gn-offcanvas-social {
	padding: 15px;
	color: #fff;
}

.gn-offcanvas .gn-offcanvas-contact a,
.gn-offcanvas .gn-offcanvas-social a,
.gn-offcanvas .gn-offcanvas-social a span {
	color: #fff;
}

.gn-offcanvas .gn-offcanvas-contact ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.gn-offcanvas .gn-offcanvas-contact li {
	display: block;
	margin: 0 0 6px;
}


/* ---------- 1.1.17: JoomShopping titles / service layouts ---------- */
.productview .gn-product-title {
	margin: 0 0 20px;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--gn-text);
}
.productview .gn-product-title .jshop_code_prod,
.productview .gn-product-title .gn-product-code {
	display: block;
	margin-top: 4px;
	font-size: 14px;
	font-weight: 400;
}
.gn-product-service .gn-service-images {
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin-bottom: 25px;
}
.gn-product-service .gn-service-image { margin: 0; }
.gn-product-service .gn-service-image img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
	border-radius: var(--gn-image-radius, 10px);
}
.gn-product-service .gn-service-videos { margin-bottom: 25px; }

/* ---------- 1.1.23: mobile menu as on the old site ----------
   Values from www.nijolesgeliunamai.lt (Nextend accordion menu):
   separators rgba(255,255,255,.33), open / current / hover item
   rgba(255,255,255,.2), small white triangles ~20px from the right edge,
   sub-items indented 23px with the same separators, close button = white
   circle with a dark cross. */
.gn-offcanvas .gn-offcanvas-close,
.gn-offcanvas .gn-offcanvas-close:hover {
	width: 24px;
	height: 24px;
	border: 0;
	border-radius: 50%;
	background: #fff;
	color: #3d3d3d;
	font-size: 12px;
	opacity: 1;
	text-shadow: none;
}
.gn-offcanvas .gn-offcanvas-close:hover { background: #e6e6e6; }

.gn-offcanvas .gn-offcanvas-search { border-bottom: 1px solid rgba(255, 255, 255, .33); }
.gn-offcanvas .gn-offcanvas-search input[type="text"],
.gn-offcanvas .gn-offcanvas-search input[type="search"],
.gn-offcanvas .gn-offcanvas-search .inputbox { border-radius: 4px; }
.gn-offcanvas .gn-offcanvas-search input[type="submit"],
.gn-offcanvas .gn-offcanvas-search button,
.gn-offcanvas .gn-offcanvas-search .button {
	margin-left: 4px;
	border-radius: 4px;
	font-size: 14px;
}

/* separators: light */
.gn-offcanvas .offcanvas-inner ul.menu > li,
.gn-offcanvas .offcanvas-inner ul.menu > li ul > li,
.gn-offcanvas .gn-offcanvas-extra ul > li {
	border-bottom: 1px solid rgba(255, 255, 255, .33);
}
.gn-offcanvas .offcanvas-inner ul.menu > li ul > li:last-child { border-bottom: 0; }
.gn-offcanvas .gn-offcanvas-extra { border-top: 1px solid rgba(255, 255, 255, .33); }

/* main items: 39px rows like the original */
.gn-offcanvas .offcanvas-inner ul.menu > li > a,
.gn-offcanvas .offcanvas-inner ul.menu > li > span {
	padding: 8px 35px 8px 15px;
	line-height: 23px;
}

/* open / current / hover item: light highlight */
.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent-open > a,
.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent-open > span,
.gn-offcanvas .offcanvas-inner ul.menu li.current > a,
.gn-offcanvas .offcanvas-inner ul.menu li.current > span,
.gn-offcanvas .offcanvas-inner ul.menu li > a:hover,
.gn-offcanvas .offcanvas-inner ul.menu li.active.current > a {
	background: rgba(255, 255, 255, .2);
	color: #fff;
}
.gn-offcanvas .offcanvas-inner ul.menu > li.active:not(.current):not(.menu-parent-open) > a {
	background: transparent;
}

/* sub-menu: same background as the panel, indented */
.gn-offcanvas .offcanvas-inner ul.menu > li ul {
	padding: 0;
	background: transparent;
	border-top: 1px solid rgba(255, 255, 255, .33);
}
.gn-offcanvas .offcanvas-inner ul.menu > li ul > li > a,
.gn-offcanvas .offcanvas-inner ul.menu > li ul > li > span {
	padding: 6px 35px 6px 28px;
	font-size: 14px;
	line-height: 22px;
	color: #fff;
}
.gn-offcanvas .offcanvas-inner ul.menu > li ul ul > li > a { padding-left: 42px; }
/* 1.1.24: lines of the sub-menu go edge to edge, only the text is indented
   (beats Helix "body.ltr .offcanvas-menu ... ul.menu > li ul { margin-left: 10px }"
   and ".sp-module ul.menu ul { margin-left: 10px }"). */
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li ul {
	margin: 0;
}

/* arrows: small triangles ~20px from the right edge (beats Helix
   "body.ltr ... .menu-toggler { right: -10px }") */
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent > a > .menu-toggler,
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent > .menu-separator > .menu-toggler,
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent > .nav-header > .menu-toggler {
	right: 8px;
	left: auto;
	padding: 10px;
	line-height: 0;
}
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent .menu-toggler::after,
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent.menu-parent-open > a > .menu-toggler::after,
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent.menu-parent-open > .menu-separator > .menu-toggler::after,
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent.menu-parent-open > .nav-header > .menu-toggler::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	font-family: inherit;
	border-style: solid;
	border-width: 4px 0 4px 6px;
	border-color: transparent transparent transparent rgba(255, 255, 255, .8);
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .6));
}
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent.menu-parent-open > a > .menu-toggler::after,
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent.menu-parent-open > .menu-separator > .menu-toggler::after,
body .offcanvas-menu.gn-offcanvas .offcanvas-inner ul.menu li.menu-parent.menu-parent-open > .nav-header > .menu-toggler::after {
	border-width: 6px 4px 0 4px;
	border-color: rgba(255, 255, 255, .8) transparent transparent transparent;
}

/* 1.1.25: work page - all photos one under another */
.productview .image_middle .gn-product-image { margin: 0 0 20px; }
.productview .image_middle .gn-product-image:last-child { margin-bottom: 0; }
.productview .image_middle .gn-product-image img {
	display: block;
	max-width: 100%;
	height: auto;
	border-radius: var(--gn-image-radius, 10px);
}

/* 1.1.26: work page photos in a full-width column (col-12); an image is not
   stretched beyond its own size and is centred. */
.productview .image_middle .gn-product-image img { margin: 0 auto; }