:root {
  --eb-kangaroo-green: /*#6eb43f*//*#94b248*/#87b43b;
  --eb-kangaroo-green-dark: #476025;
  --eb-kangaroo-gray: #f0f0f0;
  /* použití př.
    var(--eb-kangaroo-green)
  */
}

* { padding: 0; margin: 0; }

/******************************************************************************/

input, textarea, select { font-family: oswald, tahoma; font-size: 1em; }
input, textarea, select { padding: 4px 5px; }
select option[disabled="disabled"] { color: #990033; }
fieldset { background: rgba(230, 230, 230, 0.25); border: 1px solid #dedede; border-radius: 5px; float: left; margin-right: 10px; padding: 5px 10px; }
fieldset legend .fa { color: #aaa; padding: 0 2px; }
fieldset legend .fa:hover { color: #444; }
ul { list-style: none; }
ul li::before {content: "•"; color: var(--eb-kangaroo-green); display: inline-block; margin-left: -1em; width: 1em; }

#jprev, #jnext { display: none; }

.responsive-design { font-size: 1em; }

/******************************************************************************/

.ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: oswald; font-size: 1em; }
.custom-combobox-toggle { margin: -2px 0 0 1px; padding: 8px 2px 8px 1px; }

a[href^="tel"] { color: inherit; text-decoration: none; }
a[x-apple-data-detectors] { color: inherit !important; text-decoration: none !important; font-size: inherit !important; font-family: inherit !important; font-weight: inherit !important; line-height: inherit !important; }

/******************************************************************************/

.highlight { color: var(--eb-kangaroo-green); }
.highlight2 { color: #ab7442; }
.nu { text-decoration: none; }
.nu:hover { text-decoration: underline; }
.un { text-decoration: underline; }
.un:hover { text-decoration: none; }
.nn { text-decoration: none; }
.nn:hover { text-decoration: none; }
.nc { text-decoration: none; }
.nc:hover { color: #eb2332; color: #1aa9e6; }
.ui-tooltip { background: #444; border: 0; border-radius: 2px; box-shadow: none; color: #fff; font-family: oswald; font-size: 12px; }
.hidden { display: none; }
.clear { clear: both; }
.text-shadow { text-shadow: 1px 2px 3px #222; }
.center { text-align: center; }
.uppercase { text-transform: uppercase; }
.go-back { display: inline-block; margin-top: 3em; text-transform: lowercase; margin-bottom: 1em; }

/******************************************************************************/
/* tlačítka */

.button-black { background: #000; border: 3px solid #000; color: #fff; cursor: pointer; padding: 5px 30px; text-align: center; }
.button-black:hover { background: #111; }
.button-gold { background: #fecb04; border: 3px solid #fecb04; color: #000; cursor: pointer; padding: 5px 30px; text-align: center; }
.button-gold:hover { background: #edba03; }
.button-white { background: #fff; border: 3px solid #aaa; color: #666; cursor: pointer; padding: 5px 30px; text-align: center; }
.button-white:hover { background: #eee; }

/******************************************************************************/
/* tabulka */

.table tr th, .table tr td { padding: 5px 15px; }
.table tr th, .table thead tr td, .table tr.th td { background: #81ba25; color: #fff; font-weight: bold; }

.table2 tr th, .table2 tr td { padding: 5px 15px 5px 0; }

/******************************************************************************/
/* hlášky */

.msg-ok { background: var(--eb-kangaroo-green); color: #fff; margin-bottom: 1em; padding: 5px 15px; }
.msg-error { background: #c00; color: #fff; margin-bottom: 1em; padding: 5px 15px; }
.msg-ok a, .msg-error a { color: #fff; }

/******************************************************************************/
/* blok */

.wrap1 { clear: both; float: left; position: relative; width: 100%; }
.wrap2 { margin: 0 auto; position: relative; width: 1260px; }
.content { float: left; padding: 50px 0; position: relative; width: 100%; }

.wrap-title { border-bottom: 1px solid #999; width: 50%; }
.wrap-title .title { border: 1px solid #999; border-bottom: 0; display: inline-block; left: calc(100% - (1260px / 2) + 25px); padding: 3px 15px; position: relative; text-transform: uppercase; }

/******************************************************************************/
/* plášť hlavičky */

#wrap-head { background: #fff; position: absolute; top: 0; z-index: 9; }
#wrap-head { position: absolute; }
.scroll-top { position: fixed; }
.scroll { position: fixed; margin-top: 37px; }

/******************************************************************************/
/* jazyky */

#lang .content { font-size: 12px; padding: 5px 0; text-align: right; }
#lang { background: #fff; }

#lang a { display: inline-block; line-height: 1em; margin-left: 5px; text-decoration: none; }
#lang a img { vertical-align: middle; }

/******************************************************************************/
/* hlavička */

#head { background: #fff; }
#head .content { margin-bottom: 30px; padding: 10px 0 0 0; }
#head .address, #head .phone, #head .facebook { display: inline-block; margin: 0 30px 0 0; vertical-align: middle; }
#head .dpmb { font-size: 1.4em; margin: 0 auto; vertical-align: bottom; }
#head .search-contact { display: inline-block; vertical-align: bottom; float: right; max-width: 315px; margin-top: 3px;}
#head .search-contact .search-box { float: right; margin-top: 10px; }
#head .search-contact .search-box input { min-width: 250px; padding: 1px 5px; border: 1px solid #000; margin-right: 20px; text-transform: uppercase; border-radius: 0; -webkit-appearance: none; }
#head .search-box i {font-size: 24px;}
#head .search-box button { background: #fff; border: 0; }
#head .search-box button:hover { cursor: pointer; }
#head .search-contact .contact-box { /*margin-bottom: 20px;*/ float: right; margin-left: -20px; }
#head a { text-decoration: none; }

.head-icon-circle { padding: 5px 7px; margin-right: 3px; background: #000; color:#fff; border-radius: 50%; text-align: center; font-size: x-small; }
.contact-box span {margin-left: 5px;}

/******************************************************************************/

#head-box {}

.head-box { display: inline-block; margin: 0 30px 0 0; vertical-align: top; }
.head-box:first-child { width: calc(30% - 1px); }
.head-box:nth-child(2) { width: calc(40%);  vertical-align: bottom; margin-bottom: 5px; text-align: center; }
.head-box:last-child { width: calc(30% - 6px); }
.head-box{ margin-right: 0; }
.head-box img { height: auto; }


/******************************************************************************/
/* rychlé ikony */
.animation .text { display: none; margin-top: 10px; margin-left: 75px; text-decoration: none!important; color: black; font-size: 18px; width: 220px; background: var(--eb-kangaroo-green); color: #fff; padding: 5px; padding-left: 15px; }
.animation:hover {color: black; text-decoration: none!important; background-color: transparent; padding-left: 90px; transition: all .3s 0s; width: 200px; }
.animation:hover .text { display: block;}

.faster-phone { color: white; background-color: #000; width: 35px; height: 35px; text-align: center; padding: 15px; border-radius: 120px; position: absolute; right: 30px; top: 270px; position: fixed; z-index: 50000; margin-right: 25px; }
.faster-phone:hover { margin-right: 120px; }
.fast-phone { display: inline-block; height: 65px; position: absolute; right: 40px; top: 270px; width: 85px; z-index: 90000; }
.fast-phone { position: fixed; }

.faster-mail { color: white; background-color: #000; width: 35px; height: 35px; text-align: center; padding: 15px; border-radius: 120px; position: absolute; right: 30px; top: 355px; position: fixed; z-index: 50000; margin-right: 25px; }
.faster-mail:hover { margin-right: 120px; }
.fast-mail { display: inline-block; height: 65px; position: absolute; right: 40px; top: 355px; width: 85px; z-index: 90000; }
.fast-mail { position: fixed; }

/******************************************************************************/
/* logo */

#logo { display: inline-block; margin-right: 90px; text-decoration: none; vertical-align: middle; }

/******************************************************************************/
/* menu */

#menu { background: #1c1c1c; color: #fff; text-transform: uppercase; display: block; line-height: 1em; margin: 0; padding: 10px; position: relative; text-align: center; }
#menu li { display: inline-block; list-style: none; margin: 0; }
#menu li::before { content: ""; display: none; }
#menu li a { color: #fff; display: block; padding: 10px 50px; text-align: center; text-decoration: none;  font-size: 1.2em;}
#menu li a:hover, #menu li a.active { color: var(--eb-kangaroo-green); transition: 0.2s; }
#menu li a.active { font-weight: bold; }
#menu li.icon { display: none; }

/* submenu */
#menu li ul { background: rgba(135, 180, 59, 0.95); margin: 0; padding: 0; position: absolute; visibility: hidden; z-index: 3; }
#menu li.active ul:hover { border-top: 0; }
#menu li ul li { display: block; float: none; margin: 0; width: auto; }
#menu li ul li a { color: #fff; display: block; padding: 10px 60px 10px 20px; text-align: left; }
#menu li ul li a:link, .menu li ul li a:visited { width: auto; }
#menu li ul li a:hover, #menu li ul li a.active { background: none; color: #000; }
#menu li ul li a.active { font-weight: bold; }

/******************************************************************************/
/* slider */

#subpage #slider { display: none; }
#slider { margin-top: 205px; position: relative; z-index: -1; }
#slider .wrap2 { width: 100% !important; }
#slider .content { overflow: hidden; padding: 0; position: relative; }
#slider .content ul li { list-style: none; }
#slider .content ul li a { display: inline-block; width: 100%; }

#slider .title { color: #fff; font-size: 6em; font-weight: bold; left: calc((100% - 1260px) /2); line-height: 1.25em; position: absolute; text-transform: uppercase; top: 20vh; z-index: 2; }

.slider-box { position: absolute; width: 650px; top: 75px; left: 49%; padding: 5px 30px; margin-left: -325px; font-size: 3em; line-height: 1.5em; color: #fff; font-weight: bold; text-align: center; background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4) 15%, rgba(0, 0, 0, 0.4) 85%, rgba(0, 0, 0, 0)); }

/******************************************************************************/
/* obsah - homepage */

#content { background: #fff; }

#homepage #content .content { padding: 0; }

#subpage #content { margin-top: 265px; }

#breadcrumbs { margin-bottom: 1em; margin-top: 1em; }
#content ul li { line-height: 1.75em; }

/******************************************************************************/
/* fotografie */

.wrap-photo { }
.photo { display: inline-block; margin: 6px 6px; }
.photo img { height: auto; vertical-align: top; width: 150px; }
.photo:hover img { opacity: 0.95; }

/******************************************************************************/
/* foto - reference detail */
.reference-detail { }
.reference-detail .photo { display: inline-block; margin: 10px; width: calc(33% - 19px);}
.reference-detail .photo img { height: auto; vertical-align: top; width: 100%; }
.reference-detail .photo:hover img { opacity: 0.95; }

/******************************************************************************/
/* box na HP */

#box-on-hp {}

.box-on-hp { display: inline-block; margin: 0 30px 30px 0; vertical-align: top; width: calc(33% - 18px); }
.box-on-hp:last-child { margin-right: 0; }
.box-on-hp img { height: auto; width: 100%; }
.box-on-hp .title { font-weight: bold; margin-bottom: .5em; text-transform: uppercase; }
.box-on-hp .text { padding-top: 20px; position: relative; text-align: center; }
.box-on-hp .button-gold { bottom: 20px; position: absolute; }
.box-on-hp .button-white { bottom: 20px; position: absolute; right: 20px; }

/******************************************************************************/
/* reference */

#references {}

.references { display: inline-block; margin: 0 30px 30px 0; vertical-align: top; width: calc(33% - 16px); position: relative; }
/*.references:nth-child(4) { margin-right: 0; }*/
.references a { text-decoration: none;}
#references .third { margin-right: 0; }
/*.references:nth-of-type(3n+4)  { margin-right: 0; }*/
/*.references:last-of-type { margin-right: 0; }*/
.references img { height: auto; width: 100%; }
.references .title { font-weight: bold; margin-bottom: .5em; text-transform: uppercase; }
.references:hover .text { background: rgba(255,255,255,0.9); transition: background 0.4s; height: 60px; transition: height 0.4s; padding-top: 30px; transition: padding 0.8s;}
/*.references:hover .title { color: #fff; }*/
/*.references:hover .title { color: var(--eb-kangaroo-green); }*/
/*.references .text { padding-top: 20px; position: relative; text-align: center; }*/
.references .photo { margin: 0; }
.references .text {position: absolute; text-align: center; background: rgba(255,255, 255, 0.5); width: 100%; bottom: 0;}

#references .more { float: right; color:#595959; }
#references .more:hover i { color: var(--eb-kangaroo-green); }

.references-video { margin: 0px 0 25px 0; }
.references-video .video { width: calc(50% - 15px); display: inline-block; vertical-align: top; text-align: center; }
.references-video .video:first-child { padding-right: 30px; }
/*.references-video iframe { padding: 5px; }*/


/******************************************************************************/
/* video */

#video-yt { }
body.version-a #video-yt, #video-yt .content { background: var(--light-grey); }
#video-yt .content { padding-bottom: 20px; }

#video-mobile { display: none; }

/*
.video-container { display: flex; justify-content: center; flex-wrap: wrap; margin-top: 35px; column-gap: 25px; }
.video-container p { width: 100%; height: 100%; }
.video { display: flex; justify-content: center; align-items: center; flex: 1; min-height: 300px; }
.video:first-of-type { justify-content: left; }
.video:last-of-type { justify-content: right; }
*/

.video-container { margin-top: 15px; }
.video-container p { width: 100%; height: 100%; }
.video-yt { display: inline-block; width: 480px; height: 360px; }
.video-yt:nth-of-type(3n) { margin-right: 0; }

#background-video { /*width: 640px;*/ height: 360px; position: relative; width: 100%; }
#background-video iframe { width: 100%; height: 100%; display: none; }
#background-video .play-btn { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; font-size: 0px; line-height: 0px; background: url(https://www.pokerman.cz/img/playbutton.png) center center no-repeat; background-size: 120px auto; }
#background-video:hover .play-btn { background-color: rgba(0, 0, 0, 0.4); }
#background-video .title {   position: absolute; bottom: -52px; left: 0; width: calc(100% - 10px); color: #000; background: #eee; padding: 5px; text-align: center; min-height: 40px; border-top: 2px solid #999; line-height: 1.25em; display: flex; justify-content: left; align-items: center; }


/******************************************************************************/
/* kategorie na HP */

#categories {}

.categories { display: inline-block; margin: 0 30px 30px 0; vertical-align: top; width: calc(25% - 26px); }
.categories:last-child { margin-right: 0; }
.categories img { height: auto; width: 100%; filter: hue-rotate(85deg); }
.categories:hover img { filter: hue-rotate(0); transition: 0.2s;}
.categories:hover .text { color: var(--eb-kangaroo-green); transition: 0.2s;}
.categories a { text-decoration: none;}
.categories .title { font-weight: bold; margin-bottom: .5em; text-transform: uppercase; margin-top: 50px; font-size: 1.5em;}
.categories .text { color: #000; padding-top: 20px; position: relative; text-align: center; }
.categories .button-gold { bottom: 20px; position: absolute; }
.categories .button-white { bottom: 20px; position: absolute; right: 20px; }
.categories p { line-height: 1.35em; }

/******************************************************************************/
/* rychlé vyhledávání na HP */

#fast-search { background: var(--eb-kangaroo-gray); text-align: center; }
#fast-search h1 { text-align: center; text-transform: uppercase; margin-bottom: -5px; }
#fast-search p { text-align: center; }
#subpage .fast-search-title { display: none; }
#subpage #fast-search .content { min-height: auto; text-align: center; padding: 25px 0; }

/*the container must be positioned relative:*/
.custom-select { position: relative; display: inline-block; }
.custom-select select { display: none; }
.select-selected { background-color: var(--eb-kangaroo-green); }

/*style the arrow inside the select element:*/
.select-selected:after { position: absolute; content: ""; top: 20px; right: 10px; width: 0; height: 0; border: 6px solid transparent; border-color: #fff transparent transparent transparent; }

/*point the arrow upwards when the select box is open (active):*/
.select-selected.select-arrow-active:after { border-color: transparent transparent #fff transparent; top: 7px; }

/*style the items (options), including the selected item:*/
.select-items div,.select-selected { color: #000; padding: 8px 16px; border: 1px solid transparent; border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent; cursor: pointer; user-select: none; }

/*style items (options):*/
.select-items { position: absolute; background-color: var(--eb-kangaroo-green); top: 100%; left: 0; right: 0; z-index: 99; }
.select-items div { padding: 0 16px; }

/*hide the items when the select box is closed:*/
.select-hide { display: none; }

.select-items div:hover, .same-as-selected { background-color: rgba(0, 0, 0, 0.1); }

#fast-search input { height: 50px; width: 160px; color: #fff; background: #000; border: none; text-transform: uppercase; border-radius: 0; -webkit-appearance: none;}
#fast-search input:hover { cursor: pointer; }

.search-term { background: var(--eb-kangaroo-gray); padding: 15px 0px 15px 10px; }

/******************************************************************************/
/* parallax na hlavní stránce */

#parallax h1, #parallax h2 { font-weight: bold; text-align: center; color: #fff; text-transform: uppercase; }
.parallax { background-image: url("../img/mhd_parallax.jpg"); min-height: 500px; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: auto; }
.parallax-content { padding-top: 100px; padding-bottom: 100px; }
.parallax h1 { font-size: 80px; margin-bottom: 0px; }
.parallax h2 { font-size: 50px; }

/******************************************************************************/
/* ikony */

#icon { background: #fff; }
#icon .content { padding: 0 0 50px 0; text-align: center; }

.icon { display: inline-block; margin: 30px; padding: 0; position: relative; text-align: left; vertical-align: top; width: calc(100%/3 - 60px); }
.icon img { float: left; margin: 0 30px 0 0; }
.icon .wrap { float: left; width: calc(100% - 90px); }
.icon .title { display: block; font-weight: bold; margin: 0 0 1em 0; text-transform: uppercase; }

/******************************************************************************/
/* fotky na HP */

#photo-on-hp .wrap2 { width: 100%; }
#photo-on-hp .content { background: #eee; padding: 0 0 50px 0; }

.photo-on-hp { background-position: center center; background-repeat: no-repeat; background-size: cover; height: calc(20vw/384 * 260); display: inline-block; vertical-align: top; width: 20%; }

/******************************************************************************/
/* mapa */

#map-title { }
#map-title .content { font-size: 50px; font-weight: bold; padding: 100px 0; text-align: center; }

#map { position: relative; text-align: center; }
#map .wrap2 { width: 100%; }
#map .content { padding: 0; }

#google-maps { }
#google-maps iframe { pointer-events: none; }

/******************************************************************************/
/* tabulka formulář */

.table-form { }
.table-form td { padding: 5px 10px 5px 0; }
.table-form td input[type="text"], .table-form td input[type="password"], .table-form td input[type="number"], .table-form td textarea, .table-form td .ui-autocomplete-input, .table-form td select { width: 300px; }
.table-form td textarea { height: 108px; }
.table-form td select.code { width: 65px; }
.table-form td input[type="text"].phone { width: 232px; }

/******************************************************************************/
/* e-shop */

.wrap-left { float: left; margin-right: 25px; width: 275px; }
.wrap-right { float: right; width: calc(100%); overflow: hidden; }

/******************************************************************************/
/* menu - e-shop kategorie */

.menu-ec { display: block; line-height: 1em; padding: 0; position: relative; text-align: center; }
.menu-ec li { display: inline-block; list-style: none; margin: 0 0 3px 0; text-transform: uppercase;}
.menu-ec li::before { content: ""; display: none; }
.menu-ec li a { color: #000; display: block; padding: 10px 35px; text-decoration: none; }
.menu-ec li a:hover, .menu-ec li a.active { color: var(--eb-kangaroo-green); transition: 0.2s; }
.menu-ec li a:hover i, .menu-ec li a.active i { color: #000; }
.menu-ec li a.active { font-weight: bold; }
.menu-ec li.icon { display: none; }
.icon-tram { margin-bottom: 5px; height: 22px; margin-right: -5px; }

.menu-ec.level2 { padding: 0 0 0 20px; }
.menu-ec.level2 li { }

/******************************************************************************/
/* filtr */

.filter2 { background: var(--eb-kangaroo-gray); clear: both; margin-bottom: 1em; padding: 12px 25px; }
.filter2 .group { display: inline-block; margin-right: 30px; }
.filter2 .group:last-child { margin-right: 0; }
.filter2 a { margin-right: 5px; }
.filter2 a:hover, .filter2 a.active { color: var(--eb-kangaroo-green); text-decoration: none; }
.filter2 .fa { font-size: 14px; }
.filter2 .paging { display: inline-block; }
.filter2 .paging a { text-decoration: none; }
.filter2 .page-active { color: var(--eb-kangaroo-green); }

/******************************************************************************/
/* eshop - seznam produktů */

.ul-ep { }
.ul-ep .li { background: #f9f9f9; display: inline-block; margin: 0 50px 75px 0; padding: 20px; width: calc(25% - 78px); position: relative; overflow: hidden; }
.ul-ep .edge { margin-right: 0; }
.ul-ep .li:hover { background: var(--eb-kangaroo-green); transition: 0.2s; }

.ul-ep .li .img { background-position: center center; background-repeat: no-repeat; display: block; height: 250px; text-align: center; }

.ul-ep .li .title { color: #000; display: block; text-transform: uppercase;}
.ul-ep .li .price { color: var(--eb-kangaroo-green); }

.ul-ep .li:hover .title, .ul-ep .li:hover .price { color: #fff; }

.ul-ep .li .perex { display: block; margin: 0.5em 0; color: #3d3d3d;}
.ul-ep .li .wrap-amount { text-align: center; }
.ul-ep .li .button-shoping-cart { clear: both; padding: 0; text-align: center; width: 115px; height: 30px; }

.separator { border-top: 3px solid #fff; height: 1px; margin: 0.5em 0; }
.separator-black { border-top: 2px solid #707070; height: 1px; margin: 1em 18em; }
.amount { padding: 5px 5px; text-align: center; width: 60px; }
.button-shoping-cart, .submit-button { background: #000; border: 0; color: #fff; text-transform: uppercase; cursor: pointer; display: inline-block; padding: 7px 12px; text-decoration: none; }
.button-shoping-cart:hover { background: #333; }
/* probliknutí boxu s produktem po jeho přidání do košíku var(--eb-kangaroo-green)*/
.blink { background: #a9d65d!important; transition: 0.2s; }
.line-through { text-decoration: line-through; }

/* klasické dlaždice */
.list0 .li .perex { margin-top: 3px; margin-bottom: 1em; }
.list0 .li .price { text-align: left; color: var(--eb-kangaroo-green); width: 50%; margin-top: 5px; }
.list0 .li .wrap-amount { margin-bottom: 0.5em; }
.list0 .li .amount { width: calc(100% - 30px); }
.list0 .li .price_and_ask { display: flex; }
.list0 .li .title { text-align: center; margin-top: 1em; }
.list0 .li .perex { text-align: center; }
.list0 .li .img { background-size: contain; }

/* dlaždice přes celou šíři */
.list1, .list2 { width: 100%; }
.list1 .li, .list2 .li { padding: 3%; width: calc(94%); }
.list1 .left, .list2 .left { float: left; margin-right: 5%; width: 20%; }
.list1 .li .img, .list2 .li .img { clear: both; float: left; height: 150px; width: 100%; }
.list1 .right, .list2 .right { float: left; width: 75%; }
.list1 .li .wrap-amount, .list2 .li .wrap-amount { display: inline-block; margin-right: 25px; }
.list1 .li .button-shoping-cart, .list2 .li .button-shoping-cart { display: inline-block; width: 150px; }
.list1 .li .img { background-size: contain; }

/* dlaždice přes celou šíři - bez popisu */
.list2 .li { padding: 2%; width: 96%; }
.list2 .li .img { height: 100px; background-size: contain; }
.list2 .li .perex { display: none; }

/******************************************************************************/
/* eshop - detail produktu */

.ep-perex { color: #3d3d3d; margin-bottom: 1em; }

.ep-left { float: left; width: 250px; }
.ep-right { float: right; width: calc(100% - 275px); }

.ep-left img { height: auto; width: 100%; }

.ep-detail .price { font-size: 2em; font-weight: bold; margin: 0.5em 0; color: var(--eb-kangaroo-green); }
.ep-detail .wrap-basket { background: var(--eb-kangaroo-gray); padding: 10px 15px; text-align: center; position: relative; overflow: hidden; }
.ep-detail .wrap-basket .item { display: inline-block; margin: 5px 15px; }
.ep-detail .wrap-basket .button-shoping-cart { background: var(--eb-kangaroo-green); }

/* foto */
.photo-ep { border: 1px solid #ccc; display: inline-block; margin-bottom: 7px; vertical-align: bottom; }
.photo-ep:hover { border: 1px solid #000; }
.photo-ep img { height: auto; width: 100%; }
.photo-ep.thumb img { height: auto; width: 145px; }
.photo-ep.thumb { margin: 0 7px 7px 0; }

.eshop-info {width: 100%; margin-bottom: 20px; }
.eshop-info div:first-child { min-width: 80px;}
.eshop-info div:last-child { width: calc(100% - 80px); text-align: left; }
.eshop-info div { display: inline-block; vertical-align: middle; }
/*.eshop-info div i { margin-right: 25px; }*/

/******************************************************************************/
/* překrytí - přidáno do košíku */

.product_inner {
  display: -webkit-box;
  display: block;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-flow: column wrap;
}

.product_overlay {
  background: rgba(255, 255, 255, 0.9);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  -webkit-transform: translateY(-500px);
          transform: translateY(-500px);
  opacity: 0;
  display: -webkit-box;
  display: block;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-flow: column wrap;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-align: center;
          align-items: center;
}

.wrap-basket .product_overlay {
    -webkit-transform: translateY(-75px);
            transform: translateY(-75px);
}

.product_overlay h2 {
  color: rgba(43, 45, 66, 0.7);
  font-size: 1.2em;
  text-align: center;
  display: block;
  margin-top: 70%;
}

.wrap-basket .product_overlay h2 { margin-top: 0; }

.product_overlay i {
  font-size: 1.5em;
  margin: 15px 45%;
  color: var(--eb-kangaroo-green);
}

.wrap-basket .product_overlay i { margin: 5px 45%; }


/******************************************************************************/
/* karty vlastností */

.ul-properties { border-bottom: 1px solid #ccc; margin: 0; padding: 0; }
.ul-properties li { display: inline-block; }
.ul-properties li::before { content: ""; display: none; }
.ul-properties li a { background: #ddd; background: var(--eb-kangaroo-green); border: 1px solid #eee; border-bottom: 0; display: inline-block; margin-right: 5px; padding: 5px 30px; text-decoration: none; position: relative; top: 1px }
.ul-properties li a:hover, .ul-properties li a.active { background: #fff; border: 1px solid #ccc; border-bottom: 0; }
.ul-properties li a.active { font-weight: bold; }

/* vlastnosti - popis */
.properties { display: none; min-height: 200px; }
.properties.active { display: block; }

/******************************************************************************/

/* technická specifikace */
.table-specification { border-collapse: collapse; margin-bottom: 5em; width: 100%; }
.table-specification tr td { background: #f7f7f7; border-bottom: 1px solid #eee; border-top: 1px solid #eee; padding: 7px 30px; }
.table-specification tr:nth-child(even) td { background: none; }
.table-specification tr td.subtitle { background: #ddd; }

/* ke stažení */
.download { background: #eee; padding: 30px; margin-bottom: 1em; }
.download ul { margin: 0; padding: 0; }
.download ul li { list-style: none; }
.download ul li span { margin-right: 5px; }

/******************************************************************************/
/* košík */

.table-basket { border-collapse: collapse; margin-bottom: 1px; min-width: 800px; width: 100%; }
.table-basket tr th, .table-basket tr td { border: 3px solid #ccc; font-weight: normal; padding: 13px 13px; }
.table-basket tr th, .table-basket tr td { }
.table-basket tr td.title { }
.table-basket tr td .img { background-position: center center; background-repeat: no-repeat; background-size: contain; display: inline-block; height: 50px; width: 50px; }
.table-basket tr td.pc { border-left: 3px double #ddd; }
.table-basket tr td #pc  { width: 35px; }
.table-basket tr td #operating_time { width: 90px; }
.table-basket tr td #term { width: 110px; }

.table-basket.small { font-size: 0.9em; }
.table-basket tr td.td-thumb a { display: inline-block; }
.table-basket tr td.td-thumb a img { max-height: 100px; vertical-align: bottom; width: auto; }

.wrap-basket-form { background: #eee; border-top: 1px solid #ccc; margin-bottom: 20px; padding: 20px; }
.wrap-basket-form { border-top-left-radius: 0; }
.wrap-basket-form table { width: 100%; }
.wrap-basket-form table table tr td:first-child { width: 110px; }
.wrap-basket-form table table tr td { padding: 0 0 10px 0; }
.wrap-basket-form input, .wrap-basket-form textarea { border: 1px solid #ccc; padding: 10px 5%; width: 80%; }
.wrap-basket-form textarea { height: 170px; width: 90%; }

.rwd-table tr td #pc  { width: 35px; }
.rwd-table tr td #operating_time { width: 90px; }
.rwd-table tr td #term { width: 125px; }
.rwd-table tr:first-child { background: #000; }
.rwd-table tr:last-child { font-weight: bold; }
.rwd-table tr { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; }
.rwd-table th { display: none; }
.rwd-table td { display: block; }
.rwd-table td:first-child { padding-top: .5em; }
.rwd-table td:last-child { padding-bottom: .5em; }
.rwd-table td:before { content: attr(data-th) ""; font-weight: bold; width: 9em; display: inline-block; }
.rwd-table td.reg::before { width: auto; }
.rwd-table a.title { font-weight: normal; letter-spacing: -1px; color: black; }
.rwd-table { background: var(--eb-kangaroo-gray); color: #000; overflow: hidden; width: 100%; font-size: 0.9em;}
.rwd-table tr { border-color: black;}
.rwd-table th, .rwd-table td { margin: .5em 1em; }
.rwd-table img { max-height: 60px; }

/* zarovnani obsahu doprava */
.rwd-table td.right, .rwd-table th.right { text-align: left; }
.rwd-table th, .rwd-table td:before { color: #000; }
.rwd-table th, .rwd-table td { text-align: left; }

.wrap-submit { text-align: center; }
.wrap-submit input { background: #fbb900; border: 0; color: #000; cursor: pointer; font-weight: bold; padding: 10px 20px; }

#fast-basket { font-size: 17px; }

/******************************************************************************/
/* tabulka block s údaji pod košíkem */

.ac-block { float: left; margin-bottom: 3em; width: 100%; background: var(--eb-kangaroo-gray); padding: 50px 0px;}

.table-block { max-width: 400px; width: 95%; margin: 0 auto;}
.table-block td { padding: 5px 10px 5px 0; }
.table-block td.width { width: 100px; }
.table-block td input[type="text"], .table-block td input[type="email"], .table-block td input[type="tel"]  { width: calc(100% - 23px); padding: 10px 10px; border: 2px solid #ddd; border-radius: 5px; }
.table-block td input:focus { border: 2px solid var(--eb-kangaroo-green); }
.table-block td input:required { border: 2px solid #999; }
.table-block td textarea[name="comment"] { width: calc(100% - 12px); padding: 10px 10px; border: 2px solid #ddd; border-radius: 5px; }
.table-block td textarea[name="comment"]:focus { border: 2px solid var(--eb-kangaroo-green); }
.table-block input[type="text"].street { float: left; margin-right: 8px; width: calc(70% - 20px); }
.table-block input[type="text"].number { width: calc(30% - 12px); }

table tr td input[name="odeslatPoptavku"] { border-radius: 5px; background: var(--eb-kangaroo-green); border: none; color: #fff; padding: 10px; font-size: 1em; text-transform: uppercase; border-radius: 0; -webkit-appearance: none;}
table tr td input[name="odeslatPoptavku"]:hover { background: #65a219; transition: 0.2s; cursor: pointer; }

/******************************************************************************/
/* objednávka */

.block { background: #eee; clear: both; float: left; margin-bottom: 2em; padding: 20px; width: calc(100% - 40px); }
.comment { padding: 5px; width: calc(100% - 12px); }

/******************************************************************************/
/* kontakt */

#contact { background: #ac7443; }
#contact .content { background: #bc9069; padding: 50px 25px 50px 25px; width: calc(100% - 50px); }
#contact, #contact a, #contact .h1 { color: #fff; }

.co1, .co2, .co3 { display: inline-block; vertical-align: top; width: 33%; }
.co1 img { height: auto; margin: 1em 0 0 0; max-width: 315px; width: 80%; }
.co2 { }
.co3 { padding: 0 0 0 50px; width: calc(33% - 50px); }
.co3 h3 { font-size: 1.5em; }

/******************************************************************************/
/* poptávkový formulář - vazníky */

#bouncers { background: #eee; border-top: 1px solid #aaa; }

.demand-form input, .demand-form select, .demand-form textarea { border: 1px solid #aaa !important; }
.demand-form .wrap-input { background: #fff; border: 1px solid #aaa; padding: 10px 3%; text-align: left; }
.demand-form .wrap-input input[type="file"] { width: 85%; }

/******************************************************************************/
/* kontaktní formulář */

.contact-form { position: relative; text-align: center; margin-top: 1em; }
.contact-form-block { padding: 50px 0px; width: 100%; background: #f1f1f1; margin-bottom: 3em;}
.contact-form .h1 { color: #fff !important; }

.table-block td textarea[name="cf_text"] { width: calc(100% - 23px); padding: 10px 10px; border: 2px solid #ddd; border-radius: 5px; }
.contact-form table input[type="submit"] { background: var(--eb-kangaroo-green); border: 0; color: #000; cursor: pointer; padding: 10px 0; width: 120px; border-radius: 0; -webkit-appearance: none; }
.contact-form table input[type="submit"]:hover { background: #a9d65d; }
.contact-form table textarea { height: 80px; }
.contact-form table textarea:required { border: 2px solid #999; }
.contact-form table select { border: 0; padding: 10px 3%; width: calc(100% - 2px); }
.contact-form table tr td { padding: 0 0 0.75em 0; vertical-align: top; text-align: left; }
.mapsitna { display: none; }

/******************************************************************************/
/* box v patičce */

#foot-box {}

.foot-box { display: inline-block; margin: 0 30px 30px 0; vertical-align: top; width: calc(33% - 22px); }
.foot-box:last-child { margin-right: 0; }
.foot-box img { height: auto; width: 80%; }
.foot-box .title { font-weight: bold; margin-bottom: .5em; text-transform: uppercase; }
.foot-box .text { padding-top: 20px; position: relative; text-align: center; }

#foot-first .foot-box { text-align: center; min-height: 210px; }
#foot-first .foot-box:first-child { display: inline-flex; text-align: left; border-right: 2px solid #fff; }
#foot-first .foot-box:first-child .address {margin-left: 20px;}

#foot-first .foot-box:nth-child(2) { display: inline-grid;; border-right: 2px solid #fff; }
#foot-first .foot-box:nth-child(2) .phone-mail { margin-left: 65px; text-align: left;}
#foot-first .foot-box:nth-child(2) .phone-box { display: inline-flex; }
#foot-first .foot-box:nth-child(2) .phone-box .phone { margin-left: 20px; }
#foot-first .foot-box:nth-child(2) .phone-box .mobile { margin-left: 25px; }
#foot-first .foot-box:nth-child(2) .mail-box { display: inline-flex; }
#foot-first .foot-box:nth-child(2) .mail-box .mail { margin-left: 20px; }
#foot-first i { margin-top: 8px; }
#foot-first li.active a { color: var(--eb-kangaroo-green-dark); text-decoration: underline; }

#foot-first .foot-box:last-child {text-align: left;}

#foot-first ul { padding-left: 140px; }
#foot-first ul li::before { content: "★"; color: var(--eb-kangaroo-green); display: inline-block; margin-left: -1em; width: 1.5em; }
#foot-first ul li a:hover { color: var(--eb-kangaroo-green); }

#foot .foot-box:first-child { text-align: left; }
#foot .foot-box:nth-child(2) { text-align: center; }
#foot .foot-box:nth-child(2) .social-icons { display: inline-flex; }
#foot .foot-box:last-child { text-align: right; }

.icon-circle { color: #fff; background: #000; width: 35px; height: 35px; text-align: center; padding: 16px; border-radius: 120px; margin-right: 30px; }
.icon-circle:hover { background: var(--eb-kangaroo-green); transition: 0.2s; }

/******************************************************************************/
/* patička */

#foot-first { background: var(--eb-kangaroo-gray); padding: 50px 0; }
#foot-first, #foot-first a { color: #000; text-decoration: none; }
#foot-first .content { text-align: center; }

#foot { background: #fff; }
#foot, #foot a { color: #000; text-decoration: none; }
#foot .content { text-align: center; }

/* =========================================================
   FAQ - společné styly pro:
   1) FAQ blok na kategorii služby: .faq-section
   2) samostatnou FAQ stránku: .faq-page
   ========================================================= */


/* -------------------------------
   Společný wrapper
-------------------------------- */

.faq-section,
.faq-page {
    max-width: 1050px;
    margin: 60px auto 70px auto;
    padding: 0 15px;
    box-sizing: border-box;
}

.faq-section__inner,
.faq-page__inner {
    border-top: 3px solid #1b1b1b;
    padding-top: 34px;
}


/* -------------------------------
   Hlavička FAQ
-------------------------------- */

.faq-section__header,
.faq-page__header {
    max-width: 820px;
    margin-bottom: 30px;
}

.faq-section__label,
.faq-page__label {
    display: inline-block;
    margin-bottom: 10px;
    padding: 6px 12px 5px 12px;
    background: #7dbb32;
    color: #fff;
    font-size: 12px;
    line-height: 1;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.faq-section h2,
.faq-page h1 {
    margin: 0 0 13px 0;
    color: #111;
    font-size: 36px;
    line-height: 1.1;
    font-weight: 800;
    text-transform: uppercase;
}

.faq-section__perex,
.faq-page__header p {
    margin: 0;
    color: #555;
    font-size: 16px;
    line-height: 1.7;
}


/* -------------------------------
   Navigace kategorií na FAQ stránce
   Používá se jen u .faq-page
-------------------------------- */

.faq-page__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 50px 0;
    padding: 18px 0 0 0;
    border-top: 1px solid #e1e1e1;
}

.faq-page__nav a {
    display: inline-block;
    padding: 9px 14px 8px 14px;
    background: #f2f2f2;
    color: #111;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}

.faq-page__nav a:hover {
    background: #7dbb32;
    color: #fff;
}


/* -------------------------------
   Kategorie FAQ na samostatné FAQ stránce
-------------------------------- */

.faq-category {
    margin: 0 0 58px 0;
}

.faq-category__header {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 18px;
    padding-bottom: 15px;
    border-bottom: 2px solid #1b1b1b;
}

.faq-category__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 46px;
    height: 46px;
    background: #1b1b1b;
    color: #7dbb32;
    font-size: 18px;
    line-height: 1;
    font-weight: 800;
}

.faq-category h2 {
    margin: 0;
    color: #111;
    font-size: 28px;
    line-height: 1.15;
    font-weight: 800;
    text-transform: uppercase;
}


/* -------------------------------
   Společný seznam otázek
-------------------------------- */

.faq-list {
    border-bottom: 1px solid #e0e0e0;
}

.faq-item {
    border-top: 1px solid #e0e0e0;
    background: #fff;
}


/* -------------------------------
   Otázka
-------------------------------- */

.faq-question {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 64px 22px 0;
    color: #111;
    cursor: pointer;
    list-style: none;
    font-size: 19px;
    line-height: 1.35;
    font-weight: 700;
    transition: color 0.2s ease;
}

/* Skrytí defaultní šipky v Chrome/Safari */
.faq-question::-webkit-details-marker {
    display: none;
}

/* Skrytí defaultní šipky ve Firefoxu */
.faq-question::marker {
    content: "";
}

.faq-question:hover {
    color: #7dbb32;
}

.faq-question:focus {
    outline: none;
}

.faq-question:focus-visible {
    outline: 2px solid #7dbb32;
    outline-offset: 4px;
}

.faq-question__text {
    display: block;
}


/* -------------------------------
   Ikona plus / minus
-------------------------------- */

.faq-question__icon {
    position: absolute;
    right: 0;
    top: 50%;
    width: 34px;
    height: 34px;
    margin-top: -17px;
    border-radius: 50%;
    background: #111;
    transition: background 0.2s ease, transform 0.2s ease;
}

.faq-question__icon::before,
.faq-question__icon::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    background: #fff;
    transform: translate(-50%, -50%);
}

.faq-question__icon::before {
    width: 14px;
    height: 2px;
}

.faq-question__icon::after {
    width: 2px;
    height: 14px;
}

.faq-item[open] .faq-question {
    color: #7dbb32;
}

.faq-item[open] .faq-question__icon {
    background: #7dbb32;
    transform: rotate(180deg);
}

.faq-item[open] .faq-question__icon::after {
    display: none;
}


/* -------------------------------
   Odpověď
-------------------------------- */

.faq-answer {
    max-width: 850px;
    padding: 0 64px 25px 0;
    color: #333;
    font-size: 16px;
    line-height: 1.75;
}

.faq-answer p {
    margin: 0;
}

.faq-answer a {
    color: #7dbb32;
    text-decoration: underline;
}

.faq-answer strong,
.faq-answer b {
    color: #111;
    font-weight: 700;
}


/* -------------------------------
   Jemné odlišení FAQ bloku na kategorii
-------------------------------- */

.faq-section {
    margin-top: 65px;
    margin-bottom: 65px;
}

.faq-section .faq-list {
    margin-top: 26px;
}


/* -------------------------------
   Jemné odlišení samostatné FAQ stránky
-------------------------------- */

.faq-page {
    margin-top: 55px;
    margin-bottom: 85px;
}

.faq-page .faq-list {
    margin-top: 0;
}


/* -------------------------------
   Responsive
-------------------------------- */

@media (max-width: 768px) {
    .faq-section,
    .faq-page {
        margin: 42px auto 55px auto;
        padding: 0 14px;
    }

    .faq-section__inner,
    .faq-page__inner {
        padding-top: 28px;
    }

    .faq-section h2,
    .faq-page h1 {
        font-size: 28px;
    }

    .faq-section__perex,
    .faq-page__header p {
        font-size: 15px;
        line-height: 1.65;
    }

    .faq-page__nav {
        margin-bottom: 38px;
    }

    .faq-page__nav a {
        padding: 8px 11px 7px 11px;
        font-size: 13px;
    }

    .faq-category {
        margin-bottom: 42px;
    }

    .faq-category__header {
        gap: 13px;
    }

    .faq-category__number {
        min-width: 38px;
        height: 38px;
        font-size: 15px;
    }

    .faq-category h2 {
        font-size: 23px;
    }

    .faq-question {
        padding: 18px 48px 18px 0;
        font-size: 17px;
    }

    .faq-question__icon {
        width: 30px;
        height: 30px;
        margin-top: -15px;
    }

    .faq-question__icon::before {
        width: 13px;
    }

    .faq-question__icon::after {
        height: 13px;
    }

    .faq-answer {
        padding: 0 48px 21px 0;
        font-size: 15px;
        line-height: 1.65;
    }
}

@media (max-width: 480px) {
    .faq-section,
    .faq-page {
        margin-top: 35px;
        margin-bottom: 45px;
    }

    .faq-section h2,
    .faq-page h1 {
        font-size: 24px;
    }

    .faq-question {
        padding-right: 42px;
        font-size: 16px;
    }

    .faq-question__icon {
        width: 28px;
        height: 28px;
        margin-top: -14px;
    }

    .faq-answer {
        padding-right: 42px;
    }
}