---
layout: base
title: Sticky Header
---

<div class="it-header-wrapper it-header-sticky">
  <div class="it-header-slim-wrapper">
    <div class="container">
      <div class="row">
        <div class="col-12">
          <div class="it-header-slim-wrapper-content">
            <a class="d-none d-lg-block navbar-brand" href="#"
              >Ente appartenenza/Owner</a
            >
            <div class="nav-mobile">
              <nav>
                <a
                  class="it-opener d-lg-none"
                  data-toggle="collapse"
                  href="#menu-principale"
                  role="button"
                  aria-expanded="false"
                  aria-controls="menu-principale"
                >
                  <span>Ente appartenenza/Owner</span>
                  <svg class="icon">
                    <use
                      xlink:href="{{
                        site.baseurl
                      }}/dist/svg/sprite.svg#it-expand"
                    ></use>
                  </svg>
                </a>
                <div class="link-list-wrapper collapse" id="menu-principale">
                  <ul class="link-list">
                    <li><a href="#">Link 1</a></li>
                    <li><a href="#">Link 2 Active</a></li>
                  </ul>
                </div>
              </nav>
            </div>
            <div class="header-slim-right-zone">
              <div class="nav-item dropdown">
                <a
                  class="nav-link dropdown-toggle"
                  href="#"
                  data-toggle="dropdown"
                  aria-expanded="false"
                >
                  <span>ITA</span>
                  <svg class="icon d-none d-lg-block">
                    <use
                      xlink:href="{{
                        site.baseurl
                      }}/dist/svg/sprite.svg#it-expand"
                    ></use>
                  </svg>
                </a>
                <div class="dropdown-menu">
                  <div class="row">
                    <div class="col-12">
                      <div class="link-list-wrapper">
                        <ul class="link-list">
                          <li>
                            <a class="list-item" href="#"><span>ITA</span></a>
                          </li>
                          <li>
                            <a class="list-item" href="#"><span>ENG</span></a>
                          </li>
                        </ul>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="it-access-top-wrapper">
                <button class="btn btn-primary btn-sm" href="#" type="button">
                  Accedi
                </button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="it-nav-wrapper">
    <div class="it-header-center-wrapper">
      <div class="container">
        <div class="row">
          <div class="col-12">
            <div class="it-header-center-content-wrapper">
              <div class="it-brand-wrapper">
                <a href="#">
                  <svg class="icon">
                    <use
                      xlink:href="{{
                        site.baseurl
                      }}/dist/svg/sprite.svg#it-code-circle"
                    ></use>
                  </svg>
                  <div class="it-brand-text">
                    <h2 class="no_toc">Lorem Ipsum</h2>
                    <h3 class="no_toc d-none d-md-block">
                      Inserire qui la tag line
                    </h3>
                  </div>
                </a>
              </div>
              <div class="it-right-zone">
                <div class="it-socials d-none d-md-flex">
                  <span>Seguici su</span>
                  <ul>
                    <li>
                      <a href="#" aria-label="Facebook" target="_blank">
                        <svg class="icon">
                          <use
                            xlink:href="{{
                              site.baseurl
                            }}/dist/svg/sprite.svg#it-facebook"
                          ></use>
                        </svg>
                      </a>
                    </li>
                    <li>
                      <a href="#" aria-label="Github" target="_blank">
                        <svg class="icon">
                          <use
                            xlink:href="{{
                              site.baseurl
                            }}/dist/svg/sprite.svg#it-github"
                          ></use>
                        </svg>
                      </a>
                    </li>
                    <li>
                      <a href="#" target="_blank" aria-label="Twitter">
                        <svg class="icon">
                          <use
                            xlink:href="{{
                              site.baseurl
                            }}/dist/svg/sprite.svg#it-twitter"
                          ></use>
                        </svg>
                      </a>
                    </li>
                  </ul>
                </div>
                <div class="it-search-wrapper">
                  <span class="d-none d-md-block">Cerca</span>
                  <a
                    class="search-link rounded-icon"
                    href="#"
                    aria-label="Cerca"
                  >
                    <svg class="icon">
                      <use
                        xlink:href="{{
                          site.baseurl
                        }}/dist/svg/sprite.svg#it-search"
                      ></use>
                    </svg>
                  </a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="it-header-navbar-wrapper">
      <div class="container">
        <div class="row">
          <div class="col-12">
            <nav class="navbar navbar-expand-lg has-megamenu">
              <button
                class="custom-navbar-toggler"
                type="button"
                aria-controls="nav10"
                aria-expanded="false"
                aria-label="Toggle navigation"
                data-target="#nav10"
              >
                <svg class="icon">
                  <use
                    xlink:href="{{
                      site.baseurl
                    }}/dist/svg/sprite.svg#it-burger"
                  ></use>
                </svg>
              </button>
              <div class="navbar-collapsable" id="nav10">
                <div class="overlay"></div>
                <div class="close-div sr-only">
                  <button class="btn close-menu" type="button">
                    <span class="it-close"></span>close
                  </button>
                </div>
                <div class="menu-wrapper">
                  <ul class="navbar-nav">
                    <li class="nav-item active">
                      <a class="nav-link active" href="#"
                        ><span>link 1 attivo</span
                        ><span class="sr-only">current</span></a
                      >
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="#"><span>link 2</span></a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link disabled" href="#"
                        ><span>link 3 disabilitato</span></a
                      >
                    </li>
                  </ul>
                  <ul class="navbar-nav navbar-secondary">
                    <li class="nav-item">
                      <a class="nav-link" href="#">
                        <span>Iscrizioni</span>
                      </a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="#"
                        ><span>Estate in città</span></a
                      >
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="#"
                        ><span>Polizia locale</span></a
                      >
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="#"
                        ><span class="font-weight-bold"
                          >Tutti gli argomenti...</span
                        ></a
                      >
                    </li>
                  </ul>
                </div>
              </div>
            </nav>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="container my-4">
  <h1>Lorem Ipsum</h1>
  <p>
    Ab illo tempore, ab est sed immemorabili.<br />
    Ullamco laboris nisi ut aliquid ex ea commodi consequat.<br />
    Quis aute iure reprehenderit in voluptate velit esse.<br />
    Petierunt uti sibi concilium totius Galliae in diem certam indicere.
  </p>
  <p>
    Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nihil quo
    impedit? Repellendus similique vitae consequatur suscipit vel delectus aut
    quos neque. Quisquam ipsa odio accusamus possimus blanditiis provident, quam
    quos nobis, alias similique cumque atque sunt dolor quis, quod minus aliquam
    deleniti dolorum nemo mollitia praesentium omnis a dicta. Possimus maiores
    exercitationem fugit deleniti itaque nobis ab, magni facilis, ipsum ipsa
    animi vel aliquam iusto dolorum nemo! Laudantium, harum ipsum cupiditate
    odio provident expedita placeat veniam aspernatur quos! Fuga iure corporis
    exercitationem. Facere reprehenderit obcaecati placeat neque esse aliquam,
    est sit similique repudiandae explicabo saepe, impedit consequatur eveniet
    assumenda voluptate, labore ad aliquid rerum totam autem praesentium.
    Impedit sunt dolorem possimus dolores, quo voluptatibus saepe placeat,
    itaque aliquid corporis perspiciatis fugit qui exercitationem suscipit
    corrupti modi consequuntur maxime nobis earum ipsum illum perferendis vel
    iusto eligendi! Molestias temporibus delectus repellat accusantium quas,
    minima ipsam. Cupiditate accusantium eius nemo quibusdam est magnam
    recusandae mollitia aspernatur consequuntur. Harum nihil adipisci atque,
    odit excepturi accusantium ipsa inventore recusandae amet ex asperiores
    dolore nulla reprehenderit tempora repellat, ullam deserunt saepe debitis
    repellendus soluta quis qui, temporibus perspiciatis molestias. Et aperiam
    eius laboriosam repudiandae, unde distinctio consequuntur corporis hic porro
    illum aspernatur, soluta inventore ullam rerum voluptatem eaque enim
    consequatur facilis suscipit quas totam cum corrupti? Odio sapiente, at
    minus sit ipsa consequatur, pariatur quaerat quidem et distinctio illum
    culpa explicabo numquam optio non facere dolores perspiciatis. Eum
    perspiciatis distinctio odio aperiam, obcaecati, quam non voluptatem harum
    consectetur ad ipsum similique deserunt itaque repudiandae dolore cumque,
    praesentium laborum adipisci quidem quas molestias consequuntur.
    Perspiciatis, eum iure amet optio at voluptates inventore, doloribus
    quisquam adipisci quod ut fugit. Nam doloremque fuga corrupti aliquam,
    pariatur reprehenderit? Fugiat natus dolore quas eligendi ad inventore
    voluptatibus nostrum numquam adipisci. Temporibus illum sint nobis eligendi
    dolorem, id laborum nam atque numquam esse a ea quia odio dignissimos ipsam
    magnam cupiditate hic necessitatibus? Maxime atque consequuntur explicabo.
    Nesciunt facere nulla facilis laudantium. Aliquam aspernatur molestias
    nihil, provident non sint cupiditate tempore doloribus dignissimos quas
    deleniti, saepe a magni odit pariatur! Iste officia facilis distinctio, enim
    adipisci quos, necessitatibus modi tenetur minima soluta reprehenderit quo
    in error quasi exercitationem quidem ipsum repellendus quaerat? Praesentium
    voluptate excepturi sunt cum exercitationem at ratione, qui odit blanditiis?
    Blanditiis inventore saepe rem sapiente ut nihil aspernatur eaque? Maiores
    facilis ducimus eum nulla commodi atque, iste dolorem doloribus. Eveniet
    quas nobis enim dolorem dolorum tempora porro corrupti repellendus fuga
    quaerat natus, modi nemo, saepe mollitia numquam sunt omnis soluta delectus?
    Culpa perspiciatis enim consequatur vel eveniet aperiam modi doloribus
    atque, neque ducimus odit maiores natus. Dolores amet delectus consequatur
    dolore animi voluptas, corrupti quidem expedita modi, reprehenderit natus
    molestias eveniet illo inventore commodi non temporibus! Et temporibus
    tenetur sed veritatis porro. Unde deleniti consectetur voluptatibus atque
    delectus. Sed ipsam id eius facilis doloribus voluptates ducimus, aperiam
    totam itaque nihil libero natus consequatur dolorum eum atque nam sit
    pariatur. Dolore rerum, in tempore dolorum consectetur fugit voluptate, sint
    suscipit repellat modi, vero aliquam deleniti delectus. Nisi nobis saepe
    adipisci sit doloribus et, magnam quod eum ratione, autem, perspiciatis
    praesentium voluptate sint laboriosam enim tenetur esse. Perspiciatis
    praesentium maxime possimus optio voluptates repellendus nobis vero nihil
    distinctio, dolor voluptatibus ullam earum asperiores tempora. Dignissimos,
    ipsum id? Odit, voluptatum eos, blanditiis nobis repudiandae aliquam fugit
    obcaecati fugiat officia doloremque fuga aspernatur ipsam nihil culpa. Quam
    dolores tenetur, quidem blanditiis culpa eveniet quasi nulla quaerat earum
    veritatis incidunt sapiente. Labore ipsa rem sapiente quisquam asperiores
    unde debitis veritatis voluptatem necessitatibus. Optio eius dolorem
    cupiditate numquam nemo saepe porro autem doloribus harum fugit, aliquid
    nulla velit quidem doloremque consequuntur illo labore commodi natus
    necessitatibus placeat deserunt facere. Tempore voluptate ad minus, optio
    debitis omnis magnam? Minima est magnam deserunt dolores, ad tenetur autem
    doloremque, aliquam laborum tempore ratione nisi atque sit doloribus rerum
    asperiores voluptas repellendus corrupti expedita. Beatae, iusto! Aperiam
    perferendis nisi accusantium quibusdam sit officia magni repellat ipsam,
    aliquam id nam at voluptatum expedita, ducimus esse fugit, voluptate
    voluptatibus? Sit omnis expedita doloremque dolorum, itaque fuga debitis
    libero nam accusamus quos alias facilis porro ipsa atque earum, minus, natus
    officiis vel! Unde sequi enim quae, aspernatur laboriosam facere, in nihil,
    sit deserunt ut earum molestiae. Explicabo dolorem voluptate eos porro
    aliquid corporis libero dolor molestiae exercitationem aliquam magni
    adipisci dolore similique alias vitae id unde rem cum architecto, nam
    consequatur aspernatur nesciunt enim ratione. Eaque iusto, quidem animi
    incidunt dignissimos deserunt repudiandae. Fuga praesentium voluptas nemo
    doloribus vero quibusdam vel. Enim neque laudantium dolores perferendis
    dolorem, quae eum commodi nemo quam voluptas quos vitae odit eaque
    voluptatibus ipsam quas! Molestiae cumque recusandae eligendi vitae incidunt
    non nesciunt maxime quidem ipsam officiis dolores aut obcaecati voluptatum
    ducimus temporibus debitis numquam perspiciatis, perferendis veniam
    dignissimos quis quod suscipit, dicta quia? Ratione voluptates molestiae ea
    natus expedita animi doloribus nihil enim dolore magnam nostrum optio nisi
    magni veritatis ad corrupti, consequuntur facilis voluptatum odio minima
    fuga exercitationem. Rem sapiente voluptatem a. Minima, optio! Inventore cum
    distinctio, nemo deserunt exercitationem ratione blanditiis eveniet?
    Laboriosam illo omnis quae ipsam quia ipsum voluptatum, excepturi aspernatur
    repellendus mollitia maxime, delectus veritatis magni voluptatem. Cumque,
    quidem, ab totam doloribus amet, dolore saepe sapiente ad quibusdam dolorem
    similique eum consectetur provident. Delectus totam quam dolorem rerum quas
    nesciunt minus reprehenderit eligendi veritatis deserunt facilis, officia
    est error dolore consectetur mollitia maxime odit quisquam expedita quo
    excepturi animi. Earum enim, quas iste reiciendis voluptatum vitae sint
    cumque doloribus ratione totam, ipsam facere deleniti ab eveniet libero
    autem molestiae possimus! Possimus sed delectus voluptatem velit laudantium
    officia placeat, ad repudiandae amet earum cumque culpa itaque
    exercitationem deleniti non consequatur et omnis obcaecati iusto eveniet
    corporis. Neque, suscipit. Inventore quaerat officiis et omnis quidem
    provident, architecto numquam mollitia a dolore itaque! Deleniti laudantium
    quaerat repudiandae, fuga numquam quia nostrum in, inventore, quod ipsa
    recusandae earum beatae distinctio suscipit debitis nobis quam rem itaque
    consequatur iusto exercitationem perspiciatis commodi. Ex amet natus error
    quae praesentium quasi perspiciatis earum debitis perferendis sunt, id hic
    nihil dicta iusto fugit quaerat quam officiis culpa odio.
  </p>
  <p>
    Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nihil quo
    impedit? Repellendus similique vitae consequatur suscipit vel delectus aut
    quos neque. Quisquam ipsa odio accusamus possimus blanditiis provident, quam
    quos nobis, alias similique cumque atque sunt dolor quis, quod minus aliquam
    deleniti dolorum nemo mollitia praesentium omnis a dicta. Possimus maiores
    exercitationem fugit deleniti itaque nobis ab, magni facilis, ipsum ipsa
    animi vel aliquam iusto dolorum nemo! Laudantium, harum ipsum cupiditate
    odio provident expedita placeat veniam aspernatur quos! Fuga iure corporis
    exercitationem. Facere reprehenderit obcaecati placeat neque esse aliquam,
    est sit similique repudiandae explicabo saepe, impedit consequatur eveniet
    assumenda voluptate, labore ad aliquid rerum totam autem praesentium.
    Impedit sunt dolorem possimus dolores, quo voluptatibus saepe placeat,
    itaque aliquid corporis perspiciatis fugit qui exercitationem suscipit
    corrupti modi consequuntur maxime nobis earum ipsum illum perferendis vel
    iusto eligendi! Molestias temporibus delectus repellat accusantium quas,
    minima ipsam. Cupiditate accusantium eius nemo quibusdam est magnam
    recusandae mollitia aspernatur consequuntur. Harum nihil adipisci atque,
    odit excepturi accusantium ipsa inventore recusandae amet ex asperiores
    dolore nulla reprehenderit tempora repellat, ullam deserunt saepe debitis
    repellendus soluta quis qui, temporibus perspiciatis molestias. Et aperiam
    eius laboriosam repudiandae, unde distinctio consequuntur corporis hic porro
    illum aspernatur, soluta inventore ullam rerum voluptatem eaque enim
    consequatur facilis suscipit quas totam cum corrupti? Odio sapiente, at
    minus sit ipsa consequatur, pariatur quaerat quidem et distinctio illum
    culpa explicabo numquam optio non facere dolores perspiciatis. Eum
    perspiciatis distinctio odio aperiam, obcaecati, quam non voluptatem harum
    consectetur ad ipsum similique deserunt itaque repudiandae dolore cumque,
    praesentium laborum adipisci quidem quas molestias consequuntur.
    Perspiciatis, eum iure amet optio at voluptates inventore, doloribus
    quisquam adipisci quod ut fugit. Nam doloremque fuga corrupti aliquam,
    pariatur reprehenderit? Fugiat natus dolore quas eligendi ad inventore
    voluptatibus nostrum numquam adipisci. Temporibus illum sint nobis eligendi
    dolorem, id laborum nam atque numquam esse a ea quia odio dignissimos ipsam
    magnam cupiditate hic necessitatibus? Maxime atque consequuntur explicabo.
    Nesciunt facere nulla facilis laudantium. Aliquam aspernatur molestias
    nihil, provident non sint cupiditate tempore doloribus dignissimos quas
    deleniti, saepe a magni odit pariatur! Iste officia facilis distinctio, enim
    adipisci quos, necessitatibus modi tenetur minima soluta reprehenderit quo
    in error quasi exercitationem quidem ipsum repellendus quaerat? Praesentium
    voluptate excepturi sunt cum exercitationem at ratione, qui odit blanditiis?
    Blanditiis inventore saepe rem sapiente ut nihil aspernatur eaque? Maiores
    facilis ducimus eum nulla commodi atque, iste dolorem doloribus. Eveniet
    quas nobis enim dolorem dolorum tempora porro corrupti repellendus fuga
    quaerat natus, modi nemo, saepe mollitia numquam sunt omnis soluta delectus?
    Culpa perspiciatis enim consequatur vel eveniet aperiam modi doloribus
    atque, neque ducimus odit maiores natus. Dolores amet delectus consequatur
    dolore animi voluptas, corrupti quidem expedita modi, reprehenderit natus
    molestias eveniet illo inventore commodi non temporibus! Et temporibus
    tenetur sed veritatis porro. Unde deleniti consectetur voluptatibus atque
    delectus. Sed ipsam id eius facilis doloribus voluptates ducimus, aperiam
    totam itaque nihil libero natus consequatur dolorum eum atque nam sit
    pariatur. Dolore rerum, in tempore dolorum consectetur fugit voluptate, sint
    suscipit repellat modi, vero aliquam deleniti delectus. Nisi nobis saepe
    adipisci sit doloribus et, magnam quod eum ratione, autem, perspiciatis
    praesentium voluptate sint laboriosam enim tenetur esse. Perspiciatis
    praesentium maxime possimus optio voluptates repellendus nobis vero nihil
    distinctio, dolor voluptatibus ullam earum asperiores tempora. Dignissimos,
    ipsum id? Odit, voluptatum eos, blanditiis nobis repudiandae aliquam fugit
    obcaecati fugiat officia doloremque fuga aspernatur ipsam nihil culpa. Quam
    dolores tenetur, quidem blanditiis culpa eveniet quasi nulla quaerat earum
    veritatis incidunt sapiente. Labore ipsa rem sapiente quisquam asperiores
    unde debitis veritatis voluptatem necessitatibus. Optio eius dolorem
    cupiditate numquam nemo saepe porro autem doloribus harum fugit, aliquid
    nulla velit quidem doloremque consequuntur illo labore commodi natus
    necessitatibus placeat deserunt facere. Tempore voluptate ad minus, optio
    debitis omnis magnam? Minima est magnam deserunt dolores, ad tenetur autem
    doloremque, aliquam laborum tempore ratione nisi atque sit doloribus rerum
    asperiores voluptas repellendus corrupti expedita. Beatae, iusto! Aperiam
    perferendis nisi accusantium quibusdam sit officia magni repellat ipsam,
    aliquam id nam at voluptatum expedita, ducimus esse fugit, voluptate
    voluptatibus? Sit omnis expedita doloremque dolorum, itaque fuga debitis
    libero nam accusamus quos alias facilis porro ipsa atque earum, minus, natus
    officiis vel! Unde sequi enim quae, aspernatur laboriosam facere, in nihil,
    sit deserunt ut earum molestiae. Explicabo dolorem voluptate eos porro
    aliquid corporis libero dolor molestiae exercitationem aliquam magni
    adipisci dolore similique alias vitae id unde rem cum architecto, nam
    consequatur aspernatur nesciunt enim ratione. Eaque iusto, quidem animi
    incidunt dignissimos deserunt repudiandae. Fuga praesentium voluptas nemo
    doloribus vero quibusdam vel. Enim neque laudantium dolores perferendis
    dolorem, quae eum commodi nemo quam voluptas quos vitae odit eaque
    voluptatibus ipsam quas! Molestiae cumque recusandae eligendi vitae incidunt
    non nesciunt maxime quidem ipsam officiis dolores aut obcaecati voluptatum
    ducimus temporibus debitis numquam perspiciatis, perferendis veniam
    dignissimos quis quod suscipit, dicta quia? Ratione voluptates molestiae ea
    natus expedita animi doloribus nihil enim dolore magnam nostrum optio nisi
    magni veritatis ad corrupti, consequuntur facilis voluptatum odio minima
    fuga exercitationem. Rem sapiente voluptatem a. Minima, optio! Inventore cum
    distinctio, nemo deserunt exercitationem ratione blanditiis eveniet?
    Laboriosam illo omnis quae ipsam quia ipsum voluptatum, excepturi aspernatur
    repellendus mollitia maxime, delectus veritatis magni voluptatem. Cumque,
    quidem, ab totam doloribus amet, dolore saepe sapiente ad quibusdam dolorem
    similique eum consectetur provident. Delectus totam quam dolorem rerum quas
    nesciunt minus reprehenderit eligendi veritatis deserunt facilis, officia
    est error dolore consectetur mollitia maxime odit quisquam expedita quo
    excepturi animi. Earum enim, quas iste reiciendis voluptatum vitae sint
    cumque doloribus ratione totam, ipsam facere deleniti ab eveniet libero
    autem molestiae possimus! Possimus sed delectus voluptatem velit laudantium
    officia placeat, ad repudiandae amet earum cumque culpa itaque
    exercitationem deleniti non consequatur et omnis obcaecati iusto eveniet
    corporis. Neque, suscipit. Inventore quaerat officiis et omnis quidem
    provident, architecto numquam mollitia a dolore itaque! Deleniti laudantium
    quaerat repudiandae, fuga numquam quia nostrum in, inventore, quod ipsa
    recusandae earum beatae distinctio suscipit debitis nobis quam rem itaque
    consequatur iusto exercitationem perspiciatis commodi. Ex amet natus error
    quae praesentium quasi perspiciatis earum debitis perferendis sunt, id hic
    nihil dicta iusto fugit quaerat quam officiis culpa odio.
  </p>
</div>

<footer class="it-footer">
  <div class="it-footer-main">
    <div class="container">
      <section>
        <div class="row clearfix">
          <div class="col-sm-12">
            <div class="it-brand-wrapper">
              <a href="#">
                <svg class="icon">
                  <use
                    xlink:href="{{
                      site.baseurl
                    }}/dist/svg/sprite.svg#it-code-circle"
                  ></use>
                </svg>
                <div class="it-brand-text">
                  <h2 class="no_toc">Nome del Comune</h2>
                  <h3 class="no_toc d-none d-md-block">
                    Uno dei tanti Comuni d'Italia
                  </h3>
                </div>
              </a>
            </div>
          </div>
        </div>
      </section>
      <section>
        <div class="row">
          <div class="col-lg-3 col-md-3 col-sm-6 pb-2">
            <h4>
              <a href="#" title="Vai alla pagina: Amministrazione"
                >Amministrazione</a
              >
            </h4>
            <div class="link-list-wrapper">
              <ul class="footer-list link-list clearfix">
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Giunta e consiglio"
                    >Giunta e consiglio</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Aree di competenza"
                    >Aree di competenza</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Dipendenti"
                    >Dipendenti</a
                  >
                </li>
                <li>
                  <a class="list-item" href="#" title="Vai alla pagina: Luoghi"
                    >Luoghi</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Associazioni e società partecipate"
                    >Associazioni e società partecipate</a
                  >
                </li>
              </ul>
            </div>
          </div>
          <div class="col-lg-3 col-md-3 col-sm-6 pb-2">
            <h4>
              <a href="#" title="Vai alla pagina: Servizi">Servizi</a>
            </h4>
            <div class="link-list-wrapper">
              <ul class="footer-list link-list clearfix">
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Pagamenti"
                    >Pagamenti</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Sostegno"
                    >Sostegno</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Domande e iscrizioni"
                    >Domande e iscrizioni</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Segnalazioni"
                    >Segnalazioni</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Autorizzazioni e concessioni"
                    >Autorizzazioni e concessioni</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Certificati e dichiarazioni"
                    >Certificati e dichiarazioni</a
                  >
                </li>
              </ul>
            </div>
          </div>
          <div class="col-lg-3 col-md-3 col-sm-6 pb-2">
            <h4>
              <a href="#" title="Vai alla pagina: Novità">Novità</a>
            </h4>
            <div class="link-list-wrapper">
              <ul class="footer-list link-list clearfix">
                <li>
                  <a class="list-item" href="#" title="Vai alla pagina: Notizie"
                    >Notizie</a
                  >
                </li>
                <li>
                  <a class="list-item" href="#" title="Vai alla pagina: Eventi"
                    >Eventi</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Comunicati stampa"
                    >Comunicati stampa</a
                  >
                </li>
              </ul>
            </div>
          </div>
          <div class="col-lg-3 col-md-3 col-sm-6">
            <h4>
              <a href="#" title="Vai alla pagina: Documenti">Documenti</a>
            </h4>
            <div class="link-list-wrapper">
              <ul class="footer-list link-list clearfix">
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Progetti e attività"
                    >Progetti e attività</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Delibere, determine e ordinanze"
                    >Delibere, determine e ordinanze</a
                  >
                </li>
                <li>
                  <a class="list-item" href="#" title="Vai alla pagina: Bandi"
                    >Bandi</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Concorsi"
                    >Concorsi</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Albo pretorio"
                    >Albo pretorio</a
                  >
                </li>
              </ul>
            </div>
          </div>
        </div>
      </section>
      <section class="py-4 border-white border-top">
        <div class="row">
          <div class="col-lg-3 col-md-3 pb-2">
            <h4>
              <a href="#" title="Vai alla pagina: Amministrazione"
                >Amministrazione trasparente</a
              >
            </h4>
            <p>
              I dati personali pubblicati sono riutilizzabili solo alle
              condizioni previste dalla direttiva comunitaria 2003/98/CE e dal
              d.lgs. 36/2006
            </p>
          </div>
          <div class="col-lg-3 col-md-3 pb-2">
            <h4><a href="#" title="Vai alla pagina: Contatti">Contatti</a></h4>
            <p>
              <strong>Nome del Comune</strong><br />
              Via Roma 0 - 00000 Lorem Ipsum Codice fiscale / P. IVA: 000000000
            </p>
            <div class="link-list-wrapper">
              <ul class="footer-list link-list clearfix">
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: Posta Elettronica Certificata"
                    >Posta Elettronica Certificata</a
                  >
                </li>
                <li>
                  <a
                    class="list-item"
                    href="#"
                    title="Vai alla pagina: URP - Ufficio Relazioni con il Pubblico"
                    >URP - Ufficio Relazioni con il Pubblico</a
                  >
                </li>
              </ul>
            </div>
          </div>
          <div class="col-lg-3 col-md-3 pb-2">
            <h4>
              <a href="#" title="Vai alla pagina: Newsletter">Newsletter</a>
            </h4>
            <form action="#" method="post" class="form-newsletter">
              <p><strong>Iscriviti per riceverla</strong></p>
              <input
                type="email"
                class="form-control"
                id="input-newsletter"
                name="input-newsletter"
                placeholder="mail@example.com"
              />
              <button class="btn btn-primary btn-icon" type="submit">
                <svg class="icon icon-white">
                  <use
                    xlink:href="{{ site.baseurl }}/dist/svg/sprite.svg#it-mail"
                  ></use>
                </svg>
                <span>Iscriviti</span>
              </button>
            </form>
          </div>
          <div class="col-lg-3 col-md-3 pb-2">
            <h4>
              <a href="#" title="Vai alla pagina: Seguici su">Seguici su</a>
            </h4>
            <ul class="list-inline text-left social">
              <li class="list-inline-item">
                <a class="p-2 text-white" href="#" target="_blank"
                  ><svg class="icon icon-sm icon-white align-top">
                    <use
                      xlink:href="{{
                        site.baseurl
                      }}/dist/svg/sprite.svg#it-designers-italia"
                    ></use></svg
                  ><span class="sr-only">Designers Italia</span></a
                >
              </li>
              <li class="list-inline-item">
                <a class="p-2 text-white" href="#" target="_blank"
                  ><svg class="icon icon-sm icon-white align-top">
                    <use
                      xlink:href="{{
                        site.baseurl
                      }}/dist/svg/sprite.svg#it-twitter"
                    ></use></svg
                  ><span class="sr-only">Twitter</span></a
                >
              </li>
              <li class="list-inline-item">
                <a class="p-2 text-white" href="#" target="_blank"
                  ><svg class="icon icon-sm icon-white align-top">
                    <use
                      xlink:href="{{
                        site.baseurl
                      }}/dist/svg/sprite.svg#it-medium"
                    ></use></svg
                  ><span class="sr-only">Medium</span></a
                >
              </li>
              <li class="list-inline-item">
                <a class="p-2 text-white" href="#" target="_blank"
                  ><svg class="icon icon-sm icon-white align-top">
                    <use
                      xlink:href="{{
                        site.baseurl
                      }}/dist/svg/sprite.svg#it-behance"
                    ></use></svg
                  ><span class="sr-only">Behance</span></a
                >
              </li>
            </ul>
          </div>
        </div>
      </section>
    </div>
  </div>
  <div class="it-footer-small-prints clearfix">
    <div class="container">
      <h3 class="sr-only">Sezione Link Utili</h3>
      <ul
        class="it-footer-small-prints-list list-inline mb-0 d-flex flex-column flex-md-row"
      >
        <li class="list-inline-item">
          <a href="#" title="Note Legali">Media policy</a>
        </li>
        <li class="list-inline-item">
          <a href="#" title="Note Legali">Note legali</a>
        </li>
        <li class="list-inline-item">
          <a href="#" title="Privacy-Cookies">Privacy policy</a>
        </li>
        <li class="list-inline-item">
          <a href="#" title="Mappa del sito">Mappa del sito</a>
        </li>
      </ul>
    </div>
  </div>
</footer>