body{padding: 0; margin: 0; width: 100%; height: 100%; font-size: 18px; background: #fff; color: #000; font-family: 'Fira Sans', sans-serif}
.cleaner{width: 0; height: 0; line-height: 0; font-size: 0; clear: both}
#header{height: 100px; width: 100%; z-index: 100; position: absolute;background: #fff; top:0}
#logoBg{position: absolute; left: 0; top:0; width: 320px; height: 269px; background: url(images/logoBg.png) no-repeat center center}
#logo{position: absolute; left: 88px; top:46px;}
#lang{position: absolute; right: 5.2%; top:53px;; display: none}
#lang .flag{background-color:grey; width: 20px; height: 14px; display: block; float: left; background-repeat: no-repeat; background-position: center; background-blend-mode:multiply; font-size: 0; text-decoration: none}
#lang .flag:hover{box-shadow: 0 2px 5px rgba(0,0,0,0.3); background-blend-mode:normal}
#lang .flag.cs{background-image: url(images/flagCs.png); margin-right: 10px}
#lang .flag.en{background-image: url(images/flagEn.png);}
#lang .flag.active{background-blend-mode:normal}
#menu{position: absolute; top:20px; right: 9.63%;}
#menu>a{display: none}
#menu ul{list-style: none; margin: 0; padding: 0}
#menu ul li{list-style-image: none; margin: 0; padding: 0; position: relative}
#menu>ul>li{float: left}
#menu>ul>li>a{text-decoration: none; color: #acacac; font-size: 20px; margin: 0 15px; text-align: center; display: block; height: 80px; line-height: 80px; text-transform: uppercase}
#menu>ul>li.selected>a{color: #000}
#menu>ul>li:hover>a{background: url(images/menuL1H.png) no-repeat center bottom; color: #000}
#menu>ul>li>ul{position: absolute; left: 50%; top:80px; width: 480px; margin-left: -240px; background: #47a9de; color: #fff; box-sizing: border-box; padding: 56px 45px 20px; display: none;}
#menu>ul>li:hover>ul{display: block;}
#menu>ul>li>ul>li>a{font-size: 20px; color: #fff; text-decoration: none; font-weight: 700; display: block; padding: 5px 0}
#menu>ul>li>ul li>a:hover{text-decoration: underline}
#menu>ul>li>ul>li>ul>li>a{display: block; text-decoration: none; color: #fff; font-size: 20px; padding: 0 0 0 35px; background: url(images/menuL3Def.png) no-repeat left center; height: 33px; line-height: 33px}
#menu>ul>li>ul>li>ul>li:first-of-type>a{height: 43px; background: url(images/menuL3F.png) no-repeat left top;box-sizing: border-box; padding-top: 11px}
#menu>ul>li>ul>li>ul>li:last-of-type>a{height: 33px; background: url(images/menuL3Last.png) no-repeat left top;}
#menu>ul>li:nth-child(7)>a{font-size: 0; text-decoration: none}
#menu>ul>li:nth-child(7)>a::after{content:'\f16a'; font-family: 'FontAwesome'; color: #cc181e; font-size: 20px}
#part001 {background: #fff}
#part001 .rightPart{float: right; width: 64.1%;}
#part001 .rightPart img{max-width: 100%}
#part001 .leftPart{width: 35.9%; float: left}
#part001 .leftPart .in{padding-left: 43.9%; padding-top: 12.1%}
#part001 .leftPart .in h1{font-size: 48px; font-weight: 400; text-transform: uppercase}
#part001 .leftPart .in h1 .blue{color:#47a9de}
#part001 .leftPart .in .link a{border-radius: 35px; color: #47a9de; border:2px solid #47a9de; text-decoration: none; display: inline-block; height: 61px; line-height: 61px; width: 225px; font-size: 19px; transition: all 0.4s; text-transform: uppercase; box-sizing: border-box; padding-left: 25px; padding-right: 20px}
#part001 .leftPart .in .link a::after{font-family: 'FontAwesome'; content: '\f178'; float: right; font-size: 18px}
#part001 .leftPart .in .link a:hover{background: #47a9de; color: #fff}
#part002 .content{height: 100%}
#part002 .content .item{width: 33%; height: 100%; color: #fff; float: left; transform: scale(0)}
#part002 .content .item:nth-child(1){background: #47a9de}
#part002 .content .item:nth-child(2){background: #83c477}
#part002 .content .item:nth-child(3){width: 34%;background: #428d46}
#part002 .content .item .in{padding: 126px 19% 5% 19% }
#part002 .content .item .in h2 {font-weight: 400; font-size: 48px}
#part002 .content .item .in h2 .slim{font-weight: 300}
#part002 .content .item .in .link a{border:2px solid #fff; border-radius: 35px; text-transform: uppercase; width: 210px; height: 65px; box-sizing: border-box;padding: 0 20px; transition: all 0.4s; display: inline-block; line-height: 65px; color: #fff; text-decoration: none}
#part002 .content .item .in .link a::after{font-family: 'FontAwesome'; font-size: 18px; float: right; content:'\f178'}
#part002 .content .item .in .link a:hover{background: #fff}
#part002 .content .item:nth-child(1) .in .link a:hover{color:#47a9de}
#part002 .content .item:nth-child(2) .in .link a:hover{color:#83c477}
#part002 .content .item:nth-child(3) .in .link a:hover{color:#428d46}
.blueboard{background: #47a9de; color: #fff}
.blueboard a{color: #fff;}
.blueboard .content{max-width: 1366px; margin: 0 auto; padding: 80px 0; width: 96%}
.blueboard .content .col{width: 40%; float: left; margin-left: 5%}
.blueboard .content .col:nth-child(2){float: right; margin-right: 5%; margin-left: 0}
.blueboard .content h2{color: #fff; font-weight: 400; font-size: 48px; padding-right: 38%}
.blueboard .content h2.NadpisKontakt{padding-right: 0}
.blueboard .content h2 .slim{font-weight: 300}
.blueboard .content .col:nth-child(1) p{font-size: 24px; margin-bottom: 0}
.blueboard .content h3{font-size: 23px; font-weight: 400;}
.blueboard .content ul{margin: 0; padding: 0; list-style: none}
.blueboard .content ul li{padding: 0 0 0 15px; margin: 0; background: url(images/li.png) no-repeat left 9px}
#footer{position: relative}
#footer .content .logo{float: left; width: 12.81%; text-align: right; margin-top: 20px}
#footer .content .adwise{float: left; margin-left: 60px; margin-top: 40px}
#footer .content .adwise a{color: #47a9de; font-size: 48px; font-weight: 400; text-decoration: none; text-transform: uppercase}
#footer .content .adwise a .slim{color: #000; font-weight: 300; display: block}
#footer .content .cta{float: right; margin-right: 60px; margin-top: 55px}
#footer .content .cta a{font-size: 48px; display: block; text-decoration: none; color: #000; text-transform: uppercase; font-weight: 300}
#footer .content .cta a.small{font-size: 18px;}
#copyright{position: absolute; left: calc(12.81% + 60px); top:160px}
#copyright a{color: #000; font-size: 13px; text-decoration: none}
#copyright a:nth-child(1)::after{content:', '}
#copyright a:hover{text-decoration: underline}
#noRoll{padding-top: 100px}
#noRoll #part001 {padding: 50px 0}
#navigator{position: fixed; z-index: 101; right:1%; top:50%; margin-top: -90px; background: #fff; border-radius: 15px; width: 34px; text-align: center; height: 140px; box-shadow: 0px 5px 8px rgba(0,0,0,0.3); padding-top: 20px; padding-bottom: 20px; display: table}
#navigator ul{list-style: none; margin: 0; padding: 0; display: table-cell; width: 100% ;height: 100%; vertical-align: middle}
#navigator ul li{list-style-image: none; margin: 0 auto 10px; padding: 0}
#navigator a{display: block; width: 6px; height: 6px; border:3px solid #fff; border-radius: 50%; background: #d9d9d9; margin: 0 auto}
#navigator li:last-of-type{margin-bottom: 0}
#navigator li.active a{background: #fff; border-color: #47a9de}
p{margin: 0 0 1.8em; padding: 0; line-height: 1.5em}
h1,h2,h3,h4,h5,h6{margin: 0 0 1em; padding: 0;} 
a{color: #fff; text-decoration: underline}
a:hover{text-decoration: none}

#mContext{transition-property: left,width,transform; transition-duration: .25s;transition-timing-function: cubic-bezier(.35,0,.25,1);width: 100%;-webkit-backface-visibility: hidden;}
#mContext.shrinked{transform: translate3d(200px,0,0); position: fixed; min-height: 0; overflow: hidden;}
#overlaymContext{opacity: 0.8; background: #000; width: 100%; height: 100%;position: fixed;top: 0; z-index: 200}
.sidenav{position: fixed; width: 200px; transform: translate(-100%,0); transition: all .25s ease-in-out; left: 0; top:0; height: 100%; background: #fff; color: #000; visibility: hidden; padding: 0 10px; overflow-y: scroll}
.sidenav.expanded{transform: translate(0,0); visibility: visible;}
.sidenav .supertitle{padding: 15px 0 15px 20px; font-size: 20px; font-weight: bold;}
.sidenav ul{list-style: none; margin: 0; padding: 0}
.sidenav>ul{background-color: #fff;width: 180px;}
.sidenav>ul>li{background-color: #fff;border-bottom: 1px solid #dcdcdc;display: block;width: 180px; line-height: 20px;}
.sidenav ul li a{line-height: 1em; padding: 9px 0 9px 20px;text-decoration: none;transition: all .2s ease-in-out; color: #a2a2a2; display: block; font-size: 14px}
.sidenav ul li:before{content:''; padding-left: 0}
.sidenav ul li.selected>a,.sidenav ul li>a:hover{color: #000}
.sidenav ul li ul li a{padding-left: 25px;}
.sidenav ul li ul li ul li a{padding-left: 30px;}
.sidenav ul li ul li ul li ul li a{padding-left: 35px;}
.sidenav ul li ul li ul li ul li ul li a{padding-left: 40px;}
.sidenav ul li ul li ul li ul li ul li ul li a{padding-left: 40px;}
.sidenav ul li ul li ul li ul li ul li ul li ul li a{padding-left: 45px;}
.sidenav ul li ul li ul li ul li ul li ul li ul li ul li a{padding-left: 50px;} 
.sidenav ul li.haschilds>ul{display: none}
.sidenav ul li.haschilds.throw>ul,.sidenav ul li.selected>ul{display: block}
.sidenav ul li>a>span.doexpandchild{float: right}
.sidenav ul li>a>span.doexpandchild::after{content:'▼'}
.sidenav ul li.haschilds.throw>a>span.doexpandchild::after,.sidenav ul li.haschilds.selected>a>span.doexpandchild::after{content:'▲'}

@media screen and (max-width:1600px){
    #part001 .leftPart .in h1{font-size: 40px}
    #part002 .content .item .in{padding-left: 15.7%}
}
@media screen and (max-width:1560px) and (max-height:650px){
    #logoBg{width: 220px; height: 184px; background-size: cover}
    #logo{width: 132px; height: 148px; left: 40px; top:10px}
    #logo img{max-width: 100%; max-height: 100%}
}
@media screen and (max-width:1300px){
    #part001 .leftPart .in h1{font-size: 35px}
    #part001 .leftPart .in{padding-left: 30%}
    #part002 .content .item .in h2{font-size: 35px}
    .blueboard .content h2{font-size: 35px}
}
@media screen and (max-width:1200px){
    #lang{right: 4%}
}
@media screen and (max-width:1000px){
    #menu>ul{display: none}
    #menu>a{display: block; width: 60px; height: 100px; background: #47a9de; color: #fff; text-decoration: none; text-align: center; line-height: 100px; font-size: 25px;}
    #menu{top:0; right: 0;}
    #lang{right: 80px; top:43px}
    #part001 .leftPart {width: 100%; text-align: center; padding-top: 100px}
    #part001 .leftPart .in{padding-left: 0; padding-top: 50px}
    #part001 .rightPart{width: 100%; text-align: center}
    #part001 .rightPart img{max-width: 100%}
    #logoBg{background: none; width: 158px; height: 171px}
    #logo{left: 0; top:0}
    #part001 h1{width: 92%; margin: 0 auto}
    #part002 .content .item:nth-child(n){width: 100%; height: auto; text-align: center}
    #part002 .content .item .in{padding: 10% 15%}
    .blueboard .content .col:nth-child(n){width: 90%; margin-bottom: 25px; float: none; margin-left: auto; margin-right: auto}
    .blueboard .content .col:nth-child(2){margin-bottom: 0}
}
@media screen and (max-width:900px){
    #footer .content .adwise{margin-left: 80px}
    #copyright{left: calc(12.81% + 80px)}
}
@media screen and (max-width:799px){
    #part002 .content .item .in{padding: 5% 5%}
    #part002 .content .item .in h2{font-size: 30px}
    .blueboard .content h2{font-size: 30px}
    .blueboard .content .col:nth-child(1) p{font-size: 20px}
    #footer .logo{display: none}
    #footer .content .adwise{margin-left: 60px}
    #copyright{position: relative; width: 100%; text-align: center; padding-bottom: 10px; left: 0; top:0}
    #logo{height: 120px;}
    #logo img{max-height: 100%}
}
@media screen and (max-width:700px){
    #footer .content .adwise{width: 96%; margin-left: auto; margin-right: auto; float: none; font-size: 30px; text-align: center}
    #footer .content .cta{width: 96%; margin-left: auto; margin-right: auto; float: none;; font-size: 30px; text-align: center; margin-top: 20px}
    #copyright {margin-top: 20px}
    #copyright a{display: block;}
    #copyright a:nth-child(1)::after{content:''}
}
@media screen and (max-width:500px){
    #navigator{width: 20px; height: 70px; margin-top: -70px}
    #noRoll #part001{padding-top: 0}
    #noRoll #part001 .leftPart{padding-top: 25px}
}
@media screen and (max-width:340px){
    #part001 .leftPart .in h1{font-size: 25px}
    #part002 .content .item .in h2{font-size: 25px}
    .blueboard .content h2{font-size: 25px}
    .blueboard .content .col:nth-child(1) p{font-size: 18px}
}