/* CSS Document */
/*#levyobrazek {
background: url("pozadi1.png");
}

#pravyobrazek {
background: url("pozadi2.png");
}
*/

* {
/*font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;*/
font-family:  Verdana, "Trebuchet MS", sans-serif;
/*font-family: Georgia, serif;*/
}

*, 
*:after, 
*:before {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}



body {
text-align:center;
overflow-x: hidden;
}

/*Doporucene nastaveni podle webu jecas*/
img, iframe, canvas, video, svg {
  max-width: 100%;
  height: auto;
}

input, textarea, select {
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/*Velikost stranky a  ostylovani sekci*/
.tucne {
font-weight: bold;
}

/*Navigace*/


#menu {
width:90%;
height: 100%;
margin:5px auto;
}

menu {
margin: 0 1em;
padding: 0;
text-align: center;
}

#menu menu li {
display: inline-block;
list-style-type: none;
font-weight: bold;
margin:0 0 1.1em 0;
}

#menu menu li a{
color: #DDD;
margin-left: -.3em;
text-decoration: none;
padding: .5em .3em .5em .3em;
background-color: brown;

}

#menu menu li a:hover {
background-color: #F90;
color: black;
}

#menu menu li #active a {
background-color: #0B0;
}

#menu button {
    background: brown;
    border: 0;
    color: #fff;
    font-size: 30px;
    cursor: pointer;
    display: none;
}  

#menu.zobrazit menu {
  display: block;
    }

@media screen and (max-width: 390px) {

    #menu button {
        display: block;
       float: right;
       margin-bottom: .4em;
              }
          
    #menu menu li {
        display: list-item;
    list-style-type: none;
    text-align: right;
                }
      
        #menu menu {
        margin: 0;
        display: none;
        clear: both;
        }
}


/*Konec stylu pro menu*/
header {
text-align: left;
}

header a {
display:block;
margin: .2em 0 .6em 0;
}

h1, h2 {
font-size: 1em;
}

#doporuceni {
padding-top: .2em;
border-bottom: 1px solid silver;
}

#main {
margin-top:.3em;
padding:.3em;
padding-right:.5em; 
background-color:#FFF;
border-radius: 1em; 
box-shadow:.3em -.3em .3em #BBB;
width: auto;
position: relative;
}

input[type=submit]{
    background-color: green;
    border: none;
    border-radius:.3em;
    color: white;
    font-size:200%;
    padding: 1em 2em;
    text-decoration: none;
    margin: .25em .1em;
    cursor: pointer;
}

/*Reklamni banner*/
#baner {
display:block;
margin: 1em auto;
margin-bottom:5em;
max-width:728px;
height: 90px;
-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
border: 1px solid #ccc;
}

/*Zneviditelnění respons banneru pro větší rozlišení*/
.respons_baner {
display:none;
}

.gas {
max-width:730px;
margin: 1em auto 1em;
border:1px solid silver;
text-align: left;
}

/*Konec reklamnich banneru*/

.step {
border: 2px solid silver;
margin-bottom: .2em;
background-color: #FF6;
}

.otazka {
margin: 0em .1em 0 .1em;
padding: .1em;
font-weight: bold;
}

.odpoved {
margin: .3em .1em;
background-color: #FFF;
border: 1px solid silver;
}

.varovani {
border:2px solid red;
}

#predbezny_vyber{
text-align: center;
font-size:90%;
width: 200px;
padding: 2px;
}

.dlazdice, .dlazdice1, .dlazdice2 {
border: 1px solid silver;
width:196px;
height:140px;
margin: 0 auto;
padding: .1em;
} 

.dlazdice, .dlazdice3 {
background: #FE9;
}

.dlazdice1, .dlazdice4 {
background: #CCC;
}

.dlazdice2, .dlazdice5 {
background: #C3F;
}

#main .sloupec {
float: left;
}

#main .levy {
width: 200px;
position: relative;
z-index:1;
}

#main .pravy {
float: right;
width: 100%; 
margin-left: -200px;
padding-right:.3em;
margin-top: .7em;
padding-left: 210px;
position: relative; 
/*z-index:-1;*/
}

#main hr {
border: 2px dotted silver;
}

.formular {
display: inline-block;
border: 1px solid silver;
border-radius:5px;
box-shadow: 2px 2px silver;
padding: 3px;
margin: 2px;
background-color: #DDD;
}

form {
margin-bottom: 1em;
}


#titulek {
text-align: center;
font-weight: bolder;
color:white; 
background-color:brown;
padding: 1em 0 .5em 0;
margin: -.9em auto 0 auto;
width: auto;
}

/*Vlajka v titulku*/
.flag {
position: absolute;
left:.5em;
margin-bottom:2em;
}

#container {
text-align: left;
background-image: url(titulni1.png);    
background-position:top;
background-repeat: no-repeat;
max-width: 63.5em;
margin: 1em auto;
padding-top: 6.3em;
}

#main .invisible, .invisible {
visibility: hidden;
}


label[for="box1"],  .levy input{
display: none;
}         

#result-box {
max-width: 40em;
margin-left: auto;
margin-right: auto;
}                             

#result-box .dlazdice, #result-box .dlazdice1, #result-box .dlazdice2{
float: left;
margin: 0 .3em .4em 0;
text-align: center;
padding: .2em .1em;
min-height: 130px;
}

.odstavec{
text-align: center;
width: 90%;
margin: .5em;
}

#result_links {
text-align: center;
margin: .2em auto .5em auto;}

.cleaner, #cleaner, .cleaner1 {
clear: both;
}

.cleaner1 {
visibility:hidden;
}

/*Na str8nce vysledek.php*/
#ulozit {
background-color:#0B0;
margin: .2em .2em 2em .2em;
padding: 1em; 
border-radius: .5em; 
box-shadow:0 0 .5em .5em silver;
}

#qr {
margin: .6em;
float: left;
}

.shoda {
margin: .1em;
font-weight: bold;
padding: .3em;
background-color: #9F0;
}

.neshoda {
margin: .1em;
font-weight: bold;
padding: .3em;
background-color: #F30;
}

/*Mailový formulář*/

#formular{
/*Nadpis nad formularem*/
width: 100%;
text-align: center;
}

#mailovy_formular{
margin: 0 auto;
text-align: left;
max-width: 40em;
}

#mailovy_formular label{
width: 10em;
margin-right: 1em;
}

#mailovy_formular .left{
  position:  relative;
  display:  block;
    float:  left;
}


#mailovy_formular form p{
 margin-bottom: 2em;
  clear:  both;
}

#captcha {
margin: -1em 0 1em 0;
border: 2px solid red;
} 

.banner, .banner1 {
margin: 1em 2em;
}

code {
padding: .1em;
margin-top: .2em;
display: block;
background-color: #7FFFD4;
}

.banner1 img {
/*float: left;*/
margin: 0em .1em 0em 0em;
}



.banner1 div {
clear: both;
}

#copyright {
margin-top: -2em;
}

.kalendar {
border-radius:5%;
width:9em;
height: 40em;
margin-top:0;
margin-left: 1em;
margin-bottom:2em;
padding: .1em; 
float: left;
background-color:#FE9;
}

strong {
padding-left: 1em;
}

#kontakt {
text-align: center;
}


#A,#B,#C,#D,#E,#F,#G,#H,#I,#J,#K,#L,#M,#N,#O,#P,#Q,#R,#S,#T,#U,#V,#W,#X,#Y,#Z,#Č,#Ř,#Š,#Ž{
display: block;
margin-top: 1em;
margin-bottom: -.5em;
}
#A {
margin-bottom: .5em;
}

.anchor {
margin-top:1em;
}

.plemeno {
width: auto;
display: inline-block;
margin: 1em;
padding: .3em;
background-color: #FF6;
}

#topten {
display: inline-block;
margin-bottom: 1em;
}

.top10 {
background-color: #FF6;
text-align: left;
margin: 1em;
padding:1em;
border-radius: 1em;
}

#fotka_a_popis{
margin-bottom: 2em;
}

#foto_velke {
width: 200px;
float:left;
padding: .5em;
}

#fotka_a_popis p {
padding: 0 .3em;
width: 100%;
padding-left: 220px;
}

#standard {
padding: .1em .5em;
margin: 1em 1em 2em 1em;
background-color: #FF6;
}

#main h3 {
font-size: 100%;
text-align: center;
}

#main .sluzby{
text-align: left;
}

#dotaz_na_plemeno {
margin: auto;
padding: 1em;
background: #CDC;
}

#prozkoumat {
margin-top: 1em;
} 

.respons {
display: none;
}


/* *****************`px************************************* */

@media screen and (max-width: 600px) {

/*Pro adsense*/
.gas {
max-width:730px;
max-height:200px;
margin: 1em auto 1em;
border:1px solid silver;
text-align: left;
}

.no_respons {
display: none;
}

.respons {
display: block;
}



#ann {
max-width: 20em;
max-height: 110px;
margin: .1em auto .1em;
padding: .2em .2em 0 .2em;
background-color: #DDD;
position: relative;
top:2.5em;
}

#linka {
display: none;
}

#main {
margin-top:1.3em;
}

#main .sloupec {
clear: both;
}

#main .levy {
width: 100%;
margin-top: .31em auto 0 auto;
}

.rozbalovac {
margin-top: 1em;
}

#main .pravy {
margin-left:0;
width: 100%;
padding-left: 0;
}

#main label[for="box1"]{
text-align: right;
margin-right:1em;
}

.formular {
border: 1px solid silver;
}

input.rozbalovac {display: none;} /* skrytí inputu */
input[type=checkbox]:checked + .rozbalovaci .obsah {display: block} /* zobrazení obsahu */

.rozbalovaci > .obsah {display: none} /* skrytí obsahu */

/* Styl přepínátka */
.rozbalovaci > label {
  display: block;
  cursor: pointer;
  background: brown;
  color: #FFF;
  padding: .5em;
}
input[type=checkbox]:checked + .rozbalovaci label {background: #0B08;}

.rozbalovaci > label:before {content: "+"; background: #fff; color: #000; padding: 0 .3em; margin-right: 1em; border-radius: 3px;}
input[type=checkbox]:checked + .rozbalovaci label:before {content: "−"}

.rozbalovaci > .obsah {background: #fff; padding: .5em} 

#fotka_a_popis p {
padding: 0 .3em;
width: 100%;
clear: both;
}
/*zviditelnění respons banneru*/
#respons_baner {
display: block;
margin: 1em auto;
margin-bottom:5em;
max-width:472px;
max-height:62px;
-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
border: 1px solid #ccc;
}
/*Zneviditelnění velkého banneru pro malá rozlišení*/
#baner {
display: none;
}


 }

/*Styly pro Annonci*/
#ann {
max-width: 20em;
max-height: 110px;
margin: .2em auto .1em;
padding: .2em .2em 0 .2em;
background-color: #DDD;
}

#ann .ann {
position: relative;
display:inline-block;
top: -5em;
margin-left: 4em;
text-align: justify;
}

#ann .ann a {
font-size:120%;
font-weight: bold;
}





