
.burger {display: none;}

.filter {width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background-color: rgba(0,0,0,0.15);}
.youtubePlay {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-image: url('/images/icon-youtube-play.png'); background-position: center; background-repeat: no-repeat;}

header {width: 100%; float: left;}
header .inner {position: relative; width: 100%; float: left; justify-content: space-between;}
header .inner .logo {margin: 10px 80px 10px 0;}
header .inner .logo img {display: block; max-width: 110px;}
header .inner .menu {text-transform: uppercase;}
header .inner .menu ul li {padding: 0 20px;}
header .inner .menu ul li.onlyInBurger {display: none; background-color: #ccc;}
header .inner .menu ul li a {font-size: 15px; font-weight: 600; color: #484848; align-items: center; border-top: 3px solid transparent; border-bottom: 3px solid transparent;}
header .inner .menu ul li a:hover {border-bottom-color: #3a4975;}
header .inner .menu ul li a.active {border-bottom-color: #3a4975;}
header .inner .langs {margin-left: auto; font-size: 15px; font-weight: 600; color: #484848;}
header .inner .langs a {margin: 0 0 0 10px; align-items: center; border-top: 3px solid transparent; border-bottom: 3px solid transparent;}
header .inner .langs a:hover {border-bottom-color: #3a4975;}
header .inner .langs a.active {border-bottom-color: #3a4975;}

#mainBanner {width: 100%; height: auto; margin: 0px; float: left;}
#mainBanner .slide {width: 100vw; height: 700px; display: flex; align-items: flex-end; justify-content: space-around; background-size: cover; background-position: center center; color: #FFF; position: relative;}
#mainBanner .slide .filter {}
#mainBanner .slide .text {width: 1600px; margin: 0 auto 40px auto; z-index: 1;}
#mainBanner .slide .text h2 {margin: 5px 0; padding: 0; font-size: 40px; text-transform: uppercase; text-shadow: 0px 0px 10px rgba(0,0,0,0.5);}
#mainBanner .slide .buttonMore {display: inline-block; padding: 8px 24px; background-color: #3a4875; font-weight: 300; font-size: 15px; border-radius: 0px; margin: 0px 0px 0px 0px; transition: all 200ms; text-transform: uppercase;}
#mainBanner .slide .buttonMore:hover {background-color: #6977a4;}

#mapDealersCont {width: 100%; height: calc(100vh - 60px); margin: 0px; float: left; background-color: #c7c7c7;}
#mapDealersCont .mainFrame {position: relative;}
#mapDealersCont .switchFrame {width: 400px; float: left; background-color: #FFF; position: absolute; top: 200px; left: 0px; box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);}
#mapDealersCont .switchFrame .buttonsLine {width: 100%; height: 44px; float: left; display: flex;}
#mapDealersCont .switchFrame .buttonsLine .button {flex: 1; display: flex; align-items: center; justify-content: space-around; font-size: 18px; font-weight: 600; transition: all 200ms; background-color: #0d5f7e; color: #FFF;}
#mapDealersCont .switchFrame .buttonsLine .button.active {background-color: #FFF; color: #010101;}
#mapDealersCont .switchFrame .buttonsLine .button:HOVER {box-shadow: inset 0 0 15px rgba(0,0,0,0.10);}
#mapDealersCont .switchFrame .dealerContent {width: 100%; float: left; padding: 20px;}
#mapDealersCont .switchFrame .dealerContent .inner {width: 100%; float: left; padding: 10px 20px; background-color: #f6f6f6;}
#mapDealersCont .switchFrame .dealerContent .inner A {text-decoration: underline;}
#mapDealers {width: 100%; height: calc(100vh - 60px); margin: 0px; float: left; background-color: #c7c7c7;}

#kontakt {width: 100%; float: left; padding: 30px 0 10px; background-color: #f9f9f9;}
#kontakt h1 {font-size: 34px; margin: 20px 0px 10px 0px; text-align: center; text-transform: uppercase; font-weight: 700;}
#kontakt .text {width: 100%; float: left; margin-top: 10px;}
#kontakt .text .left {width: calc(50% - 10px); margin: 0 20px 0 0; padding: 45px 65px; background-color: #ececec;}
#kontakt .text .left .tinymceCont {padding: 0;}
#kontakt .text .left .tinymceCont p {margin: 20px 0px 20px 0px;}
#kontakt .text .left .tinymceCont strong {font-weight: 700;}
#kontakt .text .right {width: calc(50% - 10px); margin: 0 0 0 0;}
#kontakt .osobyTitle {width: 100%; float: left; margin: 40px 0 20px 0; padding: 0 0 5px 0; border-bottom: 2px solid #ececec; text-transform: uppercase; font-weight: 700; color: #484848; font-size: 16px;}
#kontakt .osoby {width: 100%; float: left; flex-wrap: wrap; border-bottom: 2px solid #ececec;}
#kontakt .osoby .osoba {width: 24%; margin: 10px 1.333333% 30px 0; font-size: 16px;}
#kontakt .osoby .osoba:nth-child(4n) {margin-right: 0;}
#kontakt .osoby .osoba .name {font-size: 18px; font-weight: 700; color: #3a4875; text-transform: uppercase;}
#kontakt .osoby .osoba .pozice {font-weight: 600;}
#kontakt .osoby .osoba .data {margin: 15px 0 0 0;}


#catList {width: 100%; float: left; padding: 30px 0 60px;}
#catList.home {background-color: #f9f9f9; padding: 20px 0 60px;}
#catList h1 {text-transform: uppercase; font-size: 34px; text-align: center;}
#catList .inner {width: 100%; float: left; flex-wrap: wrap;}
#catList .inner .item {width: calc(25% - 15px); margin: 0 20px 20px 0; background-color: #ececec; flex-direction: column;}
#catList .inner .item:nth-child(4n) {margin-right: 0;}
#catList .inner .item:hover {background-color: #3a4875; color: #fff;}
#catList .inner .item:hover .text .name {border-color: #4e5b83}
#catList .inner .item:hover .text .btn {color: #e6e6e6;}
#catList .inner .item .photo {position: relative;}
#catList .inner .item .photo img {max-width: 100%; display: block;}
#catList .inner .item .text {padding: 20px 30px;}
#catList .inner .item .text .name {position: relative; padding-left: 10px; font-size: 20px; text-transform: uppercase; font-weight: 700; line-height: 1.3;}
#catList .inner .item .text .name:before {position: absolute; content: ''; width: 2px; height: calc(100% - 13px); left: 0; margin: 7px 0 0 0; display: block; background-color: #d8d8d8;}
#catList .inner .item .text .btn {margin-top: 20px; padding-left: 10px; color: #999999; font-weight: 300; text-transform: uppercase;}

#keStazeni {width: 100%; float: left; padding: 30px 0 60px;}
#keStazeni h1 {text-transform: uppercase; font-size: 34px; text-align: center;}
#keStazeni .inner {width: 100%; float: left; flex-wrap: wrap;}
#keStazeni .inner .item {width: calc(25% - 15px); margin: 0 20px 20px 0; background-color: #ececec; flex-direction: column;}
#keStazeni .inner .item:nth-child(4n) {margin-right: 0;}
#keStazeni .inner .item:hover {background-color: #3a4875; color: #fff;}
#keStazeni .inner .item:hover .text .name {border-color: #4e5b83}
#keStazeni .inner .item:hover .text .btn {color: #e6e6e6;}
#keStazeni .inner .item .photo {position: relative;}
#keStazeni .inner .item .photo img {max-width: 100%; display: block;}
#keStazeni .inner .item .text {padding: 20px 30px;}
#keStazeni .inner .item .text .name {position: relative; padding-left: 10px; font-size: 20px; text-transform: uppercase; font-weight: 700; line-height: 1.3;}
#keStazeni .inner .item .text .name:before {position: absolute; content: ''; width: 2px; height: calc(100% - 13px); left: 0; margin: 7px 0 0 0; display: block; background-color: #d8d8d8;}
#keStazeni .inner .item .text .btn {margin-top: 20px; padding-left: 10px; color: #999999; font-weight: 300; text-transform: uppercase;}


#homeText {width: 100%; float: left; padding: 40px 0 60px;}
#homeText .inner {width: 100%; float: left; text-align: center;}
#homeText .inner h1 {text-transform: uppercase; font-size: 34px;}
#homeText .inner p {font-size: 16px; font-weight: 300; line-height: 1.6;}

#newsHome {width: 100%; float: left; padding: 40px 0 20px; color: #fff; background-color: #f9f9f9;}
#newsHome img {max-width: 100%; display: block;}
#newsHome h2 {margin: 10px 0 20px; padding: 0; color: #484848; text-align: center; text-transform: uppercase; font-size: 34px;}
#newsHome .inner {width: 100%; float: left;}
#newsHome .inner .hlavni {position: relative; width: calc(50% - 10px); padding: 0 30px 30px 30px; background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 1; flex-direction: column; justify-content: flex-end;}
#newsHome .inner .hlavni .name {position: relative; padding-left: 10px; font-size: 26px; z-index: 1; font-weight: 600; line-height: 1.3;}
#newsHome .inner .hlavni .name:before {position: absolute; content: ''; width: 2px; height: calc(100% - 16px); left: 0; margin: 10px 0 0 0; display: block; background-color: #d8d8d8;}
#newsHome .inner .hlavni .perex {padding-left: 10px; margin-top: 8px; font-size: 17px; z-index: 1; font-weight: 300; text-shadow: 0px 0px 10px rgba(0,0,0);}
#newsHome .inner .hlavni .perex p {line-height: 1;}
#newsHome .inner .hlavni:hover {/*box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.10); outline: 4px #3a4875 solid; transition: all 100ms;*/}
#newsHome .inner .dalsi {width: calc(50% - 10px); margin-left: 20px; flex-wrap: wrap;}
#newsHome .inner .dalsi .item {position: relative; width: calc(50% - 10px); margin-right: 20px;}
#newsHome .inner .dalsi .item:nth-child(2n) {margin-right: 0;}
#newsHome .inner .dalsi .item:nth-child(1), #newsHome .inner .dalsi .item:nth-child(2) {margin-bottom: 20px;}
#newsHome .inner .dalsi .item .name {position: absolute; bottom: 20px; left: 40px; width: calc(100% - 80px); z-index: 1; font-size: 18px; font-weight: 400; line-height: 1.3; text-shadow: 0px 0px 10px rgba(0,0,0);}
#newsHome .inner .dalsi .item .name:before {position: absolute; content: ''; width: 2px; height: calc(100% - 10px); left: -12px; margin: 6px 0 4px 0; display: block; background-color: #d8d8d8;}
#newsHome .inner .dalsi .item:hover {/*box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.10); outline: 4px #3a4875 solid; transition: all 100ms;*/ }

#news {width: 100%; float: left; background-color: #f9f9f9; padding: 30px 0 60px;}
#news img {max-width: 100%; display: block;}
#news .inner {width: 100%; float: left; flex-wrap: wrap; color: #fff;}
#news .inner .item {position: relative; width: calc(25% - 15px); margin: 0 20px 20px 0; flex-wrap: wrap;}
#news .inner .item:nth-child(4n) {margin-right: 0;}
#news .inner .item .name {position: absolute; bottom: 20px; left: 40px; width: calc(100% - 80px); z-index: 1; font-size: 18px; font-weight: 400; line-height: 1.3; text-shadow: 0px 0px 10px rgba(0,0,0);}
#news .inner .item .name:before {position: absolute; content: ''; width: 2px; height: calc(100% - 10px); left: -12px; margin: 6px 0 4px 0; display: block; background-color: #d8d8d8;}
#news .inner .item:hover {/*box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.10) ;outline: 4px #3a4875 solid; transition: all 100ms;*/}

#videoList {width: 100%; float: left; background-color: #f9f9f9; padding: 30px 0 60px;}
#videoList img {max-width: 100%; display: block;}
#videoList .inner {width: 100%; float: left; flex-wrap: wrap;}
#videoList .inner .item {position: relative; width: calc(50% - 10px); margin: 0 20px 20px 0; flex-wrap: wrap;}
#videoList .inner .item:nth-child(2n) {margin-right: 0;}
#videoList .inner .item .name {position: absolute; bottom: 20px; left: 40px; width: calc(100% - 80px); z-index: 1; color: #fff; font-size: 24px; font-weight: 600; line-height: 1.3;}
#videoList .inner .item .name:before {position: absolute; content: ''; width: 2px; height: calc(100% - 15px); left: -12px; margin: 8px 0 4px 0; display: block; background-color: #d8d8d8;}
#videoList .inner .item:hover {/*box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.10);*/}

#sledujteNas {width: 100%; float: left; padding: 40px 0 60px; color: #fff; background-color: #f9f9f9;}
#sledujteNas img {display: block; max-width: 100%;}
#sledujteNas h2 {margin: 10px 0 20px; padding: 0; color: #484848; text-align: center; text-transform: uppercase; font-size: 34px; font-weight: 700;}
#sledujteNas .inner {width: 100%; float: left;}
#sledujteNas .inner .left {width: calc(50% - 10px); margin-right: 20px; flex-wrap: wrap;}
#sledujteNas .inner .left .item {position: relative; width: calc(50% - 10px); margin-right: 20px;}
#sledujteNas .inner .left .item:nth-child(2n) {margin-right: 0;}
#sledujteNas .inner .left .item:nth-child(1), #sledujteNas .inner .left .item:nth-child(2) {margin-bottom: 20px;}
#sledujteNas .inner .left .item .name {position: absolute; bottom: 20px; left: 40px; width: calc(100% - 80px); z-index: 1; font-size: 24px; font-weight: 600; line-height: 1.3;}
#sledujteNas .inner .left .item .name:before {position: absolute; content: ''; width: 2px; height: calc(100% - 14px); left: -12px; margin: 8px 0 4px 0; display: block; background-color: #d8d8d8;}
#sledujteNas .inner .left .item:hover {/*box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.10);*/ /*outline: 4px #3a4875 solid;*/}
#sledujteNas .inner .right {position: relative; width: calc(50% - 10px); background-image: url('/images/wtc-dealers-map2.png'); background-repeat: no-repeat; background-position: center; background-size: cover;}
#sledujteNas .inner .right .name {position: absolute; bottom: 20px; left: 40px; width: 45%; z-index: 1; font-size: 24px; font-weight: 600; line-height: 1.3; text-shadow: 0px 0px 10px rgba(0,0,0,0.7);}
#sledujteNas .inner .right .name:before {position: absolute; content: ''; width: 2px; height: calc(100% - 14px); left: -12px; margin: 8px 0 4px 0; display: block; background-color: #fff;}



#itemList {width: 100%; float: left; padding: 30px 0 20px; background-color: #f9f9f9;}
#itemList img {max-width: 100%; display: block;}
#itemList .inner {width: 100%; float: left; flex-wrap: wrap;}
#itemList .inner .item {width: calc(25% - 15px); margin: 0 20px 20px 0; background-color: #ececec; flex-direction: column;}
#itemList .inner .item:nth-child(4n) {margin-right: 0;}
#itemList .inner .item:hover {background-color: #3a4875; color: #fff;}
#itemList .inner .item:hover .text .name {border-color: #4e5b83}
#itemList .inner .item:hover .text .btn {color: #e6e6e6;}
#itemList .inner .item .photo {position: relative;}
#itemList .inner .item .photo img {max-width: 100%; display: block;}
#itemList .inner .item .text {padding: 20px 30px;}
#itemList .inner .item .text .name {position: relative; padding-left: 10px; font-size: 20px; text-transform: uppercase; font-weight: 700; line-height: 1.3;}
#itemList .inner .item .text .name:before {position: absolute; content: ''; width: 2px; height: calc(100% - 13px); left: 0; margin: 7px 0 0 0; display: block; background-color: #d8d8d8;}
#itemList .inner .item .text .perex {margin-top: 10px; padding-left: 10px;}
#itemList .inner .item .text .price {font-size: 14px ;margin-top: 10px; padding-left: 10px;}
#itemList .inner .item .text .btn {margin-top: 20px; padding-left: 10px; color: #999999; font-weight: 300; text-transform: uppercase;}

#item {width: 100%; float: left; padding: 30px 0 20px; background-color: #f9f9f9;}
#item.vybaveni {padding: 0 0 25px 0; background-color: #ececec;}
#item img {max-width: 100%; display: block;}
#item .title {width: 100%; float: left; padding: 0 0 5px 0; margin: 40px 0 20px 0; border-bottom: 2px solid #ececec; font-weight: 600; text-transform: uppercase; font-size: 16px;}
#item.vybaveni .title {}
#item.vybaveni .title {border-color: #fff;}
#item.vybaveni .itemList {width: 100%; flex-wrap: wrap;}
#item.vybaveni .itemList .item {width: 50%;}
#item.vybaveni .itemList .item:before {content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 6px; background-color: #3a4875;}

#item .vybava ul {width: 100%; float: left;}
#item .vybava ul li {width: 50%; float: left; list-style: none url(); position: relative; padding-left: 15px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
#item .vybava ul li:before {content: ''; display: inline-block; width: 5px; height: 5px; margin-right: 6px; background-color: #3a4875; position: absolute; left: 0px; top: calc(50% - 1px);}

#item.fotogalerie {padding: 0 0 20px 0;}
#item.fotogalerie .title {margin: 10px 0 10px 0;}

#item.videogalerie {padding: 0 0 30px 0;}
#item.videogalerie .title {margin: 10px 0 10px 0;}

#poptavkaBtnLine {width: 100%; float: left; text-align: center; background-color: #f9f9f9;}
#poptavkaBtnLine a {display: inline-block; padding: 15px 50px; margin-top: 40px; background-color: #3a4875; text-transform: uppercase; color: #fff; font-weight: 500; font-size: 18px;}
#poptavkaBtnLine a:hover {background-color: #2a3660;}

#itemTechParam {width: 100%; float: left; padding: 0 0 20px; background-color: #f9f9f9;}
#itemTechParam .title {width: 100%; float: left; padding: 0 0 5px 0; margin: 40px 0 20px 0; border-bottom: 2px solid #ececec; font-weight: 600; text-transform: uppercase; font-size: 16px;}
#itemTechParam .itemList {width: 100%; flex-wrap: wrap;}
#itemTechParam .itemList .item {width: calc(50% - 10px); margin: 0 20px 2px 0;}
#itemTechParam .itemList .item:nth-child(2n) {margin-right: 0;}
#itemTechParam .itemList .item .name {flex: 1; padding: 10px 15px; background-color: #ececec;}
#itemTechParam .itemList .item .value {width: 180px; padding: 10px 15px; border-left: 2px solid #fff; background-color: #ececec;}

#itemPrice {width: 100%; float: left; padding: 0 0 0 0; background-color: #f9f9f9;}
#itemPrice .price {font-size: 16px; font-weight: 600;}
#itemPrice .oldPrice {text-decoration: line-through;}

#itemStav {width: 100%; float: left; padding: 40px 0 30px; background-color: #f9f9f9;}
#itemStav .stav {font-size: 16px; font-weight: 600;}

footer {width: 100%; float: left; padding: 50px 0 50px; background-color: #4a4a4a; color: #fff; font-weight: 200;}
footer a {text-decoration: none;}
footer a:hover {text-decoration: underline;}
footer .inner {width: 100%; float: left; justify-content: space-between;}
footer .inner h3 {position: relative; padding-left: 10px; text-transform: uppercase; font-weight: 400; margin-top: 0px;}
footer .inner h3:before {position: absolute; content: ''; width: 2px; height: calc(100% - 13px); left: 0; margin: 7px 0 0 0; display: block; background-color: #d8d8d8;}
footer .inner .kontakt {width: calc(25% + 10px);}
footer .inner .right {margin-left: auto; text-align: right; flex-direction: column; justify-content: space-between;}
footer .inner .right .top {font-size: 16px;}
footer .inner .right .claim1 {font-weight: 500;}
footer .inner .right .claim2 {letter-spacing: 1.65px;}

#mainText {width: 100%; float: left; padding: 40px 0 0 0; background-color: #f9f9f9;}
#mainText.eu {padding-top: 0px;}

#poptavkaForm {width: 100%; float: left; padding-bottom: 40px; background-color: #ececec;}
#poptavkaForm a {font-size: 16px;}
#poptavkaForm .title {width: 100%; float: left; padding: 0 0 5px 0; margin: 40px 0 20px 0; border-bottom: 2px solid #fff; font-weight: 600; text-transform: uppercase; font-size: 16px;}
#poptavkaForm .text {width: 100%; float: left; margin: 0 0 20px 0; font-size: 16px;}
#poptavkaForm .data {width: 100%; float: left;}
#poptavkaForm .data .left {width: 400px; margin-right: 20px;}
#poptavkaForm .data .right {width: calc(100% - 420px);}
#poptavkaForm .odeslat {width: 100%; float: left; margin-top: 8px;}
#poptavkaForm .odeslat .left {width: 50%;}
#poptavkaForm .odeslat .right {width: 50%; align-items: center;}
#poptavkaForm LABEL A {text-decoration: underline;}

#poptavkaForm input[type=checkbox] {margin-right: 8px;}
#poptavkaForm input[type=submit] {padding: 6px 85px; font-weight: 500; -webkit-appearance: none;}

#formSubmitMessage {width: 100%; float: left; padding-top: 15px; background-color: #ececec;}

#navig {width: 100%; float: left; padding: 15px 0; background-color: #ececec; color: #858585; font-size: 12px;}
#navig a:hover {text-decoration: underline;}

.euFrame {width: 100%; float: left; display: flex; align-items: center; justify-content: center; padding: 20px;}
.euFrame .logoEu {width: 300px; height: auto;}

.euContentFrame {width: 100%; float: left; display: flex; flex-direction: column; align-items: center; flex-grow: 0; }
.euContentFrame IMG {margin: 0px 0px 20px 0px; max-width: 100%;}


