@font-face {
    font-family: 'bold';
    src: url('../font/OpenSans-Bold.ttf'); 
}

@font-face {
    font-family: 'medium';
    src: url('../font/OpenSans-Medium.ttf'); 
}

@font-face {
    font-family: 'regular';
    src: url('../font/OpenSans-Regular.ttf'); 
}

@font-face {
    font-family: 'semibold';
    src: url('../font/OpenSans-SemiBold.ttf'); 
}

@font-face {
    font-family: 'extrabold';
    src: url('../font/OpenSans-ExtraBold.ttf'); 
}

@font-face {
    font-family: 'semibold-2';
    src: url('../fonts/WorkSans-SemiBold.ttf'); 
}


* {
    --font-bold: 'bold',sans-serif;
    --font-medium: 'medium',sans-serif;
    --font-regular: 'regular',sans-serif;
    --font-semibold: 'semibold',sans-serif;
    --font-semibold-2: 'semibold-2',sans-serif;
    --font-extrabold: 'extrabold',sans-serif;



    font-family: 'regular',sans-serif;
    font-weight: normal;

    -webkit-font-smoothing: subpixel-antialiased !important; 
    text-rendering:optimizeLegibility !important;
    box-sizing: border-box;

    --body_c: #F5F6F8;
    --main_c: transparent;

    --min_width: min(1276px, 100%);

    --logo: url('../website/images/logo.png');
    --logo_hover: url('../website/images/logo.png');

    --logo_foot: url('../img/logo-pata.jpg');
    --logo_foot_hover: url('../img/logo-pata.jpg');



    --padding: min(8vw,140px);
    --web_max_w: 2000px;
    --header_logo_height:clamp(40px, 3vw, 50px);
    --header_logo_height-full: clamp(35px, 3vw, 45px);
    --header_mobile_height: 95px;
    --padd_under_header: clamp(4rem, 6.2vw, 7.5rem);
    
    --textmenu:#484848;
    --textmenu-full: #484848;
    --textmenuhover: #386535;
    --textsubmenu: #484848;
    --textsubmenuhover: #484848;

    --submenu_background: #FFC702;

    --menu_open_bg: #386535;
    --tit_h1: #F8F8F8;
    --tit_h1_in: #386535;
    --menu_dropdown_icon_hover: #386535;
    --menu_dropdown_icon: #484848;
    --menu_dropdown_top: calc(var(--header_logo_height) + 15px);
    --menu_dropdown_line_color: #DFDFDF;

    --hlavni_barva: #FFC702;
    --druha_barva: #386535;
    --druha_hover: #457c41;



    --textcontent: #2C2829;
    --header_bg: #FFC702;
    --header_bg_full: #FFC702;
    --header_mobile_open: #FFC702;

    --nadpisy: #252E3D;
    --text: #484848;
    --odkaz: #386535;

    --marker: #C4C4C4;
    --light: #C9C9C9;



    --text_footer: #ffffff;
    

    --menu_open_time: .4s;
    --menu_bg: #d9ab02;
    --foot_bg: #017ABF;

    --meho_c: #575757;

}

@counter-style custom-letters {
    system: fixed;
    symbols:A B C D E F G H I J K L M N O P Q R S T U V W X Y Z;
    suffix: ") ";
}
@counter-style custom-letters-small {
    system: fixed;
    symbols:a b c d e f g h i j k l m n o p q r s t u v w x y z;
    suffix: ") ";
}

img {
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;
    
}

body{
    margin:0;
    max-width: var(--web_max_w);
    overflow-x: hidden;
    margin: 0 auto;
    overscroll-behavior-y: none;
}

body.bg {
    background: var(--body_c);
}

html {
    scroll-padding-top: var(--header_logo_height);
    scroll-behavior: smooth;
    background: white;
    /* overflow-x: hidden; */
}



a:link {
    text-decoration: unset;
}

a:visited {
    color: none;
}

a:-webkit-any-link {
    text-decoration: none;
}


header {
    z-index: 100;
    box-sizing: border-box;
    height: fit-content;
    top:0px;
    /* margin-top: 46px; */
    position: absolute;
    width: 100%;
    max-width: var(--web_max_w);
    padding-inline: calc(var(--padding));
    display: flex;
    justify-content: space-between;
    /*padding-bottom: 16px;*/
    user-select: none;
    background: var(--header_bg);
    /* padding-block: 18px; */


    transition: all .3s ease-in-out;

}

header.full_open {
    background: var(--header_bg_full);
    position: fixed;
    margin-top: 0px;
    /* padding-block: 18px 22px; */
}

.menu_open {
    display: none;
}



.open {
    background: var(--header_bg_full) !important;
    opacity: 100%;
    transition-delay: 0s;
    /* transition-duration: 0s; */
}

a.logo {
    position: relative;
    display: block;
    height: var(--header_logo_height);
    width: fit-content;
    align-self: center;
    transition: all .3s ease-in-out;
    /* margin-right: auto; */
    /* padding-block: 15px; */
    box-sizing: content-box;

}

a.logo .img {
    height: 100%;
    /* width: auto; */
    aspect-ratio: 4/1;
    display: block;
    /* padding-left: calc(var(--padding)); */
    transition: padding .3s ease-in-out, background-image .3s ease-in-out, transform .3s ease-in-out;
    transform-origin: left center;
    background: var(--logo) left center/contain no-repeat;
}

a.logo .img:hover,
.preload .img_hover {
    background-image: var(--logo_hover);
    /* transform: scale(1.03); */
}


header.full_open a.logo {
    /* padding-block: 20px; */
}


span.smallfont {
    font-size: 14px !important;
    font-style: normal !important;
}

.menu{ 
    /* position: relative; */
    height:auto; 
    /* padding-block: clamp(15px, 1.3vw,20px); */
    /* padding-right: var(--padding); */
    display: flex;
    justify-content: center;
    user-select: none;
    transition: all .3s ease-in-out;
    /* gap: 10vw; */

}




.menu > ul{ 
    height:auto; 
    margin:0; 
    padding:0; 
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0;
    border-radius: .4rem 0 0 .4rem;
}



.menu ul li, .menu ul li a{ 
    list-style: none; 
    margin: 0; 
    color: var(--textmenu);
    font-family: var(--font-semibold);
    font-size: 1rem;
    text-transform: none;
    text-decoration: none; 

    transition: all .2s ease-in-out;
}

header.full_open .menu > ul > li > a:not(.actived) {
    color: var(--textmenu-full);
}
header .menu > ul > li > a:not(.actived):hover {

}

.menu ul li a{
    padding: 0 0.7rem; 
    
}


.menu > ul > li {
    padding: 0;
    /* position: relative; */
    height: 100%;
    cursor: default;
}

.menu > ul > li:last-child > a {
    /* padding-right: 0px; */
}

.menu > ul > li.sipka_dolu {
    display: flex;
    flex-direction: row;
    align-items: center;
    cursor: pointer;
}


.menu > ul > li.sipka_dolu {
    display: flex;
    flex-direction: row;
    gap: 15px;
}

.menu > ul > li.sipka_dolu::after {
    content: '';
    mask: url(../website/images/cta_sipka.svg) center/contain no-repeat;
    -webkit-mask: url(../website/images/cta_sipka.svg) center/contain no-repeat;
    background: var(--textmenu);
    width: 12px;
    height: 10px;
    transform-origin: center;
    transition: all .3s ease-in-out;

}



.menu > ul > li.sipka_dolu.active > a::after {
    transform: rotate(180deg);
}

footer li.sipka_dolu::after {
    border-color: var(--text);
    position: absolute;
    top: 8px;
    left: 10rem;
    pointer-events: all;
    cursor: pointer;
    z-index: 3;
}

header.full_open .menu > ul > li.sipka_dolu::after {
    border-color: var(--textmenu-full);

}

header.full_open .menu > ul > li.sipka_dolu:hover::after,
header.full_open .menu > ul > li.sipka_dolu.actived::after {
    border-color: var(--textmenuhover);

}

@media screen and (max-width:1367px) {
    .menu > ul > li.sipka_dolu::after {
        right:0px;
    
    }
}

.menu > ul > li:hover.sipka_dolu::after {
    border-color: var(--textmenuhover);
}




.menu > ul > li > a {
    font-size: clamp(.85rem,1.1vw, 1rem);
    display: block;
    width: fit-content;
    height: 100%;
    padding: calc(20px + min(.6vw, .8rem)) min(1.5vw, 1.5rem); /*bez ::beforu*/
    /* padding: min(0.8vw, 1rem) min(1.6vw, 2rem) min(0.8vw, 1rem) min(1.6vw, 2rem); */
    /* padding: min(.8vw, 1rem) .5em min(.8vw, 1rem) min(1.6vw, 2rem); */
    cursor: pointer;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    text-underline-offset: 8px;
    text-decoration-thickness: 2px;



    display: flex;
    /* gap: 10px; */
    align-items: center;
    position: relative;


    text-decoration: underline;
    text-decoration-color: transparent;

}

.menu > ul > li.sipka_dolu > a {
    padding: 0;
}

.menu > ul > li.sipka_dolu {
    padding: calc(20px + min(.6vw, .8rem)) min(1.5vw, 1.5rem);
}
/*

.menu > ul > li > a::before{
    content: '';
    background-image: url('../img/menu_hover.png');
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.2em;
    height: 1.2em;
    opacity: 0;

    transition: all .3s ease-in-out;
}

*/
.menu > ul > li:hover > a, .menu > ul > li > a.active  {
    color:var(--textmenuhover);
    /* text-decoration-color: var(--textmenuhover); */
    text-decoration-thickness: 2px;
    text-underline-offset: 16px;
    transition: all .3s ease-in-out;

    /*text-shadow: 0 0 .65px #333, 0 0 .65px #333; /* Náhrada za font-weight, aby neroztahovalo text */

    /* position: relative; */
}
/*
header.full_open .menu > ul > li > a.active::before {
    top: -10px;

}*/

.menu > ul > li > a::before, .menu > ul > li > a.active::before {
    content: '';
    width: calc(100% - 2 * min(1.5vw, 1.5rem));
    height: 4px;

    pointer-events: none;

    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 10px;
    opacity: 0;
    background: var(--druha_barva);
    transition: all .3s ease-in-out;
}

.menu > ul > li.sipka_dolu > a::before, .menu > ul > li.sipka_dolu > a.active::before {
    bottom: -20px;
}

.menu > ul > li:hover > a::before,
.menu > ul > li > a.active::before {
    opacity: 1;
    bottom: 0px;

}

.menu > ul > li.sipka_dolu:hover > a::before,
.menu > ul > li.sipka_dolu > a.active::before {
    bottom: calc(-1 * calc(20px + min(0.6vw, 0.8rem)));
}

.menu > ul > li.sipka_dolu > a::before {
    width: calc(100% + 27px);
    transform: translateX(calc(-50% + (27px)/2));
}

header.full_open .menu > ul > li:hover > a, header.full_open .menu > ul > li > a.active  {
    /* text-decoration-color: white; */
}



.menu > ul > li:hover > a::before, .menu > ul > li > a.active:before{
    opacity: 1;

}


.menu ul li > ul,
section.nabidka ul.menu { 
    display: grid;
    grid-template-columns: repeat(5, 1fr);

    position: absolute; 
    height: fit-content;
    top: 100%; 
    left: 0;
    width: 100%;
    z-index: 100;
    padding-block: 0rem;
    max-height: 0px;
    background-color: var(--submenu_background);
    box-sizing: border-box;
    padding: 0 calc(2.3 * var(--padding)) ;
    gap:20px;
    border-top: 0px solid rgba(56, 101, 53, 0.0);

    overflow: hidden;

    transition: all .3s ease-in-out;

}
@media screen and (max-width:1700px) {
    .menu ul li > ul{ 
        grid-template-columns: repeat(4, 1fr);
    }    
}
@media screen and (max-width:1300px) {
    .menu ul li > ul { 
        grid-template-columns: repeat(3, 1fr);
    }    
}
@media screen and (max-width:900px) {
    .menu ul li > ul{ 
        grid-template-columns: repeat(2, 1fr);
    }    
}

@media screen and (max-width:900px) {
    .menu ul li > ul { 
        grid-template-columns: repeat(2, 1fr);
    }    
}

@media screen and (max-width:560px) {
    section.nabidka ul.menu { 
        grid-template-columns: repeat(1, 1fr);
    }    
}

header.full_open .menu ul li > ul{ 
    /* top: calc(10px + var(--header_logo_height-full));  */
}

.menu ul li.active > ul {
    padding-block: 60px;
    max-height: 1000px;
    border-top: 1px solid rgba(56, 101, 53, 0.2);

}

.menu ul li > ul > li,
section.nabidka ul.menu > li {
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    position: relative;
    cursor:pointer;

    color: var(--textsubmenu);

    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
    transition: all .2s ease-in-out;

}

section.nabidka ul.menu > li:hover {
    background-color: var(--hlavni_barva);
}

.menu ul li > ul > li > a,
section.nabidka ul.menu > li > a {
    font-family: var(--font-semibold);
    font-size: clamp(.9rem, 1.1vw, 1rem);
    text-align: center;
    text-transform: none;
    position: relative;
    transition-delay: 0s;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: row-reverse;
    padding:1rem .9rem;
    gap: 10px;
    justify-content: flex-end;
    align-items: center;
    color:var(--textsubmenu);
    transition: all .2s ease-in-out;
    z-index: 1;
    text-decoration: underline;
    text-decoration-color: transparent;
}




.menu ul li > ul > li:hover > a,
.menu ul li > ul > li > a.active ,
section.nabidka ul.menu > li:hover > a,
section.nabidka ul.menu > li > a.active {
    color:var(--textsubmenuhover);
    text-decoration-color: var(--textsubmenuhover);

}


header div.uzivatel {
    display: flex;
    flex-direction: row;
    gap:10px;
    align-items: center
}

header div.uzivatel_login {
    display: grid;
    grid-template-columns: auto auto;

    column-gap: 25px;

    height: fit-content;
    margin-top: auto;
    margin-bottom: 10px;
    order: 3;
}

header div.uzivatel_login span.uzvi {
    grid-column: 1/3;
    grid-row: 1;
    margin-bottom: 4px;
    color: #4E5460;
    font-size: .9rem;
    font-family: var(--font-regular);
    margin-left: auto;
    margin-top: 10px;
}

header div.kosik_wrap {
    margin-top: auto;
    height: fit-content;
}

header a.kosik {
    grid-column: 1;
    grid-row: 2;

    background: #386535 0% 0% no-repeat padding-box;
    border-radius: 6px;

    display: block;
    width: 40px;
    height: 40px;


    position: relative;
    margin-left: 10vw;
    margin-bottom: 10px;

}

@media screen and (max-width:1650px) {
    header a.kosik { 
        margin-left: 7vw;
    }
}

@media screen and (max-width:1520px) {
    header a.kosik { 
        margin-left: 5vw;
    }
}

@media screen and (max-width:1420px) {
    header a.kosik { 
        margin-left: 15px;
    }
}

header a.kosik::after {
    content: attr(data-number);
    font-size: 15px;
    font-family: var(--font-semibold);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top:0;
    right: 0;
    width: 20px;
    height: 20px;
    border-radius: 40px;
    transform: translateX(50%) translateY(-50%);
    background-color: #F50104;

}

header a.kosik::before {
    content: '';
    position: absolute;
    top:0;
    left: 0;
    width: 20px;
    height: 20px;
    transform: translateX(50%) translateY(50%);
    background-color: #F5F6F8;
    mask: url('../website/images/img_zakaznik/ikona_kosik.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/img_zakaznik/ikona_kosik.svg') center/contain no-repeat;

}

div.js-dropdown {
    grid-column: 2;
    grid-row: 2;
    position: relative;
    z-index: 200;
}

div.js-dropdown div.btn {
    display: flex;
    gap: clamp(20px, 5vw, 75px);
    padding: 0.5rem 1.5rem;
    font-size: .95rem;
    cursor: pointer;
    min-width: 200px;
    border-bottom: 1px solid #00000000;


}

div.js-dropdown.drop_open div.btn {
    border-radius: 6px 6px 0px 0px;
    border-bottom: 1px solid #000000;
}

div.js-dropdown div.btn:hover {
    background: var(--druha_barva);
    border-color: var(--druha_barva);
    border-bottom-color: black;

}

div.js-dropdown div.btn::after {
    content:'';

    mask: url('../website/images/cta_sipka.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/cta_sipka.svg') center/contain no-repeat;
    background: white;
    margin-right: -8px;
    width: 12px;
    height: 10px;

    transform-origin: center;
    transition: all .3s ease-in-out;
}

div.js-dropdown.drop_open div.btn::after {
    transform: rotate(180deg);
}


div.js-dropdown ul.dropdown {
    position: absolute;
    width: 100%;
    height: fit-content;
    top:100%;
    left:0;
    background: var(--druha_barva);
    margin: 0;
    padding: 0px 20px;
    border-radius: 0 0 6px 6px;

    display: flex;
    flex-direction: column;
    gap:20px;
    list-style-position: inside;
    overflow: hidden;
    max-height: 0px;
    transition: all .3s ease-in-out;
}


div.js-dropdown.drop_open ul.dropdown {
    max-height: 400px;
    padding: 20px;

}

div.js-dropdown ul.dropdown li::marker {
    content: '-  ';
    color: white;
    font-size: .95rem;
    font-family: var(--font-semibold);
}

div.js-dropdown ul.dropdown li {
    margin-left: 15px;
    list-style: none;
}

div.js-dropdown ul.dropdown li a {
    padding: 0;
    color: white;
    font-size: .95rem;
    text-decoration: underline;
    text-decoration-color: white;
    transition: all .22s ease-in-out;
}

div.js-dropdown ul.dropdown li a:hover {
    text-decoration-color: transparent;
}


header div.uzivatel a:not(.btn) {
    width: fit-content;
    height: fit-content;
    display: flex;
    font-size: clamp(.85rem, 1.1vw, 1rem);
    font-family: var(--font-semibold);
    padding: .7rem .5rem;
    transition: all .3s ease-in-out;
    box-sizing: border-box;
    align-items: center;
   color: var(--text);
}


/* MAIN */

main {
    position: relative;
    background: var(--main_c);
    padding: 100px var(--padding) 100px var(--padding);
    overflow-x: clip;

}

section.tit + main {
    padding-top: 0;
}

header + main {
    padding-top:clamp(150px, 15vw, 190px);
    min-height: 100vh;
}

main.white {
    background: white;
}




/* titulka */

section.tit {
    position:relative;
    top:0;
    left:0;
    /* padding-top:var(--padd_under_header); */
    width:100%;
    height: fit-content;
    background: white;
    /* overflow: hidden; */
    /* aspect-ratio: 16/9;     */
    background: var(--main_c);


    padding-inline: calc(var(--padding));
    padding-top: calc(82px + var(--header_logo_height-full));
    padding-bottom: clamp(20px, 12vw, 120px);
}



section.vzor::before {
    content: '';
    width: clamp(130px, 13vw, 340px);
    aspect-ratio: 1/2;

    position: absolute;
    right: 0;
    bottom: 0;
    transform-origin: center;
    transform: translateY(20%) rotate(180deg);


    background: url('../img/doplnek.jpg') center/contain no-repeat;
}

section.vzor.v2::before {
    bottom: unset;
    right: unset;

    top: 20%;
    left: 0;
    transform: translateY(20%);
}


section.tit div.obsah > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right;

    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
}


section.tit div.obsah > img.mobile, section.tit div.obsah > img.tablet {
    display: none;
    visibility: hidden;
    opacity: 0;
}

section.tit > div.obsah {
    position: relative;
    box-sizing: border-box;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    gap: clamp(30px, 3vw, 50px);

    display: flex;
    flex-direction: column;
    justify-content: center;

    z-index: 2;

    /* ořízlý roh */
    -webkit-mask-image: linear-gradient(135deg, black 97%, transparent 97%);
    mask-image: linear-gradient(135deg, black 97%, transparent 97%);
    /* --- */

    padding: var(--padding);
    aspect-ratio: 16/7.7;
    min-height: clamp(318px, 52vw, 700px);


} 


section.tit.podstranka {
    padding-left: 0;
    padding-right: calc(2* var(--padding));
}

section.tit.podstranka h1 {
    font-size: clamp(2.6rem, 7vw, 6.5rem);
    font-family: var(--font-semibold);

    width: min(100%, calc(1360px - var(--padding)));
    margin-inline: auto;
}

section.tit.podstranka > div.obsah {
    padding-bottom: 20px;
    justify-content: flex-end;
    padding-right: 0px;
    min-height: clamp(168px, 36vw, 500px);
    aspect-ratio: 16/5;
}

section.tit:not(.podstranka) h1 {
    text-shadow: 0px 5px 10px #017AC1;
}





/* ----- */







/* BTNS */

.btn, .btn-inverse{
    width: fit-content;
    /* min-width: min(100%, 190px); */
    background: var(--druha_barva);
    height: fit-content;
    display: flex;
    text-align: start;
    font-size: clamp(.85rem, 1.1vw, 1rem);
    color: white;;
    font-family: var(--font-semibold);
    padding: .5rem 2rem;
    transition: all .3s ease-in-out;
    box-sizing: border-box;
    border: 2px solid var(--druha_barva);
    align-items: center;
    border-radius: 6px;
   
    justify-content: space-between;
    /* gap:clamp(20px, 3vw, 50px); */
}
.btn.cntr, .btn-inverse.cntr {
    margin-inline: auto;
}
.btn:hover {
    background-color: var(--druha_hover);
    border-color: var(--druha_hover);

}
.btn-inverse {
    background-color: white;
    border: 2px solid white;
    color: var(--druha_barva);
}

a.btn:hover, a.btn-inverse:hover {
    transform-origin: center;
    transform: scale(1.02);
}

.btn-inverse:hover {
    background-color: white;
    border-color: white;
    color: var(--druha_hover);
}

 
.btn::after, .btn-inverse::after{
    /* content: ''; */
    /* display: block;
    width: 1em;
    height: 1em;
    margin-right: -10px;
    mask: url('../img/sipka.svg') center/contain no-repeat;
    -webkit-mask: url('../img/sipka.svg') center/contain no-repeat;
    background-color: white;

    transition: all .3s ease-in-out;
    align-self: center;
    transform-origin: center; */
}
.btn-inverse::after {
    background-color: var(--druha_barva)
}
.btn-inverse:hover::after {
    background-color: var(--druha_hover)
}

.btn:hover::after, .btn-inverse:hover::after {
    /* transform: translateX(10px); */
}


/* Univerzalni sekce */

section.grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px 25px;
    width: 100%;

}



/*  -----  */
/* TITULKA */

body.bg:has(section.top_nadpis) {
    background-color: #F8F4EC;
}


section.top_nadpis {
    display: grid;
    position: relative;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-top: clamp(50px, 5vw, 85px);
    margin-bottom: clamp(120px, 10vw, 170px);
    width: var(--min_width);
    margin-inline: auto;
}

section.top_nadpis h1 {
    font-family: var(--font-extrabold);
    color: var(--text);
    font-size: clamp(2.4rem, 4vw, 3.5rem);
    line-height: 1.5em;

    grid-column: 1;
    grid-row: 1;
    z-index: 1;
}

section.top_nadpis p {
    margin: 0px;
    color: var(--text);
    font-size: clamp(1.1rem, 1.8vw, 1.5rem);
    font-family: var(--font-semibold);

    grid-column: 1;
    grid-row: 2;
    z-index: 1;
}

section.top_nadpis img {
    position: absolute;
    grid-column: 2;
    grid-row: 1/3;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center right;
    transform-origin: 77% 38%;
    transform: scale(2.3);
    z-index: 0;
}

@media screen and (max-width: 1000px) {
    section.top_nadpis img {
        transform: scale(1.7);
        transform-origin: 84% 16%;
    }
}

@media screen and (max-width: 800px) {
    section.top_nadpis {
        display: flex;
        flex-direction: column;
        gap: 20px;
        margin-bottom: -12vw;
        margin-top: 0px;
    }

    section.top_nadpis img {
        position: relative;
        transform-origin: center;
        transform: scale(1);
        width: max(290px, 50%);
    }
}

@media screen and (max-width: 550px) {
    section.top_nadpis h1 {
        font-size: 1.9rem;
    }

    section.top_nadpis {
        gap: 10px;
    }
}

section.nabidka.uvod {
    margin-bottom: clamp(50px, 10vw, 170px);
}


section.text_foto {
    width: var(--min_width);
    position: relative;
    margin-inline: auto;
    padding-inline: 80px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr auto 1fr;
    gap:28px clamp(30px, 4vw, 70px) ;
    margin-top: clamp(50px, 5vw, 90px);
}

section.text_foto .img_wrap {
    position: relative;
    width: 100%;
    height: 100%;
    grid-column: 1;
    grid-row: 1/4;
    overflow: hidden;
    min-height: 400px;
}

section.text_foto img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-position: center;
    object-fit: cover;
    border-radius: 10px;
}

section.text_foto.rev .img_wrap {
    grid-column: 2;
}

section.text_foto h2 {
    margin: 0px;
    padding: 0px;
    padding-top: 30px;
    margin-top: auto;
    color: var(--text);
    font-family: var(--font-bold);
    font-size: clamp(1.4rem, 2.2vw, 2.1rem);

}

section.text_foto div.texty p {
    font-family: var(--font-semibold);
    font-size: 0.95rem;
    color: var(--text);
    margin: 0px;
    padding-bottom: 8px;
    line-height: 2em;
}

section.text_foto div.texty p:last-of-type {
    padding-bottom: 0px;
}

section.text_foto .btn {
    margin-bottom: 30px;
}

section.text_foto h2,
section.text_foto div.texty,
section.text_foto .btn {
    grid-column: 2;
}

section.text_foto.rev h2,
section.text_foto.rev div.texty,
section.text_foto.rev .btn {
    grid-column: 1;
}



section.text_foto.dec1::before,
section.text_foto.dec2::before,
section.text_foto.dec3::before {
    content: '';
    position: absolute;
    bottom: -10%;
    left: 2%;
    width: clamp(150px, 18vw, 220px);
    aspect-ratio: 5/4;
    background: center bottom/contain no-repeat;
    z-index: 5;
}

section.text_foto.dec1::before {
    background-image: url('../website/images/titulka/banan.webp');
}

section.text_foto.dec2::before {
    left: unset;
    right: -30px;
    transform-origin: center;
    transform: scale(1.2);
    background-image: url('../website/images/titulka/jahoda.webp');
}

section.text_foto.dec3::before {
    background-image: url('../website/images/titulka/cibule.webp');
}

@media screen and (max-width:1000px) {
    section.text_foto {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    section.text_foto h2, section.text_foto div.texty, section.text_foto .btn , section.text_foto .img_wrap,
    section.text_foto.rev h2, section.text_foto.rev div.texty, section.text_foto.rev .btn, section.text_foto.rev .img_wrap {
        grid-column: 1;
    }

    section.text_foto .img_wrap {
        grid-row: 3;
        min-height: 250px;
    }

    section.text_foto.dec1::before,
    section.text_foto.dec2::before,
    section.text_foto.dec3::before {
        bottom: 10%;
        right: -20px;
        left: unset;
    }
}

@media screen and (max-width:660px) {
    section.text_foto {
        padding: 0px;
    }
}


/* ------- */


/* přehled objednávky */

section.prehled {
    width: min(1000px, 100%);
    margin: auto;
}

section.prehled > h1 {
    margin: auto;
    width: fit-content;
    margin-bottom: 30px;
}

section.prehled table.polozky {
    border-collapse: separate;
    width: 100%;
    background-color: transparent;
    border-spacing: 0px 10px;
    margin-top: 50px;
    min-width: 800px;

}

section.prehled table.polozky tr {
    background: #FFFFFF 0% 0% no-repeat padding-box;
}

section.prehled table.polozky tr td img {
    width: clamp(60px, 5vw, 70px);
    aspect-ratio: 1/1;
    object-fit: contain;
}

section.prehled table.polozky tr td {
    border-top: 0.5px solid #D1D1D1;
    border-bottom: 0.5px solid #D1D1D1;
    padding-right: 10px;
}

section.prehled table.polozky tr td:first-of-type {
    border-left: 0.5px solid #D1D1D1;
    border-radius: 6px 0px 0px 6px;

}

section.prehled table.polozky tr:first-of-type {
    background: transparent;
}

section.prehled table.polozky tr:first-of-type th.mobile {
    opacity: 0;
    visibility: hidden;
}

section.prehled table.polozky tr th {
    color: #848484;
    font-family: var(--font-semibold);
    font-size: .9rem;
    text-align: left;
}

section.prehled table.polozky tr th:nth-of-type(5) {
    text-align: right;
}

section.prehled table.polozky tr td:last-of-type {
    border-right: 0.5px solid #D1D1D1;
    border-radius: 0px 6px 6px 0px;
}

section.prehled table.polozky tr td div.flex {
    display: flex;
    flex-direction: row;
    /* gap: 10px; */
    align-items: center
}

section.prehled table.polozky tr td button {
    width: 2rem;
    height: 2rem;
    border: 0.75px solid #D1D1D1;
    border-radius: 6px;
    background: white;
    font-family: var(--font-bold);
    font-size: 1.1rem;
    color: var(--text);
    cursor: pointer;
    transition: all .125s ease-in-out;
}

section.prehled table.polozky tr td button:hover {
    filter: brightness(.9);

}

section.prehled table.polozky tr td button:active {
    filter: brightness(.8);
}



section.prehled table.polozky tr td a.btn.min,
section.prehled table.polozky tr td a.btn.plus {
    margin: 0;
    font-family: var(--font-semibold);
    font-size: 1.7rem;
    color: var(--text);

    width: 2.5rem;
    height: 2.5rem;
    border: 0.75px solid #D1D1D1;
    padding: 1px 6px;
    border-radius: 6px;
    background: white;

    justify-content: center;
    margin-block: 20px;
    cursor: pointer;
    transition: all .125s ease-in-out;
}

section.prehled table.polozky tr td a.btn.min:hover,
section.prehled table.polozky tr td a.btn.plus:hover {
    filter: brightness(.9);

}

section.prehled table.polozky tr td a.btn.min:active,
section.prehled table.polozky tr td a.btn.plus:active {
    filter: brightness(.8);
}



section.prehled table.polozky tr td p {
    font-family: var(--font-bold);
    font-size: 1.1rem;
    color: var(--text);
    margin: 0;
    padding-left: 10px;
}


section.prehled table.polozky tr td span {
    color: #D1D1D1;
    font-family: var(--font-regular);
    font-size: .9rem;
}

section.prehled table.polozky tr td:nth-of-type(3) {
    width: 1%;
    padding-right: 30px;
    white-space: nowrap;
}

section.prehled table.polozky tr td:nth-of-type(5) {
    width: 1%;
    white-space: nowrap;
    padding-left: clamp(30px, 3.3vw, 70px);
    padding-right: 0px;
}

section.prehled table.polozky tr td:nth-of-type(5) p {
    text-align: right;
}

section.prehled table.polozky tr td:nth-of-type(4) {
    width: 1%;
    white-space: nowrap;
    padding-right: 0px;
}

section.prehled table.polozky tr td:nth-of-type(6){
    padding-left: 15px;
}

section.prehled table.polozky tr td:last-of-type,
section.prehled table.polozky tr td:first-of-type {
    width: 1%;
    padding-right: 20px;
    white-space: nowrap;
}

section.prehled table.polozky tr td:last-of-type {
    padding-left: clamp(20px, 3vw, 60px);
}

section.prehled table.polozky tr td:first-of-type {
    padding-left: 20px;
}

section.prehled table.polozky tr td .btn-inverse {
    cursor: pointer;
    border: 2px solid var(--druha_barva);
    padding-block: 1rem;
}

section.prehled table.polozky tr td .btn-inverse:hover {
    cursor: pointer;
    background: var(--druha_barva);
    color: white;
}


section.prehled table.polozky tr td .remove {
    content: '';
    mask: url('../website/images/smazat_kruh_a.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/smazat_kruh_a.svg') center/contain no-repeat;
    background: #848484;
    width: 1.1rem;
    height: 1.2rem;
    display: block;
    border: 0px;
    margin: 0;
    margin-left: auto;
    color: transparent;

    transform-origin: center;
    transition: all .18s ease-in-out;
}

section.prehled table.polozky tr td .remove:hover {
    transform: scale(1.1);
    filter: brightness(1.3);
}

section.prehled table.polozky tr.cena {
    background-color: transparent;
    transform: translateY(-10px);
}

section.prehled table.polozky tr.cena td {
    border: 0;
}

section.prehled table.polozky tr.cena td span {
    font-family: var(--font-regular);
    color: #D1D1D1;
    font-size: 1.05rem;
}

section.prehled table.polozky tr.cena td b {
    font-family: var(--font-bold);
    color: white;
}

section.prehled table.polozky tr.cena td.tabulka_cena {
    background: #484848 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-right: 0px;
    border-radius: 0px 0px 0px 6px;
    padding-left: clamp(16px, 6vw, 50px);
    padding-block: 16px;
    padding-right: 0px;

}
section.prehled table.polozky tr.cena td.tabulka_cena.end {
    border-radius: 0px 0px 6px 0px;
    padding-left: 0px;
    border-left: 0px;
    padding-right: 10px;



}

section.prehled.objednavka_detail table.polozky tr.cena td.tabulka_cena {
    padding-left: 10px;
}

section.prehled.objednavka_detail table.polozky tr.cena td.tabulka_cena.end {
    padding-right: 17px;
}


section.prehled table.polozky tr.cena td.tabulka_cena div.col_flex {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: flex-end;
}

section.prehled section.wrap_table {
    overflow-x: auto;
}


@media screen and (max-width:925px) {
    section.prehled table.polozky tr:not(.cena, :first-of-type) {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 7px;


        border: 0.5px solid #D1D1D1;
        border-radius: 6px;

        padding: 30px clamp(20px, 9vw, 45px);
    }

    section.prehled table.polozky tr td a.remove {
        width: 1.8rem;
        height: 1.8rem;
    }

    section.prehled table.polozky tbody {
        display: flex;
        flex-direction: column;
    }

    section.prehled table.polozky tr:first-of-type th {
        opacity: 0;
        visibility: hidden;
    }

    section.prehled table.polozky tr:first-of-type th.mobile {
        opacity: 1;
        visibility: visible;
    }

    section.prehled table.polozky tr td img {
        width: 75px;
    }

    section.prehled table.polozky {
        min-width: 0px;
    }

    section.prehled table.polozky tr:not(.cena, :first-of-type) td {
        width: 100%;
        height: 100%;
        padding: 0px;
        border: 0px;
    }


    section.prehled table.polozky tr:not(.cena, :first-of-type) td:last-of-type {
        grid-column: 2;
        grid-row: 1;
    }

    section.prehled table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(1) {
        grid-column: 1;
        grid-row: 1;
    }

    section.prehled table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(2) {
        grid-column: 1/-1;
        grid-row: 2;
    }

    section.prehled table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(3) {
        grid-column: 1;
        grid-row: 4;
    }

    section.prehled table.polozky.oblibene tr:not(.cena, :first-of-type) td:nth-of-type(3) {
        grid-column: 1;
        grid-row: 3;
    }

    section.prehled table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4) {
        grid-column: 1;
        grid-row: 3;
    }

    section.prehled table.polozky.oblibene tr:not(.cena, :first-of-type) td:nth-of-type(4) {
        grid-column: 1;
        grid-row: 4;
    }

    section.prehled table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5) {
        grid-column: 2;
        grid-row: 4;
    }

    section.prehled table.polozky.oblibene tr:not(.cena, :first-of-type) td:nth-of-type(5) {
        grid-column: 2;
        grid-row: 3;
    }

    section.prehled table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5) p {
        height: 100%;
        display: flex;
        align-items: center;
        gap: 5px;
    }

    section.prehled table.polozky tr.cena {
        display: flex;
        flex-direction: row;
        transform: translateY(0px);
        justify-content: center
    }

    section.prehled table.polozky tr.cena td:not(.tabulka_cena) {
        padding: 0;
    }

    section.prehled table.polozky tr.cena td.tabulka_cena {
        width: max(230px, 50%);
    }

    section.prehled table.polozky tr.cena td.tabulka_cena.end {
        width: max(130px, 20%);
    }

    section.prehled section.wrap_table {
        overflow-x: unset;
        width: min(500px, 100%);
        margin: auto;
    }


    section.prehled table.polozky tr:not(.cena, :first-of-type, :nth-of-type(2)) {
        margin-top: 15px;
    }





}

@media screen and (max-width:420px) {
    section.prehled table.polozky tr.cena td span {
        font-size: .8rem;
    }
}

@media screen and (max-width:380px) {
    section.prehled table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5) {
        grid-column: 1/-1;
        grid-row: 5;
    }

    section.prehled table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(3) {
        grid-column: 1/-1;
        grid-row: 4;
    }

    section.prehled table.polozky.oblibene tr:not(.cena, :first-of-type) td:nth-of-type(5) {
        grid-column: 1/-1;
        grid-row: 4;
        padding-bottom: 15px;
    }

    section.prehled table.polozky.oblibene tr:not(.cena, :first-of-type) td:nth-of-type(3) {
        grid-column: 1/-1;
        grid-row: 3;
    }

    section.prehled table.polozky.oblibene tr:not(.cena, :first-of-type) td:nth-of-type(4) {
        grid-column: 1;
        grid-row: 5;
    }
}


section.prehled section.poznamka_input {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 45px;
}

section.prehled section.poznamka_input label {
    color: var(--text);
    font-size: .9rem;
    font-family: var(--font-semibold);
}

section.prehled section.poznamka_input input {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
    padding: 15px 20px;
    color: var(--druha_barva);
    font-family: var(--font-semibold);
    font-size: .9rem;
}


section.prehled section.prehled_form {
    display: grid;
    grid-template-columns: 1fr 1fr 240px;
    gap: 16px;

    margin-top: 60px;
}

section.prehled section.prehled_form div.block {
    padding: clamp(20px, 3.5vw, 57px) clamp(25px, 4vw, 60px);
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
}

section.prehled section.prehled_form div.block.min {
    padding: clamp(15px, 1.7vw, 21px) clamp(20px, 2vw, 30px);
    
}

section.prehled section.prehled_form div.block.max {
    grid-column: 1/-1;
}

section.prehled section.prehled_form h2 {
    color: var(--text);
    font-family: var(--font-semibold);
    font-size: 1.2rem;
    margin: 0;
    margin-bottom: 25px;

}

section.prehled section.prehled_form input[type=date] {
    margin-bottom: 15px;
}

section.prehled section.prehled_form input,
section.prehled section.prehled_form select,
.custom-select {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
    padding: 15px 20px;
    color: var(--druha_barva);
    font-family: var(--font-semibold);
    font-size: .95rem;
}

section.prehled section.prehled_form div.flex {
    display: flex;
    align-items: center;
}

section.prehled section.prehled_form select#datum_rozvoz {
    margin-bottom: 15px;
}

/* radio */

section.prehled section.prehled_form input[type="radio"]:checked,
section.prehled section.prehled_form input[type="radio"]:not(:checked) {
    position: absolute;
    visibility: hidden;
    opacity: 0;
    z-index: -100;
    width: 0px;
}
section.prehled section.prehled_form input[type="radio"]:checked + label,
section.prehled section.prehled_form input[type="radio"]:not(:checked) + label
{
    position: relative;
    cursor: pointer;
    line-height: 20px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: center;

    color: var(--text);
    font-family: var(--font-semibold);
    font-size: .95rem;
}
section.prehled section.prehled_form input[type="radio"]:checked + label:before,
section.prehled section.prehled_form input[type="radio"]:not(:checked) + label:before {
    content: '';
    width: 30px;
    height: 30px;

    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 15px;
}
section.prehled section.prehled_form input[type="radio"]:checked + label:after,
section.prehled section.prehled_form input[type="radio"]:not(:checked) + label:after {
    content: '';
    width: 16px;
    height: 16px;
    position: absolute;
    /* top: 8px; */
    left: 8px;

    background: #386535 0% 0% no-repeat padding-box;
    border-radius: 15px;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
section.prehled section.prehled_form input[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
section.prehled section.prehled_form input[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

/* checkbox */

section.prehled section.prehled_form div.flex_col {
    display: flex;
    flex-direction: column;
    margin-top: 20px;
    gap:7px;
}

section.prehled section.prehled_form div.flex_col div.flex {
    gap: 10px;
}

section.prehled section.prehled_form div.flex_col div.flex label:first-of-type {
    margin-right: auto;
}

section.prehled section.prehled_form div.flex_col div.flex label {
    font-size: .95rem;
    color: var(--text);
    font-family: var(--font-semibold);
}

section.prehled section.prehled_form div.flex_col input {
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
    width: 40px;
    height: 40px;
    padding: 9px 3px;
    text-align: center;
}

input[type="checkbox"],
input[type="radio"] {
    position: absolute;
    left: -9999px;
}

input[type="checkbox"]+label.labelcheckbox,
input[type="radio"]+label.labelcheckbox {
    position: relative;
    padding-top: 0;
    padding-left: 2.3rem;
    cursor: pointer;
    font-size: .95rem;
    color: var(--text);
    font-family: var(--font-semibold);
}

input[type="checkbox"]+label.labelcheckbox.right, input[type="radio"]+label.labelcheckbox.right {
    padding-left: 0rem;
    padding-right: 2.3rem;
}

input[type="checkbox"]+label.labelcheckbox.right,
input[type="radio"]+label.labelcheckbox.right {
    padding-left: 0rem;
    padding-right: 2.3rem;
}

input[type="checkbox"]+label.labelcheckbox:before,
input[type="radio"]+label.labelcheckbox::before {
    content: '';
    background: #fff;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
    height: 1.8rem;
    width: 1.8rem;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

input[type="checkbox"]+label.labelcheckbox.right:before,
input[type="radio"]+label.labelcheckbox.right:before {
    left: unset;
    right: 0;
}

input[type="checkbox"]+label.labelcheckbox:after,
input[type="radio"]+label.labelcheckbox:after {
    content: '';
    width: .8rem;
    height: .8rem;
    position: absolute;
    background: var(--druha_barva);
    mask: url('../website/images/krizek.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/krizek.svg') center/contain no-repeat;
    top: 50%;
    left: 0.15rem;
    opacity: 0;
    transform: scale(2) translateY(-50%) translateX(50%);
    transition: transform 0.3s linear, opacity 0.3s linear;
}

input[type="checkbox"]+label.labelcheckbox.right:after,
input[type="radio"]+label.labelcheckbox.right:after {
    left: unset;
    right: 0.85rem;
}


input[type="checkbox"]:checked+label.labelcheckbox:after,
input[type="radio"]:checked+label.labelcheckbox:after {
    opacity: 1;
    transform: scale(1) translateY(-50%) translateX(50%);
}
/* ----- */ 

.custom-select {
    width: 300px;
    position: relative;
    border: 0px;
    border-radius: 6px;
}
.custom-select .dropdown,
.custom-select {
    -moz-box-shadow: 0px 3px 6px #00000029, inset 0 0 0.5px #000000;
    box-shadow: 0px 3px 6px #00000029, inset 0 0 0.5px #000000;
    -webkit-box-shadow: 0px 3px 6px #00000029, inset 0 0 0.5px #000000;
}

.custom-select.show {
    border-radius: 6px 6px 0 0;
}

.custom-select .select-header {
    background: white;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.custom-select .select-header span {
    color: var(--druha_barva);
    font-family: var(--font-semibold);
    font-size: .95rem;
}

.custom-select .dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    padding-inline: 15px;
    background: white;


    border-top: none;
    z-index: 10;
    max-height: 0px;
    overflow-y: auto;
    transition: all .3s ease-in-out;
}

.custom-select .dropdown.btn {
    margin-bottom: 16px;

}

.custom-select.show  .dropdown{
    max-height: 300px;

}

.custom-select .dropdown-item {
    padding: 16px 12px;
    border-top: 1px solid #eeeeee00;
    cursor: pointer;
}

.custom-select .dropdown-item:not(.add-new) {
    border-top: 1px solid #F1F1F1;
}

.custom-select .dropdown-item:hover {
    background-color: #f1f1f1;
}

.custom-select .dropdown-item input {
    display: none;
}

.custom-select .dropdown-item label {
    cursor: pointer;
    display: block;
}

.custom-select .arrow {
    font-size: 12px;
}

/* ---- */

section.prehled section.prehled_form div.block.max div.flex select {
    max-width: 240px;
}

section.prehled section.prehled_form div.block.max div.flex h2 {
    margin-bottom: 0px;
}

section.prehled section.prehled_form div.block.max div.flex {
    align-items: center;
    margin-bottom: 17px;
    gap: 30px;
}

section.prehled section.prehled_form div.block.max div.adresa_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 17px;
}

section.prehled section.prehled_form div.block.max div.adresa_wrap div.input_wrap {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

section.prehled section.prehled_form div.block.max div.adresa_wrap div.input_wrap label {
    color: #848484;
    font-family: var(--font-regular);
    font-size: 0.95rem;
}


section.prehled section.prehled_form div.block.max div.adresa_wrap section.grid_adresa {
    display: grid;
    grid-template-columns: 3fr 2fr 1fr;
    margin-bottom: 0px;
    gap: 17px;
}


section.prehled section.prehled_form div.block.max div.adresa_wrap div.input_wrap:last-of-type {
    grid-column: span 2;
}

section.prehled section.prehled_form div.spodek {
    display: grid;
    padding: clamp(20px, 2.5vw, 30px) clamp(25px, 4vw, 60px);
    grid-template-columns: 1fr 1fr;
    gap:35px;
    grid-column: 1/-1;
}

section.prehled section.prehled_form div.spodek :first-child {
    grid-column: 1/-1;
}


section.prehled section.prehled_form div.spodek .btn{
    width: min(368px, 100%);
    align-items: center;
    justify-content: center;
    font-family: var(--font-semibold);
    font-size: 1.1rem;
    padding-block: 20px;
    margin-left: auto;
}

@media screen and (max-width: 830px) {
    section.prehled section.prehled_form {
        grid-template-columns: 1fr 1fr;
    }

    section.prehled section.prehled_form > :first-child {
        grid-column: 1/-1;
    }

    section.prehled section.prehled_form div.spodek {
        display: flex;
        flex-direction: column;
    }

    section.prehled section.prehled_form div.spodek .btn {
        margin: 0px;
        margin-top: -25px;
    }

}

@media screen and (max-width: 615px) {
    section.prehled section.prehled_form div.block.max div.flex {
        flex-direction: column;
        align-items: flex-start;
        gap:15px;
    }

    section.prehled section.prehled_form div.block.max div.adresa_wrap section.grid_adresa {
        grid-template-columns: 3fr 2fr;
    }

    section.prehled section.prehled_form div.block.max div.adresa_wrap div.input_wrap:first-of-type {
        grid-column: 1/-1;
    }

    section.prehled section.prehled_form div.block.max div.adresa_wrap div.input_wrap:nth-last-of-type(2) {
        grid-column: 1/-1;
    }
}

@media screen and (max-width: 560px) {
    section.prehled section.prehled_form {
        display: flex;
        flex-direction: column;
    }
}

/* vyhledavani */

section.vyhledat {

}

section.vyhledat div.search_wrap {
    display: grid;
    position: relative;
    grid-template-columns: 1fr;

    max-width: 778px;
    margin-inline: auto;
}

section.vyhledat div.search_wrap label {
    color: var(--text);
    font-size: .9rem;
    font-family: var(--font-semibold);
    display: flex;
    justify-content: center;
    align-items: center;

    position: absolute;
    top:0;
    left:0;

    transform: translateX(calc(-100% - 10px));
    height: 100%;
}

section.vyhledat table.search {
    padding: 0px min(5vw, 40px);
    width: 100%;

    border-spacing: 0;
}

section.vyhledat table.search tr td {
    padding: 20px;
}



section.vyhledat table.search tr:not(:first-of-type) td {
    border-top: 1px solid #D1D1D1;
}

section.vyhledat table.search tr td:not(:nth-of-type(2)) {
    width: 1%;
    white-space: nowrap;
}

section.vyhledat table.search tr td:first-of-type {
    padding-left: 0;
}

section.vyhledat table.search tr td:last-of-type {
    padding-right: 0;
}

section.vyhledat table.search tr td img {
    width: clamp(60px, 5vw, 70px);
    aspect-ratio: 1/1;
    object-fit: contain;
}

section.search_popup_warp {
    display: grid;
    position: relative;
    grid-template-columns: 1fr;
}

section.search_popup_warp input#vyhledat {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #386535;
    border-radius: 6px;
    padding: 13px;
    font-size: 1.07rem;
    font-family: var(--font-semibold);
    color: var(--text);
}

section.vyhledat div#popup {
    display: none;
    grid-column: 1;
    grid-row: 2;
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    z-index: 2;

    max-height: 450px;
    overflow-y: auto;


    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 15px #00000066;
    border: 1px solid #D1D1D1;
    border-radius: 5px;
}

section.vyhledat div#popup.active {
    display: block;
}

@media screen and (max-width: 1060px) {
    section.vyhledat div.search_wrap label {
        position: static;
        transform: none;

        justify-content: flex-start;
        margin-bottom: 8px;
        width: fit-content;
    }

    section.vyhledat div.search_wrap {
        grid-template-columns: auto 1fr;
        max-width: 778px;
        margin-inline: auto;

        display: grid;
        position: relative;
        grid-template-columns: auto;
    }
}

@media screen and (max-width: 710px) {
    section.vyhledat table.search tr td {
        padding: 20px 10px;
    }
}


@media screen and (max-width: 530px) {
    section.vyhledat table.search tr{
        display: grid;
        width: fit-content;
    }

    section.vyhledat table.search tr:nth-of-type(even) {
        margin-left: auto;
    }

    section.vyhledat table.search tr td {
        width: 100% !important;
        padding: 10px 0px;
    }


    section.vyhledat table.search tr:not(:first-of-type) td {
        border-top: none;
    }

    
}

@media screen and (max-width: 370px) {

    section.vyhledat table.search tr:nth-of-type(even) {
        margin-left: 0px;
    }

    section.vyhledat table.search tbody {
        display: grid;
        grid-template-columns: 1fr;
    }

    
}


@media screen and (max-width: 925px) {
    section.vyhledat table.search,
    section.vyhledat table.search tbody {
        display: block;
    }

    section.vyhledat table.search tr {
        display: grid;
        width: 100%;
        grid-template-columns: auto 1fr auto;
    }

    section.vyhledat table.search tr td:first-of-type {
        grid-column: 1;
        grid-row: 1/3;
        padding-right: 17px;
    }

    section.vyhledat table.search tr td:nth-of-type(2) {
        grid-column: 2;
        grid-row: 1;
        padding-inline: 0;
        padding-bottom: 5px;
    }

    section.vyhledat table.search tr td:nth-of-type(3) {
        grid-column: 2;
        grid-row: 2;
        padding-top: 0px;
        padding-inline: 0;

    }

    section.vyhledat table.search tr td:nth-of-type(4) {
        grid-column: 3;
        grid-row: 1/3;
        display: flex;
        align-items: center;
        padding-left: 17px;

    }

    section.vyhledat table.search tr td,section.vyhledat table.search tr:not(:first-of-type) td {
        width: 100% !important;
        border-width: 0px;
    }

    section.vyhledat table.search tr td:not(:nth-of-type(2)) {
        border-bottom: 1px solid #D1D1D1;

    }
}

@media screen and (max-width: 450px) {
    section.vyhledat table.search tr td img {
        width: 40px;
    }

    section.vyhledat table.search tr td:nth-of-type(3),
    section.vyhledat table.search tr td:nth-of-type(2) a {
        font-size: .8rem;
    }

    section.vyhledat table.search tr td:nth-of-type(4) .btn {
        font-size: .75rem;
        padding: 0.5rem 1rem;
    }
}

/* registrace / login */

section.registrace_login {
    width: min(100%, 1000px);
    margin: auto;
}

section.registrace_login h1 {
    margin: auto;
    width: fit-content;
    margin-bottom: 50px;
}

section.registrace_login div.prepnout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: fit-content;
    margin-inline: auto;
    gap: 16px;
    margin-top: -87px;
    margin-bottom: 60px;
    display: none;
}

section.registrace_login div.prepnout a {
    display: flex;
    gap: 26px;
    align-items: center;
    justify-content: space-between;
}

section.registrace_login div.prepnout a,
section.registrace_login div.prepnout a.actived:hover {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 2px solid #386535;
    border-radius: 6px;
    padding: 26px 28px;
    color: #386535;
    transition: all .3s ease-in-out;
}

section.registrace_login div.prepnout a.actived,
section.registrace_login div.prepnout a:hover {
    background-color: #386535;
    border-color: #386535;
    color: #FFFFFF;

}

section.registrace_login div.prepnout a::after,
section.registrace_login div.prepnout a.actived:hover::after {
    content: '';
    width: 1.5em;
    height: 1.5em;

    mask: url('../website/images/prihlaseni/checkbox.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/prihlaseni/checkbox.svg') center/contain no-repeat;
    background-color: #386535;
    transition: all .3s ease-in-out;
}

section.registrace_login div.prepnout a.actived::after,
section.registrace_login div.prepnout a:hover::after {
    background-color: #FFFFFF;

}

section.registrace_login div.prepnout a.actived::after,
section.registrace_login div.prepnout a.actived:hover::after {
    mask: url('../website/images/prihlaseni/checkbox_a.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/prihlaseni/checkbox_a.svg') center/contain no-repeat;
}


section.registrace_login div.form_obal {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
    padding: clamp(35px, 3vw, 50px) clamp(20px, 3vw, 50px);

}

section.registrace_login div.form_obal.firma_ne .firma {
    display: none;
}

section.registrace_login div.form_obal.firma .firma_ne {
    display: none;
}

section.registrace_login.login div.form_obal {
    margin-top: 120px;

}

section.registrace_login div.form_obal div.form_content {
    width: min(100%, 752px);
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

section.registrace_login div.form_obal label {
    color: #848484;
    font-size: .95rem;
    font-family: var(--font-regular);
}

section.registrace_login div.form_obal .ico.osoba, 
section.registrace_login div.form_obal .ico.zamek {
    gap: 8px;
}

.ico.osoba::before {
    mask: url('../website/images/prihlaseni/osoba.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/prihlaseni/osoba.svg') center/contain no-repeat;
    width: 1em;
    background-color: #848484;
}

.ico.zamek::before {
    mask: url('../website/images/prihlaseni/zamek.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/prihlaseni/zamek.svg') center/contain no-repeat;
    width: 1em;
    background-color: #848484;
}

section.registrace_login div.form_obal input:not([type="submit"]) {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
    font-size: .95rem;
    font-family: var(--font-regular);
    color: #484848;
    padding: 0.6rem 1rem;
}


section.registrace_login div.form_obal input:disabled::placeholder,
section.registrace_login div.form_obal input:disabled::placeholder {
    color: rgba(197, 197, 197, 0.73);
}

section.registrace_login div.form_obal input[type=checkbox]:disabled+label,
section.registrace_login div.form_obal input[type=checkbox]:disabled+label.labelcheckbox:after {
    opacity: .7;
}


section.registrace_login div.form_obal p.sep {
    width: min(100%, 784px);
    margin: auto;
    margin-block: 16px;
    color: var(--text);
    font-family: var(--font-semibold);
    font-size: .95rem;
    background: #F1F1F1 0% 0% no-repeat padding-box;
    padding: .8rem 1rem;
    margin-top: clamp(20px, 3vw, 35px);
}

section.registrace_login div.na_firmu {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-block: clamp(30px, 3vw, 45px) 0;
    grid-column: 1/-1;
}

section.registrace_login div.na_firmu p {
    margin: 0;
    font-family: var(--font-semibold);
    font-size: .95rem;
}

section.registrace_login section.fakturacni {
    display: grid;
    grid-template-columns: 3fr 2fr 1fr;
    grid-template-rows: auto;
    width: min(100%, 752px);
    margin: auto;
    gap: 16px
}

section.registrace_login section.fakturacni div.input_wrap,
section.registrace_login div.form_content div.input_wrap {
    display: flex;
    flex-direction: column;
    gap:4px
}

section.registrace_login section.fakturacni:not(.firma_ne) :first-child {
    grid-column: 1/-1;
}

section.registrace_login section.fakturacni:not(.dodaci, .firma_ne) > :nth-child(3),
section.registrace_login section.fakturacni.firma_ne > :nth-child(2) {
    grid-column: 2/-1;
}

section.registrace_login section.fakturacni.dodaci > :last-child {
    grid-column: 2/-1;
    margin-top: auto;
}


section.registrace_login section.fakturacni.dodaci > :nth-last-child(2) {
    margin-top: 40px;
}

section.registrace_login div.souhlasy {
    width: min(100%, 752px);
    margin: auto;
    display: flex;
    flex-direction: column;
    gap:16px;
    margin-block: 35px;
}

section.registrace_login div.souhlasy label {
    font-family: var(--font-semibold);
    color: var(--text);
    font-size: .95rem;
}

section.registrace_login div.souhlasy label a {
    font-family: var(--font-semibold);
    color: var(--text);
    font-size: .95rem;
}


section.registrace_login button[type=submit] {
    min-width: 200px;
    padding: 15px;
    text-align: center;
    justify-content: center;
    margin-inline: auto;
}

section.registrace_login div.zapomneli {
    margin-top: 37px;
}

section.registrace_login div.zapomneli,
section.registrace_login.login button[type=submit] {
    grid-column: 1/-1;
    grid-row: 2;
    margin-inline: auto;
    width: fit-content;
}

section.registrace_login.login button[type=submit] {
    grid-row: 3;
}

section.registrace_login a.zapomenute {
    font-family: var(--font-regular);
    color: #848484;
    font-size: .95rem;
    text-decoration: underline;
    grid-column: 1;
}

@media screen and (max-width:600px) {
    section.registrace_login div.prepnout {
        grid-template-columns: 1fr;
    }

    section.registrace_login div.prepnout a, section.registrace_login div.prepnout a.actived:hover {
        padding: 13px 12px;
    }

    section.registrace_login div.prepnout {
        margin-top: -80px;
        margin-bottom: 40px;
    }

    section.registrace_login.login div.form_obal {
        margin-top: 73px;
    }
}

@media screen and (max-width:580px) {
    section.registrace_login section.fakturacni {
        grid-template-columns: 1fr 1fr;
    }

    section.registrace_login section.fakturacni:not(.dodaci) > :nth-last-child(3){
        grid-column: 1/-1;
    }

    section.registrace_login section.fakturacni.dodaci > :nth-child(2){
        grid-column: 1/-1;
    }

    section.registrace_login section.fakturacni:not(.dodaci) > :nth-child(3) {
        grid-column: unset;
    }
    
    section.registrace_login section.fakturacni.dodaci > :last-child {
        grid-column: unset;
    }

    section.registrace_login.login div.form_obal div.form_content {
        display: flex;
        flex-direction: column;
    }
}


@media screen and (max-width:420px) {
    section.registrace_login section.fakturacni,
    section.registrace_login div.form_obal div.form_content,
    section.registrace_login div.na_firmu  {
        display: flex;
        flex-direction: column;
    }

    section.registrace_login div.na_firmu label {
        width: 80px;
    }
}


/* nabidka */

section.nabidka {
    width: var(--min_width);
    margin-inline: auto;
}


section.nabidka ul.menu {
    position: relative;
    top:0;
    max-height: unset;
    background: transparent;
    margin: -20px 0 0 0;
    z-index: 1;
    padding-inline: 0px;
}

section.produkty_wrap {
    width: 100%;
    margin-top: clamp(50px, 6vw, 100px);
}

section.produkty_wrap div.js-dropdown {
    width: fit-content;
    z-index: 20;
}

section.produkty_wrap div.js-dropdown div.btn {
    gap: 10px;

}

section.produkty {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    border-top: 1px solid rgba(56, 101, 53, 0.0);
    overflow: hidden;
    transition: all .3s ease-in-out;
    padding-block: 20px;
}

section.produkty > a.polozka {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
    padding: clamp(25px, 2.5vw, 35px) clamp(18px, 2vw, 25px);
    gap:4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: all .3s ease-in-out;
}

section.produkty > a.polozka:hover {
    border: 0.5px solid var(--druha_barva);

}

section.produkty > a.polozka span {
    text-align: center;
}

section.produkty > a.polozka span.name {
    color: #F50104;
    text-decoration: underline;
    text-decoration-color: #F50104;
    font-size: .95rem;
    font-family: var(--font-bold);
    margin-bottom: auto;
    transition: all .3s ease-in-out;
}

section.produkty a.polozka:hover span.name{
    text-decoration-color: transparent;
}

section.produkty > a.polozka img {
    width: 100%;
    aspect-ratio: 1/1;
    display: block;
    object-fit: contain;
    object-position: center;
    transform-origin: center;
    transition: all .3s ease-in-out;

}

section.produkty a.polozka:hover img{
    transform: scale(1.04);
}

section.produkty > a.polozka span.popis {
    color: var(--text);
    font-size: .8rem;
    font-family: var(--font-regular);
}

section.produkty > a.polozka span.cena {
    color: var(--text);
    font-size: .95rem;
    font-family: var(--font-bold);
}

@media screen and (max-width:1080px) {
    section.produkty,
    section.nabidka ul.menu {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media screen and (max-width:800px) {
    section.produkty,
    section.nabidka ul.menu {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (max-width:660px) {
    section.produkty,
    section.nabidka ul.menu {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width:460px) {
    section.nabidka ul.menu {
        grid-template-columns: repeat(1, 1fr);
        gap: 8px;
    }

    section.nabidka ul.menu > li > a {
        padding: .4rem .7rem;
    }
}

@media screen and (max-width:360px) {
    section.produkty {
        grid-template-columns: repeat(1, 1fr);
    }
}

section.nabidka_detail_wrap {
    margin-top: 110px;
}

section.wrap_produkt_detail {
    display: flex;
    flex-direction: column;
}

section.nabidka_detail {
    display: grid;
    grid-template-columns: 1fr 600px;
    width: 100%;
    gap: clamp(40px, 13vw, 140px);
}

section.nabidka_detail h1 {
    font-family: var(--font-bold);
    font-size: clamp(2rem, 3vw, 2.8rem);
    color: var(--text);
}

section.nabidka_detail div.name_wrap {
    display: flex;
    flex-direction: row;
    gap: 15px;
    justify-content: space-between;
}

section.nabidka_detail span.popis {
    color: var(--text);
    font-size: 1.1rem;
    font-family: var(--font-semibold);
}

section.nabidka_detail a.oblibene,
section.nabidka_detail a.oblibene.active:hover,
.preload .oblibene {
    border: 0px;
    background: url("../website/images/img_zakaznik/ikona_oblibene.svg") center/contain no-repeat;
    width: 40px;
    height: 40px;
    margin-bottom: auto;
    cursor: pointer;
    transform-origin: center;
    transition: .3s ease-in-out all, .1s ease-in-out transform;
}

section.nabidka_detail a.oblibene:hover {
    transform: scale(1.1);

}

section.nabidka_detail a.oblibene:hover,
section.nabidka_detail a.oblibene.active,
.preload .oblibene {
    background-image: url("../website/images/img_zakaznik/ikona_oblibene_aktivni.svg");
}

section.nabidka_detail a.oblibene:active {
    transform: scale(.9);
}

section.nabidka_detail hr {
    border: 0.5px solid #D1D1D1;
    margin-block: 43px;
    width: 100%;
}

section.nabidka_detail img {
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
}

section.nabidka_detail div.cena {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap:20px;
    width: fit-content;
}

section.nabidka_detail div.cena span:nth-of-type(even) {
    text-align: right;
    margin-left: auto;
}

section.nabidka_detail div.cena span.hlavni {
    color: var(--text);
    font-size: 1.6rem;
    font-family: var(--font-semibold);
}

section.nabidka_detail div.cena span.popis {
    color: #848484;
    font-size: .95rem;
    font-family: var(--font-regular);
}

section.pridat {
    width: 100%;
    display: flex;
    flex-direction: row;
    margin-top: 41px;
    align-items: center;
}

section.pridat::after {
    content: '';
    width: 0; 
    height: 0; 
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    
    border-right: 16px solid var(--druha_barva);
}

section.pridat div.flex {
    display: flex;
    flex-direction: row;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border-radius: 74px;
    padding: clamp(15px, 2vw, 25px) clamp(20px, 2vw, 30px);
    width: fit-content;
    gap:10px;
}

section.pridat div.flex .btn {
    /* margin-left: 15px; */
}

section.pridat div.popisek {
    padding: 15px;
    order: 3;
    width: 240px;
    width: min(240px, 100%);
    background: var(--druha_barva);

    display: flex;
    justify-content: center;
    align-items: center;

}

section.pridat div.popisek p {
    margin: 0;
    text-align: center;  
    color: #FFFFFF;
    font-family: var(--font-regular);
     
}

section.pridat div.flex button.plus_min,
section.pridat div.flex p,
section.pridat input.cisla {
    margin: 0;
    font-family: var(--font-semibold);
    font-size: 1.7rem;
    color: var(--text);
}

section.pridat input.cisla {
    font-size: 20px;
}

section.pridat div.flex button.plus_min {
    width: 2.5rem;
    height: 2.5rem;
    border: 0.75px solid #D1D1D1;
    border-radius: 6px;
    background: white;

    cursor: pointer;
    transition: all .125s ease-in-out;
}

section.pridat div.flex button.plus_min:hover {
    filter: brightness(.9);

}

section.pridat div.flex button.plus_min:active {
    filter: brightness(.8);
}

section.pridat input.cisla,
section.prehled table.polozky tr td input.cisla {
    padding: 0 5px;
    width: 40px;
    text-align: center;
    border: unset;
    /* pointer-events: none; */

    border: 0.75px solid var(--text);
    border-radius: 6px;
    height: 2.5rem;
    /* margin-inline: 10px; */
    background: var(--hlavni_barva);
}

section.prehled table.polozky tr td input.cisla {
    width: 40px;
    height: 32px;

}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

section.nabidka_detail div.puvod {
    display: flex;
    gap: 7px;
    width: fit-content;
    margin-top: auto;
    align-items: center;
    padding-top: 30px;
}


section.nabidka_detail div.puvod img {
    height: 1.9rem;
    aspect-ratio: 1/1;
    object-fit: contain;
}


section.nabidka_detail div.puvod p {
    color: var(--text);
    font-family: var(--font-regular);
    margin: 0;
    font-size: 0.95rem;
}

section.nabidka_detail div.puvod p b {
    font-family: var(--font-semibold);
}


@media screen and (max-width:1400px) {
    section.nabidka_detail {
        gap:30px;
    }
}

@media screen and (max-width:1270px) {
    section.nabidka_detail {
        grid-template-columns: 1fr;
        width: min(100%, 610px);
        margin-inline: auto;


    }
    section.nabidka_detail img {
        width: min(100%, 300px);
    }
}

@media screen and (max-width:660px) {
    section.pridat {
        flex-direction: column;
        width: fit-content;
    }

    section.pridat::after {
        transform-origin: center;
        transform: rotate(90deg) translateX(3px);
    }
}

@media screen and (max-width:450px) {
    section.nabidka_detail div.name_wrap {
        flex-direction: column-reverse;
    }

    section.nabidka_detail div.cena {
        grid-template-columns: 1fr;
        gap:10px;
    }

    section.nabidka_detail div.cena span.popis.f {
        grid-row: 2;
        margin-bottom: 20px;
    }

    section.nabidka_detail div.cena span.hlavni:first-of-type {
        grid-row: 1;
    }

    section.nabidka_detail div.cena span:nth-of-type(even) {
        text-align: left;
        margin: 0px;
    }

    section.pridat div.flex {
        width: fit-content;
        flex-wrap: wrap;
        justify-content: center;
    }
}

/* kam rozvazime */

section.rozvoz {
    width: var(--min_width);
    margin-inline: auto;

}

section.rozvoz h1 {
    margin-bottom: 70px;
}

section.rozvoz p {
    color: var(--text);
    font-family: var(--font-medium);
    font-size: 1.1rem;
}

section.rozvoz div.flex {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 40px;
    margin-bottom: 50px;
}

section.rozvoz label.vyhledat {
    color: var(--text);
    font-family: var(--font-medium);
    font-size: 1.1rem;
}

section.rozvoz div.flex input {
    padding: 8px 10px;
    width: min(100%, 300px);
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
}



section.rozvoz div.vyhledane {
    display: flex;
    flex-direction: column;
    gap: 10px;
}


section.rozvoz .vyhledane .polozka {
    display: flex;
    justify-content: space-between;
    gap: 15px;
}

section.rozvoz .vyhledane .polozka span:nth-of-type(2) {
    text-align: right;
}

section.rozvoz .paging {
    margin-top: 55px;
}


@media screen and (max-width:520px) {
    section.rozvoz p {
        font-size: 0.95rem;
    }

    section.rozvoz div.flex {
        gap: 6px;
        align-items: flex-start;
        flex-direction: column;
    }
}


/* kontakt */


section.kontakt {
    width: var(--min_width);
    margin-inline: auto;

}


section.kontakt h1 {
    width: 100%;
}


section.kontakt section.kontakt_grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 45px 20px;
    margin-top: 60px;
}

section.kontakt section.kontakt_grid iframe {
    grid-column: 1/-1;
    width: 100%;
    aspect-ratio: 3/2;
}

section.kontakt section.kontakt_grid div.udaje p {
    line-height: 1.5em;
}

section.kontakt section.kontakt_grid div.udaje h2 {
    margin-top: 0px;
    margin-bottom: 47px;
    position: relative;
}

section.kontakt section.kontakt_grid div.udaje h2::after {
    content: '';
    position: absolute;
    top: 130%;
    left:0;
    width: 40px;
    height: 3px;
    background: var(--druha_barva);
}

section.kontakt section.kontakt_grid div.udaje div.flex  {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

section.kontakt a.tel,
section.kontakt a.mail {
    color: var(--text);
    font-family: var(--font-semibold);
    font-size: clamp(1rem, 1.5vw, 1.1rem);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: all .2s ease-in-out;
}

section.kontakt a.tel:hover,
section.kontakt a.mail:hover {
    text-decoration-color: transparent;
}


@media screen and (max-width:540px) {
    section.kontakt section.kontakt_grid {
        grid-template-columns: 1fr;
    }
}

/* dekujeme */

section.dekujeme {
    width: var(--min_width);
    margin-inline: auto;
}

section.dekujeme h1 {
    width: 100%;
    text-align: center;
}

section.dekujeme a {
    margin-inline: auto;
    margin-top: 40px;
}


/* uni template*/


/* FORM */

section.form_wrap {
    background-color: transparent;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-row-gap: 30px;
    margin-top: 0px;

    /* background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(4px) brightness(1.8);
    -webkit-backdrop-filter: blur(4px) brightness(1.8); */

    padding: clamp(30px, 3vw, 60px) var(--padding);
}



section.form_wrap::before {
    /* content: ''; */
    position: absolute;
    top: 0;
    right: calc(-1 * var(--padding));
    background: url('../img/foto_telefon.webp') center right/contain no-repeat;

    transform: translateY(-40%);
    width: clamp(180px, 20vw, 350px);
    aspect-ratio: 1/1;
}

@media screen and (max-width: 600px) {
    section.form_wrap::before {
        width: 120px;
    }
}

section.form_wrap > * {
    grid-column: span 2;
}

section.form_wrap h1 {
    font-family: var(--font-semibold);
    color: #252E3D;
    margin: 0;
}
section.form_wrap p {
    text-align: center;
    margin: 0;
}

section.form_wrap section.sep {
/*     
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto; */
    grid-gap: 5px 15px;
   
    display: flex;
    flex-direction: column; 
}

section.form_wrap section.textarea_wrap {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

section.form_wrap section.sep label {
    grid-row: 1;
    margin-bottom: 8px;
}


section.form_wrap label, section.form_wrap input, section.form_wrap textarea {
    font-family: var(--font-regular);
    font-size: clamp(1rem, 1.4vw, 1.1rem);
    color: #252E3D;
}

section.form_wrap textarea {
    border: none;
    border-radius: 3px;
}

section.form_wrap input, section.form_wrap textarea
section.form_wrap input:focus-visible, section.form_wrap textarea:focus-visible {
    padding: 10px 15px;
    width: 100%;

    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #9A9A9A;
}

section.form_wrap textarea {
    resize: vertical;
    background: #FFFFFF 0% 0% no-repeat padding-box;
border: 1px solid #9A9A9A;
}

section.form_wrap > section.for_captcha {
    grid-column: 1;
    grid-row: 5;
    transform-origin: top left;
    width: 50%;
    /* transform: scale(.77); */
    position: relative;
    min-height: 65px;
    min-width: 180px;
}

section.form_wrap > section.for_captcha > * {
    position: absolute;
}

section.form_wrap .btn {
    grid-column: 2;
    margin-left: auto;
    cursor: pointer;
    width: min(300px, 100%);
}


section.form_wrap label.souhlas {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    font-family: var(--font-regular);
    font-size: .9rem;
    color:var(--text);
    margin-bottom: 0px;

    display: flex;
    flex-direction: row;
    align-items: center;
    height: 25px;
}


@media screen and (max-width:740px) {
    section.form_wrap .btn {
        grid-column: 1;
        margin: 0;
    }
}




@media screen and (max-width:580px) {
    section.form_wrap > section.for_captcha,
    section.form_wrap .btn  {
        grid-column: 1/-1;
    }


    section.form_wrap section.sep {
        display: flex;
        flex-direction: column;
    }

    section.form_wrap section.sep input:first-of-type {
        margin-bottom: 20px;
    }
}

@media screen and (max-width:400px) {
    section.form_wrap > section.for_captcha {
        transform: scale(.85);
    }

    section.form_wrap h1 {
        font-size: 1.7rem;
    }
}




/* checkbox */

/* Hide the browser's default checkbox */
label.souhlas input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
  }
  
/* Create a custom checkbox */
.checkmark {
position: absolute;
top: 0;
left: 0;
height: 25px;
width: 25px;
background-color: #eee;
}

/* On mouse-over, add a grey background color */
label.souhlas:hover input ~ .checkmark {
background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
label.souhlas input:checked ~ .checkmark {
background-color: #3F8E30;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
content: "";
position: absolute;
display: none;
}

/* Show the checkmark when checked */
label.souhlas input:checked ~ .checkmark:after {
display: block;
}

/* Style the checkmark/indicator */
label.souhlas .checkmark:after {
left: 9px;
top: 5px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}



/* moje objednavky */

section.moje_objednavky section.top_site {
    border-bottom: 1px solid #D1D1D1;
    padding-bottom: 45px;
    display: flex;
    justify-content: space-between;
    gap: 7px 40px;
    flex-wrap: wrap;
}

section.moje_objednavky section.pager,
div.paging {
    display: flex;
    flex-direction: row;
    height: fit-content;
}

div.paging {
        width: 100%;
    justify-content: center;
}


section.moje_objednavky section.pager ul.pagination {
    margin: 0;
    padding: 0;
}

section.moje_objednavky section.pager a:hover,
div.paging a:hover {
    text-underline-offset: 8px;
    text-decoration-color: transparent;
}

section.moje_objednavky section.pager a:not(.straight),
div.paging a,
div.paging span {
    text-decoration: underline;
    font-family: var(--font-bold);
    font-size: 1rem;
    padding: 5px 12px;
    display: flex;
    align-items: center;
    text-underline-offset: 2px;
    transition: all .2s ease-in-out;
    cursor: pointer;
}
div.paging a.straight {
    text-decoration: none;
    color: var(--text);
}


section.moje_objednavky section.pager a.active:not(.straight),
div.paging span  {
    text-decoration: none;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.75px solid #D1D1D1;
    border-radius: 6px;
    color: #484848;
}

section.moje_objednavky section.pager a.active:hover:not(.straight),
div.paging a.active:hover:not(.straight) {
    background: #e4e4e4 0% 0% no-repeat padding-box;
}

section.moje_objednavky section.pager ul.pagination li.active span {
    background:transparent;
    color: inherit;
}
section.moje_objednavky section.pager ul.pagination li.active span {
    width: fit-content;
    height: fit-content;
    border-radius: 0px;
    display: block;
    padding: 0rem;
    text-decoration: none;
}

section.table_wrap {
    overflow-x: auto;
    padding-top: 45px;
}

table.moje_objednavky_table{
    width: 100%;
    border-collapse: separate;
    border-spacing: 0px 20px;
}


table.moje_objednavky_table tr:not(:first-of-type){
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
}

table.moje_objednavky_table tr td {
    padding-block: 15px;

    border: 0px solid #D1D1D1;
    border-block-width: 0.5px;
}

table.moje_objednavky_table tr td:not(:last-of-type),
table.moje_objednavky_table tr th:not(:last-of-type) {
    padding-right: 15px;
}

table.moje_objednavky_table tr td:nth-of-type(5),
table.moje_objednavky_table tr td:nth-of-type(6),
table.moje_objednavky_table tr th:nth-of-type(5),
table.moje_objednavky_table tr th:nth-of-type(6) {
    width: 1%;
    white-space: nowrap;
    padding-right: clamp(30px, 4vw, 70px);
}

table.moje_objednavky_table tr td:nth-of-type(5),
table.moje_objednavky_table tr td:nth-of-type(6) {
    text-align: end;
}



table.moje_objednavky_table tr td:last-of-type,
table.moje_objednavky_table tr th:last-of-type {
    padding-right: 20px;
}

table.moje_objednavky_table tr td:last-of-type {
    border-right-width: 0.5px;
    border-radius: 0px 6px 6px 0px;
}

table.moje_objednavky_table tr td:first-of-type,
table.moje_objednavky_table tr th:first-of-type {
    padding-left: 20px;
}

table.moje_objednavky_table tr th {
    text-align: start;
    color: #848484;
    font-family: var(--font-semibold);
    font-size: .95rem;
    
}

table.moje_objednavky_table tr td:first-of-type {
    border-radius: 6px 0px 0px 6px;
    border-left-width: 0.5px;
}

table.moje_objednavky_table div.flex.col {
    display: flex;
    flex-direction: column;
}

table.moje_objednavky_table a,
table.moje_objednavky_table span b,
table.moje_objednavky_table span,
table.moje_objednavky_table div.status {
    font-size: .95rem;
    font-family: var(--font-bold);
}

table.moje_objednavky_table span b {
    color: #484848;
}

table.moje_objednavky_table span {
    color: #848484;
    font-family: var(--font-semibold);
}

table.moje_objednavky_table div.status {
    background: #386535 0% 0% no-repeat padding-box;
    border-radius: 10px;
    padding: 11px 17px;
    color: #FFFFFF;
    width: 100%;
}

table.moje_objednavky_table tr td:nth-of-type(4) {
    width: 1%;
    white-space: nowrap;
    padding-right: clamp(40px, 4vw, 87px);
}

table.moje_objednavky_table div.status.prijato {
    background: #386535 0% 0% no-repeat padding-box;
}

table.moje_objednavky_table div.status.cekame {
    background: #F50104 0% 0% no-repeat padding-box;
}

table.moje_objednavky_table div.status.vyskladneno {
    background: #A041E8 0% 0% no-repeat padding-box;
}

table.moje_objednavky_table div.status.dodano {
    background: #484848 0% 0% no-repeat padding-box;
}

@media screen and (max-width: 1340px) {
    table.moje_objednavky_table tr td:nth-of-type(4),
    table.moje_objednavky_table tr td:nth-of-type(5), 
    table.moje_objednavky_table tr td:nth-of-type(6), 
    table.moje_objednavky_table tr th:nth-of-type(5), 
    table.moje_objednavky_table tr th:nth-of-type(6){
        padding-right: 15px;
    }

    
}


@media screen and (max-width: 1210px) {
    table.moje_objednavky_table tr:first-of-type {
        display: none;
    }

    table.moje_objednavky_table tr:not(:first-of-type) {
        display: grid;
        grid-template-columns: 1fr 1fr;
        margin-bottom: 30px;
    }

    table.moje_objednavky_table tr td {
        border: 0px;
        padding: 0px;
        width: 100% !important;
    }

    table.moje_objednavky_table tr td:nth-of-type(1),
    table.moje_objednavky_table tr td:nth-of-type(2),
    table.moje_objednavky_table tr td:nth-of-type(4),
    table.moje_objednavky_table tr td:nth-of-type(5) {
        padding-left: clamp(15px, 5.5vw, 45px);
        padding-right: 0px;
    }

    table.moje_objednavky_table tr td:nth-of-type(1),
    table.moje_objednavky_table tr td:nth-of-type(3),
    table.moje_objednavky_table tr td:nth-of-type(4),
    table.moje_objednavky_table tr td:nth-of-type(6) {
        padding-right: clamp(15px, 5.5vw, 45px);
    }

    table.moje_objednavky_table tr td:nth-of-type(1) {
        padding-top: clamp(10px, 4vw, 30px);
    }

    table.moje_objednavky_table tr td:nth-of-type(2),
    table.moje_objednavky_table tr td:nth-of-type(3) {
        padding-top: 20px;
    }
    
    table.moje_objednavky_table tr td:nth-last-of-type(1) {
        padding-bottom: clamp(10px, 6vw, 30px);
        grid-column: 1/-1;
    }

    table.moje_objednavky_table td:nth-of-type(2) div.flex.col::before,
    table.moje_objednavky_table td:nth-of-type(3) div.flex.col::before,
    table.moje_objednavky_table tr td:nth-of-type(5) span::before,
    table.moje_objednavky_table tr td:nth-of-type(6) span::before {
        content: 'Datum objednávky';
        order: 1;
        font-size: 1rem;
        color: #848484;
        font-family: var(--font-semibold);
    }

    table.moje_objednavky_table td:nth-of-type(3) div.flex.col::before {
        content: 'Požadovaný rozvoz';
    }

    table.moje_objednavky_table td:nth-of-type(2) div.flex.col span:first-of-type,
    table.moje_objednavky_table td:nth-of-type(3) div.flex.col span:first-of-type {
        order: 2;
    }

    table.moje_objednavky_table td:nth-of-type(2) div.flex.col span,
    table.moje_objednavky_table td:nth-of-type(3) div.flex.col span {
        order: 3;
    }

    table.moje_objednavky_table tr td:nth-of-type(1),
    table.moje_objednavky_table tr td:nth-of-type(4) {
        grid-column: 1/-1;
    }

    table.moje_objednavky_table tr td:nth-of-type(5) span,
    table.moje_objednavky_table tr td:nth-of-type(6) span {
        display: flex;
        flex-direction: column;
        width: fit-content;
        margin-top: 20px;
    }

    table.moje_objednavky_table tr td:nth-of-type(6) span,
    table.moje_objednavky_table tr td:nth-of-type(3) div.flex.col {
        margin-left: auto;
        width: fit-content;
    }

    table.moje_objednavky_table div.status {
        margin-top: 20px;
    }

    table.moje_objednavky_table tr td:nth-of-type(5) span b,
    table.moje_objednavky_table tr td:nth-of-type(6) span b {
        order: 2;
    }

    table.moje_objednavky_table tr td:nth-of-type(5) span::before {
        content: 'Celkem bez DPH';
    }

    table.moje_objednavky_table tr td:nth-of-type(6) span::before {
        content: 'Celkem s DPH';
    }
    

    table.moje_objednavky_table {
        width: min(500px, 100%);
        margin-inline: auto;
    }
}

@media screen and (max-width:420px) {
    table.moje_objednavky_table tr:not(:first-of-type) {
        display: flex;
        flex-direction: column;
    }

    table.moje_objednavky_table tr td:nth-of-type(6) span, 
    table.moje_objednavky_table tr td:nth-of-type(3) div.flex.col{
        margin: 0px;
    }

    table.moje_objednavky_table tr td {
        padding-inline: 15px !important;
    }

    table.moje_objednavky_table tr td:nth-of-type(5) span, 
    table.moje_objednavky_table tr td:nth-of-type(6) span {
        min-width: 125px;
    }

    table.moje_objednavky_table tr td:nth-of-type(5) span {
        margin-bottom: 20px;
    }
}

/* objednavky detail */

section.objednavka_form {
    grid-column: 1/-1;
}

section.objednavka_form h2 {
    margin: 0;
    font-family: var(--font-semibold);
    font-size: 1.3rem;
    color: var(--text);
}

section.wraper.objednavka {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: clamp(30px, 6vw, 90px);
    padding-left: clamp(40px, 10vw, 130px);
    padding-right: var(--padding);
    box-sizing: content-box;

    width: min(1000px, 100%);
    margin: auto;
}

@media screen and (max-width:1580px) {
    section.wraper.objednavka {
        padding-inline: 0px;
    }
}

section.wraper.objednavka.vychystani {
    gap: clamp(30px, 3vw, 40px);
}

section.objednavka p.cislo {
    color: var(--nadpisy);
    font-size: 1em;
    font-family: var(--font-bold);
    line-height: 2.5em;
}

section.objednavka p.cislo span {
    font-family: var(--font-bold);
    font-size: 2em;

    display: flex;
    gap: 10px;
    line-height: 1em;
}


section.objednavka p.adresa {
    font-size: 1em;
    font-family: var(--font-regular);
    color: #848484;
    line-height: 1.8em;
}

section.objednavka p.adresa b {
    font-family: var(--font-bold);
    color: var(--nadpisy);

}

section.objednavka div.tabulka {
    display: grid;
    grid-template-columns: 1fr 270px;

    padding: 25px 45px;

    background: #F1F1F1 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
}

section.objednavka div.tabulka > div {
    display: flex;
    align-items: center;
    padding-block: clamp(10px, 1.5vw, 20px);
}

section.objednavka div.tabulka > div span {
    color: var(--text);
    font-size: .95rem;
    font-family: var(--font-semibold);
}

section.objednavka div.tabulka > div span b {
    font-family: var(--font-bold);
}

section.objednavka div.tabulka > div:not(:nth-last-of-type(1), :nth-last-of-type(2)) {
    border-bottom: 1px solid #D1D1D1;
}

section.objednavka div.tabulka > div:nth-of-type(odd) {
    border-right: 1px solid #D1D1D1;
    padding-right: 20px;
}

section.objednavka div.tabulka > div:nth-of-type(even) {
    padding-left: clamp(15px, 2vw, 30px);
}

section.objednavka div.tabulka > div span b {
    font-family: var(--font-bold);

}

section.objednavka div.tabulka > div span.hlaska {
    border-radius: 10px;
    padding: 10px 17px;

}

section.objednavka div.tabulka > div span.hlaska::before {
    font-family: var(--font-bold);
    color: white;
    font-size: 1rem;
}

section.objednavka div.tabulka > div span.hlaska.yes {
    background: #386535 0% 0% no-repeat padding-box;

}

section.objednavka div.tabulka > div span.hlaska.yes::before {
    content: 'Zboží dodáno';

}

section.objednavka div.tabulka > div span.hlaska.no {
    background: #F50104 0% 0% no-repeat padding-box;
}

section.objednavka div.tabulka > div span.hlaska.no::before {
    content: 'Čekáme na dodání zboží';


}


section.objednavka div.tabulka > div.status > span {
    display: block;
    border-radius: 10px;
    padding: 10px 17px;
    font-family: var(--font-bold);
    color: white;
    font-size: .95rem;
}

section.objednavka div.tabulka > div.status.prijato > span {
    background: #386535 0% 0% no-repeat padding-box;

}

section.objednavka div.tabulka > div.status.cekame > span {
    background: #F50104 0% 0% no-repeat padding-box;
}

section.objednavka div.tabulka > div.status.vyskladneno > span {
    background: #A041E8 0% 0% no-repeat padding-box;
}

section.objednavka div.tabulka > div.status.dodano > span {
    background: #484848 0% 0% no-repeat padding-box;
}

@media screen and (max-width: 1110px) {
    section.wraper.objednavka {
        display: flex;
        flex-direction: column;
    }

    section.objednavka div.tabulka {
        grid-template-columns: 1fr 1.2fr;
    }
}

@media screen and (max-width: 900px) {
    section.wraper.objednavka {
        padding-left: 0;
    }

}

@media screen and (max-width: 610px) {
    section.objednavka div.tabulka {
        padding: 15px 20px;
        grid-template-columns: 1fr 250px;

    }

}

@media screen and (max-width: 450px) {
    section.objednavka div.tabulka {
        display: flex;
        flex-direction: column;
    }

    section.objednavka div.tabulka > div:nth-of-type(odd) {
        padding-right: 0px;
        border: 0px;
    }

    section.objednavka div.tabulka > div:nth-of-type(even) {
        padding-left: 0px;
        padding-top: 0px;
    }

}

.objednavka div.flex.col {
    gap: 56px;
}

div.flex.col {
    flex-direction: column;
}



section.prehled.objednavka_detail:not(:first-child) {
    margin-top: 50px;

}

section.prehled.objednavka_detail > h1 {
    margin: auto;
    width: fit-content;
    margin-bottom: 30px;
}

section.prehled.objednavka_detail table.polozky {
    border-collapse: separate;
    width: 100%;
    background-color: transparent;
    border-spacing: 0px 10px;
    min-width: 800px;
    margin-top: 0px;
}

section.prehled.objednavka_detail table.polozky tr {
    background: #FFFFFF 0% 0% no-repeat padding-box;
}

section.prehled.objednavka_detail table.polozky tr:not(:first-of-type) {
    min-height: 80px;
    height: 80px;
}

section.prehled.objednavka_detail table.polozky tr:nth-of-type(1) {
    transform: translateY(10px);
}

section.prehled.objednavka_detail table.polozky tr td img {
    width: clamp(60px, 5vw, 70px);
    aspect-ratio: 1/1;
    object-fit: contain;
}

section.prehled.objednavka_detail table.polozky tr td {
    border-top: 0.5px solid #D1D1D1;
    border-bottom: 0.5px solid #D1D1D1;
    padding-right: 10px;
    
    padding: 0.75rem 1rem;
    line-height: 1.6rem;
    font-size: 1rem;
}

section.prehled.objednavka_detail table.polozky tr:has(img) td {
    padding-block: 0rem;
}

section.prehled.objednavka_detail table.polozky tr td:first-of-type {
    border-left: 0.5px solid #D1D1D1;
    border-radius: 6px 0px 0px 6px;

}

section.prehled.objednavka_detail table.polozky tr:first-of-type {
    background: transparent;
}

section.prehled.objednavka_detail table.polozky tr:first-of-type th.mobile {
    opacity: 0;
    visibility: hidden;
}

section.prehled.objednavka_detail table.polozky tr th {
    color: #848484;
    font-family: var(--font-semibold);
    font-size: .9rem;
    text-align: left;
    vertical-align: bottom;
    padding: 0;
}

section.prehled.objednavka_detail table.polozky tr td:last-of-type {
    border-right: 0.5px solid #D1D1D1;
    border-radius: 0px 6px 6px 0px;
}

section.prehled.objednavka_detail table.polozky tr td div.flex {
    display: flex;
    flex-direction: row;
    /* gap: 10px; */
    align-items: center
}

section.prehled.objednavka_detail table.polozky tr td button {
    width: 2rem;
    height: 2rem;
    border: 0.75px solid #D1D1D1;
    border-radius: 6px;
    background: white;
    font-family: var(--font-bold);
    font-size: 1.1rem;
    color: var(--text);
    cursor: pointer;
    transition: all .125s ease-in-out;
}

section.prehled.objednavka_detail table.polozky tr td button:hover {
    filter: brightness(.9);

}

section.prehled.objednavka_detail table.polozky tr td button:active {
    filter: brightness(.8);
}

section.prehled.objednavka_detail table.polozky tr td p,
section.prehled.objednavka_detail table.polozky tr td input[type="text"],
section.prehled.objednavka_detail table.polozky tr td input[type="number"] {
    font-family: var(--font-bold);
    font-size: 1.1rem;
    color: var(--nadpisy);
    margin: 0;
    padding-left: 0px;
}

section.prehled.objednavka_detail table.polozky tr td:first-of-type p {
    font-size: 1rem;
}


section.prehled.objednavka_detail table.polozky tr td span {
    color: #D1D1D1;
    font-family: var(--font-regular);
    font-size: .9rem;
}

section.prehled.objednavka_detail table.polozky tr td p span {
    font-family: var(--font-regular);
}

section.prehled.objednavka_detail table.polozky tr th div.box_table {
    display: flex;
    align-items:flex-end;
    padding-bottom: 10px;
}

section.prehled.objednavka_detail table.polozky tr th:nth-of-type(1) div.box_table {
    padding-left: 20px;
}

section.prehled.objednavka_detail table.polozky tr th:nth-of-type(6) div.box_table {
    justify-content: flex-end;
    padding-right: 30px;

}

section.prehled.objednavka_detail table.polozky tr td:nth-of-type(2) {
    width: 1%;
    padding-right: 30px;
    white-space: nowrap;
}



section.prehled.objednavka_detail table.polozky tr td:nth-of-type(4),
section.prehled.objednavka_detail table.polozky tr td:nth-of-type(6) {
    width: 1%;
    white-space: nowrap;
    padding-inline: 0px;
    padding-left: 13px;

}


section.prehled.objednavka_detail table.polozky tr th:nth-of-type(4) div.popisek_flex div.popis,
section.prehled.objednavka_detail table.polozky tr th:nth-of-type(6) div.popisek_flex div.popis {
    padding-left: 13px;
    padding-right: 0px;
}

section.prehled.objednavka_detail table.polozky tr td:nth-of-type(4) p,
section.prehled.objednavka_detail table.polozky tr td:nth-of-type(6) p {
    padding-left: 0px;
}


section.prehled.objednavka_detail table.polozky tr td:nth-of-type(5) {
    padding-inline: 0px;
}

section.prehled.objednavka_detail table.polozky tr td:nth-of-type(5) p {
    padding-inline: 33px 18px;
    text-align: left;
}

section.prehled.objednavka_detail:not(.obaly) table.polozky tr td:nth-of-type(5) div.flex {
    padding-inline: 50px 10px;
}
section.prehled.objednavka_detail table.polozky tr td:nth-of-type(5) div.flex p {
    padding-inline: 0px;
}

section.prehled.objednavka_detail table.polozky tr th:nth-of-type(5),
section.prehled.objednavka_detail table.polozky tr th:nth-of-type(7) {
    padding-inline: 0px 15px;
}



section.prehled.objednavka_detail table.polozky tr th div.popisek_flex {
    display: flex;
    gap: 10px;
    flex-direction: column;

    font-size: 1rem;
    font-family: var(--font-semibold);

}

section.prehled.objednavka_detail table.polozky tr th div.popisek_flex div.popis {
    color: white;
    background-color: #848484;
    padding: 10px 17px 10px 33px;

    font-size: 1rem;
    font-family: var(--font-regular);
    text-align: start;
}


section.prehled.objednavka_detail table.polozky tr td:last-of-type,
section.prehled.objednavka_detail table.polozky tr td:first-of-type {
    width: 1%;
    padding-right: 20px;
    white-space: nowrap;
}

section.prehled.objednavka_detail table.polozky tr td:last-of-type{
    padding: 10px 17px 10px 33px;
}

section.prehled.objednavka_detail table.polozky tr td:first-of-type {
    padding-left: 20px;
}

section.prehled.objednavka_detail table.polozky tr td a.remove {
    mask: url('../../website/images/smazat_kruh_a.svg') center/contain no-repeat;
    -webkit-mask: url('../../website/images/smazat_kruh_a.svg') center/contain no-repeat;
    background: #848484;
    width: 1.1rem;
    height: 1.1rem;
    display: block;
    margin: 0;
    margin-left: auto;

    transform-origin: center;
    transition: all .18s ease-in-out;
}

section.prehled.objednavka_detail table.polozky tr td a.remove:hover {
    transform: scale(1.1);
    filter: brightness(1.3);
}

section.prehled.objednavka_detail table.polozky tr.cena {
    background-color: transparent;
    transform: translateY(-10px);
}

section.prehled.objednavka_detail table.polozky tr.cena td {
    border: 0;
}

section.prehled.objednavka_detail table.polozky tr.cena td span {
    font-family: var(--font-regular);
    color: #D1D1D1;
    font-size: 1.05rem;
}

section.prehled.objednavka_detail table.polozky tr.cena td b {
    font-family: var(--font-bold);
    color: white;
}

section.prehled.objednavka_detail table.polozky tr.cena td.tabulka_cena_wrap{
    padding: 0px;
}

section.prehled.objednavka_detail table.polozky tr.cena div.tabulka_cena {
    display: flex;
    flex-direction: row;
    gap: 20px;
    width: fit-content;
    margin-left: auto;

    background: #484848 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-right: 0px;
    border-radius: 0px 0px 6px 6px;
    padding-left: clamp(16px, 6vw, 50px);
    padding-block: 16px;

    padding-right: 81px;

}



section.prehled.objednavka_detail table.polozky tr.cena div.tabulka_cena div.col_flex {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: flex-end;
}

section.prehled.objednavka_detail section.wrap_table {
    overflow-x: auto;
}



section.obaly.objednavka_detail {
    margin-top: 40px;
}

section.obaly.objednavka_detail div.obaly {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.5px solid #D1D1D1;
    border-radius: 6px;
    padding: 24px;
    width: min(750px, 100%);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 15px;
    margin-top: 20px;
}

section.obaly.objednavka_detail div.obaly span {
    font-size: .95rem;
}


section.obaly.objednavka_detail div.obaly span:last-of-type {
    padding-right: clamp(30px, 5vw, 102px);
}

section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(1) { 
    font-family: var(--font-semibold);
}

section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td div.flex { 
    font-family: var(--font-bold);
    font-size: 1.1rem;
    color: var(--nadpisy);
}

section.prehled.objednavka_detail.obaly table.polozky tr th,
section.prehled.objednavka_detail.obaly table.polozky tr td,
section.prehled.objednavka_detail.obaly table.polozky tr td:last-of-type {
    padding: 0.75rem 1rem;
}

section.prehled.objednavka_detail.obaly table.polozky tr td,
section.prehled.objednavka_detail.obaly table.polozky tr td:last-of-type {
    padding: 0.75rem 1.45rem;
}


section.prehled.objednavka_detail.obaly table.polozky tr td:nth-of-type(5) div.flex,
section.prehled.objednavka_detail.obaly table.polozky tr td:nth-of-type(6) div.flex,
section.prehled.objednavka_detail.obaly table.polozky tr th:nth-of-type(5) div.popis,
section.prehled.objednavka_detail.obaly table.polozky tr th:nth-of-type(6) div.popis {
    display: flex;
    justify-content: flex-end;
    text-align: right;
}

section.prehled.objednavka_detail.obaly section.celkem {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 10px;
    padding: 1rem 1.45rem;
}

section.prehled.objednavka_detail.obaly section.celkem span {
    font-family: var(--font-bold);
    font-size: 1.25rem;
    color: var(--nadpisy);
}



@media screen and (max-width:1300px) {
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 7px 0px;


        border: 0.5px solid #D1D1D1;
        border-radius: 6px;

        padding: 30px clamp(20px, 9vw, 45px);
    }

    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) {
        display: flex;
        flex-direction: column;
    }

    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td {
        padding: 0px;
    }

    section.prehled.objednavka_detail table.polozky tr td a.remove {
        width: 1.8rem;
        height: 1.8rem;
    }

    section.prehled.objednavka_detail table.polozky tbody {
        display: flex;
        flex-direction: column;
    }

    section.prehled.objednavka_detail table.polozky tr:first-of-type th {
        opacity: 0;
        visibility: hidden;
    }

    section.prehled.objednavka_detail table.polozky tr:first-of-type th.mobile {
        opacity: 1;
        visibility: visible;
    }

    section.prehled.objednavka_detail table.polozky tr td img {
        width: 75px;
    }

    section.prehled.objednavka_detail table.polozky {
        min-width: 0px;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td {
        width: 100%;
        height: 100%;
        padding: 0px;
        border: 0px;
    }


    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:last-of-type {
        grid-column: 2;
        grid-row: 1;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(1) {
        grid-column: 1;
        grid-row: 1;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(2) {
        grid-column: 1/-1;
        grid-row: 2;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(3) {
        grid-column: 1/-1;
        grid-row: 3;
    }

    section.vychystani section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(3) {
        grid-column: 1/-1;
        grid-row: 3;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4) {
        grid-column: 1;
        grid-row: 4;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4),
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5),
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(6),
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(7),
    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(2),
    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(3) {
        display: flex;
        flex-direction: column;
        gap: 10px;
        justify-content: flex-end;
        padding-top: 20px;
    }

    section.vychystani section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4) {
        justify-content: flex-start;
    }

    section.prehled.objednavka_detail:not(.obaly) table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4)::before {
        content: 'Požadováno:';
        order: 1;

        font-size: 1rem;
        font-family: var(--font-semibold);
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4)::after,
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5)::after,
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(6)::after,
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(7)::after,
    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:not(:first-of-type)::after {
        content: 'Množství:';
        background: #848484;
        padding: 7px 13px;
        color: white;
        order: 2;

        font-size: 1rem;
        font-family: var(--font-regular);
    }

    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:not(:first-of-type)::after {
        order: 1;
    }

    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td div.flex,
    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td div.flex {
        order: 2;
    }

    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(3)::after {
        content: 'Dodáváme';
    }
    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(2)::after {
        content: 'Vrací';
    }

    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4)::after {
        content: '∑';
    }

    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5)::after {
        content: 'Cena/ks';
    }

    section.prehled.objednavka_detail.obaly table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(6)::after {
        content: 'Cena';
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5)::after,
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(7)::after {
        content: 'Cena:';
    }


    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4) input,
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5) p,
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4) p,
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5) div.flex,
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(6) p,
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(7) p {
        order: 3;
        padding-inline: 0px;
        height: fit-content;
        padding-left: 13px;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5) {
        grid-column: 2;
        grid-row: 4;

    }

    section.prehled.objednavka_detail.obaly section.celkem {
        padding: 15px;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(6) {
        grid-column: 1;
        grid-row: 5;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(7) {
        grid-column: 2;
        grid-row: 5;
    }

    section.prehled.objednavka_detail:not(.obaly) table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(6)::before {
        content: 'Dodáno:';
        order: 1;

        font-size: 1rem;
        font-family: var(--font-semibold);
    }
    
    section.prehled.objednavka_detail table.polozky tr td p:not(:first-of-type),
    section.prehled.objednavka_detail table.polozky tr td:nth-of-type(5) p {
        text-align: right;
        padding: 0 0 0 20px;
    }

    section.prehled.objednavka_detail table.polozky tr td:nth-of-type(5) p {
        height: 100%;
        display: flex;
        align-items: center;
    }

    section.prehled.objednavka_detail table.polozky tr.cena td {
        width: 100%;
    }

    section.prehled.objednavka_detail table.polozky tr.cena div.tabulka_cena {
        margin: 0;
        width: 100%;
        justify-content: space-between;
        padding: 10px 20px;
    }

    section.prehled.objednavka_detail table.polozky tr.cena {
        display: flex;
        flex-direction: row;
        transform: translateY(0px);
        justify-content: center
    }

    section.prehled.objednavka_detail table.polozky tr.cena td:not(.tabulka_cena) {
        display: none;
    }

    section.prehled table.polozky tr.cena td.tabulka_cena div.col_flex {
        height: 100%;
        justify-content: space-between;
    }

    section.prehled.objednavka_detail table.polozky tr.cena td:not(.tabulka_cena) {
        padding: 0;
    }

    section.prehled.objednavka_detail table.polozky tr.cena td.tabulka_cena {
        width: max(230px, 50%);
        padding-block: 15px;
    }

    section.prehled.objednavka_detail table.polozky tr.cena td.tabulka_cena.end {
        width: max(130px, 20%);
        padding-block: 15px;

    }

    section.prehled.objednavka_detail section.wrap_table {
        overflow-x: unset;
    }


    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type, :nth-of-type(2)) {
        margin-top: 15px;
    }

    section.prehled.objednavka_detail table.polozky tr:not(:first-of-type) {
        min-height: 0px;
        height: fit-content;
    }


    section.prehled.objednavka_detail,
    .objednavka.vychystani div.flex.vychystani {
        width: min(500px, 100%);
        margin: auto;
        margin-top: 30px;

    }

    .objednavka.vychystani div.flex.vychystani {
        margin-top: 0px;
    }

    .objednavka.vychystani div.flex.vychystani section.obaly {
        width: 100%;

        margin-bottom: 30px;
    }

    section.obaly {
        margin-inline: auto;
    }

    section.objednavka_form .vyhledat {
        width: min(500px, 100%);
        margin-inline: auto;


    }

    section.prehled.objednavka_detail table.polozky tr:first-of-type {
        display: none;
    }


    section.obaly.objednavka_detail div.obaly {
        display: flex;
        flex-direction: column;
        gap: 25px;
    }

    section.obaly.objednavka_detail {
        width: min(500px, 100%);
        margin-inline: auto;
    }

    section.obaly.objednavka_detail div.obaly span {
        width: min(100%, 10rem);
        display: flex;
        justify-content: space-between;
    }

    section.obaly.objednavka_detail div.obaly span:last-of-type {
        padding-right: 0px;
    }


}

@media screen and (max-width:580px) {
    section.prehled.objednavka_detail table.polozky tr.cena td span {
        font-size: .8rem;
    }
}

@media screen and (max-width:450px) {
    section.objednavka_form {
        padding: 20px 15px;
    }
    section.prehled.objednavka_detail table.polozky tr.cena div.tabulka_cena {
        padding: 10px;
        gap: 10px;
    }

    /* section.prehled.objednavka_detail table.polozky tr td p {
        font-size: .95rem;
    } */

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) {
        padding: 15px 15px;
    }
}


@media screen and (max-width:420px) {
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) {
        display: flex;
        flex-direction: column;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(5),
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(7) {
        padding-top: 0px;
    }

    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(4),
    section.prehled.objednavka_detail table.polozky tr:not(.cena, :first-of-type) td:nth-of-type(6) {
        padding-top: 35px;
    }

}



/* BLOG */

section.blog_img {
    position: absolute;
    top:0;
    left:0;
    width: 100vw;
    height: clamp(200px, 19vw, 350px);

    background: url('../website/images/titulka/titulka.webp') center/cover no-repeat;
}

body.bg:has(section.blog) {
    background-color: #FFFFFF;
}

section.blog{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(30px, 4vw, 60px);
    position: relative;
    justify-content: flex-start;

    margin-top: calc(clamp(200px, 19vw, 350px) - 100px);

    width: var(--min_width);
    margin-inline: auto;
}


section.blog > h1 {
    width: 100%;
    text-align: left;
    grid-column: 1/-1;
    font-family: var(--font-extrabold);
    font-size: clamp(2.3rem, 3.5vw, 3.2rem);
    color: var(--text);

}

section.blog div.paging {
    grid-column: 1/-1;
}

a.blog_clanek {
    width: 100%;
    display: grid;
    grid-template-rows: 2fr 3fr;
    background: #F8F5EC 0% 0% no-repeat padding-box;
    border-radius: 6px;
    min-height: 300px;
}

a.blog_clanek div.img_wrap {
    width: 100%;
    height: 100%;
    border-radius: 6px;
    position: relative;
    overflow: hidden;
}

a.blog_clanek div.img_wrap span.kategorie {
    position: absolute;
    top: 0px;
    right: 35px;
    padding: 0.25rem 1rem;
    border: 0.5px solid var(--druha_barva);
    border-radius: 0px 0px 6px 6px;

    background-color: #FFC702;
    color: var(--druha_barva);
    font-family: var(--font-semibold);
    font-size: .95rem;
    z-index: 3;

}

a.blog_clanek div.img_wrap > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top:0px;
    left:0px;
    border-radius: 6px;
    transition: all .3s ease-in-out;
    z-index: 2;
}

a.blog_clanek:hover div.img_wrap > img {
    transform-origin: center;
    transform: scale(1.1);
}

a.blog_clanek section.popisek {
    padding: 35px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

a.blog_clanek section.popisek span.date {
    font-size: 1rem !important;
}

a.blog_clanek section.popisek h2,
a.blog_clanek section.popisek span.more {
    color: var(--text);
    font-family: var(--font-bold);
    font-size: 1.3rem;
    line-height: 1.5em;
    transition: .125s ease-in-out all;
    margin: 0;
}


a.blog_clanek section.popisek span.btn {
    margin-top: auto;
}

a.blog_clanek:hover section.popisek h2 {
    text-decoration-color: transparent;
}

a.blog_clanek:hover section.popisek span.btn {
    background-color: var(--druha_hover);
    border-color: var(--druha_hover);
}

a.blog_clanek section.popisek span.more {
    font-size: 1.1rem;
}
a.blog_clanek section.popisek p {
    font-size: 1rem;
    line-height: 1.5em;
    margin: 10px 0 0 0;
    font-family: var(--font-medium);
    color: var(--text);
}

a.blog_clanek[data-name="Hádanka"] section.popisek p {
    overflow-wrap: anywhere;
}

@media screen and (max-width: 1250px) {
    section.blog{
        grid-template-columns: repeat(2, 1fr);
    }
}


@media screen and (max-width:920px) {
    section.blog {
        background-size: 1400px;
        background-position: top right;
    }
}


@media screen and (max-width:840px) {

    a.blog_clanek div.img_wrap {
        height: clamp(150px, 45vw, 350px);
    }
}

@media screen and (max-width:540px) {
    section.blog {
        background-size: 1100px;
        background-position: top right;
    }
}

@media screen and (max-width: 750px) {
    section.blog{
        display: flex;
        flex-direction: column;
    }

    a.blog_clanek {
        grid-template-rows: 1fr auto;
    }
}

@media screen and (max-width:400px) {
    section.blog {
        background-size: 620px;
        background-position: top right;
    }
}







/* DETAIL */

section.detail {
    max-width: 1400px;
    margin: auto;
    margin-top: 120px;
}
section.detail section.detail_grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-column-gap: clamp(40px, 6vw, 80px);
}
section.detail section.detail_grid *:not(.right) {
    grid-column: 1;
}

section.detail span.date, a.blog_clanek section.popisek span.date{
    color: #B5B5B5;
    font-family: var(--font-regular);
    font-size: 1.1rem;
    display: flex;
    gap: 10px;
    align-items: center;
}
section.detail span.date::before, a.blog_clanek section.popisek span.date::before {
    content: '';
    mask: url('../website/images/kalendar.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/kalendar.svg') center/contain no-repeat;
    background: #B5B5B5;

    
    height: 1.1em;
    aspect-ratio: 1/1;
}

section.detail section.detail_grid > a.btn-inverse {
    height: fit-content;
    flex-direction: row-reverse;
    margin-left: auto;
    grid-row: 2;
    margin-top: 50px;
    border: 1px var(--druha_barva) solid;
    padding-block: 1rem;
}

section.detail section.detail_grid > a.btn-inverse:hover {
    background-color: var(--druha_barva);
    color: white;
}

section.detail section.detail_grid .right {
    grid-column: 2;
}
section.detail section.detail_grid section.clanek section.clanek_obsah {
    padding: 1.5rem 2.5rem;
}
section.detail section.detail_grid section.clanek {
    overflow: hidden;
    box-shadow: 0px 16px 40px #B4B4B433;
    border-radius: 5px;
    background: white;
}
section.detail section.detail_grid a.btn {
    margin: auto;
    margin-block: 25px;
    font-size: 1.25rem;
    padding: 1rem 2.5rem;
}
section.detail section.detail_grid section.clanky-nav {
    grid-row: 3;
    padding: 0px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

section.detail section.detail_grid section.clanek section.clanek_obsah img {
    border-radius: 15px;
    width: 100%;
    object-fit: contain;
}
section.detail section.detail_grid section.clanek > img {
    width: 100%;
    object-fit: cover;
    object-position: center;
    max-height: 400px;
}

section.detail section.detail_grid section.clanky-nav .btn-inverse {
    border: 0px;
    box-shadow: 0px 16px 40px #B4B4B433;
    border-radius: 5px;
    background: white;
    width: 100%;
    color: var(--text);
    text-align: left;
    display: grid;
    grid-template-columns: 1fr 1.05em;
    gap: 5px
}

section.detail section.detail_grid section.clanky-nav .btn-inverse.active,
section.detail section.detail_grid section.clanky-nav .btn-inverse:hover {
    background: var(--druha_barva);
    color: white;

}
section.detail section.detail_grid section.clanky-nav .btn-inverse::after {
    content: '';
    display: block;
    width: 100%;
    aspect-ratio: 1/1;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: all .3s ease-in-out;
    align-self: center;
    transform-origin: center;
    transform: rotate(-90deg);
    mask: url('../website/images/cta_sipka.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/cta_sipka.svg') center/contain no-repeat;
    background-color: var(--druha_barva);


}

section.detail section.detail_grid section.clanky-nav .btn-inverse.active::after ,
section.detail section.detail_grid section.clanky-nav .btn-inverse:hover::after {
    background: white;
    transform: rotate(90deg);


}


section.detail section.detail_grid > .btn {
    padding-inline: 2rem;
}

section.detail section.detail_grid h1 {
    margin-top: 30px;
    margin-bottom: 60px;
}

section.detail section.detail_grid section.clanek section.clanek_obsah p,
section.detail section.detail_grid section.clanek section.clanek_obsah p span,
section.detail section.detail_grid section.clanek section.clanek_obsah li {
    margin: 0;
    font-family: var(--font-medium);
    font-weight: normal;
    font-size: 1rem;
    line-height: 1.75em;
    margin-bottom: 30px;
}

section.detail section.detail_grid section.clanek section.clanek_obsah li {
    margin-bottom: 5px;
}

section.detail section.detail_grid section.clanek section.clanek_obsah ul {
    margin-block: 30px;
    padding-left: 35px;

}

section.detail section.detail_grid section.clanek section.clanek_obsah h2 {
    font-family: var(--font-bold);
    font-weight: normal;

    font-size: 1.5rem;
    margin-top: 30px;
}



@media screen and (max-width:800px) {
    section.detail section.detail_grid section.clanky-nav {
        display: none;
    }
    section.detail section.detail_grid > a.btn-inverse {
        grid-column: 1;
        grid-row: 1;
        margin-bottom: 30px;
        margin-top: 0px;
    }
    section.detail section.detail_grid {
        grid-template-columns: 1fr;
    }
    section.detail {
        margin-top: 60px;
    }
}
@media screen and (max-width:400px) {
    section.detail section.detail_grid section.clanek section.clanek_obsah {
        padding: 1.5rem;
    }
}

section.clanek_obsah h2 {
    font-size: 1.2rem;
    font-family: var(--font-semibold);
}


section.clanek_obsah h3 {
    font-size: 1.2rem;
    font-family: var(--font-medium);
}




/* ------- */





/* Univerzal stranka */

section.sekce section.blok.uni {
    display: block;
    margin-top: 60px;
}

section.sekce section.blok.uni > a:not(.btn, .btn-inverse) {
    margin-bottom: 1em;
    display: block;
}

section.sekce section.blok.uni a:not(.btn, .btn-inverse) {
    word-break: break-word;

}

section.sekce section.blok.uni h2 {
    margin-bottom: clamp(20px, 2vw, 40px);
    margin-top: 0px;
}

section.sekce section.blok.uni li {
    font-family: var(--font-book);
    font-size: 1.1rem;
    color: var(--text);
    line-height: 1.5em;
    margin-top: 0;
}

section.sekce section.blok.uni ol {
    list-style: custom-letters-small;

}




/* ----- */



/*TEXTY */

section.tit h1 {
    color: var(--tit_h1);
    font-family: var(--font-bold);
    font-size: clamp(2.5rem, 5vw, 4.8rem);
    text-align: left;
    margin-bottom: 0;
    line-height: 1.15em;
    z-index: 1;
}

@media screen and (max-width:400px) {
    section.tit h1 {
        font-size: 2rem;
    }
}



section.tit span {
    font-size: clamp(1.2rem, 1.5vw, 1.5rem);
    font-family: var(--font-book);
    color: #F8F8F8;

    
}

section.tit p {
    /* color: var(--tit_h1); */
    line-height: 1.5em;
    font-size: clamp(1.4rem, 2vw, 1.8rem);

    color: var(--druha_barva);
    font-family: var(--font-book);
}


a:not([class]) {
    font-size: inherit;
    color: var(--odkaz);
    font-family: var(--font-semibold);
    text-decoration: underline;
    transition: 0.125s ease-in-out all;
}
a:not([class]):hover {
    text-decoration-color: transparent;
}







/*section.tit p::after, */.decor::after {
    content: '';
    display: block;
    width: 70px;
    height: 5px;
    background-color: var(--druha_barva);
    position: relative;
    bottom: -50px;
    left: 0;
}
/*

section.tit p {
    padding-left: calc(clamp(25px, 3vw, 50px) + 20px);

}
section.tit p::after {
    bottom: 50%;
    height: 2px;
    width: clamp(25px, 3vw, 50px);
    left: calc((clamp(25px, 3vw, 50px) + 20px )* -1)
}*/



p {
    color: var(--text);
    font-family: var(--font-semibold);
    font-size: clamp(1rem, 1.5vw, 1.1rem);
    line-height: 1.5em;
}
span {
    color: var(--text);
    font-size: 1.1rem;
}
b{ 
    font-weight: normal;
    font-family: var(--font-bold);
    font-size: inherit;
}


section.tit h1 span {
    color: var(--tit_h1_in);
    font-size: 1.1em;
    font-family: inherit;
}

h1 span {
    color: var(--druha_barva);
    font-family: inherit;
    font-size: 1.25rem;
    display: block;
}

section.tit h3 {
    font-family: var(--font-book);
    color: white;
    font-size: clamp(1rem, 1.2vw,1.5rem);
    padding-block: 15px;
}




h3 a {
    color: var(--hlavni_barva);
    text-decoration: underline !important;
    transition: all .2s ease-in-out;

}

h3 a:hover {
    filter: brightness(.7);
    text-decoration: none !important;
}

h1 {
    color: var(--nadpisy);
    font-family: var(--font-semibold);
    font-size: clamp(1.9rem, 3.2vw, 2.75rem);
    /* margin: 0 0 clamp(4rem, 7vw, 6rem) 0;   */
    margin: 0 0 10px 0;  
    position: relative;
    line-height: 1.15em;
}


h1.empty {
    width: 100%;
    text-align: center;
    grid-column: 1/-1;
    color: #adadad;
}

h2 {
    font-family: var(--font-medium);
    color: var(--nadpisy);
    font-size: clamp(1.2rem, 2vw, 1.8rem);
    margin: 55px 0 1rem 0;  
}
h3{
    font-family: var(--font-semibold);
    font-size: clamp(1.2rem, 2.2vw, 1.6rem);
    color: var(--nadpisy);
    font-weight: normal;

}
h1 ~ h3 {
    line-height: 1.75rem;
    font-family: var(--font-book);
    margin-bottom: 30px;
}
h4{
    font-family: var(--font-medium);
    font-size: clamp(1rem,1.2vw, 1.4rem);
    color: var(--text);
    margin-top: 40px;
    margin-bottom: 0;
}

section.tit p, .decor {
    position: relative;
    padding-bottom: clamp(20px, 3vw, 50px);
}


.decor.center {
    padding-bottom: 50px;
}

.margin-bottom {
    margin-bottom: clamp(30px, 7vw, 50px);
}

.center {
    text-align: center;
    padding-inline: var(--padding);
    width: 100%;
    display: inline-block;
}


.decor.center::after {
    left: 50%;
    bottom: -25px;
    transform: translateX(-50%);
}


/* rest */


input, textarea, select {
    padding: 22px;
    border-radius: 3px;
    border-width: 1px;
    width: 100%;
    color: var(--text);
    cursor: pointer;

}
textarea {
    resize: vertical;
    min-height: 130px;
}

/* ----- */







/* FOOTER */

footer{
    padding-inline: var(--padding);

    margin-top: clamp(50px, 11vw, 200px);
    padding-bottom: 75px;
}

footer .foot_wrap {
    width: var(--min_width);
    margin-inline: auto;

    display: grid;
    gap: 10px;
    grid-template-columns: 1fr 1fr 2fr;

}

footer h2 {
    font-size: .95rem;
    font-family: var(--font-semibold);
    color: var(--text);
    margin-top: 0px;
    padding-top: clamp(30px, 3.5vw, 47px);
    margin-bottom: clamp(18px, 2.3vw, 28px);
}

footer a.ico {
    font-size: 1.1rem;
    font-family: var(--font-semibold);
    color: var(--text);
    margin-bottom: 5px;
}

footer a:not([class]) {
    font-size: .95rem;
    font-family: var(--font-regular);
    color: var(--text);
    text-decoration-color: transparent;
    transition: all .3s ease-in-out;
    width: fit-content;
}

footer a:not([class]):hover {
    text-decoration-color: var(--text);
}

footer section.foot_kontakt,
footer section.foot_onas {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

footer section.ucet {
    background: var(--druha_barva) 0% 0% no-repeat padding-box;
    border-radius: 11px;
    padding-inline: clamp(40px, 3.5vw, 59px);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0px clamp(40px, 5vw, 80px);
    padding-bottom: clamp(40px, 3.5vw, 56px);
}

footer section.ucet img {
    grid-column: 2;
    grid-row: 1/4;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    padding-top: clamp(30px, 3.5vw, 47px);
}

footer section.ucet h2,
footer section.ucet p,
footer section.ucet p a {
    color: white;

}

footer section.ucet .btn {
    background: white;
    color: var(--druha_barva);
    width: min(200px, 100%);
    text-align: center;
    display: block;
    padding-block: 15px;
}

footer section.ucet p,
footer section.ucet p a {
    font-family: var(--font-semibold);
    font-size: .95rem;
}

footer section.ucet p a {
    text-decoration: underline;
    transition: all .3s ease-in-out;

}

footer section.ucet p a:hover {
    text-decoration-color: transparent;
}


footer div.soc {
    display: flex;
    flex-direction: row;
    gap: 7px;
    
}


.ico {
    color: inherit;
    font: inherit;

    display: flex;
    flex-direction: row;
    gap:20px;
    width: fit-content;
    transition: all .3s ease-in-out;
    width: fit-content;
}
a.ico {
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-decoration-color: transparent;

    text-underline-offset: 12px;
}
footer section.kontakty a:hover,
a.ico:hover {
    text-decoration-color: var(--text);

    text-underline-offset: 4px;
    transition: all .3s ease-in-out;
}

p > .ico {
    display: inline-flex;
    width: fit-content;
    align-items: baseline;
    gap:10px;
    font-family: inherit;
}

p > .ico::before {
    align-self: center;
}




.ico::before,
section.telefon p::before {
    content: '';
    background: var(--text);
    width: 1em;
    aspect-ratio: 1/1;
}

.ico.tel::before {
    mask: url('../website/images/titulka/ikona_telefon.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/titulka/ikona_telefon.svg') center/contain no-repeat;
    width: 1em;
}
.ico.mail::before {
    mask: url('../website/images/titulka/ikona_mail.svg') center/contain no-repeat;
    -webkit-mask: url('../website/images/titulka/ikona_mail.svg') center/contain no-repeat;
    width: 1em;
}

.ico.addr::before {
    mask: url('../img/ikona_adresa.svg') center/contain no-repeat;
    -webkit-mask: url('../img/ikona_adresa.svg') center/contain no-repeat;
    width: 1em;
}




footer div.soc a,
.preload div{
    width: 42px;
    height: 42px;
    background: center/contain no-repeat;
    display: block;
    transition: all .3s ease-in-out;
    cursor: pointer;
}
footer div.soc a:hover {
    transform-origin: center;
    transform: scale(1.1);
}

footer div.soc a.fb {
    background-image: url('../website/images/titulka/ss/facebook_b.svg');
}
footer div.soc a:hover.fb,
.preload div.fb {
    background-image: url('../website/images/titulka/ss/facebook_a.svg');
}

footer div.soc a.ig {
    background-image: url('../website/images/titulka/ss/instagram_b.svg');
}
footer div.soc a:hover.ig,
.preload div.ig {
    background-image: url('../website/images/titulka/ss/instagram_a.svg');
}

footer div.soc a.yt {
    background-image: url('../website/images/titulka/ss/youtube_b.svg');
}
footer div.soc a:hover.yt,
.preload div.yt {
    background-image: url('../website/images/titulka/ss/youtube_a.svg');
}


@media screen and (max-width:1230px) {
    footer .foot_wrap {
        grid-template-columns: 1fr 1fr;
        width: min(660px, 100%);
        gap: 40px 10px;

    }
    footer section.ucet {
        grid-column: span 2;
        width: 100%;
    }
}

@media screen and (max-width:580px) {
    footer .foot_wrap {
        grid-template-columns: 1fr;
    }

    footer .foot_wrap h2 {
        padding-top: 0px;
    }

    footer section.ucet {
        grid-column: span 1;
        padding-top: 30px;

    }
}


@media screen and (max-width:510px) {
    footer section.ucet {
        grid-template-columns: 1fr;
        width: fit-content;
    }

    footer section.ucet img {
        grid-column: 1;
        grid-row: 2;
        width: min(220px, 100%);
        height: auto;
        padding-top: 0px;
        padding-bottom: 30px;
    }
}

/* meho podpisy */

p.autor {
    position: relative;
    width: fit-content;
    font-size: 17px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 0;
    color: var(--meho_c);
    font-family: var(--font-book);
    text-decoration: none;
    margin-bottom: 10px;
    align-items: flex-start;
    width: 100%;
}

a.meho {
    /* padding: 0.4rem 0 0.4rem 0rem; */
    transition: 0.3s all ease-in;
    text-align: right;
    font-size: .9rem;
    line-height: 15px;
    display: flex;
    align-items: center;
    border-radius: 3px;
    color: var(--meho_c);
    font-family: var(--font-book);

    align-items: baseline;
    /* opacity: 55%; */

}

a.meho span {
    transition: 0.3s all ease-in;
    font-size: .9rem;
    line-height: 15px;
    color: var(--meho_c);
}
a.meho span.dia, a.meho span.me {
    position: relative;
    width: 0px;
    left: 0;
    bottom: 0;
    display: inline-block;
    overflow: hidden;
}
p.autor:hover{
    text-decoration: none;

}
a.meho:hover {
    background: #1DB094;
    color: #D7DF21;
    padding: 0.4rem 1rem;
    opacity: 100%;

}
a.meho:hover span.mh {
    color: white;
}
a.meho:hover span.dia {
    width: 25px;
    text-align: left;
    color: white;
}
a.meho:hover span.me {
    width: 40px;
    text-align: left;
    color: #D7DF21;
}

/* V2 */



footer p.meho {
    box-sizing: border-box;
    text-align: center;
    font-family: var(--font-book);
    font-size: .9rem;
    width: fit-content;
    color: var(--text_footer);
    text-decoration: none;

    justify-content: center;
    color: var(--druha_barva);
    margin: 0;
}


footer p.meho span {
    font-size: .9rem;
    color: var(--text_footer);
    font-family: var(--font-book);
}



/* podpis kontakt */

p.autor.kontakt {
    justify-content: flex-end;
    max-width: var(--web_max_w);
    margin: auto;
    padding-inline: var(--padding);
    bottom: 50px;
    left: 0px;
    position: absolute;
    color: rgba(255, 255, 255, 0.5);
    overflow: visible;
}


@media screen and (max-width:1150px) {
    *{
        --padding: 6vw;
    }

}



*{
    --dropdown_menu_trigger: 768px; /* SPAROVANE S JS -> JEN V PX!*/
}

@media (max-width: 768px) { /* MUSI BYT STEJNE JAKO  --dropdown_menu_trigger */

    header {
        -webkit-transition: all var(--menu_open_time) ease-in-out;
        -moz-transition: all var(--menu_open_time) ease-in-out;
        -o-transition: all var(--menu_open_time) ease-in-out;
        transition: all var(--menu_open_time) ease-in-out;
        transition-delay: background-color var(--menu_open_time);
        /* background: var(--header_bg_full); */
        height: var(--header_mobile_height);
        /* margin-top: 61px; */
        /* padding-block: 20px; */
        /* padding-top: 40px; */
        padding-block: 18px 22px;
        padding-right: calc(60px + var(--padding));
    }

    header.full_open {
        /* padding-top: 20px; */
    }


    header a.kosik {
        margin-top: 10px;
    }

    header a.logo img {
        padding-block: 0px;
    }

    .menu {
        position: absolute;
        box-sizing: border-box;
        top: var(--header_mobile_height);
        left:0;
        width: 100%;
        overflow: hidden;
        padding: 0;
        padding-inline: 0;
        max-height: 0vw;
        background: var(--header_mobile_open);

        -webkit-transition: all var(--menu_open_time) ease-in-out;
        -moz-transition: all var(--menu_open_time) ease-in-out;
        -o-transition: all var(--menu_open_time) ease-in-out;
        transition: all var(--menu_open_time) ease-in-out;


        flex-direction: column-reverse;
    }

    header div.uzivatel {
        justify-content: flex-end;
    }

    
    .menu > ul {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 2vw;
        align-items: flex-end;
        box-shadow: none;


    }

    .menu > ul li a:hover, .menu > ul li > a.active  {
        text-decoration: none;
        color: var(--textmenuhover);
    }


    .menu > ul > li {
        display:grid;
        justify-items: end

    }
    .menu ul li.sipka_dolu {
        position: relative;
        display: grid;
        /* padding-right: calc(min(1.6vw, 2rem) + 20px); */
        margin-right: 0;
        gap: 0px;
    }

    .menu ul li.sipka_dolu > a {
        margin:0;
        margin-left: 0;
        margin-right: 30px;
    }

    .menu ul li.sipka_dolu::after {
        position: absolute;
        top: 30px;
        right: min(1.5vw, 1.5rem);
        pointer-events: all;
        cursor: pointer;
        
    }

    .menu ul li > ul {
        position: relative; 
        display: none;
        top:1rem;
        left: 0;
        background-color: transparent;
        transform: none;
        opacity: 1;
        box-shadow: none;
        gap: 0px;
        padding: 0;

        width: 100%;
        padding-top: 0;
        align-items: flex-end;
        max-height: 0px;
        display: flex;
        flex-direction: column;



        transition: all .3s ease-in-out;
    }

    .menu ul li > ul > li{
        justify-content: flex-start;
    }

    .menu ul li > ul > li {
        padding-inline: 0;
        width: min(320px, 100%);
    }
    .menu ul li > ul > li > a{
        font-size: 1rem;
        padding: 10px;
    }

    .menu ul li > ul > li > a::after, section.nabidka ul.menu > li > a::after {
        width: 20px;
        height: 20px;
        min-width: 20px;
        min-height: 20px;
    }

    /* .menu > ul > li > ul > li > a {
        margin-bottom: 0;
        color: var(--textmenu);
        text-align: left;
        font-size: .9rem;
        padding-bottom: .4rem;
        padding-left: .5rem;
        border-bottom: 1px solid white;
        width:100%;

        grid-template-rows: auto;
        grid-column: 1;
        grid-row: 1;
        grid-template-columns: auto 80px;
        justify-content: space-between;
    } */
    .menu > ul > li > ul > li > a::before {
        grid-column: 2;
        grid-row: 1;
        aspect-ratio: 2/1;
        opacity: 100% !important;
        /* background-color: #4d5d65 !important; */
    }

    .menu > ul > li > a {
        text-align: right;
        border-radius: .4rem 0 0 .4rem;
        box-shadow: -10px 5px 30px #0000002a; 


    }

    .menu_open {
        display: block;
        position: absolute;
        top: 35px;
        right: min(5.2vw, 104px);
        height: 25px;
        width: 28.8px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        cursor: pointer
    }

    .menu_open div{
        box-sizing: border-box;
        width: 100%;
        border-bottom: var(--menu_open_bg) solid clamp(1px,.8vw, 3px);
        transition: all .4s;


    }


    header.podstranka .menu_open div{
        border-bottom: white solid clamp(1px,.8vw, 3px);
        outline: 1px solid rgb(141, 141, 141);
        transition: all .4s;
        

    }

    header.full .menu_open div, header.full_open .menu_open div{
        border-bottom: var(--menu_open_bg) solid clamp(1px,.8vw, 3px);
        outline: 0px solid rgb(141, 141, 141);
        transition: all .4s;
        

    }


    
    @keyframes rot {
        from {transform: rotate(0deg)}
        to {transform: rotate(360deg)}
    }

    @keyframes caraFadeOff {
        from {width: 100%}
        to {width: 0}

    }

    @keyframes caraFadeIn {
        from {width: 0}
        to {width: 100%}

    }

    .carRot {
        animation-name: rot;
        animation-duration: 1.4s;
    }



    .menu.visible {
        max-height: calc(100vh - var(--header_mobile_height));
        /* overflow-y: auto; */
        padding-bottom: 3rem;
        padding-top: min(3.2rem, 3vw);
        
    }

    .menu ul li.active > ul {
        height: fit-content;
        box-shadow: none;
        border: 0px;
        padding: 0;
        margin-top: 15px;
        gap: 10px;
        
    }

    /* nastaveni menu stranky*/
    /* .menu ul li > ul.visible {
        gap:0;
    } */

    /* .menu > ul > li > ul > li > a {
        padding-block: 15px;
        border-bottom: 1px solid #D9D9D9;
        align-items: center;
        flex-direction: row
    } */
    /* .menu > ul > li > ul > li:first-of-type > a {
        border-top: 1px solid #D9D9D9;
    } */

    /* .menu > ul > li > ul > li:last-of-type > a {
        margin-bottom: 35px
    } */


    header .menu > * {
        padding-inline: var(--padding) !important
    }

    .menu > ul {
        gap: 0;
        overflow-y: auto;
    }

    .menu > ul > li {
        width: 100%;
        /* border-bottom: 1px solid white; */


    }

    /* .menu ul li.sipka_dolu a:not([href]), .menu ul li.sipka_dolu a[href=""] {
        pointer-events: none;
    
    } */

    .menu > ul > li > a {
        text-align: left;
        /* width: 100%; */
        box-shadow: none;
        background: transparent;
        text-decoration: none !important;
        padding-block: 1rem;
        border-radius: 0;
        display: flex;
        gap:14px;
        justify-content: flex-end;
        position: relative;
        align-items: center;
    }
    /* .menu > ul > li > a::after {
        content: '';
        background-image: url('../img/ikona_sipka_45x45_default.svg');
        background-repeat: no-repeat;
        height: 1.3em;
        aspect-ratio: 1/1;
        transition: all .3s ease-in-out;
    } */

    .menu > ul > li > a:hover::after,
    .menu > ul > li > a:active::after {
        /* background-image: url('../img/ikona_sipka_45x45_hover.svg'); */
    }


    .menu > ul > li > a.active::before {
        display: none;
    }

    header a.logo img.full {
        display: block;
    }



    header div.uzivatel_login {
        width: fit-content;
        margin-left: auto;
    }



    /* ----- */




    header a.tel {
        display: none;
    }


    section.text_pozadi:first-of-type {
        margin-top: 0px;
    }

    section.text_pozadi:not(:last-of-type) {
        margin-bottom: 50px;
    }


    main.kontakt {

        padding-top: 150px;
    }


    main {
        padding: 40px var(--padding) 100px var(--padding);
    }
    
    .menu ul li > ul > li > a::after {
        /* display: none; */
    }

    .menu ul li > ul > li > a.active,
    .menu ul li > ul > li:hover > a {
        color: var(--textmenu);
    }


}

@media (min-width: 769px) {  /* --dropdown_menu_trigger + 1 px */

    header.full_open a.logo {
        height: var(--header_logo_height-full);
    }

    section.tit > a:hover{
        max-width: 450px;
        background-color: white;
    
    }

    

    header.full_open .menu, header.full_open div.soc {
        /* padding-top: 25px; */
        /* padding-bottom: 15px; */
    }
    header.full_open a.tel {
        margin-top: calc(13px + clamp(15px, 1.3vw,20px));
        backdrop-filter: blur(0px) brightness(1.8);
        -webkit-backdrop-filter: blur(0px) brightness(1.8);
    }


    




/*
    
    .menu ul li > ul > li:hover > a::before, .menu ul li > ul > li > a.active::before {
        background:  var(--menu_dropdown_icon_hover);
        opacity: 100%;
        transform: translateX(4px);
    }*/
/*
    .menu ul li > ul > li:hover > a.active::before {
        background:  var(--menu_dropdown_icon);
    }
*/
    .menu ul li > ul > li:hover > a.active {
        text-decoration: none;
    }
    
    .menu ul li > ul > li:hover > a, .menu ul li > ul > li > a.active{
        /* text-decoration: underline; */
    }
/*
    .menu ul li > ul > li > a:hover{
        font-weight: normal;
    }
    
    .menu ul li > ul > li:nth-child(odd) {
        border-right: 1px solid var(--menu_dropdown_line_color);
    }

    .menu ul li > ul {
        border: 1px solid var(--menu_dropdown_line_color);
    }

    .menu ul li > ul > li{
        border-bottom: 1px solid var(--menu_dropdown_line_color);
    }

    .menu ul li > ul > li:last-of-type,
    .menu ul li > ul > li:not(:nth-child(even)):nth-last-of-type(2) {
        border-bottom: 0px solid var(--menu_dropdown_line_color);
    }
    


    .menu > ul > li:last-child {
        padding-right: 0;
    }*/
}


/* tit foto */
@media screen and (max-width: 600px) {
    section.tit div.obsah > img {
        display: none;
        visibility: hidden;
        opacity: 0;
    }

    section.tit div.obsah > img.tablet, section.tit div.obsah > img.mobile {
        display: block;
        visibility: visible;
        opacity: 1;
        object-fit: cover;
        width: 100%;
        object-position: center;
    }


    section.tit:not(.podstranka) > div.obsah {
        aspect-ratio: 4/5;
        min-height: 510px;
        justify-content: flex-start;
        padding-block: calc(var(--padding) *2 + 30px);
    
    } 
}



/* SUBMENU IKONY */


    
.menu ul li > ul > li > a::before,
section.nabidka ul.menu > li > a::before{
    content: '';
    width: 12px;
    height: 7px;
    min-width: 12px;
    min-height: 7px;
    position: relative;
    -webkit-mask-size: contain;
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;


    background-color:  var(--menu_dropdown_icon);

    transition: all .3s ease-in-out; 

    mask-image: url('../website/images/cta_sipka.svg');
    -webkit-mask-image: url('../website/images/cta_sipka.svg');
    transform-origin: center;
    transform: rotate(-90deg);
    margin-left: auto;
}


.menu ul li > ul > li > a::after,
section.nabidka ul.menu > li > a::after {
    content: '';
    width: 30px;
    height: 30px;
    min-width: 30px;
    min-height: 30px;

    position: relative;

    background: grey center/contain no-repeat;
    border-radius: 30px;

    transition: all .3s ease-in-out; 
}

.menu ul li > ul > li > a[name="bedýnky"]::after,
section.nabidka ul.menu > li > a[name="bedýnky"]::after {
    background-image: url('../website/images/webp_kategorie/foto_bedynky.webp');
}

.menu ul li > ul > li > a[name="bylinky"]::after,
section.nabidka ul.menu > li > a[name="bylinky"]::after {
    background-image: url('../website/images/webp_kategorie/foto_bylinky.webp');
}

.menu ul li > ul > li > a[name="exotické plody"]::after,
section.nabidka ul.menu > li > a[name="exotické plody"]::after {
    background-image: url('../website/images/webp_kategorie/foto_exoticke_plody.webp');
}

.menu ul li > ul > li > a[name="houby"]::after,
section.nabidka ul.menu > li > a[name="houby"]::after {
    background-image: url('../website/images/webp_kategorie/foto_houby.webp');
}

.menu ul li > ul > li > a[name="klíčky"]::after,
section.nabidka ul.menu > li > a[name="klíčky"]::after {
    background-image: url('../website/images/webp_kategorie/foto_klicky.webp');
}

.menu ul li > ul > li > a[name="ovoce"]::after,
section.nabidka ul.menu > li > a[name="ovoce"]::after {
    background-image: url('../website/images/webp_kategorie/foto_ovoce.webp');
}

.menu ul li > ul > li > a[name="pyré"]::after,
section.nabidka ul.menu > li > a[name="pyré"]::after {
    background-image: url('../website/images/webp_kategorie/foto_pyre.webp');
}

.menu ul li > ul > li > a[name="saláty"]::after,
section.nabidka ul.menu > li > a[name="saláty"]::after {
    background-image: url('../website/images/webp_kategorie/foto_salat.webp');
}

.menu ul li > ul > li > a[name="vejce"]::after,
section.nabidka ul.menu > li > a[name="vejce"]::after {
    background-image: url('../website/images/webp_kategorie/foto_vejce.webp');
}

.menu ul li > ul > li > a[name="zelenina"]::after,
section.nabidka ul.menu > li > a[name="zelenina"]::after {
    background-image: url('../website/images/webp_kategorie/foto_zelenina.webp');
}



/* --- */





.preload, .preload * {
    position: absolute;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    height: 0;
    width: 0;
    top: 0;
    left: 0;
    z-index: -100;
    width: 100px;
    height: 100px;
}

.captcha {
    width: 240px;
}


.mt1 {
    margin-top: 1rem;
}
.mt2 {
    margin-top: 2rem;
}


footer p.for_cookies {
    position: absolute;
    right: 0;
    width: fit-content;
    margin-right: var(--padding);
    text-align: right;
    bottom: 0;
    margin-bottom: 10px;
    z-index: 2;
    color: var(--text);
    opacity: 55%;
    font-size: 15px;
}
@media screen and (max-width:690px) {
    footer p.for_cookies {
        position: static;
        grid-column: 1/-1;
        width: 100%;
        text-align: center;
        margin-right: 0;
        margin-bottom: 0;
    }
}


/* cookies */




.termsfeed-com---nb .cc-nb-main-container {
    padding: 1.2rem;
    font-family: var(--font2);
}

.termsfeed-com---nb-simple {
    width: 100%;
    max-width: 750px !important;
    box-shadow: 0px -2px 11px -2px rgba(0,0,0,0.64) !important;
}

.termsfeed-com---palette-light .cc-nb-text {
    font-weight: 100;
    font-size: 15px;
}

.termsfeed-com---palette-light .cc-nb-title {
    font-size: 1rem;
    margin-bottom: 0.3rem;
}

.termsfeed-com---palette-light .cc-nb-reject {
    color: #fff;
    background-color: #a8a6a6;
}
.termsfeed-com---palette-light .cc-nb-changep {
    border: 1px solid #c6c6c6;
}

.termsfeed-com---palette-light .cc-nb-okagree {
    background-color: var(--druha_barva) !important;
    color: white !important;
    min-width: 90px !important;
    border: 1px solid var(--druha_barva);
}

.termsfeed-com---palette-light .cc-nb-okagree:hover,
.termsfeed-com---palette-light .cc-cp-foot-save:hover {
    background-color: var(--druha_hover) !important;
}

.termsfeed-com---palette-light .cc-cp-foot-save {
    background-color: var(--druha_barva) !important;
    color: white !important;
    border: 1px solid var(--druha_barva);
}
.termsfeed-com---palette-light .cc-pc-head-title-headline {
   display: none;
}
.termsfeed-com---palette-light .cc-pc-head-close:active, .termsfeed-com---palette-light .cc-pc-head-close:focus {
    border: none !important;
}
.termsfeed-com---pc-dialog .cc-cp-body-content-entry-text {
    font-size: 15px;
    line-height: 1.4;
}
.termsfeed-com---pc-overlay {
    overflow-y: scroll;
}

.cc-custom-checkbox input {
    width: inherit;
}

.termsfeed-com---palette-light .cc-pc-head-lang select {
    font-size: 16px;
    padding-left: 2rem;
}
.termsfeed-com---palette-light .cc-pc-head-lang select option {
    font-size: 15px;
}
.termsfeed-com---palette-light .cc-pc-head-close {
    font-size: 1.2rem;
}


@media (max-width: 320px), (max-height: 480px) {
.termsfeed-com---nb-simple {
    height: auto;
}
   
}

@media (max-width: 768px){
    .termsfeed-com---nb-simple {
        width: 100%;
        max-width: unset !important;
    }
    .termsfeed-com---nb .cc-nb-main-container {
        padding: 1.5rem;
    }

}

@media (max-width: 480px) {

    .termsfeed-com---nb .cc-nb-okagree, .termsfeed-com---nb .cc-nb-reject, .termsfeed-com---nb .cc-nb-changep {
        display: block;
        width: 100%;
        max-width: 240px;
    }
    
    .termsfeed-com---nb .cc-nb-buttons-container .cc-nb-okagree {
        margin-bottom: 1rem !important;
    }
}


@media (max-width: 320px) {

.termsfeed-com---nb-simple {
    overflow: auto;
    max-width: 100%;
}

}


/*cookies*/