* {margin: 0; padding: 0;}
html {scroll-behavior: smooth;}
body {font-size: 100%;  
max-width: 1920px; margin: auto;






font-family: 'Chakra Petch', sans-serif;
font-family: 'Kaushan Script', cursive;
font-family: 'Montserrat', sans-serif;






font-family: 'Teko', sans-serif;

color: #285a73; color: #355a6d; text-align: center; background: #fff; position: relative;}
.mutacealert {
    position: fixed;
    bottom: 0;
    left: 0;
    background: #f0c419;/*#f4ba32;*/
    height: 2.5em;
    width: calc(100% - 2em);
    text-align: center;
    font-size: 1.2em;
    line-height: 1.1em;
    padding: 0.5em 1em 0 1em;
    color: black;
}
.mutacealert img {
    height: 0.75em;
    vertical-align: middle;
}
p {font-family: 'Advent Pro', sans-serif; font-family: 'Alfa Slab One', serif; font-family: 'Bebas Neue', sans-serif; font-family: 'Russo One', sans-serif; font-family: 'Gruppo', sans-serif; font-family: 'Roboto', sans-serif; font-family: 'Exo 2', sans-serif; font-family: 'Oswald', sans-serif; font-weight: 300; font-size: 1em;}
body#okoupi p {font-size: 0.9em}
hr {clear: both; visibility: hidden; margin: 0; padding: 0; height: 0; border: none;}
a {color: #ceb656;}

a.button, input.button {display: block; color: #fff; width: 90%; max-width: 145px; margin: 1em auto; padding: 0.25em; text-decoration: none; border: 1px solid #f60; background: #f60; border-radius: 10px 10px 10px 10px; transition: all 1s; text-align: center; cursor: pointer; font-size: 1.2em;}
/*---a.button:hover {background: #ceb656; border: 1px solid #ceb656; color: #fff;}  --*/
a.button:hover, input.button:hover {transform: scale(1.2, 1);
    -webkit-transform: scale(1.2, 1);   /* Chrome, Safari, Opera */
    -moz-transform: scale(1.2, 1);      /* Mozilla Firefox */
    -ms-transform: scale(1.2, 1);       /* IE 9 */}
body#home div#hlavicka {width: 100%; background: url(../img/homepage1.jpg) no-repeat #fff; background-size: cover; background-position: center;  margin: auto; z-index: 1;}
body#home div#hlavicka.homepage1 {background-image: url(../img/homepage1.jpg);}
body#home div#hlavicka.homepage2 {background-image: url(../img/homepage2.jpg);}
body#home div#hlavicka.homepage3 {background-image: url(../img/homepage3.jpg);}
body#home div#hlavicka.homepage4 {background-image: url(../img/homepage4.jpg);}
body#home div#hlavicka.homepage5 {background-image: url(../img/homepage5.jpg);}
div#hlavicka h1 {width: 95%; color: #fff;  font-weight: 800; margin: 0 auto;  }
body#detail {padding-top: 1.5em;}
body#detail div#hlavicka h1 {color: #2d81ac; }


div#mutaceapocasi {display: flex; justify-content: center; margin: auto; max-width: 470px;}
div.mutace {width: 100%; max-width: 170px; margin-top: 1em; margin-bottom: 1em;}
div.mutace img {width: 35px;/*margin: auto;*/margin: 0 0.25em;}
div.mutace img.socm {height: 22px; width: 22px; margin: 0 0.75em; position: relative; top: 2px;}
div#pocasi {width: 50%; margin: 0 auto;}
div#pocasi h2 {color: #fff; font-size: 1.2em; font-weight: 400;}
div#pocasi p {color: #f0c419; font-size: 1em; font-weight: 600; display: inline-block; vertical-align: middle; position: relative; left:-0.2em;}
div#pocasi p span {font-weight: 400; font-size: 0.8em;}
div#pocasi img {display: inline-block; width: 2em; height: auto; vertical-align: middle; position: relative; top: -0.15em; left:0em;}

div#viceinfo {display: none;}

/*---------menu---------*/
 /*div.menu {width: 100%; max-width: 400px; margin: 0 auto; z-index: 100;}
.menu button {
    background: none;
    border: none;
    color: #f60;
    font-size: 4em;
    cursor: pointer;
    display: block;
    width: 1em;
    height: 1em;
    margin: 0 auto 0.5em auto;
    
}
.menu button:focus {
  outline: none;
}
body#detail .menu button {
   
  
    color: #f60;
   
    
}

 .menu menu {display: none;}

.menu.zobrazit menu {display: block;}
div.menu menu {margin-top: 0.1em;}


div.menu li {list-style: none;}*/
div.menu a {display: block; font-weight: 300;  font-size: 1.2em; color: #fff; padding: 0.35em 0;  text-decoration: none; margin: auto;}
div.menu li a#domu {background: #e73e17;}
div.menu li a#vitosti {background: #ff6e03;}
div.menu li a#okou {background: #f4ba32;}
div.menu li a#onas {background: #cb935c;}
div.menu li a#sku {background: #a3907d;}
div.menu li a#blog {background: #898989;}


div.menu li a#last {background: #c6ad84; border-bottom: none; margin-bottom: 1em; width: 127px; position: relative; left: -2px;}
div.menu a:hover  {letter-spacing: 0.05em; color: #fff; }



/*-------menu-------*/

.menu button {
display: none;
}
 .menu menu {display: block; }
 div.menu {width: 100%; max-width: 1400px;  margin: 0 auto;  }
 
 div.menu li {display: inline; margin: -1px -2px 0 -3px;}

div.menu a {display: inline-block; line-height: 2.45em; width: 130px; height: 50px; padding: 0;  text-decoration: none;  margin: 0; text-align: center; font-size: 1.3em; }
div.menu span {padding: 0.1em 0;  transition: all 1s;}
div.menu a:hover span {border: 1px solid #fff; border-right: none; border-left: none; }
body#home div.menu a#domu span,
body#okoupi div.menu a#okou span,
body#nemo div.menu a#vitosti span,
body#kage div.menu a#onas span,
body#brog div.menu a#blog span,
body#ospanel div.menu a#sku span,
body#kont div.menu a#last span {border: 1px solid #fff; border-right: none; border-left: none;}
body#okoupi div.menu a#okou:hover span,
body#home div.menu a#domu:hover span,
body#nemo div.menu a#vitosti:hover span,
body#kage div.menu a#onas:hover span,
body#brog div.menu a#blog:hover span,
body#ospanel div.menu a#sku:hover span,
body#kont div.menu a#last:hover span {letter-spacing: 0; }
div.menu a:hover  {background: none;  }
div#mutaceapocasi {margin-top: 1em;}
div.menu {
  margin-top: 0px;  width: 400px; left: 50%; margin-left: -200px; z-index: 10; 
  position: absolute; /* Set the navbar to fixed position */
  top: 0; /* Position the navbar at the top of the page */
  }
  div#hlavicka {padding-top: 150px;}




div#vyhledavani {width: 100%; margin: 1em auto 0 auto; max-width: 1920px;}
br.vyhledbr {
    display: block;
}
div#vyhledavanibox {
    background-color: #fff; width: calc(100% - 18px); margin: auto; max-width: 1000px; box-shadow: 0 5px 10px #42718b; border: 9px solid rgba(45, 129, 172, 0.25);
}
div#vyhledavanibox select, div#vyhledavanibox button, div#vyhledavanibox input, div#vyhledavanibox label {
    font-family: 'Advent Pro', sans-serif; font-family: 'Alfa Slab One', serif; font-family: 'Bebas Neue', sans-serif; font-family: 'Russo One', sans-serif; font-family: 'Gruppo', sans-serif; font-family: 'Roboto', sans-serif; font-family: 'Exo 2', sans-serif; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 1em; color: rgb(45, 129, 172);
}
div#vyhledavanibox select, div#vyhledavanibox .multiselectType, div#vyhledavanibox .multiselectLocation {
    display: inline-block;
    height: 3em;
    width: 10.5em;
    border: 0;
    outline: 0;
    margin-right: 1.5em;
    background-color: white;
    box-shadow: inset 0 0 0 1px #fff !important;
}
div#vyhledavanibox select:focus {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: inset 0 0 0 1px #fff !important;
}
div#vyhledavanibox button {
    display: inline-block;    
    height: 3em;
    width: 4em;
    border: 0;
    margin: 0;
    background-color: #2d81ac;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../img/filter-search.png);
    float: none;
    cursor: pointer;
}
div#vyhledavanibox button[type=button] {
    display: block;    
    height: 3em;
    width: 4em;
    border: 0;
    margin: 0 auto;
    background-color: #2d81ac;
    background-image: none;
    color: white;
    font-size: 100%;
    float: none;
    cursor: pointer;
}
div#vyhledavanibox input {
    display: inline-block;    
    margin-right: 1em;
    width: 1em;
    height: 1em;
    position: relative;
    top: 0.15em;
}
div#vyhledavanibox .img {
    display: inline-block;
    margin-right: 1.5em;
    position: relative;
    top: 0.6em;
    height: 1.8em;
    width: 1.8em;
    background-position: -0.33em -0.33em;
    background-repeat: no-repeat;
    background-size: 130% 130%;
}
div#vyhledavanibox .multiselectType, div#vyhledavanibox .multiselectLocation {
  /*width: 200px;*/
  position: relative;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}
div#vyhledavanibox .selectBoxType, div#vyhledavanibox .selectBoxLocation {
  position: relative;
}
div#vyhledavanibox .selectBox select, div#vyhledavanibox .selectBoxType select, div#vyhledavanibox .selectLocation select {
  width: 100%;
  /*font-weight: bold;*/
}
div#vyhledavanibox .overSelectType, div#vyhledavanibox .overSelectLocation {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
div#vyhledavanibox #checkboxestype, div#vyhledavanibox #checkboxeslocation {
  display: none;
  width: 15em;
  position: absolute;
  left: -2.5em;
  right: 0;
  top: 3em;
  bottom: 0;
  z-index: 10;
  background-color: white;  
  border-top: 1px #767676 solid;
}

div#vyhledavanibox #checkboxestype label, div#vyhledavanibox #checkboxeslocation label {
  display: block;
  background-color: white;
  border-right: 1px #767676 solid;
  border-left: 1px #767676 solid;
  text-align: left;
  padding: 0.05em 1em;
}
div#vyhledavanibox #checkboxestype label:last-child, div#vyhledavanibox #checkboxeslocation label:last-child {
  border-bottom: 1px #767676 solid;
  padding-bottom: 0.2em;
}

div#vyhledavanibox #checkboxestype label:hover, div#vyhledavanibox #checkboxeslocation label:hover {
  background-color: #ddeeff;
}
div#vyhledavanibox #checkboxestype label input, div#vyhledavanibox #checkboxeslocation label input {
    margin-right: 0.66em;
    padding-top: 0;
}


div.vypis {display: flex; justify-content: center; flex-wrap: wrap; margin: 1em auto;  padding: 1em 0 2em 0;}
/*------------------paralax pod v?pisem--------------*/
div.paralax {
position: relative;
min-height: 500px;

background-position: center;
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
}
div.paralax h1.hlavninadpis {color: #fff;  padding-top: 1em; font-size: 3em; text-transform: uppercase; margin-bottom: 0; text-shadow: 2px 2px 15px #2d81ac;  }
div.jedna {background-image: url(../img/paralax1.jpg); padding-bottom: 2em;}



div.barak {cursor: pointer; display: block; width: 90%; max-width: 300px; border: 1px solid #ccc; border-radius: 10px; margin: 0.5em; text-decoration: none; color: #49626f; background: #fff; box-shadow:  2px 2px 15px #2d81ac; }
.horniblok {position: relative; margin: 0.5em auto; height: 210px; overflow: hidden;  }
.horniblokimg {width: calc(100% - 1em); /*max-width: 285px;*/; height: 100%; margin: 0 0.5em 0 0.5em; background-repeat: no-repeat; background-position: center; background-size: cover;}
p.typ, p.sleva, p.prodano, p.rezervace, p.refid {position: absolute; background: #fff; padding: 2px 5px; border-radius: 5px;}
p.typ {float: left;  top: 7px; left: 15px; background: #42b4a9; color: #fff; }
p.sleva, p.prodano, p.rezervace {float: right;  top: 7px; right: 15px; background: #ed7310; color: #fff;}
p.prodano {background: #e73e17;}
p.rezervace {background: #f4ba32;}
p.refid {background: #2d81ac; color: white; bottom: 7px; left: 15px; margin: 0 auto; font-size: 80%;}


div.levy {float: left; margin-left: 5px;}
div.levy img, div.levy p {float: left;}
div.levy img {width: 30px; }
div.pravy {float: right; margin-right: 5px;}
div.pravy a {color: #49626f; overflow: hidden;}
div.pravy img, div.pravy p {float: left;}
div.pravy img {width: 2.35em; vertical-align: middle; position: relative; top: -3px;}
div.pravy img.hover {display: none; }
hr {clear: both;}
div.barak h1 {font-size: 1.4em; color: #2d81ac; font-weight: 400; margin: 0.75em auto; }
div.spodnilista {display: flex; margin: 0.5em auto; width: 90%; justify-content: space-around;}
div.spodnilista img {width: 30px;}

p.loznice img, p.koupelna img, p.rozloha img, p.bazen img {margin-right: 5px;}



div#uvod {margin: 1em auto;  }
div#mapa {position: relative;cursor: pointer;}
/*div#mapa .mapdiv .mapbtn {display: inline-block; padding: 0.15em 0.20em 0 0.20em; margin-left: 0.15em; background: #6d828c; color: white; border-radius: 0.25em; line-height: 100%;}*/
div#mapa img {width: 100%; margin: auto; max-width: 800px; }
div.text {width: 90%;  color: #2d81ac; margin: 1em auto;}
div.text h1  {font-size: 2em; text-transform: uppercase;}
div.text h4 {   font-family: 'Glass Antiqua', cursive;  font-family: 'Sriracha', cursive;     font-family: 'Sedgwick Ave', cursive;   font-family: 'Playball', cursive;
font-size: 1.5em; color: #fe419a; font-weight: 200;}
div.text p {color: #49626f; max-width: 600px; line-height: 1.6em; text-align: justify; margin: 1em auto; }

div#copy {background: #375c6f; padding: 2em 0; margin: 2em auto 0 auto; width: 100%; color: #fff;}
div#copy a {color: #71c2ec;}
div#copy p {margin: 1em auto;}


/*-------------------nemovitosti--------------------*/
 body#nemo div#hlavicka {width: 100%; background: url(../img/properties1.jpg) no-repeat #fff; background-size: cover; background-position: center;  margin: auto; z-index: 1;}
 body#nemo div#hlavicka.properties1 {background-image: url(../img/properties1.jpg);}
 body#nemo div#hlavicka.properties2 {background-image: url(../img/properties2.jpg);}
 body#nemo div#hlavicka.properties3 {background-image: url(../img/properties3.jpg);}
 body#nemo div#hlavicka.properties4 {background-image: url(../img/properties4.jpg);}
 body#nemo div#hlavicka.properties5 {background-image: url(../img/properties5.jpg);}
body#nemo div#hlavicka h1 {width: 98%; color: #fff; font-weight: 800; margin: 0 auto;  }
div#vypisvse h1.hlavninadpis {color: #2d81ac; font-size: 3em; margin: 1em auto 0 auto; text-transform: uppercase;}
div#vypisvse h2.hlavninadpis {color: #2d81ac; font-size: 2em; margin: 2em auto 0 auto; text-transform: uppercase;}
div#vypisvse div.barak {box-shadow:  none;} 

/*-------------------------o n?-----------------------*/
 body#kage div#hlavicka {width: 100%; background: url(../img/about1.jpg) no-repeat #fff; background-size: cover; background-position: center;  margin: auto; z-index: 1;}
 body#kage div#hlavicka.about1 {background-image: url(../img/about1.jpg);}
 body#kage div#hlavicka.about2 {background-image: url(../img/about2.jpg);}
 body#kage div#hlavicka.about3 {background-image: url(../img/about3.jpg);}
 body#kage div#hlavicka.about4 {background-image: url(../img/about4.jpg);}
 body#kage div#hlavicka.about5 {background-image: url(../img/about5.jpg); background-position: top right;}
body#kage div#hlavicka h1 {width: 98%; color: #fff; font-weight: 800; margin: 0 auto;  }
div.person {width: 90%; margin: 1em auto; max-width: 800px;}
div.post {width: 90%; margin: 1em auto; max-width: 900px;}
div#onas div.person h2 {color: #7bae62;}
div#blog div.post h2 {color: #2d81ac; font-size: 2em;}
div.person img {margin: 0.5em 0.2em; width: 50px;}
div#onas h3 {font-size: 1.4em; width: 90%; margin: 1em auto; color: #2d81ac; line-height: 1.2em;}
div#blog h3 {font-size: 1.2em; width: 100%; margin: 0.66em 0 0 0; color: #7bae62; line-height: 1em; text-align: center; font-weight: 600;}
div#blog h3 a {color: #7bae62; text-decoration: none;}
div#blog h3 a.active {font-weight: 700; font-size: 1.25em; padding-top: 0.22em}


 body#brog div#hlavicka {width: 100%; background: url(../img/about1.jpg) no-repeat #fff; background-size: cover; background-position: center;  margin: auto; z-index: 1;}
 body#brog div#hlavicka.blog1 {background-image: url(../img/about1.jpg);}
 body#brog div#hlavicka.blog2 {background-image: url(../img/about2.jpg);}
 body#brog div#hlavicka.blog3 {background-image: url(../img/about3.jpg);}
 body#brog div#hlavicka.blog4 {background-image: url(../img/about4.jpg);}
 body#brog div#hlavicka.blog5 {background-image: url(../img/about5.jpg);}



/*------------------------detail-------------------------- */

body#detail div#hlavicka {width: 100%; margin: auto; z-index: 1;}
body#detail div#hlavicka h1 {width: 98%; color: #2d81ac; font-weight: 500; margin: 0 auto; line-height: 1.2; font-size: 300%;}
body#detail div#hlavicka h1 span {font-weight: 800; font-size: 110%;}
div#popis, div#mapa {width: 90%; margin: auto; max-width: 900px; border-radius: 2em;}
div#popis {margin-top: 8em; clear: both;}
div#popis p {text-align: justify; margin: 0.5em auto; text-align-last: center;}
div#mapa {position: relative; max-width: 900px;
    
    padding-top: 1em;
    
    margin: 1em auto;} 
iframe {max-width: 900px; margin: 1em auto; border-radius: 2em; outline: 0};
iframe:focus {outline: 0; border: 0;}
div#odkazatisk {display: block; width: 90%; max-width: 900px; margin: 1em auto 1em auto;} 
div#odkazatisk .vpravo {float: right; width: 66%;} 
div#odkazatisk .vlevo {float: left; width: 33%;} 
div#odkazatisk .vlevo p {text-align: left; margin-top: 0.75em;} 
div#odkazatisk .vlevo p.cena {font-weight: 400; font-size: 120%; margin-top: 0.5em;} 
div#odkazatisk .vlevo img {width: 40px; vertical-align: middle;} 
div#odkazatisk .parametr {float: right;} 
div#detailhlavnifoto, div#detailhlavnifoto a, div.detailhlavnifoto, div.detailhlavnifoto a {width: 100%; margin: auto; height: 500px;}
div#detailhlavnifoto a, div.detailhlavnifoto a {background-position: center; background-size: cover; background-repeat: no-repeat; display: inline-block; border-radius: 1em;}
div.parametr {margin: 0.1em;  padding: 0.5em; width: 100px;}
div.parametr img {margin: 0.25em auto; width: 40px;}
p.hodnota {font-weight: 600; margin: 0 auto;}
img.hlavnifoto {border-radius: 1em;}
div#popisamapa div {max-width: 400px; margin: 1em;}
div#popisamapa p {text-align: justify; margin: 0.5em auto; line-height: 1.4em;}

div.techpopis  {width: 90%; max-width: 1000px; margin: 2em auto;} 
div.techpopis p  {width: 90%; max-width: 800px; margin: 1em auto;} 
div#ostatniparametry {display: flex; flex-wrap: wrap; justify-content: center; margin: 0.5em auto;}
div.formular {margin-top: 3em;}
div.formular table {border-radius: 2em; background-color: #e0e0e0; width: 90%; margin: 1em auto; max-width: 900px; text-align: left; font-weight: 200; font-size: 1.1em; padding: 1em 1em 0 1em; border: 0}
div.formular table td {border: 1px solid #e8f2fb; padding: 0.5em; text-align: right; border: 0;}
div#ostatniparametry {width: 90%; margin: auto; max-width: 1000px;}
div.formular h2 {color: #2d81ac;}
div.formular input[type=text], div.formular input[type=email], div.formular select, div.formular textarea {
font-family: 'Chakra Petch', sans-serif;
font-family: 'Kaushan Script', cursive;
font-family: 'Montserrat', sans-serif;
font-family: 'Teko', sans-serif; 
border: 0;
outline: 0;
background-color: white;
border-radius: 0.5em;
padding: 0.25em 0.5em;
font-size: 1.1em;
letter-spacing: 0.025em;
width: calc(100% - 1em);
font-weight: 300;
}
div.formular input[type=submit] {
font-family: 'Chakra Petch', sans-serif;
font-family: 'Kaushan Script', cursive;
font-family: 'Montserrat', sans-serif;
font-family: 'Teko', sans-serif;   
}
div.formular input[type=checkbox] {
border: 0 !important;
outline: 0 !important;
background-color: white;
border-radius: 0.5em;
width: 1.5em;
height: 1.5em;
vertical-align: middle;
}
div.formular textarea {
line-height: 1.2;
height: 10em;
}
div.formular select {
width: 100%;
font-weight: 300;
letter-spacing: 0.025em;
}
div.formular option {
font-weight: 300;
letter-spacing: 0.025em;
}
div.formular p.alert b {
    color: green;
}
div.formular p.alert strong {
    color: red;
}


/*------------------------o koupi-------------------------- */
body#okoupi div#hlavicka {background: url(../img/buy1.jpg) no-repeat; }
body#okoupi div#hlavicka.buy1 {background-image: url(../img/buy1.jpg);}
body#okoupi div#hlavicka.buy2 {background-image: url(../img/buy2.jpg);}
body#okoupi div#hlavicka.buy3 {background-image: url(../img/buy3.jpg);}
body#okoupi div#hlavicka.buy4 {background-image: url(../img/buy4.jpg); background-position: bottom center;}
body#okoupi div#hlavicka.buy5 {background-image: url(../img/buy5.jpg);}
div#koupe {width: 100%; margin: 1em auto;}
div.trojka {width: 90%; margin: 1em auto;}
div.trojka p {margin: 1em auto; line-height: 1.5em; text-align: justify; color: #285a73; }
div#koupe h1, div#onas h1, div#ospanelsku h1, div#ospanelskugal h1 {font-size: 3em; color: #2d81ac; text-transform: uppercase;}
div#koupe h2, div#onas h2, div#ospanelsku h2, div#ospanelskugal h2 {color: #2d81ac;}
div#koupe h3, div#ospanelsku h3, div#ospanelskugal h3 {color: #7bae62; margin: 0.5em auto;}
div#onas p, div#blog p, div#ospanelsku p, div#ospanelskugal p {width: 90%; max-width: 1000px; margin: 1em auto; text-align: justify; text-align-last: center;}

div#koupe div#koupetext span {color: #e7bb24;}
div#koupe p#navod {font-size: 1.6em; font-weight: 600;}
div#koupe ul {text-align: left;}
div#koupe ul li {list-style-type: square;}
div#koupe table {margin: 1em auto; width: 99%; max-width: 1600px; text-align: left; font-size: 1.1em; border-collapse: collapse;}
div#koupe table td {padding: 0.5em; border: 1px solid #efefef; }
div#koupe div#koupetext {margin: 1em auto; width: 90%; max-width: 800px;}
div#koupe div#koupetext h1 {font-size: 3em; margin-top: 0.25em; padding-top: 0; line-height: 1em;}
div#koupe div#koupetext h2 {margin-bottom: 1em;}

div#koupe div#koupetext p {margin: 1em auto; text-align: justify; line-height: 1.6em;}
div#koupe div#koupetext p.center {text-align: center;}
div#koupe div#koupetext ul, div#koupetext table {text-align: left;}
div#koupe img.slunce {width: 20px;}
div#koupe table tr:nth-child(odd) {background: #e1f7d6;}
div#koupe table tr td:first-child {font-weight: 300;}
div#koupe table td[colspan] {text-align: center;}
div#koupe img#sunbig {width: 90%; max-width: 120px; margin: 1em auto;}
div#koupe .koupekrok {margin-bottom: 2em;}

/*---------------------o ?pan?sku--------------------------*/
body#ospanel div#hlavicka {background: url(../img/spain1.jpg) no-repeat #ccc; background-position: center;}
body#ospanel div#hlavicka.spain1 {background-image: url(../img/spain1.jpg); background-position: bottom center;}
body#ospanel div#hlavicka.spain2 {background-image: url(../img/spain2.jpg); background-position: bottom center;}
body#ospanel div#hlavicka.spain3 {background-image: url(../img/spain3.jpg);}
body#ospanel div#hlavicka.spain4 {background-image: url(../img/spain4.jpg);}
body#ospanel div#hlavicka.spain5 {background-image: url(../img/spain5.jpg);}
body#ospanel img.typicky {width: 100%; max-width: 1200px; margin: 0.5em auto;}
div#ospanelskugal a.barak {cursor: pointer; display: block; width: 150px; height: 150px; border: 1px solid #ccc; border-radius: 10px; margin: 0.5em; text-decoration: none; color: #49626f; background: #fff; box-shadow: none; }
div#ospanelskugal .horniblok {margin: 0.5em auto; height: 100%; width: 100%; overflow: hidden;  }
div#ospanelskugal .horniblokimg {width: calc(100% - 1em); /*max-width: 285px;*/; height: calc(100% - 1em); object-fit: cover;}
#reference .horniblok {margin: 0.5em 1.5em; height: 12em; width: 100%; overflow: hidden;}
#reference .horniblokimg {width: calc(100% - 3em); /*max-width: 285px;*/; height: calc(100%); object-fit: cover;}
/*----------------------kontakt--------------------*/
body#kont div#hlavicka {width: 100%; background: url(../img/contacts1.jpg) no-repeat #fff; background-size: cover; background-position: center;  margin: auto; z-index: 1;}
body#kont div#hlavicka.contacts1 {background-image: url(../img/contacts1.jpg);}
body#kont div#hlavicka.contacts2 {background-image: url(../img/contacts2.jpg);}
body#kont div#hlavicka.contacts3 {background-image: url(../img/contacts3.jpg);background-position: top center;}
body#kont div#hlavicka.contacts4 {background-image: url(../img/contacts4.jpg);}
body#kont div#hlavicka.contacts5 {background-image: url(../img/contacts5.jpg);}
body#kont div#hlavicka h1 {width: 98%; color: #fff; font-weight: 800; margin: 0 auto;  }
div#firma, div#mailteams, div#mailwhatsapp {width: 90%; max-width: 1600px; margin: 2em auto;}
div.obalflex {display: flex;  justify-content: center; flex-wrap: wrap; gap: 0em;}
div#firma img {width: 150px; margin: 0.5em auto;}
div#mailteams img, div#mailwhatsapp img {width: 50px; margin: 0.5em 0.1em;}




/*---------------------reference-----------------*/
div#reference h2 {font-size: 3em; text-transform: uppercase; color: #2d81ac; margin: 1em auto 0 auto;}

div#flexreferenci {display: flex; justify-content: center; flex-wrap: wrap;}
div#flexreferenci div {overflow: hidden; width: 90%; max-width: 420px; margin: 0.5em; border: 1px solid #dcf2fd; border-radius: 1em;}
div#flexreferenci div h3 {color: #7bae62; margin: 1em auto; width: 90%; text-align: left; font-weight: 600;  font-size: 1.3em; }
div#flexreferenci div h4 {color: #7bae62; font-weight: 400;  font-size: 1.1em; }
div#flexreferenci div img {width: 70px; margin: auto;}
div#flexreferenci div span {margin: 0.5em auto; display: inline-block; width: 90%;}
div#flexreferenci div span a {margin: 0.25em 1.5em 0.25em 0; display: inline-block; float: left;}
div#flexreferenci div p {width: 90%; text-align: justify; font-size: 0.9em; margin: 1em auto; color: #0d567b;}
div#flexreferenci img[alt="Facebook"], div#flexreferenci img[alt="Instagram"] {width: 80px; height: 80px; cursor: pointer;}




div#parametry, div#popisamapa {display: flex;  justify-content: center; flex-wrap: wrap;} 
div.parametr {margin: 0.1em;  padding: 0.5em; width: 100px;}
div.parametr img {margin: 0.25em auto; width: 40px;}
p.hodnota {font-weight: 400;}
div#detailhlavnifoto, div.detailhlavnifoto {max-width: 1000px; margin: 1em auto;}
div#popisamapa p {text-align: justify; margin: 0.5em auto; line-height: 1.4em;} 
div.dalsifoto {display: flex; justify-content: center; flex-wrap: wrap; width: 100%;} 
div.dalsifoto a {max-width: 33%; margin: 5px 1px; display: inline-block;}
div.dalsifoto img {height: 90px; width: 100%; object-fit: cover;}
div.dalsifoto object {height: calc(100px * 1.42); width: 100px; margin: 1px; pointer-events: none;}
div.dalsifoto .pdfs {width: 100%; clear: both; float: none; margin-top: 1em; font-size: 100%; display: flex; justify-content: center; flex-wrap: wrap;}
div.postfoto {display: flex; justify-content: center; flex-wrap: wrap; width: 100%; margin-top: 2em;} 
div.postfoto a {max-width: 33%; margin: 5px 5px; display: inline-block;}
div.postfoto img {height: 90px; width: 100%; object-fit: cover;}
div.postfoto object {height: calc(100px * 1.42); width: 100px; margin: 1px; pointer-events: none;}
div.postfoto .pdfs {width: 100%; clear: both; float: none; margin-top: 1em; font-size: 100%; display: flex; justify-content: center; flex-wrap: wrap;}
span.skryt {display: none;}
body#detail h2 {margin: 1em auto; max-width: 1000px;}
body#detail a.button {margin: auto;}
img.hlavnifoto {width: 90%; margin: 1em auto; max-width: 1000px;}
.scrollable-table {
  overflow-x: auto;
}

@media screen and (min-width: 364px) {
div#hlavicka  {min-height:300px;}
body#detail div#hlavicka {min-height:100px;}
}

@media screen and (min-width: 500px) {
div#hlavicka {min-height:450px;}
div#hlavicka h1 {font-size: 3em;}
div.text h1 {font-size: 5em;}
div.mutace {width: 100%; max-width: 180px; margin-top: 1em; margin-bottom: 1em;}
div.mutace img {width: 50px;/*margin: auto;*/margin: 0 0.25em;}
div.mutace img.socm {height: 32px; width: 32px; margin: 0 0.75em; position: relative; top: 2px;}
div#pocasi p {color: #f0c419; font-size: 1.5em; font-weight: 600; display: inline-block; vertical-align: middle; position: relative; left:-0.2em;}
div#flexreferenci img[alt="Facebook"], div#flexreferenci img[alt="Instagram"] {width: 123px; height: 123px; cursor: pointer;}
}


@media screen and (min-width: 800px) {

.mutacealert {
    position: fixed;
    bottom: 0;
    left: 0;
    background: #f0c419;
    height: 2.5em;
    width: 100%;
    text-align: center;
    font-size: 1.5em;
    line-height: 2.5em;
    padding: 0;
    color: black;
}

}

@media screen and (min-width: 900px) {

  
}


@media screen and (min-width: 1000px) {

 
body#home div#hlavicka {background: url(../img/homepage1.jpg); background-size: cover;}
body#okoupi div#hlavicka {background: url(../img/buy1.jpg); background-size: cover; }
body#nemo div#hlavicka {background: url(../img/properties1.jpg); background-size: cover; }
body#kage div#hlavicka {background: url(../img/about1.jpg); background-size: cover; } 
body#ospanel div#hlavicka {background: url(../img/spain1.jpg); background-size: cover; } 
body#kon div#hlavicka {background: url(../img/contacts1.jpg); background-size: cover; } 
 
body#home div#hlavicka h1,
body#okoupi div#hlavicka h1,
body#nemo div#hlavicka h1,
body#kage div#hlavicka h1,
body#ospanel div#hlavicka h1,
body#kont div#hlavicka h1 {margin-top: 0; color: #fff; text-shadow: 0 5px 10px #42718b;}
div#koupe h1,
div#onas h1 {font-size: 4em; margin: 0.5em auto 0 auto;}
div#ospanelsku h1, div#ospanelskugal h1 {font-size: 4em; margin: 0.5em auto 0 auto;}

}

@media screen and (min-width: 1080px) {
div.menu {
  margin-top: -1px;  width: 1030px; left: 50%; margin-left: -515px; z-index: 10; 
  position: fixed; /* Set the navbar to fixed position */
  top: 0; /* Position the navbar at the top of the page */
  }
div.menu a {display: inline-block; line-height: normal;  width: 150px; height: 60px; padding: 0;  text-decoration: none;  margin: 0; text-align: center; font-size: 1.3em;   display: table-cell; vertical-align: middle;  }  
div.menu li a#last {width: 147px;}
div#hlavicka {padding-top: 62px;}     
}
@media screen and (min-width: 1230px) {
    
br.vyhledbr {
    display: none;
}
div#vyhledavanibox button {
    float: right;
}
div#vyhledavanibox button[type=button] {
    display: inline-block;    
    height: 3em;
    width: 4em;
    border: 0;
    margin: 0 1.25em 0 0;
    background-color: #2d81ac;
    background-image: none;
    color: white;
    font-size: 100%;
    float: left;
    cursor: pointer;
}
    
div#uvod,
div#obaltrojky {display: flex;  justify-content: center;  }
div.trojka {margin: 1em; max-width: 400px; background: #f3fbff; padding: 1em 2em; border-radius: 1em;}
div.text {width: 95%; margin-left: 5%;  text-align: left; color: #2d81ac; margin: 2em auto 0 auto; }
div.text h4 {margin: 0;}
div#mapa {max-width: 1100px; }
div#mapa img {width: 90%; margin: 0; max-width: 1100px; }
div.text p {text-align: left; margin: 2em 0; }
body#home a.button {margin: 2em 0;}
body#home div#flexreferenci div span a {margin: 0.25em 1.5em 0.25em 0; display: inline-block; float: left;}

/*-------------------detail--------------------*/

div.obalflex {width: 90%; max-width: 1920px; display: flex; justify-content: center; margin: 0.5em auto; /*----padding: 2em 0; background: #e8f2fb; border-radius: 1em;----*/}
div#detailhlavnifoto, div.detailhlavnifoto {max-width: 900px; margin: 1px 0.5em; display: flex;  align-content: center; height: 675px; }
div#detailhlavnifoto a, div.detailhlavnifoto a {border-radius: 1em; height: 675px;}

div#parametry {display: flex; max-width: 220px; align-content: center; justify-content: center; place-self:  center ; margin-left: 0; padding-left: 0; order: -1; }
div.parametr {padding: 0.5em; max-width: 90px; }
div.parametr img {margin: 0.25em; width: 30px;}

/*------------------o n?--------------------*/
div#obalperson {display: flex;  justify-content: center; flex-wrap: wrap; }
div#obalpost {display: flex;  justify-content: center; flex-wrap: wrap; margin-top: 1.5em; }
div.person {max-width: 500px; margin: 1em;}
div.post {max-width: 900px; margin: 1em 1em 0.5em 1em;}


} 

@media screen and (min-width: 1300px) {
div#hlavicka h1 {margin-top: 1em; font-size: 4em;}

div#mapa {min-width: 700px;}

}


@media screen and (min-width: 1400px) {
div#mapa {min-width: 800px;}
div#hlavicka h1 {margin-top: 0;}
div#vyhledavani {width: 98%;}
div#vyhledavanibox {
    width: 90%;
}
}


@media screen and (min-width: 1500px) {
div.text {width: 95.5%; margin-left: 4.5%;/*7.5*/}
div#mapa img {width: 100%;}
div.dalsifoto {width: 220px; display: flex; align-content: center; justify-content: center; place-self:  center ; }
div.dalsifoto a {max-width: 24%; margin: 0px 1px; display: inline-block;}
div.dalsifoto img {height: 36px; width: 100%; border-radius: 5px; object-fit: cover;}
div.dalsifoto object {height: calc(100px * 1.42); width: 100px; margin: 1px; border-radius: 5px; pointer-events: none;}
div.dalsifoto .pdfs {width: 100%; clear: both; float: none; margin-top: 1em; font-size: 120%; font-weight: 400; display: flex; justify-content: center; flex-wrap: wrap;}
}



@media screen and (min-width: 1700px) {
div#hlavicka h1 {margin-top: 0; }
div#vyhledavani {margin-top: 3em;}
div.obalflex {display: flex;  justify-content: center; flex-wrap: wrap; gap: 1em;}
}

.grecaptcha-badge { 
    visibility: hidden;
}