.navbar-nav {
    --bs-nav-link-font-weight: 800;
    text-transform:uppercase;
    --bs-nav-link-color: #4F6570;
    flex-grow: 1;
    --bs-navbar-nav-link-padding-x: 0.75rem !important;

}

      .navbar-brand{
            --bs-navbar-brand-margin-end: 2em !important;; 
      }


html{font-size:100%;}

.bg-light{
    --bs-bg-opacity: .7;
}

.bg-lightO1{
    --bs-bg-opacity: 1;
}


html{font-size:100%;}

/* === Barvy a základní nastavení nadpisů === */
h1, h2, h3, h4,h5 {
  font-weight: 800;                  /* Ztučnění */
   margin-top: 1em;
}


div > h1:first-of-type:first-child {
  margin-top: 0;
}

h2{
    margin-bottom: 0.8em;
}

p{
    margin-bottom:.1rem;
    min-height: 1em;
}

h3{
margin: 1.1em 0;
}


/* === Barvy odkazů === */
a {
  color: var(--barva-hlavni-2);      /* Z původního CSS */
  text-decoration: none;
}
a:hover,
a:focus {
  text-decoration: underline;        /* Podtržení při hover/focus */
}
a:active,
a.active {
  color: var(--barva-hlavni-2);
}

/* === Tlačítka (Bootstrap .btn a <button>) === */
.btn, 
button {
  background: linear-gradient(to left, var(--barva-hlavni-1), var(--barva-hlavni-2));
  color: #fff;
  border-radius: 2em;                /* Kulaté okraje jako v původním CSS */
  text-transform: uppercase;
  border: 2px solid transparent;
    padding: .5em 2em;
    font-weight: 600;
    background-clip: padding-box;
}


.btn:hover, button:hover {
    background: var(--barva-bila-1);
    border: 2px solid var(--barva-hlavni-1);
    text-decoration: none !important;
    background: #fff;
    color: var(--barva-hlavni-1);
}


.btn-more{
padding: .5em 1em
}


    body{
        color:#23353E;
    }

/* Vlastní utilita pro font-weight: 900 */
.fw-900 {
  font-weight: 800 !important;
}

/* Vlastní utilita pro font-size: 7rem */
.fs-7rem {
font-size: 8.15em !important;
    line-height: 0.95;
}

.mt-05{
    margin-top:.2em;
}

.mb-05{
    margin-bottom:.43em
}

.d-label{
    margin-top: 1em;
    margin-bottom: .6em;
    text-transform: uppercase;
    padding-left: 1em;
}

.form-note {
    display: block;
    width: calc(100% + 5.5em);
    margin: 0 -2.525em -1em -2.525em;
    padding: .5em 2em;
    text-align: center;
}

.form-note a {
    font-weight:bold;
}




    .term .day {
      font-size: 1.5em; 
      margin-right: 0.5em;
    }
    .term .date {
      display: inline-flex;
      flex-direction: column;
      margin-right: 1em;
    }
    .term .icon {
      font-size: 1.2em;
      color: #888;
    }
    .term.item.active { 
      outline: 2px solid #007bff; /* jen ukázka "aktivního" stylu */
    }    
    .hero .lead{
    font-weight: 800;
    font-size: 1.91em;
    line-height: 1.28em;
    }

    .hero {
     position:relative;
     overflow:hidden;
     z-index:0;
    }

    .hero-img{
     position:absolute;
     top:0;
     right:0;
     width: 50%;
     min-height:100%;
     background: transparent url("img/hero-hp.webp?v=2.0") no-repeat center center;
     background-size:cover;
     }



.form-box {
    background-color: #f1f1f1;
    border-radius: 1em;
    box-shadow: 0px 16px 16px rgba(0, 0, 0, 0.21);
    overflow: hidden;
    max-width: 37em;
    margin-top: 3.1em;
    padding: 1em 2.7em;
    font-size: .85em;
    min-height: 18em;
}



.p-05{
    padding:.5em;
}
.form-box .p-05 {
    padding:.5em 2em .5em 2em;
}

.form-box .btn{
    margin:auto;
    
}

.nenividet{
  width: 1px;
  height: 1px;
  opacity: 0;
  position: relative; 
}

.oteviracka{
    background: #fff url(img/oteviracka.svg) no-repeat 9px 3px;
    background-size: auto 3em;
    padding-left: 6em;
    font-size: .85em;
}

.oteviracka h4{
    font-size: 1.15em;
}

.oteviracka em{
    display:block;
    font-size:.9em
}
.oteviracka div{
    margin-top:-.5em;
    margin-bottom:.5em;
}

.orange{
    color:#FA7C1C
}

.bg-grey{
background:#E2E2E2
}

.review-one{
    text-align:center
}

.review-one .reviewBody {
  display: block;
  height: 6em;         /* omezíme výšku na cca 6 řádků */
  overflow: hidden;
  position: relative;  /* pro absolutní pozicování pseudo-prvku */
    cursor:pointer;
}

/* Přechod (fade-out) dole */
.review-one .reviewBody::after {
  content: "";
  position: absolute;
  bottom: 0;          /* překryje spodní část textu */
  left: 0;
  width: 100%;
  height: 2em;        /* výška přesahu */
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff);
  pointer-events: none; /* aby se klik nepral s buttonem */
}

/* Pokud je text rozbalený, odstraníme omezení a pseudo-prvek. */
.review-one .reviewBody.expanded {
  height: auto;
  overflow: visible;
}

.review-one .reviewBody.expanded::after {
  display: none;
}
.imgig{
     aspect-ratio: 1 / 1; /* Poměr 200:133 (cca 3:2) */
     overflow: hidden;
     position: relative;
     /* margin: .3em; */
     border-radius: .5em;
     padding: 0;
}
.imgig img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.review-one img{
    max-width:90%; margin:auto;
}

.gg h2{
    background: #fff url(img/g.svg) no-repeat 0em 40%;
    background-size: auto 1.45em;
    padding-left: 2em;
    line-height: 2em;
    margin: 1em 0;
    font-size: 2em;
}

.ig h2{
    background: #fff url(img/instagram.svg) no-repeat 0em 40%;
    background-size: auto 1.45em;
    padding-left: 2em;
    line-height: 2em;
    margin: 1em 0;
    font-size: 2em;
}

hr{
    margin:2em 0;
}

h2 a{
    text-decoration:none;
    color:inherit;
    display: inline-block;
}

.bg-black{
    color:#E2E2E2;
}


.hpo{
    margin: 2em 0 5em 0;
}

.hpo a{
    display: block;
    aspect-ratio: 1 / 1;
    background-size: cover;
    background-position: center center;
    overflow: hidden;
    margin: 0 0;
    position: relative;
    z-index: 0;
    border-radius: 1em;
    transition: all .5s ease;
}

.hpo a:after{
    content: "";
    display:none;
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:rgba(255,255,255,.7) url(img/loga/logo-orange.svg) no-repeat center center;
    background-size: 5em auto;
    z-index:0;
}

.hpo a:hover:before {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

.a-hotel{
    background-image: url(img/ubytovani.webp);
}
.a-pokoje{
    background-image: url(img/hospudka.webp);
}
.a-okoli{
    background-image: url(img/okoli.webp);
}
.hpo a span{
    position:absolute;
    bottom:0;
    display:block;
    width:100%;
    padding:.5em 1em;
    text-align:center;
    background:#23353ec2;
    color:#fff;
    font-size:.8em;
    z-index:1;
}

.hpo a span h4{
    font-weight:800;
    font-size:2.5em
}

.hpo a:hover{
  box-shadow: 0px 12px 19px 0px rgba(0, 0, 0, 0.21);
   transform: scale(1.02);
}

.hpo a:hover:after{
    display:block;
}
.hpo a:hover span,.hpo a:hover span h4 {
    color: #FA7C1C;
}
.hpo a:hover span h4 {
    text-decoration:underline;
}
.hpo a:hover span{
    background:transparent
}

.ig .col-md-2{
    padding:.2em
}

.fixedNav {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
  transition: background 0.3s;
      padding: 1em 0 0 0;
}
 
nav li>ul{
display:none!important;
background:#fff;
  position: absolute;
  top: 100%;
  z-index: 1000; /* zajistí překrytí ostatních prvků */
}
nav li>ul>li>ul{
  position: absolute;
  top: 0;
  left: 100%; /* submenu se objeví napravo */
  z-index: 1000; /* zajistí překrytí ostatních prvků */
}

nav li:hover>ul{
display:block!important
}

/* */
#logo {
  display: inline-block;
  /* width: 2.75em; */
  /* height: 2.75em; */
  position: relative;
}

#logo img {
  width: 5em;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  overflow: hidden;
}


.term .day,.term .month{
    font-weight:800
}

.top-tel{
    color:#23353E;
    font-size: 1.1em;
    font-weight: 600;
}
.top-contact{
    padding-top:.75em;
    text-align: left;
    /* float: right; */
}

.side-contacts{
    overflow:auto;
}
.side-contacts iframe{
    max-width:90%;
}

.top-contact .btn span{
    display:inline-block;
}     
.top-contact .btn i{
    display:none;
}     

.foto .fg {
    display: block;
    padding: .3em;
}

.foto .fg img{
    width:100%;
}

.sd-logo{
    margin: 2.6em 0;
    width: 14.5em;
}

#sundisk{font-size: 1.2em;}
#sundisk h2 {
    margin: .45em 0 .5em 0;
    font-style: italic;
    font-size: 2.39em;
    font-weight: 600;
    line-height: 1.4;
}


#sundisk h4 {
color: #707070;
    margin: 4em 0 1em 0;
    font-size: 1rem;
}

.provozovny-list{
margin-bottom:2.8em;
margin-left:-1.19em
}

.provozovny-list a{
    display:inline-block;
    padding: .5em .6em .5em 1.65em;
    text-transform:uppercase;
    color:#E2E2E2;
    position:relative;
    font-size: .7em;
        font-weight: 500;
}
.provozovny-list a:hover{

    color:#FA7C1C;
    text-decoration:none;
}
.provozovny-list  a::before {
    font-family: 'bootstrap-icons'; /* Použití správného fontu pro Bootstrap Icons */
    position: absolute;
    left: 0; /* Ikona bude vlevo před textem */
    top: 50%;
    transform: translateY(-50%); /* Vertikálně centrováno */
    font-size: 1em; /* Velikost ikony */
    color: transparent; /* Před hoverem bude ikona neviditelná */
    transition: color 0.3s, transform 0.3s; /* Plynulý přechod pro změnu barvy a pohyb ikony */
    content: '\F285'; /* Unicode pro bi-chevron-right */
  }


.provozovny-list  a:hover::before {
    color: #FA7C1C; /* Zobrazí modrou ikonu na hover */
    transform: translateY(-50%) translateX(5px); /* Posune ikonu o kousek doprava */
  }

#footer .fimg{
    background-image: url(img/nadfooterem.webp);
    background-repeat:no-repeat;
    background-position:top;
    background-size:100% auto;
    padding-bottom:7.58%;
}

.mobil{
    background: transparent url(img/ikona_mobil.svg) no-repeat left center;
    padding-left: 4em;
    background-size: 2.5em auto;
    min-height:4em
}

.mobil a{
    display:block;
    font-weight:600;
}

.mobil a span{
    color:#23353E;
    font-weight:400;
}


#rez-kont .mobil a span{
    color:#fff;
}


a.agrey{
    color:#23353E;
}

.agrey li a{
    color: #23353E;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1.8em;
}

ul.agrey  {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.foto .img-fluid{
    border-radius:8px;
}

.dark-circle {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    border-radius: 50%;
    background: #23353E;
    font-size: 1.283em;
    text-align: center;
    /* padding: .39em .63em; */
    aspect-ratio: 1 / 1;
    font-style: normal;
    margin: 0 .5em;
    transition: transform 0.3sease, box-shadow 0.3sease;
    width: 2.11em;
    height: 2.11em;
}

.dark-circle:hover {
    text-decoration: none; /* Odebrání dekorace textu */
    transform: scale(1.1); /* Zvýšení velikosti o 10% */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Přidání lehkého stínu */
}


.mt-10{
    margin-top: 9rem;
}


.pr-x{
    padding-right:5em
}


.pl-x{
    padding-left:5em
}

.box-grey-rnd{
    background: #F1F1F1;
    border-radius: .75em;
    margin: 0.5em 0;
    padding: .5em 2em;
}

.box-grey-rnd h3{
    margin:0; padding:0;
    font-size:1em;

}


#rez-kont{
    background:#23353E;
}

#rez-kont h2{
   display:block;
    color:#fff;
}

.pall-2 {
    padding: 2em;
    display: flex; /* Přidáno pro vystředění obsahu */
    justify-content: center; /* Horizontální vystředění */
    align-items: center; /* Vertikální vystředění */
}

.knas{
    margin-top:7em;
    color:#fff;
}

.knas .mobil{
    color:#fff;
    background-image: url(img/ikona_mobil-w.svg);
}

.h1, h1 {
        font-size: 2.75rem;
    }

.h2, h2 {
        font-size: 1.875rem;
    }

.h3, h3 {
        font-size: 1.1875rem;
    }

.h4, h4 {
        font-size: 1.0875rem;
    }


.h5, h5 {
        font-size: 1rem;
    }
.language-switch {
    position: relative;
    display: inline-block;
    width: 1.8em;
    height: 1.8em;
}

.language-switch a {
    display: inline-block;
    transition: all 0.3s ease;
    z-index:0;
    position: absolute;
    top:0;
    left:0;
    padding-top:.2em;

}
.language-switch a.active {
    z-index:5;
    color:#fff;
}

.language-switch.open a:nth-child(2),
.language-switch:hover a:nth-child(2) {
    top: 2.5em;
}

.language-switch.open a:nth-child(3),
.language-switch:hover a:nth-child(3) {
    top: 5em;
}

.language-switch.open a:nth-child(4),
.language-switch:hover a:nth-child(4) {
    top: 7.5em;
}


.language-switch:hover a.active {
    z-index:5;
    color:#fff;
}

#main img, #main svg,#main table,  #sundisk img{
    max-width:100%
}

#social, #main{
    overflow:hidden;
}

.overlay {
    position: absolute;
    bottom: -1em;
    left: 0;
    right: 0;
    background: linear-gradient(to bottom, rgba(255, 255, 255, .05) 0%, rgba(255, 255, 255, 0.97) 80%, rgba(255, 255, 255, 1) 85%);
    height: 7em;
    text-align: center;
    line-height: 8em;
    color: #333;
    cursor: pointer;
    z-index: 10;
}

.col-slave{
position:relative;
}

#main img{
    max-width:100%;
    height:auto!important;
}

.mobil-oteviracka{
display:none;
}


@media (min-width: 1400px) {
   .hero .container, #fixedNav .container, #footer .container{
        max-width: 1620px;
                padding-left: 3em;
        padding-right: 3em;
    }
}


        .desktop-padding {
    padding: 5em  5em  0em 0;
  }


#main .btn{
    margin: 1em 0;
}

.rezervace-resp{
    display:none;
}

      @media (max-width: 450px) {
.term.item{ font-size:.7em; }
}

      @media (max-width: 575px) {
      
      .rowAllways  .col-6 {
           max-width: none !important;
              flex: 0 0 auto;
            width: 50%  !important;
     }
      

      }
      /* Pokud chceš na mobilu nějaké jiné chování, lze doplnit media query. */
      @media (max-width: 992px) {
.mobil-oteviracka{
display:block;
}
 
.rezervace-resp{
    display:block;
background: linear-gradient(to left, var(--barva-hlavni-1), var(--barva-hlavni-2));
    color: #fff;
    text-transform: uppercase;
    padding: .5em 2em;
    font-weight: 600;
    margin:0 -2em;
}
   
#logo{
margin-left:1em;
}
     
      #fixedNav .col-md-5, #fixedNav .col-md-7, #fixedNav .container{
        width:100%;
        max-width:100%;
      }
      
 
 .navbar-nav .nav-link.active, .navbar-nav .nav-link.show,a:active, a.active {
    color: var(--barva-hlavni-2);
}

      
      .mt-10{
        margin-top:4em;
      }
      
        .desktop-padding {
         padding: 1em 2em;
  }
  #sundisk h2{
    font-size:1.7em;
  }
  .form-box .p-05{
    padding:0
  }
  
  .term .day{
    font-size:1.7em;
  }
  
  .fs-7rem{
    font-size:4.5em !important;
  }
  .hero .lead{
    font-size:1.4em
  }
  .form-note{
    font-size:.8em
  }
 
 .pr-x, .pl-x{
    padding-left:0em;
    padding-right:0em;
 }
     .foto .fg,.ig .col-md-2{
        padding:1em;
     } 
      .language-switch{
        margin-right:1.2em
      }

    .language-switch a {
        display: none; /* Skrýt všechny tlačítka kromě aktivního */
    }
    .language-switch a.active {
        display: block; /* Skrýt všechny tlačítka kromě aktivního */
    }
    .language-switch.open a {
        display: inline-block; /* Zobrazit všechny po kliknutí */
    }
      

      
.hpo a{
margin:1em;
}

#footer .row>div{
    margin:1em 0;
}

  .navbar-toggler {
    background: transparent;
    border: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 2em;
    height: 2em; /* Výška pro celé tlačítko */
    margin-right:1em
  }

  .toggler-bar {
    display: block;
    width: 100%;
    height: 4px;
    background-color: #333;
    transition: all 0.3s ease-in-out;
  }

  .navbar-toggler.collapsed .toggler-bar:nth-child(1) {
    transform: translateY(6px);
  }

  .navbar-toggler.collapsed .toggler-bar:nth-child(2) {
    opacity: 1;
  }

  .navbar-toggler.collapsed .toggler-bar:nth-child(3) {
    transform: translateY(-6px);
  }

  .navbar-toggler:not(.collapsed) .toggler-bar:nth-child(1) {
    transform: rotate(45deg);
        top: 1em;
        position: relative;
  }

  .navbar-toggler:not(.collapsed) .toggler-bar:nth-child(2) {
    opacity: 0;
  }

  .navbar-toggler:not(.collapsed) .toggler-bar:nth-child(3) {
    transform: rotate(-45deg);
        bottom: 1em;
        position: relative;
  }
       
       body{
           padding-top: 6em;
       }
       
       .oteviracka{
        display:none
       }
       
      .hero-img{
        min-height:auto;
        position:relative;
        top:0;
        right:0;
        width:100%;
        height:100vw;
        margin-top: -10em;
        z-index:0;
        }
        .hero section{
        margin-top: 3em;
            z-index:1;
            position:relative
        }
        

        .navbar-toggler,.navbar-toggler:hover{
            background:#fff;
            border:0
        }

        .navbar-collapse{
            background:#fff;
            padding: 2em;
        }
        

        .nav-link:hover{
            color:red;
        }
 
 .language-switch {
    margin-top: -.65em;
}

#lngSwitch .dark-circle {
    color: #000;
    border-radius: 0; 
    background: #F1F1F1;
}
        
.top-contact{
        padding-top: 1em;
        padding-bottom: .4em;
        text-align: right;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        background: #F1F1F1;
}     
.top-contact a{
    float:right
}     
.top-contact .btn span{
    display:none;
}     
.top-contact .btn i{
    display:inline-block;
}     
.top-contact .btn{

        display:none;
}    

.mailtop{
        background: #fff;
        color: #000;
        border-radius: 0;
        text-transform: uppercase;
        border: 0 solid transparent;
        font-weight: 600;
        padding: 1em;
        margin-left: 1em;
        margin-top: -1em;
        margin-right: 1em;
        margin-bottom: -1em;
        padding-bottom: 1.75em;
        padding-top: 1.55em;
}
 
     .fixedNav {
        background: #fff !important;
    position:absolute;

     }
     .fixedNav nav{
        margin-top:5em;
     }
     
 
 nav li>ul{
    display: block!important;
    position:relative;
    margin-left:1em;
    text-transform: lowercase!important;   
 }
     
 nav li>ul a{

    font-weight: 100!important;
 }
     
      }

@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1420px;
    }
}      
      



/*timepicker*/
    .term.item {
    border: 1px solid #23353E;
    display: inline-flex;
    align-items: center;
    padding: .2em .8em;
    margin: 0 0 1em 0;
    cursor: pointer;
    background: #fff;
    border-radius: 4px;
    }
    .term .day {
font-size: 2.5em;
    margin-right: .16em;
    font-weight: 100;
    width: 1.35em;
    }
    .term .date {
      display: flex;
      flex-direction: column;
      margin-right: 1em;
    }
    .term .icon {
      font-size: 1.2em;
      color: #888;
    }
    .term.item.active {
      outline: 2px solid #007bff; /* jen ukázka "aktivního" stylu */
    }


.icon-ico-calendar-big{
    background: url(img/ikona_kalendar.svg) center center;
    background-size:cover;
    width: 1.7em;
    height: 1.5em;
    display: inline-block;
}