@media screen and (max-width: 1200px) {
  div#home {
    margin: 85px auto 0px auto;
  }
  div.refcol {
    width: 20%;
  }
}
@media screen and (max-width: 1024px) {
  div.container {
    max-width: 100%;
    padding: 0px 15px 0px 15px;
  }
  p.big {
    font-size: 1.8em;  
  }
  div.quotetop {
    height: 105px;
    margin: -105px auto 0px auto;
  }
  div.quotebot {
    height: 75px;
    background-position: center center;
  }  
  div#newsbot {
    height: 90px;
    background-position: center center;
  }
  div#image div#imagetop {
    height: 85px;
    background-position: center center;
  }
  div#image div#gap {
    height: 150px;
  } 
  div#image div#imagebot {
    position: relative;
    width: 100%;
    height: 133px;
    margin: 0px auto 0px auto;
    z-index: 2000;
    background: url('../images/bgr-imagebot.png') bottom center no-repeat;
  }
  .modal button  {
    right: 10px;
  }
  div#image {
    background-size: 1400px 933px;  
  }
}

@media screen and (max-width: 990px) {
  div#foot p.menu {
    float: left;
    width: 100%;
    text-align: center;
    padding: 0px 0px 10px 0px;
  }
  div#foot p.copy {
    float: left;
    width: 100%;
    text-align: center;
  }
}

@media screen and (max-width: 900px) {
  div#home {
    margin: 95px auto 0px auto;
  }
  nav#mainmenu ul#menu li {
    font-size: 1.1em;
  }
  nav#mainmenu ul#menu li a {
    padding: 0px 10px 0px 10px;
  }
  nav#mainmenu ul#menu li a.lst {
    padding: 0px 0px 0px 10px;
  }
  section#fotogalerie div.photo {
    width: 33.33%;
    padding: 0px 3% 0px 0px;
    margin: 0px 0px 3% 0px;
  }
  div.refcol {
    width: 25%;
  }
}




@media screen and (max-width: 830px) {
  .container {
    padding: 0px 10px 0px 10px;
  }
  nav#mainmenu ul#menu li {
    font-size: 1.0em;
  }
  section#aktuality div.col-1-3, section#vize div.col-1-3 {
    width: 31%;
  }
  section#aktuality div.centcol, section#vize div.centcol {
    margin: 0px 3% 0px 3%;
  }
  section#aktuality div.col-1-3 div.hdr {
    font-size: 1.8em;
  }
  section#aktuality div.col-1-3 h3 {
    font-size: 1.1em;
    margin: 0px 0px 10px 0px;
  }
  section#vize h3 {
    font-size: 1.1em;
  }
  p {
    font-size: 0.8em;
    line-height: 1.4em;
  }
  div#imagereal {
    margin-top:100px;
    height: auto;
    background-size: 1300px auto;
    background-attachment: scroll;   
  }
  div#imagereal div#gap {
    width: 100%;
    height: 50px;
  }
  
  h2.gold, h2.black, h2.white {
    font-size: 1.5em;
    line-height: 1.2em;
  }
  
  div#image {
    background-size: 1200px 800px;  
  }
}

@media screen and (max-width: 780px) {
  nav#mainmenu ul#menu {
    display: none;
  }
  div#slidemenu {
    display: block;
  }
  div#social {
    margin: 40px 0px 0px 10px;
  }
  
  header {
    position: absolute;
  }
  div#home {
    padding: 0px auto 0px auto;
  }
  div#homegap {
    width: 100%;
    height: 10px;
  }
}

@media screen and (max-width: 650px) {
  
  div.refcol {
    width: 33.3%;
  }
  div.quotetop {
    height: 70px;
    margin: -70px auto 0px auto;
    background-position: center center;
  }
  div.quotebot {
    height: 50px;
    background-position: center center;
  }
  section#aktuality div.col-1-3, section#vize div.col-1-3 {
    width: 100%;
    padding: 0px 0px 20px 0px;
  }
  section#aktuality div.centcol, section#vize div.centcol {
    margin: 0px 0px 0px 0px;
  }
  
  section#realizace div.centcol {
    padding: 0px 3% 0px 0px;
    margin: 0px 0px 3% 0px;
  }  
  .flex-direction-nav li a.next {bottom:135px;}
  .flex-direction-nav li a.prev {bottom:100px;}
  
  .hp div#image {
    background-attachment: scroll; 
    background-size: 800px 500px; 
  }
  
  .sp div#image {
    background-size: 1000px auto;  
  }
  .sp div#image div#gap {   
    height: 100px;
  }  
}

@media screen and (max-width: 600px) {
  header {
    height: 120px;
    background-position: bottom left; 
  } 
  div#home {
    margin: 60px auto 0px auto;
  }
  #logo {
    width: 170px;
    height: 60px;
    background-size: 170px 60px; 
  }
  #logo a  {
    width: 170px;
    height: 60px;
  }
  p.big {
    font-size: 1.5em;  
  }
  div#imagereal {
    margin-top: 60px;
    height: auto;
    background-size: 1200px auto;
    background-attachment: scroll;   
  }
  section#fotogalerie div.photo {
    width: 50%;
    max-width: 250px;
    padding: 0px 3% 0px 0px;
    margin: 0px 0px 3% 0px;
  }
  #kontakt div.col-1-3 {
    float: left;
    width: 50%;
  }
  #kontakt div.col-1-3.centcol {
    margin: 0px 0px 0px 0px;
  }
}

@media screen and (max-width: 560px) {
  div.refcol {
    width: 50%;
  }
}

@media screen and (max-width: 500px) {
  div#home {
    margin: 70px auto 0px auto;
  }
  ul.slides li a.wide {
    display: none;
  }
  ul.slides li a.narrow {
    display: block;
  }
  section#realizace div.col-1-3 {
    width: 100%;
    padding: 0px;
  }
  section#realizace div.centcol {
    padding: 0px;
  }
  p {
    font-size: 0.9em;
    line-height: 1.4em;
  }
  div#imagereal {
    margin-top: 65px;
    height: auto;
    background-size: 1000px auto;
    background-attachment: scroll;   
  }
  div#imagereal div#gap {
    height: 20px;
  } 
  div.refcol {
    float: left;
    min-height: auto;
    padding: 0px 20px 20px 0px;
    position: relative;
  }
  #fotogalerie #morebtn {
    float: left;
    width: 50%;
  }
  div#image {
    background-size: 1000px 667px;  
  }
  
}

@media screen and (max-width: 400px) {
  div#home {
    margin: 75px auto 0px auto;
  }
  div#imagereal {
    margin-top: 65px;
    height: auto;
    background-size: 900px auto;
    background-attachment: scroll;   
  }
  div#imagereal div#gap {
    height: 0px;
  }
  #kontakt div.col-1-3 {
    float: left;
    width: 100%;
    padding-bottom: 10px;
  }
  #fotogalerie #morebtn {
    float: left;
    width: 100%;
  }
  div.refcol {
    width: 100%;
  }
}