@font-face {
  font-family: Calibri;
  src: url('/vendor/calibri-bold.woff') format('woff');
  font-style: normal;
  font-weight: 700;
}

.kontaktos {
display: none;
}

@font-face {
  font-family: Calibri;
  font-style: normal;
  font-weight: normal;
  src: url('/vendor/calibri.woff') format('woff');
}
.VForange, .vforange {
    color: #ec7d1f !important;
}
.VFgray, .vfgray {
    color: #5b5b5b !important;
}
.bg-grey, .bg-gray {
    background: #F5F5F5 !important;
}

.u-header {
    -webkit-box-shadow: 0 5px 10px -6px rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 10px -6px rgba(0, 0, 0, 0.1);
}

a {
    color: #ec7d1f !important;
}
h1, .h1 {
    color: #ec7d1f !important;
    font-weight: 700;
    margin-bottom: 1.25rem;
}
h2, .h2 {
    font-weight: 700;
}
td {
    width: 33% !important;
}
.custom-shadow {
    -webkit-box-shadow: 0 15px 40px 0 rgba(0, 0, 0, 0.03);
    box-shadow: 0 15px 40px 0 rgba(0, 0, 0, 0.03);
    border-radius: 10px !important;
    
}
.form-control:focus, .custom-select:focus {
    border-color: #ec7d1f !important;
}
a:hover .no-underline {
    text-decoration: none !important;
}
.no-underline:hover {
    text-decoration: none !important;
} 
.top-menu ul {
    list-style: none;
    display: flex;
    text-align: right;
}

.menu-smaller .nav-item .nav-link {
    font-size: 15px !important;
    font-weight: 300;
}

.social-box {
    position: fixed;
    top: 275px;
    right: 0;
    z-index: 50;
}

.bg-grey {
    padding-top: 100px; 
}    

.social-box-ikona {
    background: #ec7d1f;
    width: 23px;
    height: 23px;
    margin-top: -1px;
}

.footer-odkazy a {
    color: #5b5b5b !important;
}
.btn-custom-orange, .btn-custom-orange:focus {
    color: white !important;
    padding: 10px 25px;
    background: #ec7d1f;
    border: 3px solid #ec7d1f;
    border-radius: 10px; 
}

.btn-custom-orange-menu {
    color: white !important;
    padding: 8px 20px;
    background: #ec7d1f;
    border: 3px solid #ec7d1f;
    border-radius: 10px; 
    margin-top: -13px;
}

.btn-custom-orange-menu:hover {
    color: #ec7d1f !important;
    background: white;
    border: 3px solid #ec7d1f;
    border-radius: 10px; 
}

.btn-custom-white  {
    color: #ec7d1f;
    padding: 10px 25px;
    background: white;
    border: 3px solid white;
    border-radius: 10px;    
}

.btn-custom-white:hover  {
    color: white;
    padding: 10px 25px;
    background: #ec7d1f;;
    border: 3px solid white;
    border-radius: 10px;    
}

.btn-custom-orange:hover {
    color: #ec7d1f !important;
    background: transparent;
    padding: 10px 15px;
    border: 3px solid #ec7d1f;
}
.u-header__section .nav-link {
    color: #5b5b5b !important;
    font-size: 18px !important;
    font-weight: 600;
}
.u-header__section .nav-link:hover {
    color: #ec7d1f !important
}
.article-custom-foto-border {
    border-radius: 0 20px 20px 0;
}
.article-custom {
    position: relative;
    height: 100%;
    border-radius: 20px;
    background-color: white;
    -webkit-box-shadow: 0 15px 40px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 15px 40px 0 rgba(0, 0, 0, 0.15);
    -webkit-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
}
.article-custom:hover {
    -webkit-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.1);
    -webkit-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
}
.article-custom .article-custom-link {
    font-weight: 700;
    position: absolute;
    margin: 30px 0 15px 0;
    bottom: 0px;
     -webkit-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
}
.article-custom:hover .article-custom-link {
     -webkit-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
    color: #ec7d1f !important; 
}
.hp-ikona {
    max-height: 100px;
    margin-bottom: 20px;
}
.hp-slider-ikona {
    max-height: 75px;
    margin-bottom: 20px;
}
.sekce-vysek {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 300px;
}
.img-bl-rounded {
    border-radius: 0 0 0 10px;
}
.o-nas-refenence-box {
    background: white;
    text-align: center;
    padding: 15px 10px;
    border-radius: 10px;
    margin: 10px 0;
} 
.o-nas-refenence-box p {
    margin-bottom: 0px;
}
.border-left-custom {
    border-radius: 10px 0 0 10px;
}
.border-right-custom {
    border-radius: 0 10px 10px 0;
}
.padding-left-custom {
    padding: 30px 15px 30px 30px
}
.padding-right-custom {
    padding: 30px 30px 30px 15px
}
.o-nas-bg1 {
    background-image: url("/img/o-nas/kolin05.jpg");
    background-size: cover;
    min-height: 300px;
    height: 100%;
    width: 100%;
    background-position: 50% 50%;
}
.o-nas-bg2 {
    background-image: url("/img/o-nas/kolin04.jpg");
    background-size: cover;
    min-height: 300px;
    height: 100%;
    width: 100%;
    background-position: 50% 50%;
}
.servis-bg1 {
    background-image: url("/img/servis/vftyp01.png");
    background-size: cover;
    min-height: 300px;
    height: 100%;
    width: 100%;
    background-position: 50% 50%;
}
.servis-bg2 {
    background-image: url("/img/servis/vftyp02.png");
    background-size: cover;
    min-height: 300px;
    height: 100%;
    width: 100%;
    background-position: 50% 50%;
}
.servis-bg3 {
    background-image: url("/img/servis/vftyp03.png");
    background-size: cover;
    min-height: 300px;
    height: 100%;
    width: 100%;
    background-position: 50% 50%;
}
.servis-bg4 {
    background-image: url("/img/servis/vftyp04.png");
    background-size: cover;
    min-height: 300px;
    height: 100%;
    width: 100%;
    background-position: 30% 70%;
}
.servis-bg5 {
    background-image: url("/img/servis/vftyp05.jpg");
    background-size: cover;
    min-height: 300px;
    height: 100%;
    width: 100%;
    background-position: 50% 50%;
}

.g-rounder-top-10 {
    border-radius: 10px 10px 0 0;
}
.hzaluzie1 {
    max-height: 300px;
    display: block;
    margin: 0 auto;
}
.hzaluzie {
    max-height: 250px;
}
.big-white-box {
    background: white;
    border-radius: 10px;
    padding: 50px;
    height: 100%;
}

.big-white-box2 {
    padding: 50px;    
}

.big-white-box-form {
    background: white;
    border-radius: 10px;
}
.big-white-box-np {
    background: white;
    border-radius: 10px;
}
.velux-white-box {
    background: white;
    border-radius: 10px;
    padding: 50px;
    height: 100%;
}
.galerie-img {
    border-radius: 10px;
    width: 100%;
    display: block;
    margin:  0 auto;
    -webkit-box-shadow: 0 15px 40px 0 rgba(0, 0, 0, 0.05);
    box-shadow: 0 15px 40px 0 rgba(0, 0, 0, 0.05);
}
.form-control {
    padding: 10px
}
.vertikalni-bg1 {
    background-image: url("/img/vnitrni-stineni/vertikalni-zaluzie/01.jpg");
    background-size: cover;
    min-height: 300px;
    width: 100%;
    background-position: 50% 50%;
}
.vertikalni-bg2 {
    background-image: url("/img/vnitrni-stineni/vertikalni-zaluzie/02.jpg");
    background-size: cover;
    min-height: 300px;
    width: 100%;
    background-position: 50% 50%;
}

.realizace-box {
    text-decoration: none !important;
}

.realizace-box p {
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
}

.realizace-box:hover p {
    color: #ec7d1f;
    
}

.upozorneni {
    background: #ec7d1f;
    padding: 10px 20px;
    font-size: 20px;
    color: white !important;
    font-weight: 700;

}

.upozorneni p {
    color: white;
    max-width: 1700px;
    margin: 0 auto;
    text-align: center;
}

.cta-poptavka {
    background: #ec7d1f !important;
    text-align: center;
    color: white;
}

.cta-poptavka .h1, .cta-poptavka .h4 {
    color: white !important;
}

/* iPhoneSE */
@media only screen 
and (max-width : 349px) {
    .article-custom-foto-border {
    border-radius: 20px 20px 0 0 !important;
    }
     .layer-5 {
     margin-top: 50px !important;
     }
     .layer-7 {
     margin-top: 150px !important;
     }
     .border-left-custom {
    border-radius: 10px 10px 0 0;
    }
    .border-right-custom {
        border-radius: 10px 10px 0 0 ;
    }
    .velux-white-box {
        padding: 10px;
    }
    .velux-img {
        max-width: 75%;
        margin: 20px auto;
        display: block;
    }
    .social-box {
    display: none;
    }
}
/* iPhoneX */
@media only screen 
and (min-width: 350px) and (max-width: 767px) {
    .article-custom-foto-border {
    border-radius: 20px 20px 0 0 !important;
    }
     .layer-5 {
     margin-top: 50px !important;
     }
     .layer-7 {
     margin-top: 150px !important;
     }
    .border-left-custom {
    border-radius: 10px 10px 0 0;
    }
    .border-right-custom {
        border-radius: 10px 10px 0 0 ;
    }

    .velux-img {
        margin-bottom: 20px;
    }

    .social-box {
    display: none;
    }
    
    .upozorneni p {
        font-size: 14px !important;
        text-align: left;
    }
    
    .bg-grey {
        padding-top: 150px !important;
    }
    
    
}
/* iPad */
@media only screen 
and (min-width : 768px) and (max-width: 991px){
    .article-custom .article-custom-link {
    position: absolute;
    margin: 30px 0 15px 0;
    bottom: 25px;
    }
    .upozorneni p {
        font-size: 14px !important;
        text-align: left;
    }
    .border-left-custom {
    border-radius: 10px 10px 0 0;
    }
    .border-right-custom {
    border-radius: 10px 10px 0 0 ;
    }
    .velux-white-box {
    padding: 30px;
    }
    .social-box {
    display: none;
    }
}
/* iPad Pro */
@media only screen 
and (min-width: 992px) and (max-width: 1199px){
    ul#js-scroll-nav {
    margin: 0 auto;
    }
    .navbar-brand {
    display: table !important;
    /*margin: 0 auto;
    padding-bottom: 1.3125rem;*/
    }
}
/* Laptop max 1450 */
@media only screen 
and (min-width: 1200px) and (max-width: 1449px){
}

/*Untill IpadPro + Desktop */
@media only screen 
and (max-width: 767px) {
    .border-radius-left-lg {
        border-radius: 10px 10px 0 0;
    }
    .border-radius-right-lg {
        border-radius: 0 0 10px 10px;
    }
}

/*IpadPro + Desktop */
@media only screen 
and (min-width: 768px) {
    .border-radius-left-lg {
        border-radius: 10px 0 0 10px;
    }
    .border-radius-right-lg {
        border-radius: 0 10px 10px 0;
    }
}

/* CUSTOM QUESTIES */

@media only screen 
and (min-width: 1041px) { 
    .thirty-year_badge--wrap {
        position: absolute; 
        right: 30px; 
        bottom: 30px; 
        z-index: 99999;
    }
    .thirty-year_badge--img {
        width: 120px;
    }
}
@media only screen 
and (max-width: 1040px) { 
    .thirty-year_badge--wrap {
        position: absolute; 
        right: 10px; 
        bottom: 10px; 
        z-index: 99999;
    }
    .thirty-year_badge--img {
        width: 120px;
    }
}
@media only screen 
and (min-width: 576px) { 
    .thirty-year_badge--mobile {
        display:none;
    }
}
@media only screen 
and (max-width: 575px) { 
    .thirty-year_badge--mobile {
        display:block;
        position: fixed;
        bottom: 10px;
        right: 10px;
    }
}
@media only screen 
and (max-width: 475px) { 
    .thirty-year_badge--img {
        width: 110px;
    }
    .thirty-year_badge--mobile { 
        bottom: 50px;
        right: 10px;
    }
}

/* ---- Úpravy homepage: hero, mobilní lišta, realizace, FAQ ---- */
.hero-vf{position:relative;min-height:90vh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;padding:190px 15px 90px;
  background:linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.2)),url(/img/hp/hero-pergola.jpg) center/cover no-repeat}
.hero-vf h1{color:#fff!important;text-shadow:0 2px 14px rgba(0,0,0,.65);font-weight:700;font-size:clamp(30px,5vw,58px);line-height:1.15;max-width:900px;margin:0 auto 14px}
.hero-vf p{color:#fff!important;text-shadow:0 1px 10px rgba(0,0,0,.65);font-size:clamp(18px,2vw,24px);margin:0 auto 34px;max-width:700px}
.hero-vf .btn{margin:8px 10px}
.mobile-cta{display:none}
@media(max-width:767px){
  .mobile-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1000;box-shadow:0 -2px 10px rgba(0,0,0,.2)}
  .mobile-cta a,.mobile-cta form,.mobile-cta .btn{flex:1;margin:0}
  .mobile-cta .btn{width:100%;border-radius:0;padding:15px 0;font-size:18px;font-weight:700}
  body{padding-bottom:56px}
}
.realizace-meta{text-align:center;color:#777;font-size:14px;margin:-4px 0 6px}
.realizace-box img{height:100%!important;object-fit:cover}
.realizace-label{display:block;font-weight:700;margin-bottom:6px}
.faq-item{border-bottom:1px solid #ddd;padding:14px 0}
.faq-item summary{cursor:pointer;font-weight:700;font-size:20px}
.faq-item p{margin:10px 0 0}

/* ---- Navigace: jedna řada s rozbalovacími nabídkami ---- */
.top-menu ul.nav-dd-menu{display:none}
@media(min-width:992px){
  .nav-dd{position:relative;padding-bottom:18px;margin-bottom:-18px}
  .nav-dd > .nav-link:after{content:"";display:inline-block;width:6px;height:6px;margin:0 0 3px 7px;border:solid currentColor;border-width:0 2px 2px 0;transform:rotate(45deg)}
  .top-menu ul.nav-dd-menu{position:absolute;left:0;top:100%;min-width:270px;margin:0;padding:10px 0;list-style:none;background:#fff;border-radius:0 0 10px 10px;
    box-shadow:0 12px 24px rgba(0,0,0,.12);z-index:1100;text-align:left;text-transform:none;flex-direction:column}
  .top-menu .nav-dd:hover > ul.nav-dd-menu,.top-menu .nav-dd:focus-within > ul.nav-dd-menu{display:block}
  .nav-dd-menu a{display:block;padding:8px 22px;color:#5b5b5b !important;font-size:15px;font-weight:600;letter-spacing:0;white-space:nowrap}
  .nav-dd-menu a:hover{color:#ec7d1f !important;background:#f5f5f5}
}

/* ---- Prodejna (mapa) a e-shop (nízký oranžový pruh) ---- */
.prodejna-mapa{width:100%;height:340px;border:0;border-radius:10px}
.eshop-banner{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:360px;padding:60px 20px;
  background:linear-gradient(rgba(0,0,0,.4),rgba(0,0,0,.4)),url(/img/slider/01.jpg) center/cover no-repeat}
.eshop-banner h2{color:#fff !important;font-size:clamp(28px,3.6vw,44px);font-weight:700;line-height:1.2;max-width:900px;margin:0 0 30px;text-shadow:0 2px 12px rgba(0,0,0,.4)}
#js-scroll-nav .nav-link,#js-scroll-nav .btn{white-space:nowrap}
@media(min-width:992px) and (max-width:1199px){
  #js-scroll-nav .nav-link{font-size:14px !important;letter-spacing:0 !important}
  #js-scroll-nav .nav-item{margin-left:7px !important;margin-right:7px !important}
}

/* odznak 30 let v hero nesmí přebít hlavičku při scrollu */
.hero-vf .thirty-year_badge--wrap{z-index:1}

/* horní řada: telefon, e-mail a Facebook přesně na střed (Safari špatně počítá -webkit-inline-box) */
.top-menu ul.menu-smaller{align-items:center}
.menu-smaller .nav-item{display:flex;align-items:center}
.menu-smaller .nav-item > a{display:inline-flex !important;align-items:center}
.menu-smaller .nav-item p{margin:0}
.menu-smaller .social-box-ikona{margin-top:0}
.top-menu ul.menu-smaller{position:relative;top:8px}

/* Práce návrhářky: na mobilu 3 fotky jako carousel (posun prstem, další fotka kouká zpoza okraje) */
.navrharka-dots{display:none}
@media(max-width:767px){
  .navrharka-row{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .navrharka-row::-webkit-scrollbar{display:none}
  .navrharka-row > div{flex:0 0 80%;max-width:80%;scroll-snap-align:center}
  .navrharka-dots{display:flex;justify-content:center;gap:8px;margin-top:4px}
  .navrharka-dots span{width:8px;height:8px;border-radius:50%;background:#ccc}
  .navrharka-dots span.on{background:#ec7d1f}
}

.upozorneni a{color:inherit !important;text-decoration:underline}

/* Karty produktů na homepage: nahoře velká fotka (poměr 3:2, aby bylo vidět celý záběr), pod ní nadpis, text a odkaz */
.produkt-box{display:flex;flex-direction:column;overflow:hidden}
.produkt-foto{aspect-ratio:3/2;overflow:hidden;background:#eee}
.produkt-foto img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
a:hover .produkt-foto img{transform:scale(1.04)}
.produkt-text{padding:28px 32px 30px;text-align:left;flex:1;display:flex;flex-direction:column}
.produkt-text p{flex:1}
@media(max-width:575px){.produkt-text{padding:22px 22px 24px}}

/* osamocená karta v poslední řadě na středu */
section .row.g-mb-50{justify-content:center}