@font-face {
font-family: 'Helvetica Neue LT Pro Roman';
font-style: normal;
font-weight: normal;
src: local('Helvetica Neue LT Pro Roman'), url('/fonts/HelveticaNeueLTPro-Roman.woff') format('woff');
}
@font-face {
font-family: 'Helvetica Neue LT Pro Light';
font-style: normal;
font-weight: normal;
src: local('Helvetica Neue LT Pro Light'), url('/fonts/HelveticaNeueLTPro-Lt.woff') format('woff');
}

body {background: #fff; color: #6f7072; text-align: center; font-family:'Helvetica Neue LT Pro Light'; font-weight:normal; font-size: 150%}
body.login .container {background: #FFF; padding-bottom: 80px}
h1, h2, h3, h4, h5, h6 {font-family:'Helvetica Neue LT Pro Roman'}
h1 {margin-top: 15px; margin-bottom: 10px; font-weight: normal; color: #6f7072}
a {color: #000000; text-decoration: underline;}
a:hover {color: #f49b13; text-decoration: none}
#dotaznik h4 {margin-bottom: .1em}
#dotaznik ul {margin: 0; padding: 0}
#dotaznik ul li {list-style: none; padding: 4px 10px; margin-bottom: 2px}
#dotaznik ul li input {margin: 2px 5px 0 0}
#dotaznik select {padding: 4px 4px; margin-right: 10px}
#dotaznik textarea {padding: 4px 4px; font-family: arial, sans-serif; box-sizing: border-box; width: 100%}
#dotaznik .otazka {border: solid #f49b13 1px; padding: 0 20px 20px; margin: 20px 0 10px}
#dotaznik .otazka .cislo {display: block; margin: -15px 0 0; text-align: center;  float: left; width: 100%}
#dotaznik .otazka .cislo span {background: #f49b13; color: #000; font-weight: bold; padding: 4px 10px; margin: 0 auto; display: inline-block}

#katalog-aktivni-f {display: none}
#katalog-aktivni-t {color: darkblue}

table {width: 100%}
/* Tabulka kosik */
.red {color: #f49b13}
.blue {color: #34447a}
.lightblue {color: #34447a}
.old {display: none !important}
.w30 {width: 30px}
.w100 {width: 100px}
.w200 {width: 200px}
.w300 {width: 300px}
.w350 {width: 350px}
.w150 {width: 150px}
.nborder, .nborder td, .nborder th {border: none}
.cena {font-size: 113%}

table.kosik {margin-bottom: 0; width: 100%}
table.kosik th {background: #dedede; border: solid 1px #eaeaea; padding: 5px; vertical-align: middle}
table.kosik td {padding: 5px; height: 2em; vertical-align: middle}
table.kosik td img {margin: 0 5px 0 0}
table.kosik tr.odd td {background: #f2f2f3; border: solid 1px #eaeaea}
table.kosik tr.even td {background: #eaeaea; border: solid 1px #eaeaea}
table.kosik td input {width: 35px; display: block; margin: 0 auto}
table.kosik td input.button {width: 60px; margin: 0 3px 0 0; display: inline-block}
/* Tabulka kosik */

@media only screen and (min-width: 860px) {
	.col-2 {
		float: left;
		width: 50%
	}
}
/*  OBECNE TRIDY */
.navbar {border-radius: 0}
.cb {clear: both}
.tc {text-align: center}
.tl {text-align: left}
.tr {text-align: right}
.fl {float: left}
.fr {float: right}
.w50 {width: 50px}
.button {background: #f49b13; border: 1px solid #091356; padding: 3px 8px; margin-top:5px; display: inline-block; color: #fff; cursor: pointer; text-decoration: none; font-weight: 400; font-size: 1em; border-radius: 10px }
.button-gray {background: #6f7072; border: 1px solid #6f7072; padding: 3px 8px; display: inline-block; color: #fff; cursor: pointer; text-decoration: none; font-weight: 400; font-size: 1em; }

#login {text-align: center}
#login input {padding: 8px 15px; margin: 5px; }

#main {margin: 0 auto; padding: 0; max-width: 1200px; width: 100%; }

#limity {
	font-size: 1rem;
	color: #333;
	text-align: right;
	padding: 0.5rem 1rem;
}
#limity .budget1 span {
	font-weight: bold;
	color: #f49b13;
}



/* Prosor s logem, vyhledavanim, logem, kosikem */
#top {margin: 0; padding: 0; background: #FFF;}

#servmenu {z-index: 99; text-align: right; background: #fff; line-height: 30px; width: 100%; padding: 0 15px; overflow: hidden; border:none; }

#odeslatPoptavku .formular label {clear: both; float: left;}
#odeslatPoptavku .formular input {border: solid 1px #CCC; padding: 3px; border-radius: 10px}
#odeslatPoptavku .formular textarea {border: solid 1px #CCC; padding: 3px; border-radius: 10px}

#search {margin: 73px 0 20px; width: 294px; padding: 0; float: none;}  /*11-07-2025 float z right na none*/
@media only screen and (max-width: 920px) {
	#search {clear: both; margin: 10px 10px 10px 0; width: 294px;}
}
#search .inner {padding: 0; width: 294px; ; margin-right: 0;}
#search .inp {float: left; height: 40px; line-height: 40px; width: 220px; color: #6f7072; border: solid 1px #f49b13; background: transparent; padding: 0 5px; box-sizing: border-box; border-radius: 10px;}
#search input.button {width: 67px; display: block; float: right; background: #f49b13 url("/img/ico-search.png") no-repeat 50% 50%; background-size: 23px; color: #fff; height: 40px; line-height: 40px; padding: 0; border-radius: 10px; }
#search input {background: transparent; border: none}
#search .input-group-addon {background: transparent; border: none}

#logo {float: left; display: block; background: url("/img/logo.png") no-repeat 0 50%; height:120px; width: 300px; background-size: auto !important}
.logo-intro {background: url("/img/logo.png") no-repeat 0 50%; max-width: 260px; width: 50%; background-size: auto !important}
@media only screen and (max-width: 920px) {
	#logo {float: left; width: 40%; max-width: 300px; min-width: 250px; background: url("/img/logo.png") no-repeat 50% 50%; margin: 10px 0 0 10px; height: 50px; }
	.logo-intro {background: url("/img/logo.png") no-repeat 0 50%; max-width: 260px; width: 100%; background-size: auto !important}
}

#kosikContainer {
	margin: -20px 14px 10px;
	float: right;
	width: auto;
}
@media only screen and (max-width: 920px) {
	#kosikContainer {clear: both; margin: 0 10px 10px 0}
}

#limity {
	font-size: 1rem;
	color: #333;
	text-align: right;
	padding: 0.5rem 1rem;
}
#limity .budget1 span {
	font-weight: bold;
	color: #f49b13;
}


#kosik {
	float: right;
	max-width: 175px;
	width: 175px;
	height: 40px;
	display: block;
	margin: 15px 0 0 0;
	background: #f49b13 url("/img/ico-basket.png") no-repeat 15px 45%; border-radius: 10px;

	color: #fff;
	font-weight: bold;
	line-height: 14px;
	text-align: right;
	box-sizing: border-box;
	padding: 7px 10px;
	font-size: 85%
}
@media only screen and (max-width: 600px) {
	#kosik {
		width: 175px;
	}
}

#kosik .inner {margin: 0; padding: 4px 55px 0 5px}
#kosik a {color: #fff}

/* Strom - hlavni uroven */
#menu {clear: both; background: #f49b13; min-height: 50px; max-width: 1400px; width: 100%; border-radius: 10px;}
#menu a {text-decoration: none !important; color: #fff; padding: 0 15px}
#menu {clear: both; background: #f49b13; max-width: 1400px; width: 100%;}
#menu .container {width: 50%; float: left; padding: 0; margin: 0}
#menu div {padding: 0}
#menu ul {margin: 0; padding: 0}
#menu ul li a {line-height: 50px; color: #fff; margin: 0; height: 50px; display: inline-block; font-weight: bold; text-decoration: none}
@media only screen and (max-width: 600px) {
	#menu ul li {clear: left; text-align: left}
	#menu ul li a {line-height: 30px; height: 30px;}
}
#menu ul li a:hover {text-decoration: underline}
#mobilMenu {margin-left: 15px}
#menu li {list-style: none; float: left}
#menu ul ul {display: none}
#menu ul li:hover ul {display: block; position: absolute; background: #f49b13; width: 150px; z-index: 999; border-radius: 10px; }
#menu ul li:hover ul li {display: block; text-align: left; border: none; height: auto}
#menu ul li:hover ul li a {line-height: 1.2em; display: block; margin: 0; padding: 5px 10px; border: none; height: auto; font-weight: normal}
#menu ul li:hover ul li span {display: block; margin: 0; padding: 0; height: auto}
#mobilMenu {margin-left: 15px}
.menu-admin {float: right; line-height: 46px; display: block; width: auto; text-align: center; font-weight: bold; margin-right: 0 !important}
.menu-admin img {width: 24px; height: auto}
#menu ul.menu-admin li a {color: #FFF }
.prave-menu {float: right; line-height: 46px; display: block; width: 150px; text-align: center; font-weight: bold; margin-left: 0 !important}

.ui-datepicker-month {color: #000}
.ui-datepicker-year {color: #000}
/* Cesta */
.path {padding: 0 0 0 5px; font-size: 0.917em; margin: 0 0 8px}
.path a {color: #6f7072}

/* Levy sloupec */
#left {float: left; width: 20%; text-align: left;}
@media only screen and (max-width: 600px) {
	#left {float: none; width: 100%; }
}
#left h2 {margin: 0; color: #696969; font-weight: normal; padding: 10px 5px}

#tree, .panel-left {background: #b0b2b3; padding: 10px 15px; margin-bottom: 15px; border-radius: 10px; color: #FFF }
#tree ul, .panel-left ul {margin-left: 0; padding-left: 0; font-weight: 600}
#tree ul ul {display: none; margin-left: 12px; font-weight: 400}
#tree ul li.open a {}
#tree ul li.open li a {background: transparent}
#tree ul li.open ul {display: block}
#tree ul li.liOpen ul {display: block}
#tree li, .panel-left li {list-style: none; text-transform: uppercase;}
#tree li li, .panel-left li li {margin-left: 15px; clear: both; list-style-type: square; text-transform: none; border: none}
#tree li span {display: none}
#tree li a, .panel-left li a {font-weight: bold; color: #fff; padding: 5px 5px 5px 5px; display: block; text-decoration: none !important}
#tree li a:hover, .panel-left li a:hover {text-decoration: underline !important}
#tree li li a, .panel-left li li a {font-weight: normal}
#tree li li {background: none; padding-left: 0}
#tree em {font-style: normal}

#aktuality {background: #b0b2b3; margin: -10px 0 0 -40px; padding:5px 15px; margin-bottom: 15px; color: #FFF; border-radius: 10px; }
#aktuality h4 {font-weight: normal !important; font-size: 110%; color: #FFF}
#akt {margin: -20px 0 0; font-size: 85%}

/* Doklady Filtr */
.filtr {background: #b0b2b3; padding: 15px; margin-bottom: 25px}
.filtr input {float: left; margin: 8px 5px 10px 0}
.filtr ul {padding: 0; margin: 0}
.filtr ul li {clear: both; list-style: none; padding: 0; margin: 0}
.filtr ul li a {color: #fff; padding: 3px 10px 3px 0; display: block; text-decoration: none !important}
.filtr ul ul {margin: 0 0 0 15px}
.filtr ul li ul li a {font-weight: 400}
.filtr h4 {color: #FFF; font-weight: bold; margin: 15px 0 5px}
.filtr input {margin-top: 5px}
.filtr label {float: left; line-height: 30px; padding: 0; text-align: left; margin: 0 5px 0 0}

/* Oblibene produkty */
.oblibene {background: #f2f2f3; padding: 15px; margin-bottom: 25px}
.oblibene ul li {clear: both}
.oblibene ul li a {color: #231f20; padding: 3px 10px 3px 0; display: block; text-decoration: none !important; font-weight: 600}
.oblibene h4 {margin: 15px 0 5px}

/* Obsah */
#middle {clear: both; max-width: 1400px; width: 100%; margin: 0 auto; padding: 0}
@media only screen and (max-width: 600px) {
	#middle {padding: 0 20px;}
}
#cont {float: right; width: 79%; text-align: left}
@media only screen and (max-width: 600px) {
	#cont {float: none; width: 100%; box-sizing: border-box; }
	#cont .produkt {width: 100%;}
}


#intro-banner {position: relative; width: 100%; height: 320px;}
@media only screen and (max-width: 1200px) {
	#intro-banner {height: 270px;}
}

@media only screen and (max-width: 600px) {
	#intro-banner {display: none}
}
#intro-banner img {width: 100%;}
#intro-banner h1 {display: none; margin: 0; padding: 0}
#intro-banner h2 {display: none}
#intro-banner #introZalozky {position: absolute; top: 225px; left: 0; height: 21px; width: 120px; z-index: 1000}
@media only screen and (max-width: 900px) {
	#intro-banner #introZalozky {position: absolute; top: 160px; left: 0;}
}
#intro-banner #introZalozky li {float: left; list-style: none}
#introZalozky a {display: inline-block; width: 10px; height: 10px; background: #CCC; margin: 0 10px 0 0; text-decoration: none}
#introZalozky a.active {text-decoration: none; background: #FFF; color: #fff}
#intro-banner img {position: absolute; z-index: 10; top: 5px; left: 5px}
.obrCont a {margin: 0 !important; padding: 0 !important; display: inline !important}
.obrCont a img {display: block !important; margin: 0 !important; padding: 0 !important; border: none}

.obrHandler {overflow: hidden; width: 170px}
.obrHandler div {width: 1000px}

.fnpanel {clear: both; height: 22px; line-height: 22px; margin-bottom: 22px}
.fnpanel a {color: #000; text-decoration: underline}
.fnpanel a:hover {text-decoration: none}
.fnpanel a.active {color: #f49b13; text-decoration: none}
.fnpanel p {text-align: right}
.fnpanel .fr {font-size: 130%}
#top {
	background-color: #ffffff;
	padding: 1rem 2rem;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
	display: block; /* Upraveno 11.7.2025 – nahrazen flex za block kvůli hlavičce */
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}


/* Produkt vypis */
#cont .produkt {width: 25%; float: left; padding: 0 0 0 1%; box-sizing: border-box;}
@media only screen and (max-width: 600px) {
	#cont .produkt {width: 50%; }
}
@media only screen and (max-width: 380px) {
	#cont .produkt {width: 100%; padding: 0; float: none }
}
.prod {padding: 0; margin: 0 0 10px; display: inline-block; position: relative; background: #FFF; width: 100%; border: solid 1px #ccc; border-radius: 10px}
.prod:hover {background: #FFF}
.prod:hover .info {background: #fff}
.prod table {width: 100%}
.prod img {width: 88%; max-width: 200px; margin: 0 auto 10px}
.prod h3 {text-align: center; font-size: 100%; line-height: 1.2em; display: block; height: 2.4em}
.prod h3 a {color: #000}
.prod .info {padding: 10px; white-space: nowrap; overflow: hidden; box-sizing: border-box; width: 100%}
.prod .detail-odkaz {position: relative; text-decoration: none; font-weight:bold; color: #FFF; display: block; font-size: 120%; display: block; text-align: center}
.prod .detail-odkaz .stitek-sleva {position: absolute; bottom: 11px; right: 14px; width: 78px; height: 48px; background: url("/img/bkg-pikt.png") no-repeat 0 0; text-align: right; line-height: 58px; box-sizing: border-box; padding-right: 2px;}
.prod .button {float: right; border: none; width: 76px; height: 30px; font-weight: bold; text-transform: uppercase; font-size: 88%; border-radius: 10px;}
.prod .cena {line-height: 30px;}
.prod4 {margin-right: 0}
.prod table, .prod table td {margin: 0; border: none; padding: 0}
.prod .barvy {height: 24px}
.prod .barva {width: 12px; height: 12px; border: solid 1px #aaa; display: inline-block; margin: 5px 5px 5px 0}
.prod .hover {display: none}
.prod:hover .hover {display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url("../img/prod-hover.png") repeat-x 0 0}
.prod:hover .hover .dostupnost {position: absolute; top: 15px; right: 15px; display: block; width: 15px; height: 16px; background: url("../img/sklad.png") no-repeat 0 0}
.prod:hover .hover .button {display: block; width: 140px; margin: 60px auto 40px}
.prod:hover .hover .predbVyber {color: #FFF; width: 105px; background: url("../img/oblibene.png") no-repeat 0 0; padding-left: 36px; line-height: 1.1em; margin: 15px auto}

/* Detail informace */
.detailTable {float: right; width: 60%}
#detailImg {position: relative; text-decoration: none; font-weight:bold; color: #FFF; display: block; width: 220px; float: left; text-align: center;}
#detailImg img {max-width: 100%;}
#detailImg .stitek-sleva {position: absolute; bottom: 0px; right: 0px; width: 147px; height: 91px; background: url("/img/bkg-pikt-detail.png") no-repeat 0 0; text-align: right; line-height: 130px; box-sizing: border-box; padding-right: 10px; font-size: 230%}
#detailPopis {float: right; width: 245px}
#detailCena {border: solid 1px #bababa; width: 100%}
#detailCena td {padding: 10px 15px}
#detailCena input {width: 30px}
#detailCena .button {width: auto}
#detailObrazky img {border: solid 1px #bababa}
#detailPripojene img {float: left; margin: 15px 15px 15px 0; display: inline}

@media only screen and (max-width: 600px) {
	#detailPopis {width: 100%; clear: both;}
	#detailImg {width: 100%;}
	#detailImg img {width: 100%;}
	.detailTable {width: 100%}
}

/* Tabulka variant Detail produktu*/
table {margin-bottom: 5px; width: 100%}
table th {background: #dedede; border: solid 1px #eaeaea; padding: 5px}
table.varianty th div {height: 2em}
table td {padding: 5px; vertical-align: middle; border: solid 1px #eaeaea}
table.varianty tr.odd td {background: #f2f2f3; border: solid 1px #eaeaea}
table.varianty tr.even td {background: #eaeaea; border: solid 1px #eaeaea}
table.varianty td input {width: 35px; display: block; margin: 0 auto}

#cont .buttonVarianty {float: left; margin: 0 20px 30px 0; background: #f49b13; border: 1px solid #f49b13; padding: 8px 15px; display: inline-block; color: #fff; cursor: pointer; text-decoration: none; font-weight: 400; font-size: 1.2em}
#cont .buttonVarianty:hover {background: #f49b13}

/* Tabulka doklady */
table.tableDoklady {width: 100%; background: #FFF; border: solid 10px #FFF; font-size: .9em; margin-bottom: 1em}
table.tableDoklady th {border: none; border-bottom: 2px solid #dddddd; padding: 3px 5px; vertical-align: middle; color: #231f20; font-weight: 600}
table.tableDoklady td {border: none; border-bottom: 1px solid #dddddd; font-size: .85em; padding: 3px 5px; vertical-align: middle}

#cart {margin: 55px 0 0; float: right; width: 200px; height: 72px; background: url("../img/kosik.png") no-repeat 0 0}
#cart .inner {padding-left: 70px}
#cart span {display: block}

#hlavniObrazek {margin: 0 0 25px; float: left}
#infoDetail {float: right; width: 56%}
#infoDetail table {width: 100%}
table.ceny {margin: 18px 0; font-size: 1.2em}

#registrace label, #formular label, .formular label  {width: 150px;}
#registrace input, .formular input {text-align: left !important; }

/* FOOTER */
#footer {background: #fff; clear: both; text-align: right; color: #969696; margin: 0 auto 60px; width: 100%; max-width: 1400px; border: solid 1px #ddd; padding: 10px; display: block; border-radius: 10px}
#footerLinks a {padding-left: 20px;	color: #969696}
#footerLinks a:hover {color: #f49b13}

/* COOKIES */
.cc_container {background: #c2c2c2 none repeat scroll 0 0 !important; color: #000 !important; text-align: left !important;}
.cc_container .cc_btn {background-color: #FFF !important; display: inline-block !important;	text-align: left; float: none !important;}
.cc_container .cc_message {float: left !important; padding-left: 20px !important;}
.cc_container .cc_logo {display: none !important;}
.cc_container .cc_btn:hover {background-color: #FFFF00 !important;}