<div class="osm-marker-tab-container">
   <ul class="osm-marker-tabs">
        <li class="marker-tab-link current" marker-tab="tab_sport"><?php esc_html_e('Sport', 'OSM'); ?></li>
        <li class="marker-tab-link" marker-tab="tab_urban"><?php esc_html_e('Urban', 'OSM'); ?></li>
        <li class="marker-tab-link" marker-tab="tab_camping"><?php esc_html_e('Camping', 'OSM'); ?></li>
        <li class="marker-tab-link" marker-tab="tab_misc"><?php esc_html_e('Misc', 'OSM'); ?></li>
    </ul>
<!-- id="tab_sport" -->
<div id="tab_sport" class="marker-tab-content current">
    <?php
    $icons = [
        'mic_black_windsurf_10.png',
        'mic_green_horseriding_01.png',
        'mic_blue_cycling_01.png',
        'mic_orange_hiking_01.png',
        'mic_blue_ski_tour_01.png',
        'mic_blue_horseriding_01.png',
        'mic_blue_scubadiving_01.png',
        'mic_black_crossbike_10.png',
        'mic_black_cross_10.png',
        'mic_black_crossbike2_10.png',
        'mic_black_boxing_10.png',
        'mic_black_swimmer_10.png',
        'mic_black_ccski_10.png',
        'mic_black_marathon_10.png',
        'mic_black_bicycle_10.png',
        'mic_black_handball_10.png',
        'mic_black_football_10.png',
        'mic_black_climbing_11.png',
        'mic_black_cycling_10.png',
        'mic_black_climbing_10.png',
        'mic_black_sail_10.png',
        'mic_black_runner_10.png',
        'mic_black_sailing2_10.png',
        'mic_black_archery_10.png',
        'mic_black_archery_01.png',
        'mic_orange_archery_01.png',
        'mic_black_basketb_10.png',
        'mic_black_baseball_10.png',
        'mic_black_ride_10.png',
        'mic_black_waterball_10.png',
        'mic_black_table_10.png',
        'mic_black_tennis_10.png',
        'mic_black_iceskate_10.png',
        'mic_black_balloon_10.png',
        'mic_black_badmint_10.png',
        'mic_black_skatboard_10.png',
        'mic_black_hockey_10.png',
        'mic_black_paraglide_10.png',
        'mic_black_olymp_10.png',
        'mic_black_olymp2_10.png',
        'mic_black_olymphouse_10.png',
        'mic_black_diver_10.png',
        'mic_black_diver2_10.png',
        'mic_black_g21090_10.png',
        'mic_black_nardicwalk_10.png',
        'mic_black_skijump_10.png',
        'mic_black_walker_10.png',
        'mic_black_surfer_10.png',
        'mic_black_chute_10.png',
        'mic_orange_climbing_01.png',
        'mic_black_grandprix_10.png',
        'mic_orange_motorbike_01.png',
        'mic_orange_sailing_1.png',
        'mic_black_rambler_10.png',
        'mic_black_triathlon_10.png',
        'mic_black_icefish_10.png',
        'mic_black_icehok_10.png',
        'mic_black_crossing_10.png',
        'mic_orange_fishing_01.png',
        'mic_black_fishing_10.png',
        'mic_black_roller_10.png',
        'mic_black_soccer_10.png'
    ];

    foreach ($icons as $icon) {
        ?>
        <label class="metabox-label">
            <input type="radio" name="marker_icon" id="marker_icon" value="<?php echo esc_attr($icon); ?>" />
            <?php echo '<img src="' . esc_url(OSM_PLUGIN_ICONS_URL . '/' . $icon) . '" align="left" hspace="5" alt="' . esc_attr($icon) . '">'; ?>
        </label>
        <?php
    }
    ?>
</div> <!-- id="tab_sport" -->



 <!-- id="tab_urban" -->
<div id="tab_urban" class="marker-tab-content">
    <?php
    $icons = [
        'mic_black_cctv_01.png',
        'mic_blue_toilets_disability_01.png',
        'mic_red_pizzaria_01.png',
        'mic_black_restaurant_10.png',
        'mic_blue_toilets_01.png',
        'mic_black_youthhostel_10.png',
        'mic_black_hospital_10.png',
        'mic_black_parking_10.png',
        'mic_black_parkride_10.png',
        'mic_black_pharmacy_10.png',
        'mic_black_playyard_10.png',
        'mic_black_police_10.png',
        'mic_black_postoffice_10.png',
        'mic_brown_parking_01.png',
        'mic_brown_harbor_01.png',
        'mic_brown_fillingstation_01.png',
        'mic_black_gasstation_10.png',
        'mic_black_nicolastation_10.png',
        'mic_blue_information_01.png',
        'mic_black_car_01.png',
        'mic_brown_car_01.png',
        'mic_green_car_01.png',
        'mic_black_undergr_10.png',
        'mic_black_subway_10.png',
        'mic_black_train_01.png',
        'mic_black_steamtrain_01.png',
        'mic_black_powerplant_01.png',
        'mic_black_netcoffee_10.png',
        'mic_black_mosque_10.png',
        'mic_black_godhouse_10.png',
        'mic_black_market_10.png',
        'mic_black_service_10.png',
        'mic_black_cemetary_10.png',
        'mic_black_funpark_10.png',
        'mic_black_airline_10.png',
        'mic_black_airport_10.png',
        'mic_black_tomb_10.png',
        'mic_black_theater_10.png',
        'mic_black_townhall_10.png',
        'mic_black_atom_10.png',
        'mic_black_bridge_10.png',
        'mic_black_brental_10.png',
        'mic_black_bus_10.png',
        'mic_black_busstop_10.png',
        'mic_black_doc_10.png',
        'mic_black_embassy_10.png',
        'mic_black_fasting_10.png',
        'mic_black_shopping_10.png',
        'mic_black_parking_bicycle-2_01.png',
        'mic_blue_mobilephonetower_01.png',
        'mic_blue_bridge_old_01.png',
        'mic_green_icecream_01.png',
        'mic_green_restaurant_02.png',
        'mic_black_coffeshop_10.png',
        'mic_black_monument_10.png',
        'mic_black_helicopter_10.png',
        'mic_black_highschool_10.png',
        'mic_black_highway_10.png',
        'mic_black_sub_10.png',
        'mic_black_infopoint_10.png',
        'mic_black_carno_10.png',
        'mic_black_cars_10.png',
        'mic_gold_stolperstein-L.png',
        'mic_grey_stolperstein_L.png'
    ];

    foreach ($icons as $icon) {
        ?>
        <label class="metabox-label">
            <input type="radio" name="marker_icon" id="marker_icon" value="<?php echo esc_attr($icon); ?>" />
            <?php echo '<img src="' . esc_url(OSM_PLUGIN_ICONS_URL . '/' . $icon) . '" align="left" hspace="5" alt="' . esc_attr($icon) . '">'; ?>
        </label>
        <?php
    }
    ?>
</div> <!-- id="tab_urban" -->


<!-- id="tab_camping" -->
<div id="tab_camping" class="marker-tab-content">
    <?php esc_html_e('Camping', 'OSM'); ?><br/><br/>
    <?php
    $icons = [
        'mic_green_caravan_01.png',
        'mic_black_camp_10.png',
        'mic_blue_drinkingwater_01.png',
        'mic_black_drinkwater_10.png',
        'mic_black_wifi_10.png',
        'mic_black_wifino_10.png',
        'mic_black_nolan_10.png',
        'mic_blue_shower_01.png',
        'mic_green_tent_01.png',
        'mic_black_camp_11.png',
        'mic_black_camp_12.png',
        'mic_black_charger_10.png',
        'mic_black_light_10.png',
        'mic_black_nolight_10.png',
        'mic_black_barbe_10.png',
        'mic_black_hymering_10.png',
        'mic_black_wastewater_10.png',
        'mic_black_energy_10.png'
    ];

    foreach ($icons as $icon) {
        ?>
        <label class="metabox-label">
            <input type="radio" name="marker_icon" id="marker_icon" value="<?php echo esc_attr($icon); ?>" />
            <?php echo '<img src="' . esc_url(OSM_PLUGIN_ICONS_URL . '/' . $icon) . '" align="left" hspace="5" alt="' . esc_attr($icon) . '">'; ?>
        </label>
        <?php
    }
    ?>
</div> <!-- id="tab_camping" -->


 <!-- id="tab_misc" -->
<div id="tab_misc" class="marker-tab-content">
    <?php
$icons = [
    'mic_black_camera_01.png',
    'mic_black_forbidden_11.png',
    'mic_black_pov_10.png',
    'mic_black_empty_01.png',
    'mic_blue_empty_01.png',
    'mic_green_audio_01.png',
    'mic_red_pirates_01.png',
    'mic_black_heart_01.png',
    'mic_black_darling_10.png',
    'mic_blue_lighthouse-2_01.png',
    'mic_green_palm-tree-export_01.png',
    'mic_green_hut_01.png',
    'mic_green_hut_02.png',
    'mic_blue_bridge_old_01_.png',
    'mic_green_vineyard-2_01.png',
    'mic_black_acupuncture_10.png',
    'mic_black_area51_10.png',
    'mic_black_bar_10.png',
    'mic_black_bank_10.png',
    'mic_black_barrierfree_10.png',
    'mic_black_beer_10.png',
    'mic_black_beach_10.png',
    'mic_black_boatbridge_10.png',
    'mic_black_border_10.png',
    'mic_black_building_10.png',
    'mic_black_cardmoney_10.png',
    'mic_black_carnival_10.png',
    'mic_black_champ_10.png',
    'mic_black_check_10.png',
    'mic_black_chess_10.png',
    'mic_black_cinema_10.png',
    'mic_black_citytrain_10.png',
    'mic_black_congress_10.png',
    'mic_black_court_10.png',
    'mic_black_crisisarea_10.png',
    'mic_black_desert_10.png',
    'mic_black_drone_10.png',
    'mic_black_ferry_10.png',
    'mic_black_firstaid_10.png',
    'mic_black_flowers_10.png',
    'mic_black_forbidden_10.png',
    'mic_black_g10088_10.png',
    'mic_black_g6269_10.png',
    'mic_black_geocaching_10.png',
    'mic_black_goal_10.png',
    'mic_black_graffity_10.png',
    'mic_black_hardrock_10.png',
    'mic_black_harbor_10.png',
    'mic_black_healer_10.png',
    'mic_black_hut_10.png',
    'mic_black_industry_10.png',
    'mic_black_jailhouse_10.png',
    'mic_black_library_10.png',
    'mic_black_limit_10.png',
    'mic_black_military_10.png',
    'mic_black_mobile_10.png',
    'mic_black_museum_10.png',
    'mic_black_nature_10.png',
    'mic_black_nodrone_10.png',
    'mic_black_noenergy_10.png',
    'mic_black_nomobile_10.png',
    'mic_black_nudebeach_10.png',
    'mic_black_observ_10.png',
    'mic_black_pubview_10.png',
    'mic_black_radiotele_10.png',
    'mic_black_railroad_10.png',
    'mic_black_redlight_10.png',
    'mic_black_remote_10.png',
    'mic_black_rent_10.png',
    'mic_black_rentbike_10.png',
    'mic_black_rescheli_10.png',
    'mic_black_renting_10.png',
    'mic_black_ropeway_10.png',
    'mic_black_science_10.png',
    'mic_black_seaworld_10.png',
    'mic_black_smoker_10.png',
    'mic_black_snow_10.png',
    'mic_black_spotfield_10.png',
    'mic_black_start_10.png',
    'mic_black_stop_10.png',
    'mic_black_survival_10.png',
    'mic_black_train_10.png',
    'mic_black_turbine_10.png',
    'mic_black_waterhole_10.png',
    'mic_black_waters_10.png',
    'mic_black_wine_10.png',
    'mic_black_xgames_10.png',
    'mic_black_xgames_11.png',
    'mic_black_yoga_10.png',
    'mic_black_zoo_10.png',
    'styria_linux.png',
    'mic_black_pinother_02.png',
    'mic_red_pinother_02.png',
    'mic_green_pinother_02.png',
    'mic_blue_pinother_02.png'
];

    foreach ($icons as $icon) {
        ?>
        <label class="metabox-label">
            <input type="radio" name="marker_icon" id="marker_icon" value="<?php echo esc_attr($icon); ?>" />
            <?php echo '<img src="' . esc_url(OSM_PLUGIN_ICONS_URL . '/' . $icon) . '" align="left" hspace="5" alt="' . esc_attr($icon) . '">'; ?>
        </label>
        <?php
    }
    ?>
</div> <!-- id="tab_misc" -->
</div> <!-- id="osm-marker-tab-container" -->



