body, h1, h2, h3, h4, h5, h6 {font-family: "Nunito Sans", sans-serif;}
a {color: #fe4f51;}
h2 {color:#1b1f11; font-size: 3rem; font-weight: 100;}
h3 {font-weight: normal;}


/* ------------ */
/* --- MENU --- */
/* ------------ */
nav#menu1 {background-color: rgba(27,31,17,0.9);}
nav#menu1 {background-color: #111; color: #eaefd8;}
.navbar-text {color: #eaefd8;}

nav#menu1 i.fa-bars {color: #FEDB1E; font-size: 2rem;}
.navbar-toggler, .navbar-toggler:focus, .navbar-toggler:active {border: none; outline: none;}

/*hr.dropdown-divider {background-color: transparent; width: 100%; border-top: 1px solid #d89127;}*/

.navbar-dark .navbar-nav .nav-link { color: #eaefd8; }
nav#menu1.navbar-dark .navbar-nav .active>.nav-link, nav#menu1.navbar-dark .navbar-nav .nav-link.active, nav#menu1.navbar-dark .navbar-nav .nav-link.show, nav#menu1.navbar-dark .navbar-nav .show>.nav-link { /*color: #eaefd8; background-color: #eaefd822;*/ color: #000; background-color: #FEDB1E; border-radius: 20px; }

.dropdown-toggle::after {display: none;} /* sipka u dropdownu */

#navbar .nav-link {font-size: 1.4rem;}

.dropdown-menu {
   background-color: rgba(30,30,30,0.9);
   border-radius: 20px;
   border: none;
   padding-top: 20px;
   padding-bottom: 20px;
}
.dropdown-item {color: #eaefd8; }
.dropdown-item:focus, .dropdown-item:hover {
    color: #FEDB1E;
    background-color: transparent;
}

/* položky menu dál od sebe */
@media (min-width: 992px) {
  .navbar-expand-lg .navbar-nav .nav-link { padding-right: 2rem; padding-left: 2rem; margin-left: 5px; margin-right: 5px;}
}

a.navbar-brand {font-size: 0.9rem; color: #eaefd8;}
a.navbar-brand:hover {color: #eaefd8;}
a.navbar-brand img#logo {width: 170px;}

#hlavickaKontakt {font-size: 1.1rem; text-align: center;padding-left: 25px; padding-right: 25px; /*background-color: #1b1f11; border-radius: 5px;*/}
#hlavickaKontakt .vetsi { font-size: 1.4rem;}
#hlavickaKontakt .vetsi a {color: #8dc63f; font-weight: 400; text-decoration: none; font-weight: bold;}
#hlavickaKontakt .vetsi a:hover {text-decoration: none;}
#hlavickaKontakt .vetsi i {rotate: -7deg; color: #8dc63f; margin-right: 7px;}




/* ---------------- */
/* --- HP VIDEO --- */
/* ---------------- */
.responsive-video {
  width: 100%; 
  /*height: auto; */
  /*max-width: 800px;*/ 
  aspect-ratio: 16 / 9; /* Nastaví pevný poměr stran */
  object-fit: cover;    /* Zajistí, že video hezky vyplní prostor */
}

/* Video kontejner */
.video-container {
  position: relative;
  width: 100%;
  /*max-width: 1000px;*/ /* Volitelná maximální šířka */
  margin: 0 auto;
  overflow: hidden; /* Aby video nepřečnívalo */
}

/* Video se přizpůsobí šířce */
.background-video {
  width: 100%;
  height: auto;
  display: block;
}

/* Vrstva s textem - pozicovaná absolutně */
.overlay-text {
  position: absolute;
  top: 25%;         /* Posun o 50 % shora */
  left: 5%;        /* Posun o 50 % zleva */
  /*transform: translate(-50%, -50%);*/ /* Přesné vycentrování na střed */
  color: #eaefd8;     /* Barva textu */
  text-align: left;
  width: 90%;       /* Aby text na mobilu nebyl až k okrajům */
  text-shadow: 2px 2px 10px rgba(0,0,0,0.7); /* Stín pro lepší čitelnost */
}

.overlay-text h1, .overlay-text h2 {
  font-size: 3.5rem;
  margin: 0;
  color: #eaefd8;
  font-weight: bold;
}
.overlay-text h1 {text-transform: uppercase; }




/* ---------------- */
/* --- OSTATNI ---- */
/* ---------------- */

.pruhYsvetly {background: #f2f0ea; padding: 4rem 0 2rem 0;}
.pruhYbily {background-color: #fff;}
.pruhYovladac {background-color: #fdfdfd;}
.pruhYtmavy {background-color: #111; color: #eaefd8;}
.pruhYcerny {background-color: #000; color: #eaefd8;}
.pruhYcerny h2 {color: #eaefd8;}
#paticka {background-color: #111; color: #eaefd8;}
#pruhUnigena {background-color: #111; color: #eaefd8;}
#paticka a, #pruhUnigena a {color: #fff;}

#prokoho {/*font-size: 1.6rem;*/}
#prokoho i {
  /*font-size: 32px; color: #000; background: #FEDB1E; border-radius: 50%; width: 60px; height: 60px; display: inline-block; text-align: center; line-height: 60px; margin-right: 20px;*/
  font-size: 25px;
  color: #000;
  background: #FEDB1E;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: inline-block;
  text-align: center;
  line-height: 50px;
}

.vetsi {font-size: 1.2rem;}
.zelena {color: #72c403;}
.zluta {color: #FEDB1E;}
.cervena {color: #fe4f51;}

.badge {font-size: 85%; font-weight: normal; margin-bottom: 3px;}
.badge i {color: #FEDB1E;}
.badge-seda {color: #000; background-color: #f3f3f3;}
.badge-zluta {color: #000; background-color: #FEDB1Edd;}
.badge.badge-zluta i {color: #000;}
.badge-zelena {color: #fff; background-color: #72c403dd;}
.badge-cervena {color: #fff; background-color: #ff6e5cdd;}  /* e15158 */

.btn {border-radius: 10px;}
.btn-outline-zluta {color: #FEDB1E; border-color: #FEDB1E; }
.btn-outline-zluta:hover {color: #000; background-color: #FEDB1E; border-color: #FEDB1E; }
.btn i.fa-mobile-screen-button {rotate: -7deg;}

.cena {margin: 20px 0; text-align: right; font-weight: bold; font-size: 1.5rem; color: #111;}
.cenabez {margin-top: -20px; margin-bottom: 20px; text-align: right; font-size: 1rem; color: #666;}
/*.cena small, .cenabez small {font-size: 1rem;}*/


.card {border-radius: 20px; box-shadow: 0 10px 40px #1d1f200f; border: 1px solid #fff; }
.card img.card-img-top {border-top-left-radius: 20px; border-top-right-radius: 20px; }
.card .card-img-over {position: absolute; top: 1.25rem; right: 1.25rem;}
.card:hover {border: 1px solid #FEDB1E;}
#productList .card-img-top {margin-top: 20px;}
.card-footer {border-top: none; background-color: transparent;}

.cta {position: relative;}
.cta .ctaBody {background: #FEDB1E; color: #000; border-top-left-radius: 20px; border-top-right-radius: 20px;}
.cta img.iCtaUkazka {border-bottom-left-radius: 20px; border-bottom-right-radius: 20px;}

.vizitka {background: #fff; border-radius: 20px; padding: 2rem;}
.pruhYbily .vizitka { /*background: #f2f0ea;*/ box-shadow: 0 10px 40px #1d1f200f; }

.mt--5 {margin-top: -6rem;}

#fUkazka .card-header {background-color: #FEDB1E; border-top-right-radius: 20px; border-top-left-radius: 20px; border-bottom: none; text-align: center; padding: 2rem;}

.btn-dark {background-color: #1b1f11; border-color: #1b1f11;}
.btn-zluta {color: #000; background-color: #FEDB1E; }
.btn-zelena {color: #fff; background-color: #72c403;}
.btn-zelena:hover {color: #fff; background-color: #72c403;}

/*
table.tSrovnani {border-spacing: 3px; border-collapse: separate;}
*/
table.tSrovnani td, table.tSrovnani th {background-color: transparent;}

table.tSrovnani td.colTradicni, table.tSrovnani th.colTradicni {background-color: #ff6e5c22;}
table.tSrovnani td.colYarbo, table.tSrovnani th.colYarbo {background-color: #72c40322;}
table.tSrovnani td.colUspora, table.tSrovnani th.colUspora {background-color: #72c40344;}
table.tSrovnani td.colUsporaNadp, table.tSrovnani th.colUsporaNadp {background-color: #72c40366;}
table.tSrovnani td.colPozemek, table.tSrovnani th.colPozemek {background-color: #f3f3f3;}
table.table.tSrovnani .colBorderRight {border-right: 1px solid #fff; padding-right: 2.5rem;}
table.table.tSrovnani .text-center.colBorderRight {padding-right: inherit;}


.kruh {
    width: 60px;
    height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0; /* Resetuje padding Bootstrapu, který by kruh deformoval */
}


.overlay {
    background: transparent;
    position: absolute;
    /*
    width: 100%;
    height: 333px;
    top: 550px;
    margin-top: -550px;
    */
    top: 0;
     left: 0;
     width: 100% !important;
     height: 100% !important;
}


#oznameni {background-color: #FEDB1E;}
#oznameni .lead {font-weight: bold;}
#oznameni .badge {font-weight: bold;}


/* ---------------- */
/* --- RESPONSIVNOST ---- */
/* ---------------- */

@media (max-width: 991px) {
  a.nav-link {text-align: center; }
  ul.navbar-nav {padding-top: 20px;}
  .nav-item {margin-top: 2px; margin-bottom: 2px;}
}


@media (max-width: 768px) {
  #hlavickaKontakt {padding-left: 10px; padding-right: 10px;}
  #hlavickaKontakt .vetsi {font-size: 1rem;}
  a.navbar-brand img#logo {width: 130px;}
  a.navbar-brand {font-size: 0.8rem;}

  .overlay-text {top: 30%; }
  .overlay-text h1, .overlay-text h2 { font-size: 2rem; }
}


@media (max-width: 426px) {
  .overlay-text {top: 35%;}
  .overlay-text h1, .overlay-text h2 { font-size: 1.3rem; }
  h2 {font-size: 2.3rem;}
}


@media (max-width: 366px) {
  #hlavickaKontakt {display: none;}
}