.container {
    max-width: 850px;
    width: 100%;
    margin: 0 auto;
}
.page-container {
    padding: 20px 0 50px;
}
header {
    background-color: #eb6428;
}
header .container {
    display: flex;
    justify-content: flex-start ;
    max-width: unset;
}
/*
header .container::before,
header .container::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background: #eb6428;
    z-index: -1;
}
header .container::after {
    left: auto;
    right: 0;
    background: #eb6428;
}
*/
header #logo {
}
header #logo svg {
    height: 70px;
    fill: white;
}
header #logo img {
    height: 70px;
}
header ul {
    position: static;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    height: 100%;
    max-width: 900px;
    margin: 0 auto;
}
header ul li {
    padding-left: 20px;
}
header ul li a,
header ul li a.menu_produkty {
    color: white;
    border-left: none;
    border-bottom: 10px solid transparent;
    transition: border-bottom-color .3s ease;
    padding: 0;
    display: block;
    text-decoration: none;
    height: 70px;
}
header ul li a:hover {
    border-bottom-color: white;
    text-decoration: none;
}
header ul li .menu_produkty {
    margin-right: 0;
}
header ul li .menu_produkty::after {
    display: none;
}

#hp .hp_kategorie {
    height: auto !important;
}

.hp_kategorie h1 {
    position: relative;
    z-index: 2;
    text-align: center;
    color: white;
    text-transform: uppercase;
    font-weight: 300;
    font-size: 56px;
    margin: 130px 0 50px;
}
.hp_kategorie h1 strong {
    font-weight: 800;
    font-size: 110px;
    text-shadow: 2px 2px 40px rgba(0, 0, 0, .8);
    display: inline-block;
    margin-bottom: 20px;
}
#hp .hp_kategorie .bg {
    top: 0;
}
#hp .hp_kategorie .bg.active {
    background-image: url(image/intro-bg.webp) !important;
}
#hp .hp_kategorie ul {
    min-height: auto;
    background: rgba(255, 255, 255, .8);
    padding: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 50px;
    width: 1260px;
    flex-wrap: wrap;
}
#hp .hp_kategorie ul li {
    float: none;
    padding: 0 25px;
    width: 290px;
    height: auto !important;
}
#hp .hp_kategorie ul li + li + li + li + li {
    margin-top: 40px;
}
/*#hp .hp_kategorie ul li + li {
    margin-left: 50px;
}*/
/*#hp .hp_kategorie ul li:last-of-type {
    display: none;
}*/
#hp .hp_kategorie ul li a::after {
    content: "";
    display: block;
    position: absolute;
    top: 36px;
    left: 0;
    width: 100%;
    height: 70px;
    background: #604696;
    z-index: -1;
}
#hp .hp_kategorie ul li a
{
    display: block;
    padding-bottom: 15px;
    color: #000;
}
#hp .hp_kategorie ul li a span.green
{
    position: absolute;
    margin-top: -20px;
}
#hp .hp_kategorie ul li a svg
{
    margin-bottom: 20px;
}
#hp .hp_kategorie ul li a span.ps:not(.green):not(.red)
{
    margin-top: 8px;
    color: #28b95a;
}
#hp .hp_kategorie .spodek {
    height: auto;
    position: relative;
    background: url(image/row-bg.png) top right no-repeat;
    background-size: cover;
    padding: 50px 0;
}
#hp .hp_kategorie .spodek .content.active {
    height: auto;
    margin-top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 850px;
    position: relative;
}
#hp .hp_kategorie .spodek .content.active::before {
    content: "";
    display: block;
    position: absolute;
    top: -20px;
    left: 50%;
    width: 1px;
    height: calc(100% + 40px);
    background: white;
}
#hp .hp_kategorie .spodek .content .button {
    background: #f26522;
    border-radius: 8px;
    box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
    width: 350px;
    position: static;
    font-size: 20px;
    line-height: 20px;
    padding: 20px 0;
    height: auto;
    margin-right: 30px;
    font-weight: 700;
}
#hp .hp_kategorie .spodek .content > div p {
    text-align: right;
}
#hp .hp_kategorie .spodek .content p:nth-of-type(1) {
    font-size: 50px;
    margin-bottom: 15px;
}
#hp .hp_kategorie .spodek .content p:nth-of-type(2) {
    color: white;
    font-size: 40px;
}

#hp .proc {
    padding: 70px 0 60px;
}
#hp .proc h2 {
    font-size: 30px;
    font-weight: 700;
    text-transform: none;
    margin: 0 0 40px;
    color: #333;
}
#hp .proc ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
#hp .proc ul li {
    max-width: 300px;
    box-shadow: 0 0 20px rgba(0, 0, 0, .2);
    float: none;
    margin-top: 0;
}
#hp .proc ul li + li {
    margin-left: 20px;
}
#hp .proc ul li::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 20%;
    width: 100%;
    background: #f1f1f1;
}
#hp .proc ul li h3 {
    margin: 20px 0;
    font-weight: 700;
}
#hp .proc ul li p {
    width: 100%;
    padding: 10px 30px 30px;
    position: relative;
    z-index: 5;
    background: #f1f1f1;
}
#hp .proc ul li img {
    margin-top: 50px;
}

footer {
    background-image: url(image/footer.webp);
    background-size: cover;
    padding: 20px 0;
}
footer ul {
    display: flex;
    justify-content: center;
    max-width: 1224px;
    margin: auto;
}
footer ul li {
    width: 50%;
    float: none;
    padding: 15px 30px;
}
footer ul li:first-of-type {
    text-align: right;
    border-right: 3px solid #28b95a;
}
footer ul li:first-of-type > p:first-of-type {
    font-size: 14px;
    font-weight: 300;
}
footer ul li:first-of-type > p:last-of-type {
    font-size: 11px;
}
footer ul li p {
    line-height: 25px;
}
footer ul li h4 {
    margin: 0 0 10px;
    font-weight: 700;
    font-size: 14px;
}
footer ul li:last-of-type a {
    text-decoration: underline;
}
footer ul li:last-of-type a:hover {
    text-decoration: none;
}
footer .copyright {
    font-size: 11px;
    font-weight: 300;
    padding-bottom: 0;
}

footer .container-footer {
    display: flex;
    justify-content: space-between;
}

footer .container-footer div {
    flex: 1;
    margin: 0 10px;
}

.container-footer-levy {
    /*padding: 10px;*/
    display: flex;
    flex-direction: column;
    gap: 10px; /* Mezery mezi odkazy */
}

.container-footer-pravy {
    padding: 10px;
}

.li-pravy .container-footer-levy {
    min-width: 200px;
}

@media (max-width: 1270px) {
    footer ul li {
        width: 100%;
    }

    .li-levy .container-footer-levy {
        flex-direction: row;
        justify-content: center; /* Mezera mezi odkazy */
    }
    .li-levy .container-footer-pravy {
        order: -1;
    }

    footer img {
        max-width: 100%;
    }
}
@media (max-width: 768px) {
    footer .container-footer {
        flex-direction: column; /* Divy se umístí pod sebe */
    }

    footer .container-footer div {
        margin: 10px 0; /* Vertikální mezera mezi divy */
    }
    .container-footer-levy {
        flex-direction: row;
        justify-content: center; /* Mezera mezi odkazy */
    }
    footer img {
        max-width: 100%;
    }
}

/* Intro Kategorie Buttons */
#hp .hp_kategorie ul li a:hover div.button {
    display: none;
}
#hp .hp_kategorie ul li a:hover span:not(.green):not(.red):not(.empty) {
    display: block;
}
/* BG ostatnich stranek */
.registration, #kontakty {
    background: url(image/detail-bg.webp) center top no-repeat;
    background-size: auto;
}

/* Detail Produktu */
#categ {
    padding: 60px 0 90px;
    background: url(image/detail-bg.webp) center top no-repeat;
    background-size: auto;
}
#categ h1, .cart-header, #kontakty h1  {
    text-align: center;
}
#categ h1 .ps {
    display: block;
    margin-top: 20px;
}
#categ .cat_top .cright .ceny {
    height: auto;
}
#categ .cat_top .cright .ceny .cen {
    text-align: center;
    width: 100%;
    padding: 20px 0 30px;
    float: none;
}
#categ .cat_top .cright .ceny .cen span {
    color: #666;
    font-size: 47px;
    text-transform: none;
    margin: 20px 0 0;
}
#categ .cat_top .cright .koupit.dis {
    background: #f26522;
}
#categ .cat_top .cleft,
#categ .cat_top .cright {
    height: auto;
}

#categ .social {
    margin: 60px 0 30px;
}
#categ .social a {
    color: #ababab;
}
#categ .social a:hover {
    text-decoration: none;
}
#categ .social [class^="flaticon-"]::before {
    font-size: 30px;
}

#categ .slova .slovo {
    border: none;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .1);
    height: 70px;
    line-height: 70px;
}
#categ .slova .slovo svg {
    margin: 20px;
}
#categ .zalozky {
    margin-top: 40px;
}
#categ .zalozky .cont {
    background:  #f7f7f7;
    padding: 30px;
}
#categ .zalozky ul.men {
    margin-bottom: 0;
}
#categ .zalozky ul.men li {
    background: transparent;
    height: 100%;
}
#categ .zalozky ul.men li.act {
    background: #f7f7f7;
    color: black;
}
#categ .zalozky ul.men li.act::after {
    display: none;
}
#kontakty .content {
    max-width: 920px;
    width: auto;
    padding: 40px;
    box-shadow: 0 0 20px rgba(0, 0, 0, .2);
    border: 1px solid #e5e5e5;
    background: #f1f1f1;
}
.ps.vic_des,
.hp_kategorie ul > li:nth-of-type(3) .ps.green {
    display: none !important;
}
.popup_kal .content {
    max-width: 800px !important;
}

#registr h2 {
    margin-top: 30px;
}

#kontakty #k_text {
    height: 200px;
    resize: vertical;
}

@media (max-width: 1400px) {
    #hp .proc ul li {
        margin-top: 20px;
    }
}

@media (max-width: 1270px) {
    header ul {
        position: absolute;
        height: auto;
        right: 0;
        width: 89%;
        z-index: 5;
        text-align: left;
        background-color: #eb6428;
        display: none;
    }
    header ul li {
        padding-right: 20px;
    }

    .hp_kategorie h1 {
        font-size: 30px;
    }
    .hp_kategorie h1 strong {
        font-size: 60px;
    }

    #hp .hp_kategorie ul {
        flex-direction: column;
        width: 80%;
    }

    #categ .cat_top .cright .sele {
        float: left;
        width: 50%;
    }
    #categ .cat_top .cright .selecty {
        min-height: 110px;
    }

    #hp .hp_kategorie ul li,
    #hp .hp_kategorie .spodek .content.active,
    #categ .slova,
    #categ .cat_top,
    #categ h1 {
        width: 100%;
    }
    #categ .zalozky{
        width: 80%;
    }
    #hp .hp_kategorie ul li + li,
    #hp .proc ul li + li {
        margin-left: 0;
        margin-top: 20px;
    }
    #hp .hp_kategorie ul li + li
    {
        margin-top: 50px;
    }
    #hp .hp_kategorie ul li > a img
    {
        display: block;
        margin: -47px auto 0;
    }
    #hp .hp_kategorie .spodek {
        padding: 50px 15px;
        background-size: cover;
    }
    #hp .hp_kategorie .spodek .content.active {
        flex-direction: column;
    }
    #hp .hp_kategorie .spodek .content.active::before,
    .page-container #content .form-container .ps.voch {
        display: none;
    }
    #hp .hp_kategorie .spodek .content .button {
        margin-top: 30px;
        margin-right: 0;
    }
    #hp .proc ul {
        flex-direction: column;
        align-items: center;
    }
    #hp .proc ul li {
        margin-left: 0;
        margin-top: 0;
    }
    footer ul {
        flex-direction: column;
        align-items: center;
    }
    footer ul li {
        text-align: center !important;
    }
    footer ul li:first-of-type {
        border-right: none;
    }
    #categ .cat_top {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    #categ .slova .slovo:first-of-type,
    #categ .slova .slovo {
        margin: 15px 5px;
        font-size: 13px;
    }
    #categ .slova .slovo svg {
        margin: 20px 10px
    }
    #categ .slova,
    #categ .cat_top .cleft .small .overflow {
        width: 80%;
    }
    #categ h1 {
        font-size: 30px;
    }
    #categ h1 .ps {
        top: auto;
        left: auto;
    }
    #categ .cat_top .cleft,
    #categ .cat_top .cright {
        width: 90%;
        float: none;
        padding: 0 30px;
        margin-right: 0;
        border: 0;
    }

    #categ .cat_top .cright .ceny {
        margin-top: 20px;
    }
    #categ .cat_top .cright .sele .but.del1 .ps.lab {
        display: none;
    }
    #categ .popup .content {
        width: calc(100% - 60px);
        top: 30px;
        left: 30px;
    }
    #categ .popup .content .obsah {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    #kontakty .content .kont_inf {
        width: 100%;
        float: none;
        padding: 0 15px;
        }
}

@media (max-width: 940px) {
    #categ .cat_top .cright .sele {
        float: none;
        width: 100%;
    }
    #categ .slova .slovo  {
        float: none;
        width: 100%;
        font-size: 16px;
    }
    #categ .slova .slovo svg {
        margin: 20px;
    }
}

@media (max-width: 576px) {
    header .container {
        height: 100%;
    }

    header .container > div {
        background-color: #eb6428;
    }
    .hp_kategorie h1 {
        font-size: 28px;
        text-shadow: 0 0 16px black;
    }
    .hp_kategorie h1 strong,
    #hp .hp_kategorie .spodek .content p:nth-of-type(1) {
        font-size: 44px;
    }
    #hp .hp_kategorie .spodek .content .button {
        width: 100%;
    }
    #hp .hp_kategorie .spodek .content p:nth-of-type(2) {
        font-size: 30px;
    }
    #hp .proc h2 {
        padding: 0 15px;
    }
    #categ .zalozky ul.men li {
        margin-right: 0;
        padding: 0 12px;
    }
    #categ .cat_top .cright .sele .deleni_lay a.change {
        position: static;
        display: block;
        text-align: center;
        margin-top: 10px;
    }
    .new_login .but{
        margin-top: 20px;
    }
    .page-container #content .form-container .table .form-group:last-of-type {
        padding-bottom: 15px;
    }
    #categ .cat_top .cright .sele .but .ps.lab {
        display: none !important;
    }
    #categ .cat_top .cright .sele .deleni_lay {
        height: auto;
    }
    .sleva_40 {
        width: auto;
    }
    .cart .price {
        padding-left: 0;
    }
    .table .row .cell {
        padding-right: 0;
    }
    .radio {
        display: block;
        margin-right: 0;
    }
    .radio .cen_dop {
        float: none;
        display: block;
        width: 100%;
        text-align: center;
        margin: 10px 0;
    }
    .radio h4 {
        display: inline-block;
        padding-top: 0;
    }
    .cart-steps h3 {
        line-height: 25px;
    }
    .page-container #content .form-container .table .error {
        bottom: 24px;
        left: 10px;
    }
    .form-group.group-inline {
        display: block;
        float: none !important;
    }
    .page-container #content .form-container .table input,
    .page-container #content .form-container input[type="submit"] {
        max-width: 100% !important;
    }

    #hp .hp_kategorie ul
    {
        padding: 20px 0;
    }
}
nav li a img { max-width: 100%; }


/* Upozorneni */
.alert {
    position: relative;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
}

.alert-heading {
    color: inherit;
}

.alert-link {
    font-weight: 700;
}

.alert-dismissible {
    padding-right: 4rem;
}

.alert-dismissible .close {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0.75rem 1.25rem;
    color: inherit;
}

.alert-primary {
    color: #004085;
    background-color: #cce5ff;
    border-color: #b8daff;
}

.alert-primary hr {
    border-top-color: #9fcdff;
}

.alert-primary .alert-link {
    color: #002752;
}

.alert-secondary {
    color: #383d41;
    background-color: #e2e3e5;
    border-color: #d6d8db;
}

.alert-secondary hr {
    border-top-color: #c8cbcf;
}

.alert-secondary .alert-link {
    color: #202326;
}

.alert-success {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.alert-success hr {
    border-top-color: #b1dfbb;
}

.alert-success .alert-link {
    color: #0b2e13;
}

.alert-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}

.alert-info hr {
    border-top-color: #abdde5;
}

.alert-info .alert-link {
    color: #062c33;
}

.alert-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

.alert-warning hr {
    border-top-color: #ffe8a1;
}

.alert-warning .alert-link {
    color: #533f03;
}

.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

.alert-danger hr {
    border-top-color: #f1b0b7;
}

.alert-danger .alert-link {
    color: #491217;
}

.alert-light {
    color: #818182;
    background-color: #fefefe;
    border-color: #fdfdfe;
}

.alert-light hr {
    border-top-color: #ececf6;
}

.alert-light .alert-link {
    color: #686868;
}

.alert-dark {
    color: #1b1e21;
    background-color: #d6d8d9;
    border-color: #c6c8ca;
}

.alert-dark hr {
    border-top-color: #b9bbbe;
}

.alert-dark .alert-link {
    color: #040505;
}