#paticka a {
text-decoration: none;}

#paticka a:hover {
text-decoration: underline;}

#EshopHomeUserContent {
    margin-top: -3.3em;
}

#contentOuter #middle {
    margin-top: -1em;
}

div#FooterUserContent {
    padding-top: 0px;
}
div#FooterUserContent2 {
    padding-top: 0px;
}

.footer_odkazy a{
    color: black;
    text-decoration: none;
}
.footer_odkazy a:hover{
    text-decoration: underline;
}
.UserContentPanelView {
    color: #404040;
    background-color: #f00;
}
.userContent p:last-child, .userContent p:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
}
.userContent p {
    padding-top: 0;
    margin-top: 0;
}


/* skrytí pozadí webu na mobilu */
@media screen and (max-width: 999px){
    #Master {
        background: none;
    }
}

#UserPanelPopupHost a span {
    color: white;
}

/* ===================================================
   EXO-EKO.cz / Greenpets.cz – jednotná šablona pro blog
   Vložit do centrální databáze CSS stylů v administraci Bsshopu.
   Barvy odpovídají firemnímu brandu:
   tmavá zelená #237948, světlá zelená #52a423, oranžová #ec6026
   =================================================== */

:root {
  --eko-dark-green: #237948;
  --eko-light-green: #52a423;
  --eko-orange: #ec6026;

  --eko-bg-tip: #eef7ec;        /* jemně zelené pozadí pro tip-box */
  --eko-bg-warning: #fdece2;    /* jemně oranžové pozadí pro warning-box */

  --eko-text: #2b2b2b;
  --eko-caption: #6b6b6b;
}

/* Omezení šířky sloupce s textem – kompaktní, čitelný blog místo roztažení
   přes celou šablonu. 720px odpovídá běžné čitelné šířce blogového obsahu. */
.blog-article {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 16px;
}

/* Základní čitelnost textu – o něco větší písmo a volnější řádkování,
   než bývá výchozí u šablony, zejména kvůli mobilům. */
.blog-article p,
.blog-article li {
  font-size: 17px;
  line-height: 1.65;
}

/* Na mobilu (do 600px) písmo ještě o kousek zvětšit a přidat víc
   vzduchu mezi řádky – na malé obrazovce se čte hůř i při stejné
   velikosti písma jako na desktopu. */
@media (max-width: 600px) {
  .blog-article p,
  .blog-article li {
    font-size: 18px;
    line-height: 1.7;
  }
  .blog-article h1 {
    font-size: 1.9em;
    line-height: 1.25;
  }
  .blog-article h2 {
    font-size: 1.55em;
    line-height: 1.3;
  }
  .blog-article h3 {
    font-size: 1.3em;
    line-height: 1.35;
  }
}

/* Nadpisy v článku */
.blog-article h2 {
  color: var(--eko-dark-green);
  border-bottom: 2px solid var(--eko-light-green);
  padding-bottom: 6px;
  margin-top: 40px;
}

.blog-article h3 {
  color: var(--eko-dark-green);
  margin-top: 28px;
}

/* Krátké shrnutí pod H1 */
.article-summary {
  background: var(--eko-bg-tip);
  border-left: 4px solid var(--eko-light-green);
  padding: 16px 20px;
  margin: 20px 0 30px;
}
.article-summary p {
  margin: 0 0 6px;
  font-weight: 600;
  color: var(--eko-dark-green);
}
.article-summary ul {
  margin: 8px 0 0;
}

/* Zvýrazněný praktický tip */
.tip-box {
  background: var(--eko-bg-tip);
  border-left: 4px solid var(--eko-light-green);
  padding: 14px 18px;
  margin: 20px 0;
}
.tip-box strong {
  color: var(--eko-dark-green);
}

/* Upozornění (např. kdy k veterináři) */
.warning-box {
  background: var(--eko-bg-warning);
  border-left: 4px solid var(--eko-orange);
  padding: 14px 18px;
  margin: 20px 0;
}
.warning-box strong {
  color: var(--eko-orange);
}

/* Vytažená myšlenka (nepovinné) */
.pull-quote {
  border-left: 4px solid var(--eko-dark-green);
  font-style: italic;
  font-size: 1.1em;
  color: var(--eko-dark-green);
  padding: 6px 20px;
  margin: 24px 0;
}

/* Obrázky a popisky – sjednocený poměr stran 16:9, aby žádný obrázek
   nepůsobil neúměrně velký nebo vysoký bez ohledu na to, jak vyšel
   z generátoru. Šířka je omezená sloupcem .blog-article výše. */
.blog-article figure {
  margin: 24px 0;
}
.blog-article figure img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  height: auto;
  border-radius: 8px;
  display: block;
}
.blog-article figcaption {
  font-size: 0.9em;
  color: var(--eko-caption);
  text-align: center;
  margin-top: 6px;
}

/* Závěrečná výzva (CTA) */
.cta-box {
  background: var(--eko-dark-green);
  color: #fff;
  padding: 18px 22px;
  margin-top: 32px;
  border-radius: 6px;
  text-align: center;
}
.cta-box a {
  color: #fff;
  font-weight: 700;
  text-decoration: underline;
}


/* ==========================================================================
   BRAND PAGE – jednotný styl brandových stránek (EXO-EKO.cz + Greenpets.cz)
   Vložit jednou do centrálního CSS v BSAdminu. Použití: obsah stránky obalit
   do <div class="bp"> … </div>. Všechny třídy mají prefix .bp-, stylování
   je omezeno na obsah uvnitř .bp, zbytek e-shopu se nemění.
   Dvojité .bp.bp zvyšuje specificitu, aby styly nepřebily pravidla šablony.
   Písmo se dědí z e-shopu (Open Sans).
   Barvy lze změnit na jednom místě v proměnných níže.
   ========================================================================== */

.bp{
  --bp-primary:#397e35;     /* hlavní zelená Greenpets */
  --bp-secondary:#086b3b;   /* tmavší zelená EXO-EKO */
  --bp-tint:#edf5ec;
  --bp-ink:#2b3033;
  --bp-muted:#5d666b;
  --bp-card:#f6f7f7;
  --bp-line:#dfe3e3;
  --bp-radius:10px;
  max-width:1100px;margin:0 auto;padding:0 16px 48px;
  color:var(--bp-ink);font-size:16px;line-height:1.65;box-sizing:border-box;
}
.bp *,.bp *::before,.bp *::after{box-sizing:border-box}
.bp.bp h2,.bp.bp h3{font-family:inherit;color:var(--bp-ink);line-height:1.2;margin:0;padding:0;border:0;text-transform:none;letter-spacing:normal;text-wrap:balance}
.bp.bp p{margin:0 0 1em;max-width:68ch}
.bp.bp a{color:var(--bp-secondary)}
.bp.bp img{max-width:100%;height:auto;display:block;border-radius:var(--bp-radius)}
.bp.bp ul,.bp.bp ol{margin:0;padding:0}

/* sekce */
.bp .bp-section{padding:40px 0 0}
.bp.bp .bp-section>h2{font-size:28px;font-weight:600;margin-bottom:8px}
.bp .bp-section>h2::after{content:"";display:block;width:56px;height:4px;border-radius:2px;background:var(--bp-primary);margin-top:10px}
.bp.bp .bp-lead{color:var(--bp-muted);margin:12px 0 24px}
.bp.bp .bp-note{font-size:14px;color:var(--bp-muted);margin-top:14px}

/* tlačítka */
.bp.bp a.bp-btn{display:inline-block;padding:12px 24px;border-radius:999px;font-weight:700;text-decoration:none;font-size:15px;line-height:1.2;border:2px solid transparent;transition:background .15s,color .15s}
.bp.bp a.bp-btn-main{background:var(--bp-primary);color:#fff}
.bp.bp a.bp-btn-main:hover{background:var(--bp-secondary)}
.bp.bp a.bp-btn-ghost{border-color:#fff;color:#fff}
.bp.bp a.bp-btn-ghost:hover{background:#ffffff22}
.bp.bp .bp-hero a.bp-btn-main{background:#fff;color:var(--bp-secondary)}
.bp.bp .bp-hero a.bp-btn-main:hover{background:var(--bp-tint)}
.bp.bp a.bp-btn-line{border-color:var(--bp-secondary);color:var(--bp-secondary)}
.bp.bp a.bp-btn-line:hover{background:var(--bp-secondary);color:#fff}
.bp a:focus-visible{outline:3px solid var(--bp-primary);outline-offset:3px}

/* HERO */
.bp .bp-hero{margin-top:16px;border-radius:14px;background:var(--bp-primary);background:linear-gradient(135deg,var(--bp-primary) 0%,var(--bp-secondary) 100%);color:#fff;display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center;padding:40px}
.bp.bp .bp-hero h2.bp-title{color:#fff;font-size:38px;font-weight:700}
.bp.bp .bp-hero p{color:#ffffffe6;font-size:17px;margin-top:14px}
.bp .bp-eyebrow{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:#ffffff22;padding:4px 12px;border-radius:999px;margin-bottom:14px}
.bp .bp-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.bp.bp img.bp-photo{width:100%;object-fit:cover}
.bp.bp img.bp-photo--hero,.bp.bp img.bp-photo--wide{aspect-ratio:3/2}
.bp.bp img.bp-photo--tall{aspect-ratio:4/5}

/* fakta */
.bp .bp-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}
.bp .bp-fact{background:var(--bp-tint);border-radius:var(--bp-radius);padding:16px 18px;font-size:14px;line-height:1.5;color:var(--bp-muted)}
.bp .bp-fact strong,.bp .bp-fact b{display:block;font-size:26px;line-height:1.1;color:var(--bp-secondary);font-weight:700;margin-bottom:2px}

/* text + obrázek vedle sebe */
.bp .bp-split{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.bp .bp-split--center{align-items:center}
.bp .bp-split--tint{background:var(--bp-tint);border-radius:14px;padding:28px;grid-template-columns:1.2fr 1fr}
.bp.bp ul.bp-list{padding-left:20px}
.bp.bp ul.bp-list li{margin-bottom:6px}

/* časová osa */
.bp.bp ol.bp-timeline{list-style:none;margin:20px 0 0;padding:0 0 0 22px;border-left:3px solid var(--bp-primary)}
.bp .bp-timeline li{position:relative;margin:0 0 18px;padding-left:6px}
.bp .bp-timeline li::before{content:"";position:absolute;left:-30px;top:6px;width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid var(--bp-primary)}
.bp .bp-timeline strong,.bp .bp-timeline b{display:block;color:var(--bp-secondary)}

/* karty (řady, kategorie) */
.bp .bp-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bp .bp-card{background:var(--bp-card);border:1px solid var(--bp-line);border-radius:var(--bp-radius);padding:20px;display:flex;flex-direction:column;gap:8px}
.bp.bp .bp-card h3{font-size:19px;font-weight:600}
.bp.bp .bp-card p{margin:0;font-size:15px;color:var(--bp-muted)}
.bp .bp-tag{align-self:flex-start;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--bp-secondary);padding:3px 10px;border-radius:999px}
.bp.bp a.bp-more{margin-top:auto;padding-top:6px;font-weight:700;font-size:14px;text-decoration:none}
.bp.bp a.bp-more:hover{text-decoration:underline}
.bp .bp-card--wide{grid-column:1/-1}
.bp .bp-card--top{border:2px solid var(--bp-primary);background:var(--bp-tint)}

/* dlaždice s ikonami (druhy masa, zvířata, kategorie) */
.bp.bp ul.bp-tiles{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:12px}
.bp.bp ul.bp-tiles li{display:block;margin:0;padding:0}
.bp.bp .bp-tiles a{display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;padding:14px 8px 12px;border:2px solid var(--bp-line);border-radius:var(--bp-radius);background:#fff;text-decoration:none;font-weight:600;font-size:15px;color:var(--bp-ink);transition:border-color .15s,background .15s}
.bp.bp .bp-tiles a:hover{border-color:var(--bp-primary);background:var(--bp-tint)}
.bp.bp .bp-tiles img{width:64px;height:64px;border-radius:0}

/* výhody (číslované) */
.bp .bp-why{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.bp .bp-why>div{padding:18px 18px 18px 20px;border:1px solid var(--bp-line);border-left:4px solid var(--bp-primary);border-radius:var(--bp-radius)}
.bp.bp .bp-why h3{font-size:17px;font-weight:600;margin-bottom:4px}
.bp.bp .bp-why p{margin:0;font-size:15px;color:var(--bp-muted)}

/* obrázek s popiskem */
.bp .bp-fig{margin:24px 0 0}
.bp.bp .bp-fig img{width:100%;aspect-ratio:3/2;object-fit:cover}
.bp .bp-fig p{margin:8px 0 0;font-size:14px;color:var(--bp-muted)}
@media (min-width:861px){.bp .bp-fig{max-width:640px}}

/* produkty z e-shopu */
.bp .bp-products{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.bp .bp-prod{border:1px solid var(--bp-line);border-radius:var(--bp-radius);padding:12px;display:flex;flex-direction:column;gap:8px;background:#fff}
.bp.bp .bp-prod img{width:100%;aspect-ratio:1/1;object-fit:contain}
.bp.bp .bp-prod h3{font-size:15px;font-weight:600}
.bp.bp .bp-prod a.bp-btn{text-align:center;padding:9px 12px;font-size:14px;margin-top:auto}

/* FAQ (vždy rozbalené) */
.bp .bp-faq-item{border:1px solid var(--bp-line);border-radius:var(--bp-radius);margin-bottom:10px;padding:14px 18px 4px;background:#fff}
.bp.bp .bp-faq-item h3{font-size:17px;font-weight:600;margin-bottom:6px}

@media (max-width:860px){
  .bp .bp-hero,.bp .bp-split,.bp .bp-split--tint{grid-template-columns:1fr}
  .bp .bp-hero{padding:28px 22px}
  .bp.bp .bp-hero h2.bp-title{font-size:30px}
  .bp .bp-facts{grid-template-columns:repeat(2,1fr)}
  .bp .bp-cards,.bp .bp-why{grid-template-columns:1fr}
  .bp .bp-products{grid-template-columns:repeat(2,1fr)}
  .bp.bp img.bp-photo--tall{aspect-ratio:3/2;object-position:center 62%}
}
@media (max-width:420px){.bp .bp-products{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.bp .bp-btn,.bp .bp-tiles a{transition:none}}