.explain-map {
    /*position: absolute;*/
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.explain-map > svg {
    display: block;
    width: 100%;
    height: 100%;
    touch-action: none !important;
}

.spot {
    transition: fill-opacity 0.3s ease-in-out;
    /* stroke-width: 1px; */
    /* stroke-dasharray: 2, 2; */
    stroke-linejoin: round;
    /* opacity: 0.3; */
    fill-opacity: 0.3 !important;
    stroke-opacity: 1;
}

.spot:hover {
    cursor: pointer;
    fill-opacity: 0.6 !important;
}

.spot.-available {
    fill: rgba(17, 219, 219, 1) !important;
    stroke: rgba(17, 219, 219, 1);
}

.spot.-reserved {
    fill: rgba(242, 201, 76, 1) !important;
    stroke: rgba(242, 201, 76, 1);
}

.spot.-sold {
    fill: rgba(235, 87, 87, 1) !important;
    stroke: rgba(235, 87, 87, 1);
}

.spot.-service {
    fill: #fff !important;
    stroke: #fff;
}

/*.spot-number {*/
/*    background: rgba(17, 219, 219, .6);*/
/*    border: 1px solid rgba(17, 219, 219, 1);*/
/*    border-radius: 50px;*/
/*    width: 60px;*/
/*    height: 60px;*/
/*    display: block;*/
/*}*/

.h-tooltip {
    background: rgba(43, 48, 55, .86) !important;
    /*opacity: .93;*/
    color: #fff;
    border: 1px solid transparent;
    padding: 20px;
    position: absolute;
    display: none;
    border-radius: 3px;
    z-index: 1;
}

.h-tooltip h3 {
    margin: 0;
    font-size: .85rem;
}

.h-tooltip-info {
    list-style: none;
    padding: 0;
    margin: 20px 0 0 0;
}

.h-tooltip-info li {
    font-size: 12px;
    font-weight: 400;
    display: flex;
}

.h-tooltip-info li span {
    font-family: "Oswald", sans-serif;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
    display: block;
    width: 100px;
    margin-right: 30px;
}

@media (min-width: 576px) {

    .h-tooltip {
        padding: 40px;
    }

    .h-tooltip-info li {
        font-size: 14px;
    }

    .h-tooltip-info li span {
        font-size: 12px;
        width: 130px;
    }
}

@media (min-width: 768px) {
    .h-tooltip-info li {
        font-size: 16px;
    }

    .h-tooltip-info li span {
        font-size: 14px;
    }
}




