/* 0 px - 640 px */
@media screen and (max-width: 640px){
  .rs_mob_nev{ display: none; }
  .pbloky{
   grid-template-columns: repeat(1,1fr);
  }
  H1.motto{
    top: 200px;
    right: auto;
    left: 0px;
    max-width: none;
    text-align: center;
    font-size: 27px;
    padding: 0px 20px;
  }
  A.rezervace,
  A.rezervace:link,
  A.rezervace:visited{
    top: 48%;
    right: 20px;
    padding: 10px 10px;
    font-size: 25px;
  }
  .fotogalerie,
  .fotogalerie2{
    grid-template-columns: 1fr 1fr;
  }
  DIV.balicky,
  DIV.balicky.balickyP,
  DIV.pokoje,
  DIV.pokoje.pokojeP{
   grid-template-columns: calc(100% - 50px);
   padding: 50px 0px;
  }
  DIV.bobram,
  DIV.pobram{ width: calc(100% + 20px); }
  .balicky DIV.bobr H3{ font-size: 10vw; }
  .pokojeL DIV.pobr H2{ right: -30px; }
  DIV.balicky.balickyL DIV.bvyb,
  DIV.pokoje.pokojeL DIV.pvyb{ padding: 70px 0px 0px 20px; width: calc(100% - 20px); }
  DIV.pokoje DIV.pvyb DIV.padL20{ padding: 50px 0px 0px 20px; }
  DIV.balicky.balickyP DIV.bobr,
  DIV.pokoje.pokojeP DIV.pobr{ order: 1; margin-left: 50px; }
  DIV.balicky.balickyP DIV.bvyb,
  DIV.pokoje.pokojeP DIV.pvyb{ order: 2; padding: 50px 0px 0px 0px; }
  .balickyP DIV.bobr H2{ left: -32px; }
  .balickyP DIV.bobr H3{ padding: 10px 50px 0px 0px; }
  .pokoj{ grid-template-columns: 100%; }
  .pokoj .pokojP{ padding: 30px 30px 0px 30px; }
  .pokoj .pokojP H2{ padding-top: 20px; }
  .tipy{ padding-right: 20px; grid-template-columns: repeat(1,1fr); }
}
/* 0 px - 1000 px */
@media screen and (max-width: 1000px){
  .rs_nev{ display: none; }
  .rs_block{ display: block; }
  .rs_center{ text-align: center; }
  .rs_nowrap{ white-space: nowrap; }
  
  BODY{ font-size: 16px; padding-top: 0px; }
  BODY.BODY2{ font-size: 16px; padding-top: 77px; }

  H1{
    display: block;
    font-size: 45px;
  }
  H2{
    display: block;
    font-size: 30px;
  }
  DIV.logo,
  .BODY2 DIV.logo{
    top: 0px;
    left: 0px;
    width: 145px;
  }
  
  A.ico_menu,
  A.ico_menu:link, A.ico_menu:visited{
   position: fixed;
   top: 16px;
   right: 16px;
   display: block;
   width: 42px;
   height: 42px;
   background-image: url(obr/ico_menu.png);
   background-repeat: no-repeat;
   background-position: center center;
   cursor: pointer;
   z-index: 101;
  }
  A.ico_menu:hover, A.ico_menu:active{
   background-image: url(obr/ico_menu_over.png);
  }
  .menupruh,
  .BODY2 .menupruh{
   top: 0px;
   height: 75px;
  }
  .menu,
  .BODY2 .menu{
    position: fixed;
    top: 77px;
    left: 0px;
    display: none;
    width: 100%;
    background-color: #212121;
  }
  .menu A, .menu A:link, .menu A:visited{
    float: none;
    font-size: 18px;
    padding: 10px 20px;
    margin: 0px;
  }
  .menu A:hover, .menu A:active{
    color: #FFFFFF;
    background-color: #595A59;
  }
  
  .vlajky, .BODY2 .vlajky{
    top: 27px;
    right: 70px;
  }
  .vlajky A, .vlajky A:link, .vlajky A:visited{
    margin: 0px 10px 0px 0px;
  }
  .soc_site, .BODY2 .soc_site{
    top: 80px;
    left: 0px;
  }
  .soc_site A, .soc_site A:link, .soc_site A:visited{
    width: 40px;
    height: 40px;
    margin: 0px;
  }
  .main33,
  .mainL,
  .mainL1,
  .mainP,
  .mainP1,
  .mainP2,
  .mainP3{
    width: 90%;
    float: none;
    margin: 0px auto 0px auto;
  }

  .bottom .main{
    min-width: 0px;
    max-width: 90%;
    width: 90%;
  }
  .copy, A.kao:link, A.kao:visited{
   float: none;
   margin: 20px 0px 0px 0px;
   text-align: center;
  }
  .bottom{
   width: 100%;
   min-width: 100%;
   max-width: 100%;
   padding: 50px 0px 100px 0px;
   text-align: center;
  }
  .bottom .main{
    width: 100%;
    min-width: 100%;
    max-width: 100%;
  }
}
/* 641 px - 1000 px */
@media screen and (min-width: 641px) and (max-width: 1000px){
  .fotogalerie,
  .fotogalerie2{
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
  .tipy{ grid-template-columns: repeat(2,1fr); }
}
/* 1001 px - 1100 px */
@media screen and (min-width: 1001px) and (max-width: 1100px){
  .BODY2 .menu A, .BODY2 .menu A:link, .BODY2 .menu A:visited,
  .menu A, .menu A:link, .menu A:visited{
    padding-left: 5px;
    padding-right: 5px;
    letter-spacing: -2px;
    font-size: 20px;
  }
  .vlajky A, .vlajky A:link, .vlajky A:visited{
    margin-right: 20px;
  }
  .tipy{ grid-template-columns: repeat(3,1fr); }
}
/* 1101 px - 1200 px */
@media screen and (min-width: 1101px) and (max-width: 1200px){
  .BODY2 .menu A, .BODY2 .menu A:link, .BODY2 .menu A:visited,
  .menu A, .menu A:link, .menu A:visited{
    padding-left: 5px;
    padding-right: 5px;
    letter-spacing: -2px;
    font-size: 22px;
  }
  .tipy{ grid-template-columns: repeat(3,1fr); }
}
/* 1201 px - 1300 px */
@media screen and (min-width: 1201px) and (max-width: 1300px){
  .BODY2 .menu A, .BODY2 .menu A:link, .BODY2 .menu A:visited,
  .menu A, .menu A:link, .menu A:visited{
    padding-left: 10px;
    padding-right: 10px;
    letter-spacing: -1px;
  }
  .vlajky A, .vlajky A:link, .vlajky A:visited{
    margin-right: 20px;
  }
  .tipy{ grid-template-columns: repeat(3,1fr); }
}
/* 1301 px - 1400 px */
@media screen and (min-width: 1301px) and (max-width: 1400px){
  .BODY2 .menu A, .BODY2 .menu A:link, .BODY2 .menu A:visited,
  .menu A, .menu A:link, .menu A:visited{
    padding-left: 10px;
    padding-right: 10px;
    letter-spacing: -1px;
  }
}
/* 1401 px - 1500 px */
@media screen and (min-width: 1401px) and (max-width: 1500px){
  .BODY2 .menu A, .BODY2 .menu A:link, .BODY2 .menu A:visited,
  .menu A, .menu A:link, .menu A:visited{
    padding-left: 10px;
    padding-right: 10px;
  }
}
/* 1501 px - 1600 px */
@media screen and (min-width: 1501px) and (max-width: 1600px){
  .BODY2 .menu A, .BODY2 .menu A:link, .BODY2 .menu A:visited,
  .menu A, .menu A:link, .menu A:visited{
    padding-left: 18px;
    padding-right: 18px;
  }
}