div.pFilter {
    position: absolute;
    top: 70px; /* Vzdálenost od horního okraje mapy */
    left: 55px; /* Vzdálenost od levého okraje mapy */
    z-index: 900; /* Zaručí, že bude nad mapou */
    background: rgba(255, 255, 255, 0.9);
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    width: 300px;
    height: 470px;
    padding-left: 30px;
    padding-top: 23px;
}

div.hCile {
    width: 225px;
    height: 53px;
    text-align: left;
    font: normal normal normal 44px/53px HealTheWebB;
    letter-spacing: 0px;
    color: #9FC259;
    opacity: 1;
    padding-top: 6px;
    margin-bottom: 33px;
}

div.dCile ul {
    margin: 0px;
    padding: 0px;
}

    div.dCile ul li {
        text-align: left;
        font: normal normal 300 18px/24px Inter;
        letter-spacing: 0.36px;
        color: #17253A;
        opacity: 1;
        list-style: none;
        padding: 0px;
        margin-left: 11px;
        margin-bottom: 18px;
    }

        div.dCile ul li input {
            display: none;
        }

        div.dCile ul li span label {
            padding-top: 7px;
            display: inline-block;
            cursor: pointer;
            padding-left: 55px;
            height: 32px;
        }

            div.dCile ul li span label:hover, div.dCile ul li span input:checked + label {
                text-decoration: underline;
                font: normal normal bold 18px/24px Inter;
                letter-spacing: 0.36px;
                color: #9FC259;
                opacity: 1;
            }

        div.dCile ul li span.Zoo label {
            background: transparent url('/imgs/Lion.png') 0% 0% no-repeat padding-box;
        }

            div.dCile ul li span.Zoo label:hover {
                background: transparent url('/imgs/Lion.svg') 0% 0% no-repeat padding-box;
            }

        div.dCile ul li span.Museum label {
            background: transparent url('/imgs/Museum.png') 2px 0% no-repeat padding-box;
        }

            div.dCile ul li span.Museum label:hover {
                background: transparent url('/imgs/Museum.svg') 2px 0% no-repeat padding-box;
            }

        div.dCile ul li span.Castle label {
            background: transparent url('/imgs/castle_1.png') 0% 0% no-repeat padding-box;
        }

            div.dCile ul li span.Castle label:hover {
                background: transparent url('/imgs/Castle.svg') 0% 0% no-repeat padding-box;
            }

        div.dCile ul li span.Tower label {
            background: transparent url('/imgs/tower.png') 5px 0% no-repeat padding-box;
        }

            div.dCile ul li span.Tower label:hover {
                background: transparent url('/imgs/tower.svg') 5px 0% no-repeat padding-box;
            }

        div.dCile ul li span.Playground label {
            background: transparent url('/imgs/playground.png') 0% 0% no-repeat padding-box;
        }

            div.dCile ul li span.Playground label:hover {
                background: transparent url('/imgs/playground.svg') 0% 0% no-repeat padding-box;
            }

        div.dCile ul li span.Tree label {
            background: transparent url('/imgs/tree.png') 5px 0% no-repeat padding-box;
        }

            div.dCile ul li span.Tree label:hover {
                background: transparent url('/imgs/treeS.png') 5px 0% no-repeat padding-box;
            }

        div.dCile ul li span.Zoo input:checked + label {
            background: transparent url('/imgs/Lion.svg') 0% 0% no-repeat padding-box;
        }

        div.dCile ul li span.Museum input:checked + label {
            background: transparent url('/imgs/Museum.svg') 2px 0% no-repeat padding-box;
        }

        div.dCile ul li span.Castle input:checked + label {
            background: transparent url('/imgs/Castle.svg') 0% 0% no-repeat padding-box;
        }

        div.dCile ul li span.Tower input:checked + label {
            background: transparent url('/imgs/tower.svg') 5px 0% no-repeat padding-box;
        }

        div.dCile ul li span.Playground input:checked + label {
            background: transparent url('/imgs/playground.svg') 0% 0% no-repeat padding-box;
        }

        div.dCile ul li span.Tree input:checked + label {
            background: transparent url('/imgs/treeS.png') 5px 0% no-repeat padding-box;
        }

body .leaflet-popup-content {
    position: relative;
    margin: 13px 24px 13px 20px;
    /*line-height: 1.3;*/
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    width: 219px;
    height: 410px;
}

    body .leaflet-popup-content h4 {
        text-align: left;
        font: normal normal normal 18px/28px HealTheWebB;
        letter-spacing: 0.36px;
        color: #17253A;
        opacity: 1;
        padding: 0px;
        margin: 12px 0px 0px 0px;
    }

body .leaflet-popup-content-des {
    position: relative;
    /*border: 1px solid black;*/
    height: 228px;
    padding-left: 20px;
    padding-right: 20px;
    float: none
}

body .leaflet-popup-content-wrapper, body .leaflet-popup-tip {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 12px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
}

    body .leaflet-popup-content-des a.hDetail {
        background: transparent url('/imgs/Detail.png') 0px 0px no-repeat padding-box;
        position: absolute;
        display: block;
        width: 71px;
        height: 16px;
        /*border: 1px solid red;*/
        bottom: 24px;
        left: 20px;
    }

body .leaflet-popup-content-des #detCile {
    background-color: #FFF;
}

    body .leaflet-popup-content-des #detCile::after {
        font: normal normal 300 13px/18px Inter;
        letter-spacing: 0.36px;
        content: 'Detail cíle';
        position: absolute;
        bottom: -40px;
        left: 0;
        background-color: #FFF;
        color: #000;
        padding: 5px;
        display: none;
        white-space: nowrap;
        border-radius: 12px;
        box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
    }

    body .leaflet-popup-content-des #detCile:hover::after {
        display: block;
    }

body .leaflet-popup-content-destext {
    padding-top: 5px;
    text-align: left;
    font: normal normal 300 13px/18px Inter;
    color: #17253A;
    opacity: 1;
    /*border: 1px solid green;*/
}

body .leaflet-popup-tip-container {
    display: none;
}

body .leaflet-popup-close-button span {
    color: #FFF;
}

.leaflet-popup-close-button {
    position: relative;
    background-color: #FFF;
}

    .leaflet-popup-close-button::after {
        font: normal normal 300 13px/18px Inter;
        letter-spacing: 0.36px;
        content: 'Zavřít cíl';
        position: absolute;
        bottom: -40px;
        left: 0;
        background-color: #FFF;
        color: #000;
        padding: 5px;
        display: none;
        white-space: nowrap;
        border-radius: 12px;
        box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
    }

    .leaflet-popup-close-button:hover::after {
        display: block;
    }