
.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;
}
/****************** *******************************************
 *		Desktop Full HD Layout: 1701px.                   *********
 **************************************************************		 */

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

  .wrapper {width: 1440px;}
  .boxRychlyKontakt .boxRychlyKontaktContent {width: 900px;}

  header.hlavicka .wrapper {width: 100%; padding: 0 50px;}
  .boxRychlyKontakt .wrapper {width: 100%;}

  .boxSmluvniPojistovnyContent li img {max-width: 350px;}

  /************************************/
  #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) {

    .boxRychlyKontakt .boxRychlyKontaktContent {padding: 0 80px 0 80px;}
  }

}

@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;}
  header.hlavicka .wrapper {width: 100%; padding: 0 50px;}
  .boxRychlyKontakt .wrapper {width: 100%;}

  header.hlavicka {height: 110px;}
  header.navMin, header.hlavicka {height: 80px;}
  .podstrana .boxZakladniPrvni {padding-top: 80px;}

  #logo a {width: 240px;}
  .uvod header.hlavicka:not(header.navMin) {height: 140px;}
  header.navMin #logo a, .podstrana #logo a {width: 190px;top: 12px;}
  header.navMin #logo, .podstrana #logo {width: 350px;height: 110px;}
  /************************************/
  #hlavniMenu {display: block !important; opacity: 1 !important;}
  #boxMenuContent > ul > li > a {padding: 6px 0px 2px}
  #boxMenuContent .boxRychlyKontaktHlavicka li {padding: 0 15px;}
  #boxMenuContent .boxRychlyKontaktHlavicka li a {height: 35px;}

  .boxRychlyKontakt .boxRychlyKontaktContent {width: 90%; padding: 0 40px 0 40px;}

  .boxNovinka .boxNovinkaNadpis {padding: 10px 70px 11px 30px;}

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

  }


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

    #logo a {}

    .boxNovinka .boxNovinkaContent {padding: 20px 0;}


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

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

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

    h1, .hlavniNadpis {font-size: 200%;}
    h2 {font-size: 180%; margin: 0 0 20px;}
    div.p, p, address {padding: 0 0 20px;}

    #logo a {width: 190px; top: 21px}

    .boxBanner .boxBannerNadpis {padding: 0 0 20px;}


    #boxMenuContent .boxRychlyKontaktHlavicka li a {height: 30px;}
    #boxMenuContent > ul > li {padding: 0 13px;}
    #myConsentCookies_v2 {bottom: 5%; max-height: 95%;}

    .boxRychlyKontakt .boxRychlyKontaktContent {width: 100%;}

    .boxNovinka .boxNovinkaContent {padding: 20px 0;}

    .boxBanner .boxBannerNadpis strong {font-size: 150%;}
    .boxBanner .boxBannerText {width: 60%;}

    .boxRychlyKontakt .tableOrdinacniDoba td .poznamka {font-size: 80%;}

    .tl a, .tl span, .listSubmenu a, #paticka .tl a, input.submit, button.submit, .tlDalsiOdkazy a {padding: 15px 30px;}
    .tl a:hover, .tl span:hover, .listSubmenu a:hover, input.submit:hover, button.submit:hover, #paticka .tl a:hover, .tlDalsiOdkazy a:hover {padding-left: 20px; padding-right: 40px;}


    @media only screen and (max-width: 1200px) {
       body {font-size: 90%;}
      .podstrana .boxZakladni {padding: 50px 0 30px;}
      .podstrana .boxZakladniPrvni {padding-top: 80px;}

      #boxMenuContent .boxRychlyKontaktHlavicka {margin: 0;}
      #boxMenuContent > ul > li > a {font-size: 130%;}

      .tlMamZajem {margin-bottom: 10px;}

    }

    @media only screen and (max-width: 1100px) {
      header.hlavicka .wrapper {padding: 0px 15px;}
      #logo a {left: 15px;}
      header.navMin #logo, .podstrana #logo {width: 280px;}

    }
  }


}




/****************** *******************************************
 *		Mobile/Tablet Layout                            *********
 **************************************************************		 */
@media only screen and (max-width: 1010px) {
  .wrapper, .wrapper-80, .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%; margin: 0 0 20px;}
  div.p, p, address {padding: 0 0 20px;}

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

  #logo, header.navMin #logo, .podstrana #logo {width: 280px; height: 100px; background-color: #262626;clip-path: polygon(0% 0%, 100% 0%, 80% 100%, 0% 100%); }
  #logo a, header.navMin #logo a, .podstrana #logo a {width: 170px; left: 30px; top: 12px;}

  /************************************/
  header.hlavicka, .uvod header.hlavicka:not(header.navMin) {height: 70px;position: fixed;top: 0;z-index: 200; background-color: #54af3a; box-shadow: 0px 0px 8px rgba(0,0,0, .2);}
  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: #fff; transition: .2s all ease;}
  #hlavniMenuM .line1 {top: 0;}
  #hlavniMenuM .line2 {top: 0; bottom: 0;}
  #hlavniMenuM .line3 {bottom: 0;}

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

  html.mobileNavActive {height: 100%;overflow: hidden;}
  body.mobileNavActive {height: 100%;overflow: auto;}
  .mobileNavActive #hlavniMenuM .line {background-color: #fff;}
  .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: #54af3a; 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;}

  #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 20px;}
  #hlavniMenu .content ul ul li a {font-size: 110%; padding: 7px 0px 7px 40px; text-align: left;}
  #hlavniMenu .content ul li {display: block; padding: 0; width: 100%; border: none;}
  #hlavniMenu .content ul li a  {font-size: 180%; padding: 20px 20px; text-align: center; color: #fff; line-height: 170%; height: auto; border: none; display: block;}
  #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 {border: none;}
  #hlavniMenu .content ul li, #hlavniMenu .content ul li a, .sf-menu ul  {background: transparent url();}
  #boxMenuContent > ul > li > a.aktivni, #boxMenuContent > ul li.aktivni > a {color: #fff !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 > ul > li > a:hover, header.navMin #boxMenuContent > ul > li > a:hover {border-color: #fff;}
  #boxMenuContent > ul > li > a.aktivni, header.navMin #boxMenuContent > ul > li > a.aktivni {border-color: rgba(0,0,0,1);}

  #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%;}
  #hlavniMenu .boxMenuContent2 .boxRychlyKontaktHlavicka {display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-justify-content:center;justify-content:center; margin: 0;}
  #hlavniMenu .boxMenuContent2 .boxRychlyKontaktHlavicka li {padding: 0 10px; width: auto;}
  #hlavniMenu .boxMenuContent2 .boxRychlyKontaktHlavicka a span {display: none;}
  #hlavniMenu .boxMenuContent2 .boxRychlyKontaktHlavicka a {display: block; width: 40px; height: 40px;}
  #hlavniMenu .boxMenuContent2 .boxRychlyKontaktHlavicka .ikoFacebook a {background: transparent url(../layout/site/facebook.webp) no-repeat center center; background-size: auto; background-size: auto 40px;}
  #hlavniMenu .boxMenuContent2 .boxRychlyKontaktHlavicka .ikoYoutube a  {background: transparent url(../layout/ikoYoutube.webp) no-repeat center center; background-size: auto; background-size: auto 40px;}

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

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

  #boxUvod .boxNovinka {width: 96%;}
  .boxNovinka .boxNovinkaContent {padding: 20px 0;}
  .boxNovinka .boxNovinkaNadpis {padding: 10px 70px 11px 20px;}
  .boxNovinka .boxNovinkaFoto {width: 25%;}
  .boxNovinka .boxNovinkaText {width: 65%;}
  .boxNovinka .boxNovinkaDatum {height: 100px; width: 100px; border: solid 10px #fff; right: -68px;}
  .boxNovinka .boxNovinkaFotoContent::before {right: -20px;}

  .boxRychlyKontakt .tableOrdinacniDoba td .poznamka {font-size: 80%;}

  #boxUvod .contentBanner {padding: 150px 0 50px;}
  .boxBanner .boxBannerNadpis {font-size: 150%; padding: 0 0 20px;}
  .boxBanner .boxBannerNadpis strong {font-size: 160%;}
  .boxBanner .boxBannerText {width: 100%; font-size: 110%;}

  #hlavniObsah::before {background-size: 80% auto;}

  .boxBannerTlacitka ul {-ms-justify-content: left; justify-content: left;}
  .boxBannerTlacitka li {margin: 0 15px 15px 0;}

  .boxRychlyKontakt .boxRychlyKontaktLeft {width: 100%; padding: 0 30px;}
  .boxRychlyKontakt .boxRychlyKontaktItem {width: 100%;}
  .boxRychlyKontakt .boxRychlyKontaktContent {max-width: 600px; padding: 50px 0; margin: auto; width: auto;}

  .boxSluzbyPrehled .boxSluzbyPrehledPolozka, .boxLide .boxLidePolozka {padding: 35px;}
  .boxSluzbyPrehled .boxSluzbyPrehledPolozka li {margin: 0 15px 15px 0}

  .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 25px 15px;}

  .boxFormular .webFormular {padding: 35px 40px;}
  .boxFormular .formular-obsah {padding: 40px;}

  @media (orientation: landscape) {


  }
  @media (orientation: portrait) {

  }

  /**************** 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;}


    /***************************************************/
    #boxHlavniKontakt .boxHlavniKontakt {width: 60%;}
    #boxHlavniKontakt .boxRecepce {width: 38%;}
    #boxHlavniKontakt .kontaktyTlacitka li {margin: 0 15px 15px 0;}

    /************************************/
    @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  {padding: 0 20px;}
    .boxRychlyKontakt .boxRychlyKontaktLeft {padding: 0 20px;}

    .boxZakladni {padding: 50px 0;}
    .podstrana .boxZakladni {padding: 20px 0 5px;}
    .podstrana .boxZakladniPrvni {padding-top: 60px;}
    .boxRychlyKontakt {padding:0;}


    #logo, header.navMin #logo, .podstrana #logo {width: 240px; height: 90px;}
    #logo a, header.navMin #logo a, .podstrana #logo a {width: 150px; left: 20px; top: 12px;}

    .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: 13px 20px;}

    .boxFormular .webFormular {padding: 25px 30px;}
    .boxFormular .formular-obsah {padding: 25px;}

    .boxSluzbyPrehled .boxSluzbyPrehledPolozka, .boxLide .boxLidePolozka {padding: 25px;}

    .boxNovinka .boxNovinkaText {width: 71%;}
    .boxNovinka .boxNovinkaFotoContent::before {display: none;}
    .boxNovinka .boxNovinkaDatum {height: auto;width: 100%; border: 0;right: 0;position: relative;left: 0; display: inline-block; background-color: transparent; padding: 10px 0 0;}
    .boxNovinka .boxNovinkaDatum span span {display: inline;}
    .boxNovinka .boxNovinkaDatum>span {background-color: #54af3a; border-radius: 0px; padding: 5px 15px; display: inline-block;}
    .boxNovinka .boxNovinkaDatum .mesic, .boxNovinka .boxNovinkaDatum .rok  {font-size: 90%; padding: 0;}

    .boxSluzbyPrehled .boxSluzbyPrehledPolozka ul {margin: 30px 0 0 ;}

    .boxNadpisGraf span.in {padding: 13px 20px;}
    .boxLide {padding: 20px 0 0;}
    .boxLide .boxLidePolozka {margin: 0 0 50px;}
    .boxSmluvniPojistovnyContent {padding: 40px 0 30px;}



    /*****************************************************/
    @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%;}
     }

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

      #boxHlavniKontakt .boxHlavniKontakt {padding: 0 0 20px;}
      #boxHlavniKontakt .boxHlavniKontakt, #boxHlavniKontakt .boxRecepce {width: 100%;}

      .boxRychlyKontakt .tableOrdinacniDoba th, .boxRychlyKontakt .tableOrdinacniDoba td {padding:0 10px 25px 0;}

      .boxFormular .webFormular {padding: 20px 20px;}
      .boxFormular .formular-obsah {padding: 20px;}

      .boxSluzbyPrehled {padding: 20px 0 0;}

      .boxBannerTlacitka {padding: 20px 0 0;}
      .boxBannerTlacitka li {margin: 0 10px 13px 0;}

      .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: 11px 15px;}
    }

  }

  /********** mini mobil **************/
  @media only screen and (max-width: 470px) {

  }


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

  }
}
