@font-face {
    font-family: 'corporate-s-regular';
    src: url("../fonts/CorporateSRegular.woff") format("woff"), url("../fonts/CorporateSRegular.eot?") format("embedded-opentype"), url("../fonts/CorporateSRegular.ttf") format("truetype");
    font-weight: 500;
    font-style: normal
}
@font-face {
    font-family: 'corporate-s-bold';
    src: url("../fonts/CorporateSBold.woff") format("woff"), url("../fonts/CorporateSBold.eot?") format("embedded-opentype"), url("../fonts/CorporateSBold.ttf") format("truetype");
    font-weight: 100;
    font-style: normal
}
/*@font-face {
    font-family: 'daimler-regular';
    src: url("../fonts/daimler-regular.woff") format("woff"), url("../fonts/daimler-regular.eot?") format("embedded-opentype"), url("../fonts/daimler-regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal
}*/
@font-face {
    font-family: 'daimler-serif';
    src: url("../fonts/daimler-regular-serif.woff") format("woff"), url("../fonts/daimler-regular-serif.eot?") format("embedded-opentype"), url("../fonts/daimler-regular-serif.ttf") format("truetype");
    font-weight: 700;
    font-style: normal
}



html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;	padding: 0;	border: 0; 	outline: 0; 	vertical-align: baseline;} :focus {	outline: 0; } ol, ul {list-style: none;} a {text-decoration:none} 
.clear{clear:both} .clearfix:before, .clearfix:after {display: table; content: " "; } .clearfix:after {clear: both;}
/*::-webkit-scrollbar { display: none; }*/    

body { background: #000; background-image:url('../img/bg.jpg'); color: white; font-size:18px; font-size:1.1vw; font-weight: normal; 
font-family: 'corporate-s-regular', sans-serif;
letter-spacing:0; line-height:1.7em}
section:not(.intro) { padding: 10em 3em 1em; position: relative; }
p {font-size:1em}
.align-center {text-align: center;}
.main-width {width:80%; margin:auto; position:relative}


a {	text-decoration: none; 	color: #0c6ff4;	outline: none;}
a:hover, a:focus { color: white;	outline: none;}

h1{ font-family: "daimler-serif", georgia; font-size: 3.9em;  font-weight: normal; font-style: normal; line-height: 1.1em; margin-bottom:0.8em; }
h2{ font-family: "daimler-serif", georgia; font-size: 3.3em; font-weight: 800; font-style: normal; line-height: 1.1em; margin-bottom: 0.5em;}
h3{  font-size: 1.1em; font-weight: 800; font-style: normal; margin-bottom: 2.5em;}

header  {line-height: 1em; height: 84px;; position:static; width:100%; z-index:10; }
header h1 {margin-top: 1.4em; font-size: 2.5em; color: white;}
.logo { width:257px;
    position: static;
    float: left;
    padding: 0 0 0 0;
 margin: 10px 2em 0 0;}
        
nav { margin: 0 2% 0 7%; display: block; padding-top: 58px; width: 38em; position: absolute; right: 0;}
nav li {float: right;
    margin-right: 3em;
    font-size: 16px;
    color: #ffffff;}
nav li:hover {color:#00adef}
nav img {width: 2.2em; float: left; margin-left: 1.7em; margin-top: -0.6em;}

.intro {width:100%; position: relative;overflow: hidden; }
.intro video {width:100%; display: block;}
.intro-mobile {display:none}
.intro-text{position: static; top: 30%; left: 17%; margin-top: 2em; padding-bottom: 4em;}

.videogrid {background-image:url('../img/grid.png');  width:100%; height:100%; position:absolute; top: 0; left: 0; mix-blend-mode: hard-light; filter: grayscale(30%); opacity:0.2 }
#sound-toggle { z-index: 10; position: absolute; bottom: 0.3em; right: 1em; width: 2.4em; cursor:pointer}

.form-nadpis {font-weight: 100; font-size: 3.7em;  text-shadow:0.03em 0.03em 0.1em rgb(43, 43, 43);}
.form-cont{ margin: auto;}

.pozvanka {width:80%; margin:auto;     display: block;}

  #toggle-menu {display: none; position: absolute; right: 7%; top: 23px; cursor: pointer;}
  #menu-mobile a {color:white}
  #menu-mobile { display: none; position: fixed; top: 0; left: 0; height: 1000px; height: 100vh; width: 100%; 
  background-image: url("../images/menu-mobile-bg.jpg"); background-size: 100%; background: #4492bc; z-index: 20;  line-height: 1.1em;}
  #menu-mobile ul {vertical-align:middle; margin-top:10%}
  #menu-mobile a:hover{color:#d6f2ff}
  #menu-mobile li {text-align:center; float:none; font-size:2em; line-height: 1.3em;}   
  #menu-mobile li a {color:white;}
  #menu-mobile .logo{margin: 10% auto; position: relative;   left: 41.8%; width: 16%;}
  #menu-mobile .close-menu{margin: 10% auto 2em; width: 37px;}
  

.tag {position: absolute; left: 0; top: 10em; width: 2.2em;}
.tag img {width:100%;     display: block;}
.tag span { transform:  translateX(-50%) translateY(-50%) rotate(-90deg); display: block; position: absolute; left:50%; top:50%; 
            color:black; letter-spacing:0.05em; font-family:'corporate-s-bold'}
.pozice {padding:10em 3em; text-align:center; position:relative}

.map {
    filter: grayscale(1);
    transition: 0.3s;
    cursor: pointer;
}


.map:hover {
    filter: grayscale(0);
}
    

.map-block {
    position: relative;
}

.map-pin { 
    position: absolute;
    top: 45.3%;
    left: 35.2%;
    transform: translate(-50%, -100%);
}

.logo-bg {width:100%}



.benefity{ text-align:center; position:relative}
.benefity-cont{ 
    padding-top: 4em; 
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
}

.benefit {display:inline-block; width:20%; border-top:1px solid #353535; border-bottom:1px solid #353535; padding:3em 0 2em; margin:0 1em 0 1em; position:relative; vertical-align: middle; height: 9em;}
.benefit:nth-of-type(5), .benefit:nth-of-type(6), .benefit:nth-of-type(7), .benefit:nth-of-type(8) {border-top:0px solid #353535;}
.benefit img {width:30%; display:block; margin:auto; margin-bottom: 2em; position:relative; transition:transform .2s, opacity .2s}
.benefit h3 {color:#00adef; position:relative; transition:transform .3s, color .2s}
.benefit p {opacity:0; padding:0 1em; position:absolute; bottom:2em; line-height:1.1em; font-size:1em; transition:opacity .5s}

.benefit:hover{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0a679d+1,4ca3d5+100 */
background: #0a679d; /* Old browsers */
background: -moz-linear-gradient(45deg, #0a679d 1%, #4ca3d5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, #0a679d 1%,#4ca3d5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, #0a679d 1%,#4ca3d5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a679d', endColorstr='#4ca3d5',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.benefit:hover img{opacity:0.2; transform:translateY(-1em)}
.benefit:hover h3{transform:translateY(-4.0em); color:black}
.benefit:hover p {opacity:1}



 .prihlaska { overflow: auto; position:relative; box-sizing:border-box; }
 .prihlaska h2{text-align: center;}
 .introimg {padding:0; width: 90%; display:block; margin: auto;  overflow: auto;}
 .prihlaska p, .prihlaska h1, prihlaska h2, cenik h3 { margin-left: 0;}
 .taginfo {font-size: 14px;
    line-height: 1.3em;
    margin-bottom: 1.6em;}
 .info1 {width: 20%; margin: 2.8em;}
 .kv  {    width: 24%; margin: 1.8em 0 0 1.8em;} 
 .timearrow1 {background-image:url("../img/timearrow1.png")}

 .count {float:left; width:5%}
.form-intro-box {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 4em;
    padding-left: 2em;
    padding-right: 2em;
}

.form-intro {
    width: 48%;
}
 .form-right {float:left; width:95%; position:relative}
 .form-right p{margin-bottom:2em}
 
 .form-section {border-bottom:1px solid #2c2c2c; overflow: hidden; padding-bottom: 3em; margin-bottom:2em; padding-top: 0.8em; padding-left: 2em; 
    padding-right: 2em;}
 .last-form-section{border-bottom:0px solid #2c2c2c}
 
 input[type=text].fullwidth {width:95%}
 input[type="submit"] {margin-left:12.5%; margin-top: 1em; }

 .continue-but {float:right}
.rolldown-section1, .rolldown-section2 {display:none}
#dynamic-souhlas {line-height:1em}






