
.filter {width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background-color: rgba(0,0,0,0.15);}
#burger {display: none;}
#catBurger {display: none;}


#top {width: 100%; float: left; background-color: #273c44; color: #fff; font-size: 13px; font-weight: 300;}
#top .inner {position: relative; width: 100%; float: left; padding: 6px 0; justify-content: space-between;}
#top .inner .left {align-items: center;}
#top .inner .left a {display: inline-block; padding: 10px 24px; background-position: left center; background-repeat: no-repeat;}
#top .inner .left a:hover {text-decoration: underline;}
#top .inner .left a.phone {margin-right: 30px; background-image: url('/images/icon-phone-white.png');}
#top .inner .left a.email {background-image: url('/images/icon-email-white.png');}
#top .inner .right {flex: 1; justify-content: flex-end;}
#top .inner .right ul {padding: 0; margin: 0; list-style: none url();}
#top .inner .right ul li {padding: 0; margin: 0 0 0 20px; list-style: none url();}
#top .inner .right ul li a {padding: 10px 0; text-align: center; align-items: center;}
#top .inner .right ul li a:hover {text-decoration: underline;}
#top .inner .right ul li a.active {text-decoration: underline;}

#menuMobile {display: none;}

#header {width: 100%; float: left;}
#header .inner {width: 100%; float: left; justify-content: space-between; align-items: center;}
#header .inner .logo {}
#header .inner .logo a {display: block; padding: 18px 0 18px 0;}
#header .inner .doprava {color: #273c44;}
#header .inner .doprava span {display: block; width: 190px; padding: 5px 5px 5px 60px; text-transform: uppercase; background-image: url('/images/icon-box.png'); background-repeat: no-repeat; background-position: left center;}
#header .inner .kosik {}
#header .inner .kosik .icon {width: 57px; height: 57px; border-radius: 50%; background-color: #67ad30; background-image: url('/images/icon-cart.png'); background-repeat: no-repeat; background-position: center;}
#header .inner .kosik .text {padding: 0 0 0 10px; flex-direction: column; justify-content: center;}
#header .inner .kosik .text .name {color: #67ad30; font-size: 17px; text-transform: uppercase;}
#header .inner .kosik .text .value {color: #5c5c5c;}


#mainText {width: 100%; float: left; margin: 30px 0;}
#mainText .inner {width: 100%; float: left;}


#navig {width: 100%; float: left;}
#navig .inner {width: 100%; float: left; padding: 10px 0; border-bottom: 1px solid #e7e7e7; align-items: center;}
#navig .inner a {font-size: 13px; color: #9b9b9b;}
#navig .inner a:hover {text-decoration: underline;}
#navig .inner a:last-child {font-weight: 700;}
#navig .inner span {margin: 0 10px; color: #9b9b9b;}


#catMenu {width: 100%; float: left; background-color: #e0bc17;}
#catMenu .inner {width: 100%; float: left; }
#catMenu .inner ul {width: 100%; position: relative; padding: 0; margin: 0; list-style: none url();}
#catMenu .inner ul li {padding: 0; margin: 0; list-style: none url(); align-items: center;}
#catMenu .inner ul li:after {content: ''; width: 1px; height: 11px; margin: 0 0 0 20px; background-color: #fff;}
#catMenu .inner ul li:last-child:after {display: none;}
#catMenu .inner ul li a {padding: 15px 0 15px 0; margin-left: 20px; color: #fff; font-size: 14px; font-weight: 700; border: 3px solid transparent; border-left: 0; border-right: 0; text-transform: uppercase;}
#catMenu .inner ul li:first-child a {margin-left: 0;}
#catMenu .inner ul li:hover ul.submenu {display: block;}
#catMenu .inner ul li:hover a {color: #746a3c; border-top-color: #746a3c;}
#catMenu .inner ul li.active a {color: #746a3c; border-top-color: #746a3c;}
#catMenu .inner ul li ul.submenu {display: none; position: absolute; z-index: 100; left: 0; top: 100%; width: 100%; height: auto; padding: 20px 70px; background-color: #746a3c;}
#catMenu .inner ul li ul.submenu li {width: calc(25% - 30px); float: left; margin: 15px 30px 15px 0;}
#catMenu .inner ul li ul.submenu li:nth-child(4n) {margin-right: 0;}
#catMenu .inner ul li ul.submenu li:after {display: none;}
#catMenu .inner ul li ul.submenu li a {border: 0; align-items: center; font-size: 15px; font-weight: 300; text-transform: none;}
#catMenu .inner ul li ul.submenu li a:hover {color: #e0bc17;}
#catMenu .inner ul li ul.submenu li a .imgCover {width: 70px; height: 70px; padding: 10px; display: block; border-radius: 50%; background-color: #fff;}
#catMenu .inner ul li ul.submenu li a .imgCover .img {width: 100%; height: 100%; display: block; border-radius: 50%; background-position: center; background-size: cover;}
#catMenu .inner ul li ul.submenu li a .name {flex: 1; margin-left: 10px;}
#catMenu .inner ul li:hover ul li a {color: #fff;}


#catDetail {width: 100%; float: left;}
#catDetail .inner {width: 100%; float: left;}
#catDetail .inner .left {width: 270px; margin: 0 30px 0 0;}
#catDetail .inner .left .nadpis {display: none;}
#catDetail .inner .left .nadpis h1 {padding: 0 0 0 50px; color: #273c44; font-size: 28px; font-weight: 400; text-transform: uppercase; background-image: url('/images/dots.png'); background-repeat: no-repeat; background-position: left center;}
#catDetail .inner .left .filters {background-color: #f8f8f8;}
#catDetail .inner .left .filters h3 {padding: 20px 0 20px 70px; margin: 20px 0 0 0; font-size: 17px; color: #273c44; background-image: url('/images/icon-setting.png'); background-repeat: no-repeat; background-position: left 30px center;}
#catDetail .inner .left .filters .block {width: 100%; padding: 30px; border-top: 3px solid #3e3e3e;}
#catDetail .inner .left .filters .block .title {font-size: 17px; font-weight: 700; color: #273c44; justify-content: space-between; align-items: center;}
#catDetail .inner .left .filters .block .title a.dropDown {width: 15px; height: 15px; background-image: url('/images/icon-arrow-down.png'); background-repeat: no-repeat; background-position: center;}
#catDetail .inner .left .filters .block .list {margin: 8px 0 0 0;}
#catDetail .inner .left .filters .block .list .filter_item {padding: 10px; margin: 0 0 8px 0; border: 2px solid #c7c7c7; border-radius: 2px; background-color: #fff; cursor: pointer; align-items: center;}
#catDetail .inner .left .filters .block .list .filter_item:hover {border-color: #273c44;}
#catDetail .inner .left .filters .block .list .filter_item.active {border-color: #273c44; background-image: url('/images/icon-filter-check.png'); background-repeat: no-repeat; background-position: right 10px center; }
#catDetail .inner .left .filters .block .list .filter_item span.color {display: inline-block; width: 12px; height: 12px; margin: -1px 6px 0 0; border-radius: 50%;}
#catDetail .inner .right {flex: 1; padding: 20px 0 0 0;}
#catDetail .inner .right h1 {padding: 0 0 0 50px; color: #273c44; font-size: 28px; font-weight: 400; text-transform: uppercase; background-image: url('/images/dots.png'); background-repeat: no-repeat; background-position: left center;}

.itemsCatFrame {width: 100%; margin: 0 0 30px 0; justify-content: space-between;}
.itemsCatFrame .item {width: calc(33.33333% - (40px / 3)); margin: 10px 20px 10px 0; padding: 5px 0; border: 2px solid #ebebeb;}
.itemsCatFrame .item:nth-child(3n) {margin-right: 0;}
.itemsCatFrame .item:hover {border-color: #4593cf;}
.itemsCatFrame .item.active {border-color: #4593cf;}
.itemsCatFrame .item .img {width: 50px; background-repeat: no-repeat; background-position: center; background-size: contain;}
.itemsCatFrame .item .name {flex: 1; align-items: center;}


#itemDetail {width: 100%; float: left; margin: 0 0 40px 0;}
#itemDetail .inner {width: 100%; float: left; margin: 60px 0 0 0;}
#itemDetail .inner .left {width: calc(40% - 30px); float: left; margin: 0 30px 0 0;}
#itemDetail .inner .right {width: calc(60% - 30px); float: left; margin: 0 0 0 30px;}
#itemDetail .inner .right h1 {margin: 0 0 30px 0;}
#itemDetail .inner .right .dostupnost {width: 100%; float: left; margin: 0 0 0 0;}
#itemDetail .inner .right .varianty {position: relative; width: 100%; float: left; margin: 20px 0 0 0;}
#itemDetail .inner .right .varianty .title {margin: 0 0 5px 0; font-weight: 700;}
#itemDetail .inner .right .varianty .block {padding: 15px 30px; border: 2px solid #273c44; border-radius: 3px; justify-content: space-between; align-items: center;}
#itemDetail .inner .right .varianty .block .photo img {max-height: 60px;}
#itemDetail .inner .right .varianty .block .text {font-weight: 700;}
#itemDetail .inner .right .varianty .block span.arrow {width: 15px; height: 15px; background-image: url('/images/icon-arrow-down.png'); background-repeat: no-repeat; background-position: center;}
#itemDetail .inner .right .varianty .items {position: absolute; display: none; left: 0; top: calc(100% - 0px); width: 100%; background-color: #fff;}
#itemDetail .inner .right .varianty .items .block {border-radius: 0; border: 1px solid #666; border-top: 0;}
#itemDetail .inner .right .price {width: 100%; float: left; margin: 30px 0 0 0; font-size: 16px; font-weight: 500;}
#itemDetail .inner .right .price span {margin-left: 10px; font-size: 29px; font-weight: 700;}
#itemDetail .inner .right .price_bez_vat {width: 100%; margin: 6px 0 0 0; font-size: 16px; font-weight: 400;}
#itemDetail .inner .right .price_bez_vat span {margin-left: 10px; font-size: 22px; font-weight: 400;}
#itemDetail .inner .right .doKosiku {width: 100%; float: left; margin: 40px 0 0 0; flex-wrap: wrap;}
#itemDetail .inner .right .doKosiku .message {width: 100%;}
#itemDetail .inner .right .doKosiku .pocet {padding: 0 10px 0 10px; background-color: #efefef; color: #919191; font-weight: 700;}
#itemDetail .inner .right .doKosiku .pocet a {display: inline-block; padding: 10px 10px; font-size: 20px;}
#itemDetail .inner .right .doKosiku .pocet input {width: 50px; color: #3a3a3a; font-weight: 700; font-size: 20px; background-color: #efefef; border: 0; text-align: center;}
#itemDetail .inner .right .doKosiku .btn {margin: 0 0 0 20px;}
#itemDetail .inner .right .doKosiku .btn a {padding: 0 40px; color: #fff; background-color: #67ad30; align-items: center; font-size: 18px; font-weight: 700;}
#itemDetail .inner .right .doKosiku .btn a:hover {background-color: #518a24;}

#itemDetailPopis {width: 100%; float: left; background-color: #f7f7f7;}
#itemDetailPopis .inner {width: 100%; float: left; padding: 20px 0; margin: 0 0 0 0;}



#homeItems {width: 100%; float: left;}
#homeItems .inner {width: 100%; float: left; margin: 30px 0;}
#homeItems .inner h2 {position: relative; text-align: center; font-size: 26px;}
#homeItems .inner h2:before {content: ''; position: absolute; left: auto; top: -10px; width: 100px; height: 7px; background-image: url('/images/dots.png'); background-repeat: no-repeat; background-position: left top;}
#homeItems .inner h2.itemDetail {text-align: left; text-transform: uppercase; font-size: 22px;}
#homeItems .inner h2.itemDetail:before {display: none;}


.itemsFrame {width: 100%; float: left; flex-wrap: wrap; font-size: 15px;}
.itemsFrame .itemFrame {width: calc(33.33333% - (40px / 3)); margin: 10px 20px 10px 0; border: 2px solid #ebebeb;}
.itemsFrame .itemFrame {flex-direction: column; justify-content: space-between;}
.itemsFrame .itemFrame:nth-child(3n) {margin-right: 0;}
.itemsFrame .itemFrame:hover {border-color: #4593cf;}
.itemsFrame .itemFrame:hover .data .button {background-color: #ffd20f;}
.itemsFrame .itemFrame .photo {padding: 15px 0 0 0; text-align: center;}
.itemsFrame .itemFrame .photo img {max-width: 100%; max-height: 100%;}
.itemsFrame .itemFrame .data {width: 100%; float: left; padding: 30px;}
.itemsFrame .itemFrame .data h3 {padding: 0; margin: 10px 0 0 0; font-size: 18px; color: #575757;}
.itemsFrame .itemFrame .data .desc {margin: 10px 0 0 0; color: #838383; line-height: 1.1;}
.itemsFrame .itemFrame .data .price {margin: 10px 0 0 0; font-size: 24px; font-weight: 700;}
.itemsFrame .itemFrame .data .button {width: 100%; padding: 12px 0; margin: 14px 0 0 0; background-color: #67ad30; color: #fff; text-align: center; font-size: 14px; text-transform: uppercase; border-radius: 3px;}

.itemsFrame.home .itemFrame {width: calc(25% - (60px / 4)); margin: 10px 20px 10px 0;}
.itemsFrame.home .itemFrame:nth-child(4n) {margin-right: 0;}


#homeText {width: 100%; float: left; margin: 30px 0 0 0; line-height: 1.6;}
#homeText .left {width: 50%; background-position: center; background-size: cover;}
#homeText .right {width: 50%; padding: 50px 80px; color: #4d4d4d; font-size: 14px; background-color: #f1f2f3;}
#homeText .right h1 {position: relative; text-align: left; font-size: 28px; color: #273c44;}
#homeText .right h1:before {content: ''; position: absolute; left: auto; top: -10px; width: 100px; height: 7px; background-image: url('/images/dots.png'); background-repeat: no-repeat; background-position: left top;}
#homeText .right p {padding: 0; margin: 15px 0;}


#newsDetail {width: 100%; float: left;}
#newsDetail .inner {width: 100%; float: left; margin: 60px 0 0 0;}
#newsDetail .inner .left {width: calc(50% - 30px); float: left; margin: 0 30px 0 0;}
#newsDetail .inner .right {width: calc(50% - 30px); float: left; margin: 0 0 0 30px;}
#newsDetail .inner .right h1 {margin: 0 0 30px 0;}
#newsDetail .buttons {width: 100%; float: left; margin: 30px 0 0 0; padding: 15px 0 0 0; font-size: 14px; color: #9b9b9b; border-top: 1px solid #e7e7e7; justify-content: space-between;}


#news {width: 100%; float: left; margin: 20px 0 0 0;}
#news.home {margin: 60px 0 0 0;}
#news h2 {position: relative; text-align: center; font-size: 26px;}
#news h2:before {content: ''; position: absolute; left: auto; top: -10px; width: 100px; height: 7px; background-image: url('/images/dots.png'); background-repeat: no-repeat; background-position: left top;}
#news .inner {width: 100%; float: left; flex-wrap: wrap;}
#news .inner .item {width: calc(25% - 60px / 4); margin: 10px 20px 10px 0; background-color: #f9f9f9;}
#news .inner .item:nth-child(4n) {margin-right: 0;}
#news .inner .item:hover {background-color: #519ad2; color: #fff;}
#news .inner .item .photo {width: 100%; height: 265px; background-position: center; background-size: cover;}
#news .inner .item .data {width: 100%; padding: 30px;}
#news .inner .item .data .dt {color: #575757; font-size: 14px; font-style: italic;}
#news .inner .item .data h3 {font-size: 18px;}
#news .inner .item:hover .data .dt {color: #fff;}
#news .inner .item .data .perex {color: #838383; font-size: 14px;}
#news .inner .item:hover .data .perex {color: #fff;}
#news .inner .item .data .vice {margin: 15px 0 0 0; padding: 10px 0 0 0; color: #9b9b9b; font-size: 13px; border-top: 1px solid #c7c7c7;}
#news .inner .item:hover .data .vice {color: #fff; border-color: #fff;}



#mainBanner {width: 100%; height: auto; margin: 0px; float: left;}
#mainBanner .slide {width: 100vw; height: 700px; display: flex; align-items: center; justify-content: space-around; background-size: cover; background-position: center center; color: #FFF; position: relative;}
#mainBanner .slide .overlay {width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background-color: rgba(0,0,0,0.3);}
#mainBanner .slide .centerer {display: flex; flex-direction: column; align-items: center; z-index: 1;}
#mainBanner .slide h2 {margin: 0px; font-size: 60px;}
#mainBanner .slide P {margin: 0px; font-size: 30px;}
#mainBanner .slide .buttonMore {padding: 20px 40px; background-color: #000; font-weight: 300; font-size: 16px; margin: 30px 0px 0px 0px; transition: all 200ms;}
#mainBanner .slide .buttonMore:HOVER {background-color: rgba(226,33,28,1);}
#mainBanner .slide HR {width: 300px; height: 6px; background-color: #FFF; border: 0px; margin: 100px 0px 30px 0px;}


#bottomLinks {width: 100%; float: left; margin: 40px 0 0 0; color: #fff; background-color: #345e6e; color: #b2d0dc;}
#bottomLinks a:hover {text-decoration: underline;}
#bottomLinks .inner {width: 100%; float: left; margin: 0 0 0 0; padding: 60px 0 40px; justify-content: space-between;}
#bottomLinks .inner h3 {position: relative; text-align: left; font-size: 20px; color: #fff; text-transform: uppercase;}
#bottomLinks .inner h3:before {content: ''; position: absolute; left: auto; top: -15px; width: 100px; height: 7px; background-image: url('/images/dots-white.png'); background-repeat: no-repeat; background-position: left top;}
#bottomLinks .inner ul {padding: 0; margin: 0; list-style: none url();}
#bottomLinks .inner ul li {padding: 0; margin: 6px 0;}
#bottomLinks .inner ul li a {font-size: 15px;}


#footer {width: 100%; float: left; margin: 0 0 0 0; background-color: #234653; color: #fff;}
#footer a:hover {text-decoration: underline;}
#footer .inner {width: 100%; float: left; margin: 0 0 0 0; padding: 10px 0; justify-content: space-between; align-items: center;}
#footer .inner .netsimple {font-size: 13px; font-weight: 300; font-style: italic;}
#footer .inner .logo a {display: block;}
#footer .inner .logo a img {display: block; width: 100px;}

