/* Velké obrazovky a stolní monitory */
@media (min-width: 1201px) {
    .tooltip {
        position: absolute;
        margin: 40px 0 0 -100px;
        visibility: hidden;
        background: #AF4E06;
        color: white;
        padding: 10px;
        text-align: center;
        border-radius: 5px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
        z-index: 1000;
        width: 200px;
    }

    .tooltip p {
        margin: 0;
        font-size: 1.2em;
    }

    .tooltip p span {
        font-weight: 900;
        color: #F3F3F3;
    }

    .tooltip.visible {
        visibility: visible;
    }

    .map-point {
        cursor: pointer;
        transition: transform 0.2s ease;
    }

    .map-point:hover {
        transform: scale(1.1);
    }

    .map-point-01, .map-point-02, .map-point-03, .map-point-04, .map-point-05, .map-point-06, .map-point-07, .map-point-08, .map-point-09, .map-point-10, .map-point-11 { width: 30px; height: 30px; border-radius:100%; position: absolute; margin: 60px 0 0 260px; background: #AF4E06;} /* Sportovni areal */
    .map-point-02 { margin: 550px 0 0 1050px;} /* Uprava zeleně */
    .map-point-03 { margin: 320px 0 0 380px;} /* Osvetleni */
    .map-point-04 { margin: 300px 0 0 710px;} /* Sběrný dvůr */
    .map-point-05 { margin: 90px 0 0 740px;} /* Doprava */
    .map-point-06 { margin: 530px 0 0 470px;} /* Odpad */
    .map-point-07 { margin: 440px 0 0 780px;} /* Bytový fond */
    .map-point-08 { margin: 460px 0 0 600px;} /* Dětská hřiště */
    .map-point-09 { margin: 740px 0 0 200px;} /* Hřbitovy */
    .map-point-10 { margin: 80px 0 0 980px;} /* Elektro-plny */
    .map-point-11 { margin: 240px 0 0 660px;} /* Teplo */
}

/* Menší laptopy a stolní počítače */
@media (min-width: 1025px) and (max-width: 1200px) {
    .tooltip {
        position: absolute;
        margin: 40px 0 0 -85px;
        visibility: hidden;
        background: #AF4E06;
        color: white;
        padding: 10px;
        text-align: center;
        border-radius: 5px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
        z-index: 1000;
        width: 180px;
    }

    .tooltip p {
        margin: 0;
        font-size: 1em;
    }

    .tooltip p span {
        font-weight: 900;
        color: #F3F3F3;
    }

    .tooltip.visible {
        visibility: visible;
    }

    .map-point {
        cursor: pointer;
        transition: transform 0.2s ease;
    }

    .map-point:hover {
        transform: scale(1.1);
    }
    
    .map-point-01, .map-point-02, .map-point-03, .map-point-04, .map-point-05, .map-point-06, .map-point-07, .map-point-08, .map-point-09, .map-point-10, .map-point-11 { width: 30px; height: 30px; border-radius:100%; position: absolute; margin: 60px 0 0 220px; background: #AF4E06;} /* Sportovni areal */
    .map-point-02 { margin: 520px 0 0 950px;} /* Uprava zeleně */
    .map-point-03 { margin: 340px 0 0 280px;} /* Osvetleni */
    .map-point-04 { margin: 250px 0 0 620px;} /* Sběrný dvůr */
    .map-point-05 { margin: 80px 0 0 640px;} /* Doprava */
    .map-point-06 { margin: 530px 0 0 470px;} /* Odpad */
    .map-point-07 { margin: 400px 0 0 700px;} /* Bytový fond */
    .map-point-08 { margin: 390px 0 0 520px;} /* Dětská hřiště */
    .map-point-09 { margin: 600px 0 0 200px;} /* Hřbitovy */
    .map-point-10 { margin: 160px 0 0 820px;} /* Elektro-plny */
    .map-point-11 { margin: 200px 0 0 570px;} /* Teplo */
}

/* Tablety na šířku */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    .tooltip {
        position: absolute;
        margin: 40px 0 0 -70px;
        visibility: hidden;
        background: #AF4E06;
        color: white;
        padding: 10px;
        text-align: center;
        border-radius: 5px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
        z-index: 1000;
        width: 150px;
    }

    .tooltip p {
        margin: 0;
        font-size: .8em;
    }

    .tooltip p span {
        font-weight: 900;
        color: #F3F3F3;
    }

    .tooltip.visible {
        visibility: visible;
    }

    .map-point {
        cursor: pointer;
        transition: transform 0.2s ease;
    }

    .map-point:hover {
        transform: scale(1.1);
    }
    
    .map-point-01, .map-point-02, .map-point-03, .map-point-04, .map-point-05, .map-point-06, .map-point-07, .map-point-08, .map-point-09, .map-point-10, .map-point-11 { width: 30px; height: 30px; border-radius:100%; position: absolute; margin: 20px 0 0 120px; background: #AF4E06;} /* Sportovni areal */
    .map-point-02 { margin: 380px 0 0 660px;} /* Uprava zeleně */
    .map-point-03 { margin: 250px 0 0 160px;} /* Osvetleni */
    .map-point-04 { margin: 170px 0 0 420px;} /* Sběrný dvůr */
    .map-point-05 { margin: 50px 0 0 450px;} /* Doprava */
    .map-point-06 { margin: 360px 0 0 240px;} /* Odpad */
    .map-point-07 { margin: 280px 0 0 440px;} /* Bytový fond */
    .map-point-08 { margin: 280px 0 0 340px;} /* Dětská hřiště */
    .map-point-09 { margin: 500px 0 0 100px;} /* Hřbitovy */
    .map-point-10 { margin: 160px 0 0 610px;} /* Elektro-plny */
    .map-point-11 { margin: 120px 0 0 380px;} /* Teplo */
}