.wrapper  {
  width: 1000px;
  margin: 0 auto;
}
.wrapper-80 {
  width: 80%;
  margin: 0 auto;
  padding: 0 50px;
  max-width: 2560px;
}
.box-mobile-info, .onlyMobile {
  display: none;
}
@media print {
  header, footer {display: none; }
}

/****************** *******************************************
 *		Desktop Full HD Layout: 1701px.                   *********
 **************************************************************		 */

@media only screen and (min-width: 1901px) {
  .desktopHidden {display: none;}
  .cleaner-desktop {clear: both;}

  .wrapper {width: 1800px;}

  /************************************/
  #hlavniMenu {display: block !important; opacity: 1 !important;}

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

  @media only screen and (max-width: 3000px) {

  }

  @media only screen and (max-width: 2500px) {


  }

  @media only screen and (max-width: 2100px) {
    body {font-size: 120%;}
    #logo a {width: 220px;}
    #boxMenuContent > ul > li {padding: 0 15px;}
  }

}

@media only screen and (min-width: 1011px) and (max-width: 1900px) {
  body {font-size: 110%;}

  .desktopHidden {display: none;}
  .cleaner-desktop {clear: both;}

  .wrapper-80 {width: 100%; padding: 0 50px;}

  #logo a {width: 200px;}
  .boxUvod::after {background-size: 130% auto;}

  #boxMenuContent > ul > li {padding: 0 5px;}


  /************************************/
  #hlavniMenu {display: block !important; opacity: 1 !important;}

  .boxPoslani .boxPoslaniLeft .boxPoslaniText {width: 60%;}
  .boxNovinky .boxNovinkyContent {padding: 20px 20px;}

  @media only screen and (min-width: 1701px) and (max-width: 1900px) {
    .wrapper {width: 1600px;}
  }

  @media only screen and (max-width: 1801px) {
     #boxMenuContent > ul, #boxMenuContent .boxMenuContent2 {min-height: 70px;}
     #boxMenuContent > ul > li > a {font-size: 100%; padding: 8px 15px;}

     #boxMenuContent ul li.dropDown > a {background-size: auto 6px;padding-left: 35px;}
     #boxMenuContent ul li.dropDownAktivni > a, #boxMenuContent ul li.dropDown > a:hover, #boxMenuContent ul li.sfHover > a {background-position: left -262px center;}

     #boxMenuContent ul li.hlavniStrana > a {background-size: auto 15px;padding-left: 35px; background-position: left 10px center;}
     #boxMenuContent ul li.hlavniStranaAktivni > a, #boxMenuContent ul li.hlavniStrana > a:hover, #boxMenuContent ul li.hlavniStrana.sfHover a {background-position: left -302px center;}

     #boxMenuContent .boxSite li {padding: 0 15px;}
  }

  @media only screen and (min-width: 1371px) and (max-width: 1700px) {
    body {font-size: 100%;}
    .wrapper {width: 1320px;}

    #logo a {width: 180px;}

    .uvod header.hlavicka {height: 170px;}
    header.navMin, .uvod header.navMin, .podstrana header.hlavicka {height: 120px;}

    .boxUvod::after {background-position: left top 180px;}
    .boxUvod {padding-top: 200px;}
    .boxUvod .boxUvodContent p {font-size: 170%;}

    .boxPoslani .boxPoslaniLeft .flexBox {border-radius: 125px;}

    .patickaKontakty, .patickaMenu {width: 100%;}


    #myConsentCookies_v2 {bottom: 5%; max-height: 95%;}
  }

  @media only screen and (min-width: 1011px) and (max-width: 1370px) {
    body {font-size: 100%;}

    .boxZakladni {padding: 50px 0}

    #logo a, header.navMin #logo a, .podstrana header #logo a {width: 140px;}

    .uvod header.hlavicka {height: 170px;}
    header.navMin, .uvod header.navMin, .podstrana header.hlavicka {height: 120px;}

    #boxMenuContent > ul {min-height: 62px; padding: 0 25px 0 25px; border-radius: 28px}
    #boxMenuContent ul li.dropDown {padding-left: 5px;}
    #boxMenuContent .boxMenuContent2 {display: none;}
    #boxMenuContent > ul > li > a {font-size: 98%; padding: 7px 10px;}

    .boxUvod::after {background-position: left top 180px;}
    .boxUvod {padding-top: 200px;}
    .boxUvod .boxHlavniNadpis {font-size: 230%; margin: 0 0 5px;}
    .boxUvod .boxUvodContent p {font-size: 130%;}

    .boxNovinky {padding: 20px 0 0;}

    .patickaKontakty, .patickaMenu {width: 100%;}

    .boxFotogalerie .boxFotogaleriePolozka {width: 23%;margin: 0 0 3.5% 2.65%; border-radius: 50px;}
    .boxFotogalerie section {border-radius: 0 0 50px 50px;}
    .boxFotogalerie article figure a {border-radius: 50px 50px 0 0;}
    .boxFotogalerie article figure a {border-radius: 50px 50px 0 0;}

    .boxPoslani .boxPoslaniLeft .flexBox {border-radius: 125px;}
    .boxPoslani .boxPoslaniLeft, .boxPoslani .boxPoslaniRight {width: 100%;}
    .boxPoslani .boxPoslaniLeft .flexBox, .boxPoslani .boxPoslaniRight .flexBox {background-color: #fff;border-radius: 165px;padding: 23px 60px 23px 23px;}
    .boxPoslani .boxPoslaniLeft {margin: 0 0 30px;}

    .boxPoslani .boxPoslaniLeft .boxPoslaniImg, .boxPoslani .boxPoslaniRight .boxPoslaniImg {width: 30%;}
    .boxPoslani .boxPoslaniLeft .boxPoslaniText, .boxPoslani .boxPoslaniRight .boxPoslaniText {width: 65%;}
    .boxPoslani h2 {text-align: center;}
    .boxPoslani .boxPoslaniText p {font-size: 110%}

    #myConsentCookies_v2 {bottom: 5%; max-height: 95%;}

    @media only screen and (max-width: 1200px) {
       body {font-size: 90%;}
    }

    @media only screen and (max-width: 1100px) {
      #boxMenuContent .boxSite {margin: 0 0 0 5px;}

    }
  }
}

/****************** *******************************************
 *		Mobile/Tablet Layout                            *********
 **************************************************************		 */
@media only screen and (max-width: 1010px) {
  .wrapper, .wrapper-80, header.hlavicka .wrapper, .patickaTop .boxSite, .patickaTop .boxInformace {
    width: 100%;
  }
  .cleaner-mobile {
    clear: both;
  }
  .box-mobile-info, .mobile-block {
    display: block;
  }
  .mobile-hidden, .mobileHidden, #hlavniMenuM div label, .patickaTop .boxMapa {
    display: none;
  }

  body {font-size: 100%;}

  h1, .hlavniNadpis {font-size: 200%;padding: 0 0 25px;}
  h2{font-size: 180%;}

  .wrapper, .wrapper-80, #hlavniObsah .wrapper, header.hlavicka .wrapper  {padding: 0 30px;}


  #logo a, header.navMin #logo a, .uvod header.navMin #logo a, .podstrana header #logo a {width: 110px;}

  .uvod #logo a {width: 150px;}
  .uvod header.hlavicka {height: 100px;}

  .uvod header.navMin {height: 70px;}

  /************************************/
  header.hlavicka,
  header.navMin, .uvod header.navMin, .podstrana header.hlavicka {height: 70px;position: fixed;top: 0;z-index: 200;}

  header.hlavicka #boxMenuContent > ul {line-height: 70px;}


  #boxMenuContent {text-align: left;}
  #boxMenuContent > ul {line-height: 70px; display: block;}
  #boxMenuContent > ul > li > a {padding: 5px 15px;}
  /************************************/
  #hlavniMenuM {position: absolute; right: 20px; top: 0px; height: 100%; border-radius: 0px; transition: .2s all ease; z-index: 154; display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-justify-content:center;justify-content:center;}
  #hlavniMenuM > div {width: 30px; height: 30px;cursor: pointer;text-align: center;display: block; position: relative; margin: auto;}
  #hlavniMenuM > div label {text-transform: uppercase;cursor: pointer;font-size: 80%;width: 100%;text-align: center;display: inline-block; display: none;}

  #hlavniMenuM .line {position: absolute; height: 4px; width: 100%; left: 0; right: 0; margin: auto; background-color: #000; border: solid 2px #000; transition: .2s all ease;}
  #hlavniMenuM .line1 {top: 0;}
  #hlavniMenuM .line2 {top: 0; bottom: 0;}
  #hlavniMenuM .line3 {bottom: 0;}

  .navMin #hlavniMenuM .line {background-color: #000;}

  html.mobileNavActive {height: 100%;overflow: hidden;}
  body.mobileNavActive {height: 100%;overflow: auto;}
  .mobileNavActive #hlavniMenuM .line {background-color: #000;}
  .mobileNavActive #hlavniMenuM .line2 {display: none;}
  .mobileNavActive #hlavniMenuM .line1 {transform: rotate(-45deg); top: 13px;}
  .mobileNavActive #hlavniMenuM .line3 {transform: rotate(45deg); top: 0px;}

  #menuMenu {position: relative; left: 0; top: 0;}
  #hlavniMenu {background-color: #ffc000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 5px 5px 25px rgba(0,0,0, 0.3); overflow: auto; margin: 0 auto 0 0; z-index: 152;}

  header.hlavicka #boxMenuContent > ul > li > a {text-shadow: none;}
  #hlavniMenu .content ul, .sf-menu ul {position: relative; width: 100%; left: 0 !important; top: 0 !important;box-shadow: none; padding: 0; border: none;}
  #hlavniMenu .content ul a {}
  #hlavniMenu .content ul ul.menu {padding: 0 0 5px;}
  #hlavniMenu .content ul ul li a {font-size: 110%; padding: 7px 0px 7px 20px;; text-align: left;}
  #hlavniMenu .content ul li {display: block; padding: 0; width: 100%; border: none;}
  #hlavniMenu .content ul li a  {font-size: 180%; padding: 5px 0; text-align: left; color: #000; line-height: 170%; height: auto; border: none; display: block; text-decoration: none;}
  #hlavniMenu .content ul li.aktivni a, #hlavniMenu .content ul li a:hover, .sf-menu li li a:hover, .sf-menu li li a:active, .sf-menu li li.sfHover>a {background-color: transparent;}
  #hlavniMenu .content ul li, #hlavniMenu .content ul li a, .sf-menu ul  {background: transparent url();}

  #boxMenuContent .sf-mega {display: block !important;}
  #boxMenuContent .sf-mega .menu {background-color: transparent;}

  #boxMenuContent > ul {background-color: transparent;}
  #boxMenuContent > ul > li > a.aktivni, #boxMenuContent > ul li.aktivni > a {color: #000 !important; text-decoration: underline; font-weight: bold;}
  #boxMenuContent > ul > li > a.aktivni, #boxMenuContent > ul > li > a:hover, #boxMenuContent > ul > li.sfHover > a {background-color: transparent !important;}
  #boxMenuContent > ul li.aktivni > a {font-weight: bold;}
  #boxMenuContent, header.navMin #boxMenuContent {padding: 70px 50px; height: auto;}

  #boxMenuContent {display: flex; align-items: center; min-height: 100%;}
  header.hlavicka #boxMenuContent > ul {height: auto; }

  #boxMenuContent .tlSipka {display: none;}

  #hlavicka .menuHlavicka {background-color: #000; color: #fff; padding: 0 25px; height: 70px; position: relative; display: none;}
  #hlavicka .menuHlavicka .nadpis {font-size: 130%; text-transform: uppercase;font-weight: bold; line-height: 70px;}

  #hlavniMenu #menuMenu {background-color: #eee; margin: 20px 0 0; padding: 25px 25px;}
  #hlavniMenu #menuMenu ul li a {border: none; padding: 10px 0 7px; text-transform: none;}

  #hlavniMenu .boxMenuContent2 {padding: 30px 0 0; width: 100%; background-color: transparent;}
  #hlavniMenu .boxMenuContent2 .boxSite {display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-justify-content:left;justify-content:left; margin: 0;}
  #hlavniMenu .boxMenuContent2 .boxSite li {padding: 0 10px 0 0; width: auto;}
  #hlavniMenu .boxMenuContent2 .boxSite a span {display: none;}
  #hlavniMenu .boxMenuContent2 .boxSite a {display: block; width: 40px; height: 40px;}

  /************************************/
  .boxZakladni {padding: 40px 0}
  .podstrana .boxZakladni {padding: 40px 0 20px;}
  .podstrana .boxZakladniPrvni {padding-top: 110px;}

  #myConsentCookies_v2 {bottom: 0; max-height: 95%; width: 100%;}


  .boxNovinky {padding: 20px 0 0;}
  .boxNovinky .boxNovinkyContent {padding: 13px; border-radius: 30px;}
  .boxNovinky .boxNovinkyContentSFotkou img {border-radius: 20px;}

  .boxPoslani .boxPoslaniLeft, .boxPoslani .boxPoslaniRight {width: 100%;}
  .boxPoslani .boxPoslaniLeft .flexBox, .boxPoslani .boxPoslaniRight .flexBox {background-color: #fff;border-radius: 120px;padding: 23px 60px 23px 23px;}
  .boxPoslani .boxPoslaniLeft {margin: 0 0 30px;}

  .boxPoslani .boxPoslaniLeft .boxPoslaniImg, .boxPoslani .boxPoslaniRight .boxPoslaniImg {width: 30%;}
  .boxPoslani .boxPoslaniLeft .boxPoslaniText, .boxPoslani .boxPoslaniRight .boxPoslaniText {width: 65%;}
  .boxPoslani h2 {text-align: center;}
  .boxPoslani .boxPoslaniText p {font-size: 110%}

  .boxFotogalerie .boxFotogaleriePolozka {width: 48%;margin: 0 0 4% 4%; border-radius: 50px;}
  .boxFotogalerie section {border-radius: 0 0 50px 50px;}
  .boxFotogalerie article figure a {border-radius: 50px 50px 0 0;}
  .boxFotogalerie .boxFotogaleriePolozka:nth-of-type(2n+1) {margin-left: 0;}

  .boxGalerieDetail .boxGalerie .polozka, .boxGalerieDetail .boxGalerie .polozka:nth-of-type(5n) {margin: 0 3% 3% 0%;}
  .boxGalerieDetail .boxGalerie .polozka {width: 22.7%;}
  .boxGalerieDetail .boxGalerie .polozka:nth-of-type(4n) {margin-right: 0;}
  .boxGalerieDetail .boxGalerie .polozka a img {border-radius: 50px;}

  .patickaKontakty .patickaKontaktyPolozka, .patickaKontakty .patickaKontaktyPolozka.patickaKontaktyPolozka33 {width: 50%;}
  .patickaKontakty .patickaKontaktyPolozka.rAdresa {width: 100%;}

  .kartaZazemi .kartaZazemiItem {width: 49%;}
  .kartaZazemi .kartaZazemiItem:nth-of-type(2n) {margin-right: 0;}

  .boxKontaktyLidi .boxPolozka {width: 50%;}

  #boxHlavniKontakt .boxHlavniKontakt {padding: 0 5% 0 0;}

  .boxKdeSeNachazimeMapa iframe {border-radius: 50px;}

  .kartaZazemi .kartaZazemiItem p {font-size: 100%;}

  /**************** tablet ***************************************************************/
  @media only screen and (min-width: 768px) and (max-width: 1010px) {
    .cleaner-tablet {
      clear: both;
    }
    .box-tablet-info, .tablet-block {
      display: block;
    }
    .tablet-hidden {
      display: none;
    }
    .tablet-upper {text-transform: uppercase;}
    /***************************************************/



    @media (orientation: landscape) {
      .boxUvod {padding-top: 130px;}
      .boxUvod::after {background-position: left top 120px; background-size: 130% auto;}
      .boxUvod .boxHlavniNadpis {font-size: 230%; margin: 0 0 5px;}
      .boxUvod .boxUvodContent p {font-size: 130%;}
    }
    @media (orientation: portrait) {
      .boxUvod {padding-top: 100px;}
      .boxUvod::after {
        display: none;
      }

      .boxUvod::before {
        content: "";
        aspect-ratio: 1349 / 853; /* skutečné rozměry obrázku */
        background: url("/layout/dumProSeniory_v3.webp") center / contain no-repeat;
        display: block; width: 95%; height: auto; margin: 0 0 25px auto;
      }

      .boxUvod .boxUvodContent {width: 100%;}

    }

    /************************************/
    @media only screen and (max-width: 850px) {


    }
  }

  /*************  mobil  **************************************************************************************************/
  @media only screen and (max-width: 767px) {
    body {font-size: 95%;}
    div.text {text-align: left;}
    .onlyMobile {display: block;}

    #myConsentCookies_v2 {padding: 20px 20px 15px;}

    .wrapper, .wrapper-80, #hlavniObsah .wrapper, header.hlavicka .wrapper  {padding: 0 20px;}

    div.p, p, address {padding: 0 0 15px;}
    h2 {margin: 0 0 15px;}
    h3 {padding: 0 0 15px;}
    ul {padding: 0 0 15px;}

    .tl .tlSipka {display: none;}

    .tl a, .tl span, .listSubmenu a, #paticka .tl a, input.submit, button.submit, .tlDalsiOdkazy a,
    .tl a:hover, .tl span:hover, .listSubmenu a:hover, input.submit:hover, button.submit:hover, #paticka .tl a:hover, .tlDalsiOdkazy a:hover {padding: 14px 35px 16px;}
    input.submit, button.submit {padding: 14px 35px;}

    .uvod header.hlavicka {height: 70px;background-color: #fff;box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);}
    .uvod header.hlavicka #logo a {width: 110px;}

    .boxUvod {padding-top: 100px;}
    .boxUvod::after {
      display: none;
    }

    .boxUvod::before {
      content: "";
      aspect-ratio: 1349 / 853; /* skutečné rozměry obrázku */
      background: url("/layout/dumProSeniory_v3.webp") center / contain no-repeat;
      display: block; width: 95%; height: auto; margin: 0 0 25px auto;
    }

    .boxUvod .boxUvodContent {width: 100%;}

    .boxUvod .boxHlavniNadpis, .boxUvod .boxNovinkyNadpis, .boxUvod .boxUvodContent p, .boxUvod .tlDetail {text-align: center;}
    .boxUvod .boxHlavniNadpis {font-size: 280%;}
    .boxUvod .boxUvodContent p {font-size: 150%;}

    .boxKdeSeNachazime .boxboxKdeSeNachazimeText {padding: 0 0 15px;}
    .boxKdeSeNachazime .boxboxKdeSeNachazimeText, .boxKdeSeNachazime .boxKdeSeNachazimeMapa {width: 100%;}

    #paticka .patickaTop {padding: 50px 0 30px;}
    .patickaKontakty .patickaKontaktyPolozka {padding: 0 0 30px;}
    .patickaKontakty .kontaktIko {background-size: 20px auto; padding-left: 40px;}

    .boxPoslani .boxPoslaniLeft .flexBox, .boxPoslani .boxPoslaniRight .flexBox {border-radius: 50px; padding: 23px;}

    .boxPoslani .boxPoslaniLeft .boxPoslaniText, .boxPoslani .boxPoslaniRight .boxPoslaniText {width: 100%; text-align: center; }
    .boxPoslani .boxPoslaniLeft .boxPoslaniImg, .boxPoslani .boxPoslaniRight .boxPoslaniImg {margin: 0 auto 20px;}

    .boxAcosiace {background-size: 120px auto; padding: 0 0 0 140px;}

    .pageTitle {padding: 0;}

    /*****************************************************/
    @media only screen and (max-width: 650px) {

      h1, .hlavniNadpis {font-size: 170%;padding: 0 0 25px;}
      h2 {font-size: 150%;}
      h3 {font-size: 130%;}
      h4 {font-size: 110%;}

        #boxHlavniKontakt .boxHlavniKontakt, #boxHlavniKontakt .boxKdeSeNachazimeMapa {width: 100%;}

     }

    @media only screen and (max-width: 600px) {
      .boxGalerieDetail .boxGalerie .polozka {width: 48.5%;}
      .boxGalerieDetail .boxGalerie .polozka:nth-of-type(2n) {margin-right: 0;}

      .patickaKontakty .patickaKontaktyPolozka, .patickaKontakty .patickaKontaktyPolozka.patickaKontaktyPolozka33 {width: 100%;}
      .patickaKontakty .patickaKontaktyPolozka {padding: 0 0 20px;}

      .patickaKontakty .kontaktIko {background-size: 18px auto; padding-left: 35px;}
    }

    @media only screen and (max-width: 550px) {
      body {font-size: 90%;}

      .boxKontaktyLidi .boxPolozka .ikona {width: 120px; height: 120px;}

      #myConsentCookies_v2 .tl {padding: 6px 20px 8px;}
    }

  }

  @media only screen and (max-width: 500px) {
    .boxFotogalerie .boxFotogaleriePolozka, #boxUcitele .boxUcitelePolozka {width: 100%; margin-left: 0;}

    .kartaZazemi .kartaZazemiItem {width: 100%; margin: 2% 0; padding: 120px 15px 15px; background-size: auto 70px;}

    .boxKontaktyLidi .boxPolozka {width: 100%;}
    .boxKontaktyLidi .boxPolozka .ikona {width: 150px; height: 150px;}
  }

  /********** mini mobil **************/
  @media only screen and (max-width: 470px) {
    .boxAcosiace {background-size: 90px auto; padding: 0 0 0 110px;}
  }


  @media only screen and (max-width: 400px) {
      body {font-size: 85%;}
      .boxAcosiace {background-size: 50px auto; padding: 0 0 0 70px;}


  }
}