* {margin: 0; padding: 0;}



body {font-size: 100%; background: #fff;font-family: 'Rajdhani', sans-serif;
 color: #333; text-align: center; }
hr {visibility: hidden; width: 1px; border: none; height: 0; clear: both;}
div#obalmain {position: relative; width: 100%; max-width: 1920px; margin: auto; }
div#obalmain h1,
div#obalmain h2,
div#obalmain a {position: absolute;}
div#obalmain h1 { top: 10%; left: 50%; width: 200px; margin-left: -100px; padding: 0.5em 0; font-size: 1em; color: #fff; border: 1px solid #fff; }
div#obalmain h2 {display: none; top: 32%; left: 50%; width: 300px; margin-left: -150px; padding: 0.5em 0; font-size: 1em; font-weight: 400; color: #fff; line-height: 1.6em; text-transform: uppercase; text-shadow: 0 0 5px #195b70; }
div#obalmain a {bottom: 15%; left: 50%;  background: #272727;  width: 150px; margin-left: -75px; color: #37caff; padding: 0.75em 0; text-decoration: none; font-size: 1.1em;  text-transform: uppercase; border: 1px solid #37caff; border-radius: 20px; box-shadow: 0 0 10px #b2e6f9; transition: all 1s;}
div#obalmain a:hover {background: #e3004a; color: #fff; border: 1px solid #fff;  box-shadow: 0 0 10px #600;}
div#obalmain h2 span {color: #37caff;}
img#mobile {width: 100%; max-width: 800px; margin: auto;}
img#big {display: none; width: 100%; max-width: 1920px; margin: auto;}
img#logo {position: absolute; width: 200px; top: 0.25em; left: 50%; margin-left: -100px;}


/*------slide kolotoč------------*/
div#kolotoc {width: 100%; max-width: 100%; margin: 0 auto;}
div.carous {position: relative;
    margin: 0.1em;
    background-color: none;
}
div.carous img {width: 100%; max-width: 800px;}


/*-----trojka----*/
div#trojka,
div.white,
div.blue {width: 100%; max-width: 1920px; margin: auto;}
div.white {background: #fff;}
div#trojka p {width: 90%; max-width: 600px; padding: 5%; font-size: 1em; text-align: justify; margin: auto; line-height: 1.6em; font-family: 'Rajdhani', sans-serif;}
div#trojka div.white p {width: 80%; max-width: 500px;}
hr.oddelitko {display: none; width: 70%; clear: none;  margin: auto;}
div#trojka div.blue p {background: #2fa1cc; color: #fff; }
div.blue hr.oddelitko:nth-child(1)  {margin-top: 3em;}
div.white hr.oddelitko:nth-child(1) {margin-top: 4em;}
div.white hr.oddelitko {border-top: 2px solid #fff;}
/*-------kontakt----------*/
div#pozadikontakt {width: 100%; max-width: 1920px; margin: auto; background: #272727; color: #ccc;}

div#udaje h4 {font-size: 1.5em; margin: 3em auto 1em auto;}
div#udaje h5 {font-size: 1.3em; margin: 0.5em auto; font-weight: 300; }
div#udaje p {font-size: 1em; padding: 0.5em; line-height: 1.6em;}
/*-------formulář-----------*/
form {width: 90%; margin: auto; color: #ccc; }
input {font-size: 1.1em; font-weight: 100;  color: #37caff; }
input#submit,
.form-style-8 input[type="button"], 
.form-style-8 input[type="submit"]
 {display: block; cursor: pointer; background: #272727;  width: 150px;  padding: 0.5em 0; text-decoration: none; font-size: 1em; color: #37caff; text-transform: uppercase;  border: 1px solid #37caff; border-radius: 20px; box-shadow: 0 0 10px #b2e6f9; transition: all 1s; margin: 2em 0 1em 0;}
input#submit:hover,
.form-style-8 input[type="button"]:hover, 
.form-style-8 input[type="submit"]:hover {background: #e3004a; color: #fff; border: 1px solid #fff;  box-shadow: 0 0 10px #600;}
textarea {font-size: 1.1em; font-weight: 100; color: #37caff; }
form p {text-align: left; font-size: 1.1em; padding: 0.5em 0;}
p#spamanswer {margin: 2em 0; line-height: 1.4em;} 
p#spamanswer span {font-weight: 600; }
form p {padding: 0; margin: 0.5em 0;}
form p.legenda {font-weight: 600; }




/*----------mapa-------------*/
iframe { width: 100%; max-width: 1920px; margin: 2em auto; }
div#mapa {position: relative; width: 100%; max-width: 1920px; margin: auto;  }




div#podcopy {width: 100%; max-width: 100%; margin: auto; background: url(img/bg.jpg) no-repeat; padding: 2em 0; }
div#copy img {width: 100%; max-width: 100px; margin: 0.5em auto;}
div#copy p {color: #efefef; line-height: 1.3em; margin: 0.5em auto; font-size: 0.9em;}
div#copy p a {text-decoration: none; color: #37caff; padding-bottom: 0.1em; border-bottom: 1px dotted #37caff;}


@media screen and (min-width: 300px) {
div#obalmain h2 {display: inline; width: 300px; margin-left: -150px; font-size: 1.1em;  }
}

@media screen and (min-width: 400px) {
div#obalmain h1 {width: 300px; margin-left: -150px; font-size: 1.2em;}
div#obalmain h2 {font-size: 1.1em;}
div#obalmain h2 {width: 350px; margin-left: -175px; font-size: 1.3em;  }
}

@media screen and (min-width: 500px) {
div#obalmain h1 {font-size: 1.6em;}
div#obalmain h2 {width: 450px; top: 40%; margin-left: -225px; font-size: 1.6em;  }
img#logo {width: 400px; margin-left: -200px;}
}

@media screen and (min-width: 800px) {
img#mobile {display: none;}
img#big {display: block;}
div#obalmain h2 {width: 700px; top: 45%; margin-left: -350px; font-size: 1.4em;  }
img#logo {width: 300px; margin-left: -150px;}
div#obalmain h2 br {display: none;}
div#obalmain a {bottom: 10%;}
}

@media screen and (min-width: 900px) {
div#trojka {margin-bottom: 4em;}
div#obalmain h2 {font-size: 1.6em;  }
div.white {float: left; width: 30%; min-height: 18em;}
div.blue {float: left; width: 40%; min-height: 18em;}
div.blue p {background: #ccc;}
div#trojka p {width: 80%; padding: 10%; }
hr.oddelitko {display: block; visibility: visible;}
div#udaje,
div#formular {float: left; width: 50%;}
input#submit,
.form-style-8 input[type="button"], 
.form-style-8 input[type="submit"]
 {float: left;} 
 div#udaje h4 {margin-top: 5em;}
 iframe {margin: 1em auto;}

}

@media screen and (min-width: 1000px) {
div#obalmain a {bottom: 10%;}
}

@media screen and (min-width: 1200px) {
div#obalmain h2 {width: 600px; margin-left: -300px; font-size: 2em;  }
img#logo {width: 400px; margin-left: -200px;}
}

@media screen and (min-width: 1300px) {
div#trojka p {font-size: 1.2em;}
}

@media screen and (min-width: 1400px) {
div.white, 
div.blue {min-height: 25em;}
div.blue hr.oddelitko:nth-child(1)  {margin-top: 4em;}
div.white hr.oddelitko:nth-child(1) {margin-top: 5.5em;}
}