There are no notes for this item.

<div class='c-country-maps'>

    <h1 class='c-heading'>

        Country Maps

    </h1>

    <div class='c-country-maps c-country-maps__country-maps'>
        <ul class='c-country-maps__items row u-list--unstyled'>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-ba'>
                            <img src='../../graphic/maps/map-ba.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-ba'>
                            <img src='../../graphic/flags/ba.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Bosna i Hercegovina

                        </h1>

                        <p class='c-country-map__localized-name'>Bosnia and Herzegovina</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-cz'>
                            <img src='../../graphic/maps/map-cz.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-cz'>
                            <img src='../../graphic/flags/cz.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Česko

                        </h1>

                        <p class='c-country-map__localized-name'>Czechia</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-am'>
                            <img src='../../graphic/maps/map-am.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-am'>
                            <img src='../../graphic/flags/am.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Հայաստան

                        </h1>

                        <p class='c-country-map__localized-name'>Armenia</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-hr'>
                            <img src='../../graphic/maps/map-hr.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-hr'>
                            <img src='../../graphic/flags/hr.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Hrvatska

                        </h1>

                        <p class='c-country-map__localized-name'>Croatia</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-hu'>
                            <img src='../../graphic/maps/map-hu.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-hu'>
                            <img src='../../graphic/flags/hu.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Magyarország

                        </h1>

                        <p class='c-country-map__localized-name'>Hungary</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-kz'>
                            <img src='../../graphic/maps/map-kz.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-kz'>
                            <img src='../../graphic/flags/kz.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Қазақстан

                        </h1>

                        <p class='c-country-map__localized-name'>Kazakhstan</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-at'>
                            <img src='../../graphic/maps/map-at.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-at'>
                            <img src='../../graphic/flags/at.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Österreich

                        </h1>

                        <p class='c-country-map__localized-name'>Austria</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-ro'>
                            <img src='../../graphic/maps/map-ro.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-ro'>
                            <img src='../../graphic/flags/ro.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            România

                        </h1>

                        <p class='c-country-map__localized-name'>Romania</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-ru'>
                            <img src='../../graphic/maps/map-ru.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-ru'>
                            <img src='../../graphic/flags/ru.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Росси́я

                        </h1>

                        <p class='c-country-map__localized-name'>Russia</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-mk'>
                            <img src='../../graphic/maps/map-mk.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-mk'>
                            <img src='../../graphic/flags/mk.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Северна Македонија

                        </h1>

                        <p class='c-country-map__localized-name'>North Macedonia</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-ge'>
                            <img src='../../graphic/maps/map-ge.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-ge'>
                            <img src='../../graphic/flags/ge.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            საქართველო

                        </h1>

                        <p class='c-country-map__localized-name'>Georgia</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-sk'>
                            <img src='../../graphic/maps/map-sk.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-sk'>
                            <img src='../../graphic/flags/sk.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Slovensko

                        </h1>

                        <p class='c-country-map__localized-name'>Slovakia</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-rs'>
                            <img src='../../graphic/maps/map-rs.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-rs'>
                            <img src='../../graphic/flags/rs.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Srbija

                        </h1>

                        <p class='c-country-map__localized-name'>Serbia</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-tr'>
                            <img src='../../graphic/maps/map-tr.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-tr'>
                            <img src='../../graphic/flags/tr.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Türkiye

                        </h1>

                        <p class='c-country-map__localized-name'>Turkey</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-ug'>
                            <img src='../../graphic/maps/map-ug.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-ug'>
                            <img src='../../graphic/flags/ug.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Uganda

                        </h1>

                        <p class='c-country-map__localized-name'>Uganda</p>

                    </figcaption>
                </figure>
            </li>

            <li class='c-country-maps__items__item col-sm-6 col-md-4 col-lg-3'>
                <figure class='c-country-map c-country-maps__country-map'>
                    <span class='c-country-map__map'>
                        <span class='c-icon c-icon--huge c-icon--map-ua'>
                            <img src='../../graphic/maps/map-ua.svg' alt='' />
                        </span>
                    </span>
                    <figcaption class='c-country-map__content'>
                        <span class='c-icon c-icon--flag-ua'>
                            <img src='../../graphic/flags/ua.svg' alt='' />
                        </span>

                        <h1 class='c-heading c-heading--minor'>

                            Україна

                        </h1>

                        <p class='c-country-map__localized-name'>Ukraine</p>

                    </figcaption>
                </figure>
            </li>

        </ul>
    </div>
</div>
<div class='{{ get_component_class( 'country-maps', display ) }}'>
    {% if heading %}
        {% include '@unit/heading/heading.twig' with heading %}
    {% endif %}
    
    {% include '@group/collection/collection.twig' with collection %}
</div>
{
  "bodyclass": "container-fluid",
  "heading": {
    "text": "Country Maps"
  },
  "collection": {
    "display": {
      "component": "country-maps"
    },
    "collection": {
      "display": {
        "itemTemplate": "unit/country-map/country-map",
        "listClass": [
          "row",
          "u-list--unstyled"
        ],
        "itemClass": [
          "col-sm-6",
          "col-md-4",
          "col-lg-3"
        ]
      },
      "items": [
        {
          "icon": {
            "iso": "ba"
          },
          "heading": {
            "text": "Bosna i Hercegovina"
          },
          "localized_name": "Bosnia and Herzegovina"
        },
        {
          "icon": {
            "iso": "cz"
          },
          "heading": {
            "text": "Česko"
          },
          "localized_name": "Czechia"
        },
        {
          "icon": {
            "iso": "am"
          },
          "heading": {
            "text": "Հայաստան"
          },
          "localized_name": "Armenia"
        },
        {
          "icon": {
            "iso": "hr"
          },
          "heading": {
            "text": "Hrvatska"
          },
          "localized_name": "Croatia"
        },
        {
          "icon": {
            "iso": "hu"
          },
          "heading": {
            "text": "Magyarország"
          },
          "localized_name": "Hungary"
        },
        {
          "icon": {
            "iso": "kz"
          },
          "heading": {
            "text": "Қазақстан"
          },
          "localized_name": "Kazakhstan"
        },
        {
          "icon": {
            "iso": "at"
          },
          "heading": {
            "text": "Österreich"
          },
          "localized_name": "Austria"
        },
        {
          "icon": {
            "iso": "ro"
          },
          "heading": {
            "text": "România"
          },
          "localized_name": "Romania"
        },
        {
          "icon": {
            "iso": "ru"
          },
          "heading": {
            "text": "Росси́я"
          },
          "localized_name": "Russia"
        },
        {
          "icon": {
            "iso": "mk"
          },
          "heading": {
            "text": "Северна Македонија"
          },
          "localized_name": "North Macedonia"
        },
        {
          "icon": {
            "iso": "ge"
          },
          "heading": {
            "text": "საქართველო"
          },
          "localized_name": "Georgia"
        },
        {
          "icon": {
            "iso": "sk"
          },
          "heading": {
            "text": "Slovensko"
          },
          "localized_name": "Slovakia"
        },
        {
          "icon": {
            "iso": "rs"
          },
          "heading": {
            "text": "Srbija"
          },
          "localized_name": "Serbia"
        },
        {
          "icon": {
            "iso": "tr"
          },
          "heading": {
            "text": "Türkiye"
          },
          "localized_name": "Turkey"
        },
        {
          "icon": {
            "iso": "ug"
          },
          "heading": {
            "text": "Uganda"
          },
          "localized_name": "Uganda"
        },
        {
          "icon": {
            "iso": "ua"
          },
          "heading": {
            "text": "Україна"
          },
          "localized_name": "Ukraine"
        }
      ]
    }
  }
}