@media screen and (min-height: 801px)
{
  header.sub-page.penzion { height: 722px; }
}

@media screen and (max-height: 900px)
{
  .banner-menu .item-text { padding: 20px 5px; }
}

@media screen 
and (min-width: 1200px)
and (max-height: 900px)
{
  header { padding-top: 25px; }
  .banner-menu { margin-top: 25px; }
}

@media screen and (max-height: 800px)
{
  header.sub-page.penzion { height: 500px; }
}

@media screen and (min-width: 1851px) 
{
  header.sub-page nav { min-width: 1200px; }
}

@media screen 
and (min-width: 1676px)
and (max-width: 1850px)
{  
  header.sub-page nav { min-width: 1000px; }
}

@media screen and (min-width: 1676px)
{
  header .logo { width: 386px; height: 90px; background-image: url("/images/logo.png"); }
  nav { padding: 25px 0; }
  header:not(.sub-page) nav { max-width: calc(100% - 400px); }
    nav a { font-size: 16px; }
    nav a:not(:last-child) { margin-right: 35px; }
}

@media screen 
and (min-width: 1451px)
and (max-width: 1675px)
{  
  header .logo { width: 325px; height: 76px; background-image: url("/images/logo-325.png"); }
  header nav { padding: 17px 0; }
  header:not(.sub-page) nav { max-width: calc(100% - 350px); }
  header.sub-page nav { min-width: 900px; }
    nav a { font-size: 15px; }
    nav a:not(:last-child) { margin-right: 25px; }
}

@media screen
and (min-width: 1451px)
{
  header .logo { float: left; }
  nav { float: right; } 
  .banner-menu { width: 1400px; }
}

@media screen
and (max-width: 1450px)
{
  header .head { display: -webkit-flex; -webkit-flex-direction: column; -webkit-align-items: center; }
  header .head { display: flex; flex-direction: column; align-items: center; }  
    .navigation { width: 100%; }
    nav { -webkit-justify-content: space-between; }    
    nav { width: 100%; justify-content: space-between; padding: 15px 0; }
      header.sub-page nav a:not(:last-child) { margin-right: 35px; }
}

@media screen
and (min-width: 1201px)
and (max-width: 1450px)
{  
  nav a { font-size: 16px; }
  .banner-menu { width: 95%; }
    .banner-menu .title { display: -webkit-flex; -webkit-justify-content: center; -webkit-align-items: center; }  
    .banner-menu .title { height: 45px; display: flex; justify-content: center; align-items: center; }
}

@media screen
and (min-width: 601px)
and (max-width: 1450px)
{
  header .logo { width: 386px; height: 90px; margin-bottom: 45px; background-image: url("/images/logo.png"); }
}

@media screen and (min-width: 1367px)
{
  .header-icon .icon,
  main:not(.home) .icon,
  .news-frame .icon { width: 125px; height: 125px; }  
  .icon.house-in-hand { background: #3fbfff url("/images/icon/house-in-hand.png") center no-repeat; }
  .icon.park { background: #a9cc4c url("/images/icon/park.png") center no-repeat; }
  .news-frame .icon { background: #ce3c57 url("/images/icon/news.png") center no-repeat; } 
  main:not(.home) .icon { position: absolute; top: -62.5px; left: calc(50% - 62.5px); }
  .news-frame .icon { position: absolute; top: -55px; left: calc(50% - 62.5px); }
  
  .map { height: 515px; }
}

@media screen and (max-width: 1366px)
{
}

@media screen
and (min-width: 481px)
and (max-width: 1366px)
{
  .header-icon .icon,
  main:not(.home) .icon,
  .news-frame .icon { width: 100px; height: 100px; }  
  .icon.house-in-hand { background: #3fbfff url("/images/icon/house-in-hand-64.png") center no-repeat; }
  .icon.park { background: #a9cc4c url("/images/icon/park-67.png") center no-repeat; }
  .news-frame .icon { background: #ce3c57 url("/images/icon/news-40.png") center no-repeat; } 
  main:not(.home) .icon { position: absolute; top: -50px; left: calc(50% - 50px); }
  .news-frame .icon { position: absolute; top: -45px; left: calc(50% - 50px); }
}

@media screen
and (min-width: 1201px)
and (max-width: 1366px)
{
  header h1 { font-size: 45px; }
  header .perex p { font-size: 22px; }
  
  .map { height: 450px; }
}

@media screen and (min-width: 1201px)
{
  .main-frame { width: 1200px; margin: 0 auto; }
  
  header:not(.sub-page) .text { padding-top: 20px; }
  
  main:not(.home) { padding-top: 95px; padding-bottom: 85px; }
  
  .home .tips { margin-bottom: 90px; }
  
  .news-frame { padding-top: 115px; padding-bottom: 90px; }
  
  footer { padding-top: 95px; padding-bottom: 65px; }
  
  article { width: calc(33.33% - 20px); flex-basis: calc(33.33% - 20px); }
  article:not(:last-child) { margin-right: 20px; }
  article:not(:nth-child(-n + 3)) { margin-top: 20px; }
}

@media screen and (max-width: 1200px)
{
  .main-frame { width: 100%; float: left; }
  
  nav a { font-size: 15px; }
  
  .home .tips { margin-bottom: 80px; }
  
  .news-frame article:last-child { display: none; }
}

@media screen
and (min-width: 841px)
and (max-width: 1200px)
{
  header h1 { font-size: 40px; }
  header .perex p { font-size: 19px; }
  
  .banner-menu .item-text { flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
    .banner-menu .title { flex: 1; margin-bottom: 10px; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 18px; } 
    .banner-menu p:last-child) { margin-bottom: 0; }
    .banner-menu .item-text p { height: 75px; font-size: 13px; }
  
  main:not(.home) { padding-top: 85px; padding-bottom: 75px; }
  
  .tip .text { height: 110px; }
    .tip h2,
    .tip h3 { font-size: 23px; }
    .tip .more { font-size: 13px; }
    
  .home .tips { margin-bottom: 70px; }
    
  .news-frame { padding-top: 105px; padding-bottom: 80px; }
  .news-frame article:first-child { margin-right: 30px; }
  
  footer { padding-top: 85px; padding-bottom: 55px; }
  footer .main-frame { float: none; margin: 0 auto; padding: 0; }
  
  .map { height: 400px; }
}

@media screen
and (min-width: 601px)
and (max-width: 1200px)
{
  article { width: calc(50% - 10px); }
  article:not(:nth-child(even)) { margin-right: 20px; }
  article:not(:nth-child(-n + 2)) { margin-top: 20px; }
}

@media screen
and (min-width: 481px)
and (max-width: 1200px)
{
  .main-frame { padding-right: 5%; padding-left: 5%; }
}

@media screen and (min-width: 1001px)
{
  header.sub-page { height: 400px; }
  .menu-button { display: none; }  
  a.home { width: 44px; height: 44px; background-image: url("/images/icon/house.png"); }
  nav { display: -webkit-flex !important; -webkit-align-items: center; }  
  nav { display: flex !important; align-items: center; border-width: 2px 0; border-style: solid; border-color: #fff; } 
}

@media screen and (max-width: 1000px)
{
  header { padding-right: 5%; padding-left: 5%; }
  header.sub-page { height: 550px; }
    .navigation { display: -webkit-flex; -webkit-justify-content: space-between; -webkit-align-items: center; }  
    .navigation { position: relative; display: flex; justify-content: space-between; align-items: center; padding: 15px 0; border-width: 2px 0; border-style: solid; border-color: #fff; } 
      .menu-button { position: relative;padding-left: 55px; cursor: pointer; }
        .menu-button .label { text-transform: uppercase; font-size: 17px; }
        .menu-button .icon { width: 35px; position: absolute; top: calc(50% - 2.5px); left: 2.5%; }
        .menu-button .icon,
        .menu-button .icon:before,
        .menu-button .icon:after { height: 4px; background-color: #fff; }
        .menu-button .icon:before,
        .menu-button .icon:after { content: ""; width: 100%; position: absolute; left: 0; }
        .menu-button .icon:before { top: -10px; }
        .menu-button .icon:after { bottom: -10px; }  
      a.home { width: 35px; height: 35px; background-image: url("/images/icon/house-35.png"); }
      nav { display: none; position: absolute; top: 100%; left: 0; z-index: 101; padding: 5px 0 0 0; } 
        nav a.home { display: none; }
        nav a { width: 100%; float: left; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.2); }
        nav a.active { border-color: #fff; }
        nav .reservation { display: none; }
    header .text { transition: opacity .15s; }
    header .text.in-background { opacity: .1; }
}

@media screen and (min-width: 841px)
{
  body { font-size: 15px; }
  h1 { font-size: 50px; }
  h2 { font-size: 40px; }
  h3 { font-size: 35px; }
  h4 { font-size: 30px; }
  h5, h6 { font-size: 25px; }

  main.home { padding-top: 60px; padding-bottom: 65px; }

  header:not(.sub-page) { height: 100vh; }
  .header-icon:before { left: 13%; }
  .header-icon:after { right: 13%; }
  
  .banner-menu { margin: 50px auto 0 auto; }
    .banner-menu .container { display: -webkit-flex; }
    .banner-menu .container { display: flex; }
      .banner-menu .item { -webkit-flex: 1;-webkit-flex-direction: column; }
      .banner-menu .item { flex: 1; flex-direction: column; }
      .banner-menu .item:not(:last-child) { margin-right: 2.15%; }
        .banner-menu .title { margin-bottom: 25px; }

  .home .icons .icon { width: calc(25% - 2.25px); height: 240px; position: relative; float: left; background-color: #f4f3f3; transition: all .35s; }
  .home .icons .icon:not(:nth-child(4n)) { margin-right: 3px; }
  .home .icons .icon:not(:nth-child(-n + 4)) { margin-top: 3px; }
  
  article .text { padding: 35px 30px 45px 30px; }
    article .date { width: 140px; line-height: 40px; font-size: 16px; }
    article h2, article h3 { font-size: 20px; }
  
  footer .main-frame { width: 840px; }
    footer .sep { margin: 0 22px; }
    .netsimple { margin-top: 75px; }
    
  .sub-page .tip { width: calc(33.33% - 2px); }
  .sub-page .tip:not(:nth-child(3n)) { margin-right: 3px; }
  .sub-page .tip:not(:nth-child(-n + 3)) { margin-top: 3px; }
}

@media screen and (max-width: 840px)
{
  body { font-size: 14px; }

  .header-icon:before { left: 0; }
  .header-icon:after { right: 0; }

  header:not(.sub-page) { padding-bottom: 25px; }
    header .perex { margin-top: 40px; }
    
  .banner-menu,
  .banner-menu .item { width: 100%; float: left; }
  .banner-menu { margin-top: 40px; }
  .banner-menu .item:not(:last-child) { margin-top: 10px; }
    .banner-menu img { width: 100%; }
    .banner-menu .item-text { flex: 1; display: flex; flex-direction: column; justify-content: center; padding-right: 15px; padding-left: 15px; }

  .home .icons .mobile-click { background-image: url("/images/icon/icon-click.png"); background-position: 10px 10px; background-repeat: no-repeat; }
  
  .home .tip:last-child { display: none; }
  
  footer .sep { margin: 0 15px; }
  footer .links { -webkit-flex-wrap: wrap; }  
  footer .links { flex-wrap: wrap; }
    footer .links .sep { display: none; }
    footer .links a { text-align: center; }  
  .netsimple { margin-top: 55px; }
  
}

@media screen
and (min-width: 601px)
and (max-width: 840px)
{
  .news-frame article:first-child { margin-right: 15px; }
  article .text { padding: 25px 15px 35px 15px; }
    article h2, article h3 { font-size: 17px; }
    article .date { width: 120px; line-height: 30px; font-size: 14px; }
}

@media screen 
and (min-width: 601px)
and (max-width: 840px)
{
  .banner-menu .item { height: 140px; }
    .banner-menu .image { width: 177px; }

  .home .icons .icon { width: calc(33.33% - 2px); height: 220px; }
  .home .icons .icon:not(:nth-child(3n)) { margin-right: 3px; }
  .home .icons .icon:not(:nth-child(-n + 3)) { margin-top: 3px; }
  
   .tip h2, .tip h3 { font-size: 25px; }
}

@media screen
and (min-width: 481px)
and (max-width: 840px)
{
  h1 { font-size: 40px; }
  h2 { font-size: 30px; }
  h3 { font-size: 25px; }
  h4 { font-size: 20px; }
  h5, h6 { font-size: 15px; }

  header h1 { font-size: 35px; }
  header .perex p { font-size: 20px; }
  
  .banner-menu .title { margin-bottom: 10px; }
  
  main.home { padding-top: 50px; padding-bottom: 55px; }
  main:not(.home) { padding-top: 75px; padding-bottom: 65px; }
  
  .home .tips { margin-bottom: 60px; }
  
  .news-frame { padding-top: 95px; padding-bottom: 70px; }
  
  footer { padding-top: 65px; padding-bottom: 45px; }
    footer .links a { -webkit-flex-basis: 50%; }  
    footer .links a { flex-basis: 50%; width: 50%; text-align: center; }
    footer .links a:not(:nth-child(-n + 2)) { margin-top: 10px; } 
    
  .map { height: 350px; }
  
  .sub-page .tip { width: calc(50% - 1.5px); }
  .sub-page .tip:not(:nth-child(even)) { margin-right: 3px; }
  .sub-page .tip:not(:nth-child(-n + 2)) { margin-top: 3px; }
}

@media screen and (min-width: 601px)
{
  footer .info .label { margin-right: 25px; }
  
  .formular { width: 600px; }
}

@media screen and (max-width: 600px)
{
  header .logo { margin-bottom: 35px; }
  
  .home .icons .icon { width: calc(50% - 1.5px); height: 220px; }
  .home .icons .icon:not(:nth-child(even)) { margin-right: 3px; }
  .home .icons .icon:not(:nth-child(-n + 2)) { margin-top: 3px; }
  
  .news { -webkit-flex-direction: column; }
  .news { flex-direction: column; }
     article { width: 100%; }
      article .text { padding: 30px 5%; }
      article:not(:last-child) { margin-bottom: 15px; }
        article .date { width: 140px; line-height: 35px; font-size: 15px; }
        article h2, article h3 { font-size: 20px; }
  
  footer .info .row { -webkit-flex-direction: column; }  
  footer .info .row { flex-direction: column; }
    footer .info .label { margin-bottom: 10px; }
}

@media screen
and (min-width: 481px)
and (max-width: 600px)
{
  .banner-menu .item { height: 118px; border-bottom-width: 5px; }
    .banner-menu .image { width: 150px; }
    .banner-menu .text { height: 95px; }
      .banner-menu .title { font-size: 16px; }
      .banner-menu p { font-size: 13px; }

  .tip .text { height: 110px; }
    .tip h2, .tip h3 { font-size: 20px; }
    .tip .more { font-size: 13px; }
}

@media screen 
and (min-width: 401px)
and (max-width: 600px)
{
  header .logo { width: 325px; height: 76px; margin-bottom: 35px; background-image: url("/images/logo-325.png"); }
}

@media screen and (min-width: 481px)
{
  main p:not(:last-child) { margin-bottom: 25px; } 
  
  .home .icons { margin-top: 25px; } 
  
  .home .tip:not(:last-child) { margin-right: 3px; }
}                  

@media screen and (max-width: 480px)
{
  body { font-size: 13px; }
  h1 { font-size: 25px; }
  h2 { font-size: 20px; }
  h3 { font-size: 17px; }
  h4 { font-size: 14px; }
  h5, h6 { font-size: 13px; }
  
  .main-frame { padding-right: 2.5%; padding-left: 2.5%; }

  .header-icon .icon,
  main:not(.home) .icon,
  .news-frame .icon { width: 75px; height: 75px; }  
  .icon.house-in-hand { background: #3fbfff url("/images/icon/house-in-hand-48.png") center no-repeat; }
  .icon.park { background: #a9cc4c url("/images/icon/park-50.png") center no-repeat; }
  .news-frame .icon { background: #ce3c57 url("/images/icon/news-30.png") center no-repeat; } 
  main:not(.home) .icon { position: absolute; top: -37.5px; left: calc(50% - 37.5px); }
  .news-frame .icon { position: absolute; top: -30px; left: calc(50% - 37.5px); }
  
  header.sub-page.penzion { height: 450px; }
  header.sub-page .perex { margin-top: 0; }

  header h1 { font-size: 25px; }
  header .perex p { font-size: 15px; }
  
  .banner-menu .item { height: 111px; border-bottom-width: 3px; }
    .banner-menu .image { width: 140px; }
      .banner-menu img { height: 100%; }
    .banner-menu .text { height: 105px; padding-top: 0; padding-bottom: 0; }
      .banner-menu .title { margin-bottom: 5px; font-size: 15px; }
      .banner-menu p { font-size: 12px; }
  
  main.home { padding-top: 40px; padding-bottom: 45px; }
  main:not(.home) { padding-top: 65px; padding-bottom: 55px; }
    main p:not(:last-child) { margin-bottom: 15px; } 
  
  .home .icons { margin-top: 15px; } 
    .home .icons .icon { height: 200px; font-size: 13px; }
    
  .home .tips { margin-bottom: 50px; }
  .tips { -webkit-flex-direction: column; }  
  .tips { flex-direction: column; }
    .tip:not(:last-child) { margin-bottom: 3px; }
    .tip .text { height: 110px; }
      .tip h2, .tip h3 { font-size: 20px; }
      
  .news-frame { padding-top: 85px; padding-bottom: 60px; }
  article .date { width: 120px; line-height: 30px; font-size: 15px; }
  article h2, article h3 { font-size: 17px; }
  article p { font-size: 13px; }
    
  footer { padding-top: 55px; padding-bottom: 45px; }
    footer .links { -webkit-flex-direction: column; } 
    footer .links { flex-direction: column; }
      footer .links a:not(:last-child) { margin-bottom: 10px; }
      
  .map { height: 300px; }
}

@media screen and (max-width: 400px)
{
  header .logo { width: 275px; height: 64px; background-image: url("/images/logo-275.png"); }
  .menu-button .label { font-size: 15px; }
  nav a { font-size: 14px; }
  
  .banner-menu .image { display: none; }
}

@media screen
and (max-height: 450px)
{
  header,
  .banner { min-height: 450px; }
  header { padding-top: 25px; }
    header .logo { margin-bottom: 35px; }
    .navigation { padding: 10px 0; }
}