<!doctype html>

<html lang="en">

   <head>

      <meta charset="utf-8" />

      <meta http-equiv="X-UA-Compatible" content="IE=edge">

      <title>Edizioni GBU</title>

      <link rel="stylesheet" href="assets/css/style.css?v=214">

      <meta name="viewport"

         content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, viewport-fit=cover" />

      <meta name="description" content="Edizioni GBU">

      <meta name="keywords" content="bootstrap, mobile template, Bootstrap 5, mobile, html, responsive" />

      <link rel="icon" type="image/png" href="assets/img/icon/favicon.png" sizes="32x32">

      <link rel="apple-touch-icon" sizes="180x180" href="assets/img/icon/192x192.png">

      <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />

      <meta http-equiv="Pragma" content="no-cache" />

      <meta http-equiv="Expires" content="0" />

      <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
      <script src="https://cdn.lordicon.com/lordicon.js"></script>



<style>

       .ripple {

      overflow: hidden;

      position: relative;

      box-sizing: border-box;

      transform: translate3d(0, 0, 0);

    }

    

    .ripple-effect {

      position: absolute;

      border-radius: 50%;

      background-color: rgba(255, 255, 255, 0.5);

      -webkit-user-select: none;

         -moz-user-select: none;

          -ms-user-select: none;

              user-select: none;

      pointer-events: none;

      padding: 0;

      margin: 0;

      opacity: 0.6;

      transform: translate3d(-50%, -50%, 0);

    }



 

button.uf-button-primary {

  background-color: #23232c;

  border-color: #23232c;

}

button.uf-button-primary:hover {

  background-color: #ce814d;

  color: black;

  border-color: #ce814d;

}

div.uf-progress-bar[style*="width"] {

  background-color: #ce814d;

}

div.uf-free-badge {

  display: none;

}



.notification-dot {
    position: absolute;
    top: 0;  /* Posizione verticale del triangolo */
    right: -56px; /* Posizione orizzontale del triangolo */
    width: 0;
    height: 0;
    border-left: 90px solid transparent; /* Triangolo a sinistra (trasparente) */
    border-right: 30px solid transparent; /* Triangolo a destra (trasparente) */
    border-bottom: 75px solid #ff4545; /* Dimensione dell'angolo in basso a sinistra */
    display: none; /* Nascosto di default */
    z-index: 1; /* Assicurati che il triangolo sia sopra il contenuto della card */

    transform: rotate(44deg); /* Ruota il triangolo di 90 gradi */
    transform-origin: top right; /* Punto di origine della rotazione */
}


   </style>



   </head>

   <body>

      <!-- Page loading -->

      <div id="loading">

         <div class="spinner-grow"></div>

      </div>

      <!-- * Page loading -->

      <!-- App Header -->

      <div class="appHeader">

         <div class="left">

            <a href="#appSidebar" class="icon" data-bs-toggle="offcanvas">

            <i class="icon ion-ios-menu"></i>

            </a>

         </div>

         <div class="pageTitle">

            <img src="assets/img/icon/logo.png" class="image">

         </div>

         <!--<div class="right">

            <label for="searchInput" class="mb-0 icon toggleSearchbox">

            

                <i class="icon ion-ios-search"></i>

            

            </label>

            

            </div> -->

      </div>

      <!-- searchBox -->

      <div id="searchBox">

         <form>

            <span class="inputIcon">

            <i class="icon ion-ios-search"></i>

            </span>

            <input type="text" class="form-control" id="searchInput" placeholder="Search...">

            <a href="javascript:;" class="toggleSearchbox closeButton">

            <i class="icon ion-ios-close-circle"></i>

            </a>

         </form>

      </div>

      <!-- * searchBox -->

      <!-- * App Header -->

      <!-- App Capsule -->

      <div id="appCapsule">

         <div class="appContent">

            <br>

            <li class="splide__slide">

               <a href="https://gbuapp.altervista.org/uppo/" class="card card-overlay text-white ripple" id="startour" data-ripple-color="#ce814d" onclick="delayedRedirect(event)">

                  <img src="assets/img/sample/uppo.jpg" class="card-img img-fluid" alt="image">

                  <div class="card-img-overlay">

                     <div class="header row">

                        <!--<div class="col-8">CONVEGNI</div>-->

                        <!--<div class="col-4 text-end">

                           <i class="icon ion-ios-eye"></i> 12K

                        </div>-->

                     </div>

                     <div class="content">

                        <!--<h1>Convegno Nazionale GBU: iscrizioni aperte</h1>-->

                        <footer>

                           <div class="author">

                              <img src="assets/img/icon/logo.png" alt="avatar">

                              <!--Edizioni GBU-->

                           </div>

                           <div class="date">

                            <!-- 2 ore fa -->

                           </div>

                        </footer>

                     </div>

                  </div>

               </a>

            </li>

            <!-- Card Overlay Carousel -->

            <div class="carousel-single splide mt-2 mb-4">

               <div class="splide__track">

                  <ul class="splide__list">

                     <!-- slide -->

                     <li class="splide__slide">

                        <a href="https://edizionigbu.it/" class="card card-overlay text-white ripple" data-ripple-color="#6b6c6e" onclick="delayedRedirect(event)">

                           <img src="assets/img/sample/edizionineg.jpg" class="card-img img-fluid" alt="image">

                           <div class="card-img-overlay">

                              <div class="header row">

                                 <!--<div class="col-8">CATEGORIA</div>-->

                                 <!--<div class="col-4 text-end">

                                    <i class="icon ion-ios-eye"></i> 523

                                 </div>-->

                              </div>

                              <div class="content">

                                <!-- <h1>Esplorare il Cristianesimo</h1>-->

                                 <footer>

                                    <div class="author">

                                      <!-- <img src="assets/img/icon/logo.png" alt="avatar">-->

                                      <!-- Edizioni GBU-->

                                    </div>

                                    <div class="date">

                                      <!-- 5 ore fa -->

                                    </div>

                                 </footer>

                              </div>

                           </div>

                        </a>

                     </li>

                     <!-- * slide -->

                     <!-- slide -->

                     <li class="splide__slide">

                        <a href="https://edizionigbu.it/esplorare-il-cristianesimo/" class="card card-overlay text-white ripple" data-ripple-color="#f2667a" onclick="delayedRedirect(event)">

                           <img src="assets/img/sample/ec.jpg" class="card-img img-fluid" alt="image">

                           <div class="card-img-overlay">

                              <div class="header row">

                                 <!--<div class="col-8">CATEGORIA</div>-->

                                 <!--<div class="col-4 text-end">

                                    <i class="icon ion-ios-eye"></i> 523

                                 </div>-->

                              </div>

                              <div class="content">

                                <!-- <h1>Esplorare il Cristianesimo</h1>-->

                                 <footer>

                                    <div class="author">

                                      <!-- <img src="assets/img/icon/logo.png" alt="avatar">-->

                                      <!-- Edizioni GBU-->

                                    </div>

                                    <div class="date">

                                      <!-- 5 ore fa -->

                                    </div>

                                 </footer>

                              </div>

                           </div>

                        </a>

                     </li>

                     <!-- * slide -->    

                     <!-- slide -->

                     <li class="splide__slide">

                        <a href="https://dirs.gbu.it/" class="card card-overlay text-white ripple" data-ripple-color="#299c41" onclick="delayedRedirect(event)">

                           <img src="assets/img/sample/dirs.jpg" class="card-img img-fluid" alt="image">

                           <div class="card-img-overlay">

                              <div class="header row">

                                 <!--<div class="col-8">CATEGORIA</div>-->

                                 <!--<div class="col-4 text-end">

                                    <i class="icon ion-ios-eye"></i> 523

                                 </div>-->

                              </div>

                              <div class="content">

                                <!-- <h1>Esplorare il Cristianesimo</h1>-->

                                 <footer>

                                    <div class="author">

                                      <!-- <img src="assets/img/icon/logo.png" alt="avatar">-->

                                      <!-- Edizioni GBU-->

                                    </div>

                                    <div class="date">

                                      <!-- 5 ore fa -->

                                    </div>

                                 </footer>

                              </div>

                           </div>

                        </a>

                     </li>

                     <!-- * slide --> 

                     <!-- slide -->

                     <li class="splide__slide">

                        <a href="https://dirs.gbu.it/evento/convegno-di-studi-gbu-2025/" class="card card-overlay text-white ripple" onclick="delayedRedirect(event)">

                           <img src="assets/img/sample/convegno2.png" class="card-img img-fluid" alt="image">

                           <div class="card-img-overlay">

                              <div class="header row">

                                 <!--<div class="col-8">CATEGORIA</div>-->

                                 <!--<div class="col-4 text-end">

                                    <i class="icon ion-ios-eye"></i> 523

                                 </div>-->

                              </div>

                              <div class="content">

                                <!-- <h1>Esplorare il Cristianesimo</h1>-->

                                 <footer>

                                    <div class="author">

                                      <!-- <img src="assets/img/icon/logo.png" alt="avatar">-->

                                      <!-- Edizioni GBU-->

                                    </div>

                                    <div class="date">

                                      <!-- 5 ore fa -->

                                    </div>

                                 </footer>

                              </div>

                           </div>

                        </a>

                     </li>

                     <!-- * slide -->          

                      <!-- slide -->

                      <li class="splide__slide">

                        <a href="https://www.whatsapp.com/channel/0029VaEbzAk3wtb7BK2a703O" class="card card-overlay text-white ripple" data-ripple-color="#a8e678" onclick="delayedRedirect(event)">

                           <img src="assets/img/sample/canalewa.jpg" class="card-img img-fluid" alt="image">

                           <div class="card-img-overlay">

                              <div class="header row">

                                 <!--<div class="col-8">CATEGORIA</div>-->

                                 <!--<div class="col-4 text-end">

                                    <i class="icon ion-ios-eye"></i> 523

                                 </div>-->

                              </div>

                              <div class="content">

                                <!-- <h1>Esplorare il Cristianesimo</h1>-->

                                 <footer>

                                    <div class="author">

                                      <!-- <img src="assets/img/icon/logo.png" alt="avatar">-->

                                      <!-- Edizioni GBU-->

                                    </div>

                                    <div class="date">

                                      <!-- 5 ore fa -->

                                    </div>

                                 </footer>

                              </div>

                           </div>

                        </a>

                     </li>

                     <!-- * slide -->           

                     <!-- slide -->

                     <li class="splide__slide">

                        <a href="https://gbu.it" class="card card-overlay text-white ripple">

                           <img src="assets/img/sample/gbustudenti.jpg" class="card-img img-fluid" alt="image">

                           <div class="card-img-overlay">

                              <div class="header row">

                                 <!--<div class="col-8">CATEGORIA</div>-->

                                 <!--<div class="col-4 text-end">

                                    <i class="icon ion-ios-eye"></i> 523

                                 </div>-->

                              </div>

                              <div class="content">

                                <!-- <h1>Esplorare il Cristianesimo</h1>-->

                                 <footer>

                                    <div class="author">

                                      <!-- <img src="assets/img/icon/logo.png" alt="avatar">-->

                                      <!-- Edizioni GBU-->

                                    </div>

                                    <div class="date">

                                      <!-- 5 ore fa -->

                                    </div>

                                 </footer>

                              </div>

                           </div>

                        </a>

                     </li>

                     <!-- * slide -->        

                  </ul>

               </div>

            </div>


            <!-- * Card Overlay Carousel -->

            

            

            

            

            <!-- Post Carousel -->

            

<!-- ----------------------------------------------------------------------- -->

<!--   nella index.html to include here from /inutilizzati/nellaindex.html   -->

<!-- ----------------------------------------------------------------------- -->




<a href="notification.html?nocache=7.0" class="card text-white bg-dark mb-3 ripple" style="margin-top: 30px; position: relative; overflow: hidden;" onclick="delayedRedirect(event)">
   <div class="notification-dot" id="notificationDot"></div> <!-- Pallino rosso sopra la card -->

   <div class="card-body">
       <div class="row">
           <div class="col-auto">
               <lord-icon
                   src="https://cdn.lordicon.com/lznlxwtc.json"
                   trigger="click"
                   colors="primary:#ffffff"
                   style="width:30px;height:30px"
                   target=".card-body">
               </lord-icon>
           </div>
           <div class="col">
               <h5 class="card-title">Notifiche e comunicazioni</h5>
           </div>
       </div>
       <p class="card-text">Clicca per visualizzare tutte le notifiche e le comunicazioni da Edizioni GBU.</p>
   </div>
</a>


         </div>





         </div>

         <!-- app Footer -->

         <div w3-include-html="footer.html"></div>

         <script>

            document.addEventListener("DOMContentLoaded", function() {

            

               includeHTML();

            

            });

            

            

            

         </script>

         <!-- * app Footer -->

      </div>

      <!-- * appCapsule -->

      <!-- Inclusioni menu e bottombar -->

      <!--<div w3-include-html="bottombar.html"></div>-->

      <div w3-include-html="menus.html"></div>

      <!-- Inclusioni menu e bottombar -->

      <!-- ///////////// Js Files ////////////////////  -->

      <!-- Bootstrap-->

      <script src="assets/js/lib/bootstrap.bundle.min.js"></script>

      <!-- Splide -->

      <script src="assets/js/plugins/splide/splide.min.js"></script>

      <!-- Main Js File -->

      <script src="assets/js/app.js?v=3"></script>

      <script>

         window.onload = function() {

         

             // Trova l'elemento con l'ID che sta nel menus.html o nel bottomenu e aggiungi la classe "active"

         

             var elemento = document.getElementById('home');

         

             elemento.classList.add('active');

         

         };

         

      </script>





<!-- Script delay for animation ripple button. in onlclick event of element insert this:  onclick="delayedRedirect(event)"-->



<script>

   function delayedRedirect(event) {

       // Previeni il comportamento predefinito del link (evita la navigazione immediata)

       event.preventDefault();



       // Verifica se l'elemento è stato trovato correttamente

       var linkElement = event.currentTarget;

       if (linkElement) {

           // Imposta il ritardo di 2 secondi (2000 millisecondi)

           setTimeout(function() {

               // Recupera l'URL dal link

               var linkUrl = linkElement.getAttribute("href");



               // Effettua la redirezione

               window.location.href = linkUrl;

           }, 500);

       }

   }

</script>



<!-- Usetiful script start -->

<script>

   (function (w, d, s) {

       var a = d.getElementsByTagName('head')[0];

       var r = d.createElement('script');

       r.async = 1;

       r.src = s;

       r.setAttribute('id', 'usetifulScript');

       r.dataset.token = "61d24bc286ce124d87e489561029406f";

                           a.appendChild(r);

     })(window, document, "https://www.usetiful.com/dist/usetiful.js");</script>

   

   <!-- Usetiful script end -->

   
   <script>
      // ID univoco della notifica (puoi cambiare questo valore ogni volta che vuoi che il pallino si rivisualizzi)
      const notificationId = '45'; // Cambialo in base alla data o all'evento
  
      // Data e ora di inizio (7 settembre 2024, 09:00 AM)
      const startDate = new Date('2024-10-22T11:30:00'); 
  
      // Data e ora di fine (8 settembre 2024, 05:00 PM)
      const endDate = new Date('2024-11-23T12:00:00');   
  
      // Data e ora attuali
      const today = new Date();
  
      // Verifica se l'ora corrente è entro l'intervallo di data e ora
      const isWithinDateRange = today >= startDate && today <= endDate;
  
      // Controlla se l'utente ha già cliccato questa notifica specifica
      const notificationClicked = localStorage.getItem('notificationClicked-' + notificationId);
  
      window.onload = function() {
          const notificationDot = document.getElementById('notificationDot');
          
          // Mostra il pallino solo se non è stato cliccato e siamo entro l'intervallo di data e ora
          if (!notificationClicked && isWithinDateRange) {
              notificationDot.style.display = 'block';
          } else {
              notificationDot.style.display = 'none';
          }
      };
  
      function delayedRedirect(event) {
          // Nasconde il pallino e salva lo stato della notifica specifica nel localStorage
          localStorage.setItem('notificationClicked-' + notificationId, 'true');
          document.getElementById('notificationDot').style.display = 'none';
      }
  </script>
  
  


<!-- Script delay for animation ripple button. in onlclick event of element insert this:  onclick="delayedRedirect(event)"-->



   </body>

</html>