:root {
  --banner-height: 500px;
}

.filter {width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background-color: rgba(0,0,0,0.15);}
.burger {display: none;}
#menuMobile {display: none;}
#menuMobileFrame {display: none;}
.mobileSearchIcon {display: none;}
.searchMobile {display: none;}

#header {width: 100%; float: left;}
#header .inner {width: 100%; float: left; display: flex; justify-content: space-between;}
#header .inner .logo {padding: 20px 0;}
#header .inner .right {flex: 1; padding: 15px 0 0 0; margin: 0 0 0 100px; display: flex; flex-direction: column; align-items: flex-end;}
#header .inner .right .search {margin: 0 0 15px 0;}
#header .inner .right .search .input {width: 300px; background-color: #eaeaea; border-radius: 20px;}
#header .inner .right .search .input .cover {position: relative; display: flex; align-items: center; justify-content: space-between;}
#header .inner .right .search .input .cover input[type="text"] {width: 250px; height: 47px; padding: 0 0 0 20px; border: 0; background: transparent;}
#header .inner .right .search .input .cover input[type="submit"] {width: 35px; height: 35px; background-color: #a3a3a3; border-radius: 50%; background-image: url("/images/svg/lupa-search.svg"); background-repeat: no-repeat; background-position: center;}
#header .inner .right .search .input .cover button.submit {width: 47px; height: 47px; border-radius: 50%; border: 0; padding: 0; background: none; cursor: pointer;}
#header .inner .right .search .input .cover button.submit img {max-width: 100%; opacity: 0.3;}
#header .inner .right .search .input .cover button.submit:hover {}
#header .inner .right hr {width: 100%; height: 2px; margin: 0; border: none; background: linear-gradient(to right, #e30d26 0, #e30d26 180px, #eaeaea 180px, #eaeaea 100%);}
#header .inner .right .menuFrame {flex: 1; display: flex; align-items: center;}
#header .inner .right .menuFrame .menu {}
#header .inner .right .menuFrame .menu ul {margin: 0; padding: 0; list-style: none; display: flex;}
#header .inner .right .menuFrame .menu ul li {position: relative; display: flex; padding: 15px 15px; margin: 0 15px;}
#header .inner .right .menuFrame .menu ul li a {display: flex; align-items: center; font-size: 18px; font-weight: 700; text-transform: uppercase; text-align: center;}
#header .inner .right .menuFrame .menu ul li a.arrow:after {content: ''; display: inline-block; width: 11px; height: 6px; margin-left: 10px; background-image: url("/images/icon-arrow-down-black.png"); background-repeat: no-repeat; background-position: right center;}
#header .inner .right .menuFrame .menu ul li ul.submenu {display: none; flex-direction: column; position: absolute; z-index: 666; left: 0; top: 100%; width: auto; min-width: 300px; padding: 15px; background-color: #f2f2ee; border: 1px solid #777676;}
#header .inner .right .menuFrame .menu ul li ul.submenu li {padding: 5px 0;}
#header .inner .right .menuFrame .menu ul li ul.submenu li a {color: #282828; font-size: 16px; font-weight: 400; text-transform: none; text-align: left;}
#header .inner .right .menuFrame .menu ul li ul.submenu li a:hover {color: #e30d26;}
#header .inner .right .menuFrame .menu ul li:hover a {color: #e30d26;}
#header .inner .right .menuFrame .menu ul li:hover a.arrow:after {background-image: url("/images/icon-arrow-down-red.png");}
#header .inner .right .menuFrame .menu ul li:hover ul.submenu {display: flex; flex-direction: column;}


#bannerContainer {width: 100%; float: left; height: var(--banner-height); align-items: center; justify-content: center; background-color: #cccccc}
#banner {width: 100%; float: left;}
#banner .inner {width: 100%; float: left;}
#banner .inner .bannerList {width: 100%; margin: 0 auto;}
#banner .inner .bannerList .item {width: 100%; padding: 0; margin: 0;}
#banner .inner .bannerList .item .cover {width: 100%; padding: 0; margin: 0; justify-content: space-between;}
#banner .inner .bannerList .item .cover .photo {width: 100%; height: var(--banner-height); background-position: center; background-repeat: no-repeat; background-size: cover;}
#banner .inner .bannerList .item .cover .photo {display: flex; align-items: center; justify-content: center; text-align: center; color: #ffffff;}
#banner .inner .bannerList .item .cover .photo img {width: 100%;}
#banner .inner .bannerList .item .cover .photo .text {width: 650px; position: relative; z-index: 555;}
#banner .inner .bannerList .item .cover .photo .text .wrapper {width: auto; display: inline-block;}
#banner .inner .bannerList .item .cover .photo .text .wrapper .name {font-size: 40px; font-weight: 700; text-transform: uppercase; line-height: 1.2;}
#banner .inner .bannerList .item .cover .photo .text .wrapper .popis {margin-top: 30px; font-size: 30px; font-weight: 400; line-height: 1.4;}
#banner .inner .bannerList .swiper-button-next {top: calc(50% - 22px); width: unset; right: 0; left: unset; margin: 0; color: #000000 !important;}
#banner .inner .bannerList .swiper-button-next:after {display: none;}
#banner .inner .bannerList .swiper-button-prev {top: calc(50% - 22px); width: unset; left: 0; right: unset; margin: 0; color: #000000 !important;}
#banner .inner .bannerList .swiper-button-prev svg {}
#banner .inner .bannerList .swiper-button-prev:after {display: none;}
#banner .inner .bannerList .swiper-pagination {bottom: 20px;}
#banner .inner .bannerList .swiper-pagination-bullet {width: 12px; height: 12px; margin: 0 8px; background-color: #f1f1ed; opacity: 1;}
#banner .inner .bannerList .swiper-pagination-bullet-active {background-color: #e30d25;}


#homeService {width: 100%; float: left; padding: 40px 0; background-color: #f1f1ed;}
#homeService h2 {margin: 0; padding: 0 0 25px; text-align: center; font-size: 30px; font-weight: 700; text-transform: uppercase;}
#homeService .inner {width: 100%; float: left; display: flex;}
#homeService .inner .item {width: calc(20% - 120px / 5); margin: 15px 30px 15px 0; padding: 30px 20px; background-color: #ffffff; transition: all 0.5s ease;}
#homeService .inner .item {display: flex; flex-direction: column; align-items: center;}
#homeService .inner .item:nth-child(5n) {margin-right: 0;}
#homeService .inner .item:hover {background-color: #f9cfd3;}
#homeService .inner .item .icon {}
#homeService .inner .item .icon img {max-height: 74px;}
#homeService .inner .item h3 {margin: 30px 0 0 0; color: #e30d26; font-size: 20px; font-weight: 700; text-align: center;}
#homeService .inner .item .perex {margin: 20px 0 0 0; font-size: 15px; font-weight: 400; text-align: center;}


#homeText {width: 100%; float: left; padding: 65px 0;}
#homeText .inner {width: 100%; float: left; display: flex; justify-content: space-between;}
#homeText .inner .left {width: calc(50% - 30px);}
#homeText .inner .right {width: calc(50% - 30px);}
#homeText .inner .right h1 {position: relative; margin: 0; padding: 30px 0 0 0; font-weight: 700; font-size: 30px; text-transform: uppercase; line-height: 1.2;}
#homeText .inner .right h1:before {content: ''; position: absolute; left: 0; top: 0; width: 235px; height: 2px; display: inline-block; background-color: #e30d26;}
#homeText .inner .right .title {font-weight: 700; font-size: 30px; line-height: 1;}
#homeText .inner .right .text {margin: 30px 0 0 0;}
#homeText .inner .right .text p {font-weight: 400; font-size: 18px; line-height: 1.8;}


#homeNews {width: 100%; float: left; padding: 0 0 40px 0;}
#homeNews h2 {margin: 0; padding: 0 0 25px; text-align: center; font-size: 30px; font-weight: 500;}
#homeNews .inner {width: 100%; float: left;}
#homeNews .inner {display: flex; flex-wrap: wrap;}
#homeNews .inner .item {width: calc(25% - 90px / 4); margin: 15px 30px 15px 0; padding: 30px; background-color: #f1f1ed; transition: all 0.5s ease;}
#homeNews .inner .item:nth-child(4n) {margin-right: 0;}
#homeNews .inner .item:hover {background-color: #f9cfd3;}
#homeNews .inner .item .dt {margin: 0; font-size: 14px; font-weight: 400; color: #e30d26;}
#homeNews .inner .item h3 {margin: 20px 0 0 0; font-weight: 700; font-size: 20px;}
#homeNews .inner .item .perex {margin: 20px 0 0 0; font-weight: 400; font-size: 16px;}


#mainText {width: 100%; float: left; padding: 0 0 30px 0; overflow: hidden;}
#mainText .inner {width: 100%; float: left; padding: 40px 0 0 0;}


#navig {width: 100%; float: left; margin: 0; color: #777676; font-size: 16px; background-color: #f2f2ee;}
#navig a:hover {text-decoration: underline;}
#navig .inner {width: 100%; float: left; padding: 25px 0 10px 0;}
#navig .inner span {display: inline-block; margin: 0 20px;}
#navig .inner a:last-child {font-weight: 700;}


#title {width: 100%; float: left; background-color: #f2f2ee;}
#title .inner {width: 100%; float: left;}


#adresarCat {width: 100%; float: left; padding: 40px 0;}
#adresarCat .inner {width: 100%; float: left;}
#adresarCat.subpage {padding: 0;}
#adresarCat.subpage h2 {width: 100%; float: left; margin: 20px 0 10px 0; padding: 0;}
#adresarCat.subpage .inner {padding: 0;}


#map {width: 100%; float: left; height: 500px;}
#map iframe {width: 100%; height: 100%;}
#map .gm-style-iw.gm-style-iw-c {}
#map .gm-style-iw.gm-style-iw-c button {height: 30px !important; width: 30px !important; border: 0 !important;;}
#map .gm-style-iw.gm-style-iw-c button:focus {outline: none;}
#map .gm-style-iw.gm-style-iw-c button span {margin: 0;}


#mainForm {width: 100%; float: left; padding: 0 0 30px 0; justify-content: center;}
#mainForm .inner {width: 700px; float: left;}


#poradna {width: 100%; float: left; margin: 30px 0; padding: 20px 50px; background-color: #f2f2ee;}
#poradna .list {width: 100%; float: left;}
#poradna .list .item {width: 100%; float: left; padding: 15px 0; border-bottom: 1px solid #ffffff;}
#poradna .list .item:last-child {border: 0;}
#poradna .list .item .otazka {position: relative; width: 100%; float: left; padding: 10px 0; font-size: 18px; font-weight: 700; cursor: pointer;}
#poradna .list .item .otazka::after {content: ""; width: 38px; height: 38px; background: url("/images/icon-arrow-down-poradna.png") no-repeat center; position: absolute; right: 10px; top: 50%; transform: translateY(-50%) rotate(0deg); transition: transform 0.3s ease;}
#poradna .list .item .otazka.active::after {transform: translateY(-50%) rotate(180deg);}
#poradna .list .item .text {display: none; width: 100%; float: left; padding: 0 0 10px 0; font-size: 18px; font-weight: 400;}


#kontaktForm {width: 600px; margin: 40px auto 40px auto;}


#googleMap {width: 100%; float: left;}
#googleMap iframe {width: 100%; height: 400px;}


#footer {width: 100%; float: left; background-color: #4b4b4b; color: #ffffff; font-size: 15px; font-weight: 400;}
#footer .inner {width: 100%; float: left;}
#footer .inner .row {width: 100%; float: left; padding: 60px 0; border-bottom: 2px solid #818181; display: flex; flex-wrap: wrap; justify-content: space-between;}
#footer .inner .row:last-child {border: 0;}
#footer .inner .row .col {}
#footer .inner .row .col .phone {display: inline-block; padding: 10px 20px 10px 55px; margin: 20px 0 0 0; background-color: #e30d26; color: #ffffff; font-size: 24px; font-weight: 700; border-radius: 20px;}
#footer .inner .row .col .phone {background-size: 36px; background-image: url("/images/svg/telefon-phone.svg"); background-repeat: no-repeat; background-position: left 10px center;}
#footer .inner .row.bottom {flex-direction: column; align-items: center; text-align: center; font-size: 14px; font-weight: 400;}
#footer .inner .row.bottom .signature {margin-top: 30px;}


.table {width: 100%; float: left; margin: 0 0 20px 0; display: flex; flex-wrap: wrap; font-size: 16px; color: #333333; font-weight: 300; border-bottom: 1px solid #e7e7e7; line-height: 1.4;}
.table a {color: #e30d26; text-decoration: none;}
.table a:hover {text-decoration: underline;}
.table .tr {width: 100%; float: left; display: flex; justify-content: space-between; border-left: 1px solid #e7e7e7;}
.table .tr.header {background-color: #e30d26; color: #ffffff; font-weight: 500; font-size: 18px;}
.table .tr.header .td {border-color: #e30d26;}
.table .tr:not(.header):nth-child(odd) {background-color: #f8f8f8;}
.table .tr .td {padding: 10px 12px; border-right: 1px solid #e7e7e7;}
.table .tr .td.pozice {width: 450px; display: flex; flex-direction: column; }
.table .tr .td.name {width: auto; flex: 1;}
.table .tr .td.phone {width: 120px;}
.table .tr .td.email {width: 300px;}
.table .tr .td.cisloDveri {width: 110px;}
.table .tr .td.btn {width: 50px; text-align: center;}
.table .tr .td.btn a {display: inline-block; padding: 4px 10px; background-color: #a2a2a2; color: #ffffff; border-radius: 4px;}