Tè e Patate by @virginia.albanese - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

Referenze

autofocusAttiva un elemento al caricamento della pagina.
<head>Tag primario di un documento HTML
<tfoot>Definisce il footer o sezione inferiore di una tabella.
<canvas>Tag per disegnare grafica dinamica su pagine web.
formenctypeDefinisce il tipo di codifica dei dati di un elemento input
formSpecifica a quale form appartiene un elemento.

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

inserimento immagini in un testo

passi avanti regioni italiane

Autovalutazione.it

04_Operators and Expressions

Arianna è un\'informatica ora

Costruzione di tabella con html5

Quiz ICF — 60 domande (Sotto-com

HTML

CSS

JS

terminal console

feedback

add_box Nuovo

cookie Informativa

Informativa privacy e cookies

Utilizziamo cookie o tecnologie per finalità tecniche e, con il tuo consenso, anche per altre finalità come specificato nella cookie policy. Il rifiuto del consenso può rendere non disponibili alcune funzioni. Leggi di più sull'informativa privacy

Clicca su “Accetta” per acconsentire.

<!DOCTYPE html>
<html lang="it">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tè e Patate</title>
    
    <link href="Te-e-patate.css" rel="stylesheet">
    <!--Link a Bootstrap-->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
    <link rel="stylesheet" href="styles.css">
    
    <!--Link al font per h1-->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Afacad+Flux:wght@100..1000&family=Barriecito&family=Londrina+Sketch&family=Playwrite+GB+S:ital,wght@0,100..400;1,100..400&display=swap" rel="stylesheet">
    
    <!--Link al font per p-->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Afacad+Flux:wght@100..1000&display=swap" rel="stylesheet">

    <!--Link al font per i prezzi-->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Chicle&display=swap" rel="stylesheet">

    <style>
        .section { display: none; }  /* Nascondi tutte le sezioni inizialmente */
        .section.active { display: block; }  /* Mostra la sezione attiva */
    </style>
    
</head>
<body>
  
    <!-- Navigation Bar -->
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <div class="container-fluid">
            <a class="navbar-brand" href="#" onclick="showSection('home')">Tè e Patate</a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                    <li class="nav-item"><a class="nav-link" href="#" onclick="showSection('idea')"> L'idea</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" onclick="showSection('materia')">Materia Prima</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" onclick="showSection('menu')">Menù</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" onclick="showSection('spazi')">Gli Spazi</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" onclick="showSection('contatti')">Contatti</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" onclick="showSection('shop')">Shop</a></li>
                </ul>
                
                <!-- Search Form -->
                <form class="d-flex col-md-4 col-lg-4" onsubmit="return performSearch(event)">
                    <input id="searchInput" class="form-control me-2" type="search" placeholder="Search" aria-label="Search" required>
                    <button class="btn btn-outline-success" type="submit">Search</button>
                </form>

                <ul class="navbar-nav ms-auto">
                    <li class="nav-item"><a class="nav-link" href="?lang=it">IT</a></li>
                    <li class="nav-item"><a class="nav-link" href="?lang=en">EN</a></li>
                </ul>
            </div>
        </div>
    </nav>

    <!-- Sezioni del sito -->
    <div id="home" class="section active">
        <div class="container mt-5">
            <h1> <br> Tè e Patate</h1>
            <p> <strong> Scopri "Tè e Patate"! </strong> Un luogo dove il tè caldo incontra il comfort delle patate, perfetto per ogni occasione. Sia che tu voglia goderti un momento di tranquillità o condividere un pasto con gli amici, qui troverai un ambiente accogliente e caloroso. Lasciati avvolgere da profumi e sapori unici, e trasforma ogni momento in un'esperienza indimenticabile! </p>
        </div>
    </div>
  
    <div id="idea" class="section">
        <div class="container mt-5">
            <h1>L'idea </h1>
            <p> Quante volte ti è capitato di essere fuori casa e desiderare irresistibilmente un tè caldo e delle patate al forno? A noi di "Tè e Patate" è successo più volte, e siamo certi che anche tu conosci bene questa sensazione. Chissà quante volte sei entrato in un bar qualsiasi, e alla tua richiesta di tè e patate, il cameriere ti ha guardato con uno sguardo perplesso. E che dire degli sguardi giudicanti quando finalmente ti servivano il tuo pasto tanto atteso?
               <br> Hai mai sognato di trovare un luogo dove poter gustare tè caldo e patate fumanti in compagnia dei tuoi amici, senza giudizi e con la gioia di assaporare ciò che ami?
              <br> Bene, amico mio, quel sogno è diventato realtà! Ti aspettiamo da "Tè e Patate" per offrirti un'esperienza unica, dove il calore del tè e il sapore delle patate al forno si incontrano in un abbraccio perfetto. Vieni a scoprire il nostro angolo di felicità, dove ogni sorso e ogni morso raccontano una storia di passione e convivialità. Ti aspettiamo!!!  </p>
        </div>
    </div>

    <div id="materia" class="section">
      <div class="container mt-5">
          <h1>I Prodotti della nostra terra</h1>
            <!--Il Te'-->
          <div>
              <h2> Il Tè </h2>
              <img src="https://www.ilgiornaledelcibo.it/wp-content/uploads/2019/02/fasi-coltivazione-te.jpg">
              <img src="https://ilvasodipandoro.com/wp-content/uploads/2022/03/essiccazione-te-produzione.jpg">
              <img src="https://cdn.shopify.com/s/files/1/0558/5125/3936/files/dhyana-tea-arrotolamento-meccanico-delle-foglie.jpg?v=1626078073">
              <p> <strong> La Qualità che si sente ad ogni sorso!</strong>
              Da noi, la passione per il tè inizia con la scelta della materia prima. Offriamo un'incredibile selezione di tè 100% italiani, raccolti a mano da esperti artigiani che rispettano la tradizione e l'ambiente. Ogni varietà è attentamente lavorata per preservare le sue proprietà aromatiche e benefiche, garantendo un infuso dal gusto autentico e avvolgente.</p>
          </div>

            <!--Le patate-->
          <div>
              <h2> Le patate </h2>
              <img src="https://valfruttaweb.blob.core.windows.net/files/immagini/immagini-blog/coltivare-patate/coltivare-patate-5.jpg">
              <img src="https://www.coltivarefacile.it/wp-content/uploads/2023/07/raccolta-patate.webp">
              <img src="https://st2.depositphotos.com/5444644/9324/i/450/depositphotos_93247336-stock-photo-freshly-harvested-unwashed-potatoes-in.jpg">
              <p> <strong> L'Essenza della Qualità nelle Nostre Patate!</strong>
                Le patate che utilizziamo provengono da agricoltori locali che praticano un'agricoltura sostenibile e attenta. Ogni fase del processo di coltivazione è gestita con cura, dalla preparazione del terreno alla raccolta, garantendo patate fresche e saporite. <br> <br>
              
              Il Nostro Impegno per la Qualità: <br>
              <ul>
                <li><strong>Raccolta Manuale</strong>: Le nostre patate sono raccolte a mano per preservare l'integrità del tubero e garantire una qualità superiore. </li>
                <li> <strong> Controllo di Qualità</strong>: Ogni raccolto è sottoposto a rigidi controlli per selezionare solo le patate migliori, caratterizzate da una pasta farinosa e un sapore autentico.</li>
                <li>  <strong> Filiera Corta</strong>: Collaboriamo direttamente con produttori locali, riducendo l'impatto ambientale e supportando l'economia della nostra comunità. </li>
              </ul>
              
              </p>
          </div>
      </div>
    </div>
    
    <div id="menu" class="section">
        <div class="container mt-5">
            <h1>Il nostro Menù</h1>
            <p>Benvenuti da <strong>Té e Patate</strong>, dove ogni giorno selezioniamo con cura i migliori infusi e le più pregiate patate della nostra terra, per offrirvi un'esperienza culinaria unica.</p>
            <p>Il nostro menù varia quotidianamente, proponendo una combinazione esclusiva di un singolo tipo di tè e un singolo tipo di patate, scelti con maestria dal nostro chef. Vi invitiamo a gustare la proposta del giorno, in quanto, secondo la nostra filosofia, non è possibile richiedere alternative. Inoltre, il menù comprende sempre entrambe le portate, che non possono essere ordinate separatamente.  </p>
            <p>Siamo felici di offrirvi tre opzioni di porzione – small, medium e large – con la possibilità di una porzione baby dedicata ai bambini sotto i 12 anni.</p>
        </div>

        <div class="proposte_menu">

          <div class="box" id="small" >
            <p>SMALL</p>
            <div id="small-price" class="price">€4.00</div>
          </div>

          <div class="box" id="medium" >
            <p>MEDIUM </p>
            <div id="medium-price" class="price" > €5.50</div>
          </div>

          <div class="box" id="large">
            <p>LARGE</p>
            <div id="large-price" class="price" >€7.00</div>
          </div>

        </div>
    </div>

    <div id="spazi" class="section">
        <div class="container mt-5">
            <h1>I nostri Spazi</h1>
            <p> <strong> Scopri il nostro angolo di relax e convivialità! </strong> <br>

        Presso "Tè e patate", abbiamo creato due ambienti unici, pensati per soddisfare ogni tua esigenza.
        <ul>
          <li>
        <strong> Area Ristorazione </strong> <br>
        Immagina di sederti a uno dei nostri tavoli accoglienti, dove puoi gustare le nostre deliziose patate e sorseggiare un tè aromatico in tutta tranquillità. Che tu stia cercando un pranzo rilassante o un momento di pausa dalla frenesia quotidiana, qui troverai il posto ideale per goderti un pasto genuino e soddisfacente. Per chi ha fretta, abbiamo anche tavolini alti da bar, perfetti per mangiare al volo due patate croccanti e bere un sorso di tè.</li>
          <li>
        <strong> Sala Relax </strong> <br>
        In un'atmosfera più informale, la nostra sala con divanetti e libreria è il luogo perfetto per riunirsi con gli amici, gustare ottime patate e sorseggiare tè, mentre ci si scambia idee e risate. Questo spazio è ideale anche per studiare o tenere meeting di lavoro in un contesto stimolante e accogliente, dove puoi lasciarti ispirare dalla tranquillità e dalla bellezza dei nostri ambienti.</li> </p>
            <div id="caffetteria-e-salotto">
              <div id="caffetteria">
                <img src="https://storage.googleapis.com/a1aa/image/ySFSZg4s2WpxHlN4Uz8nr05qzq0kreQRARnMT4XUFxk05O0JA.jpg">
              </div>
              <div id="salotto">
                <img src="https://storage.googleapis.com/a1aa/image/f8o35qNCfgnfbo1oSedrqxmP5qyBxGDSJQyQTnkp7gkjImiOB.jpg">
              </div>
            </div>
        </div>
    </div>

    <div id="contatti" class="section">
        <div class="container mt-5">
            <h1>Contattaci!</h1>
            <p>
<strong> Ci Piace Rimanere in Contatto!</strong> <br>

Hai domande, suggerimenti o semplicemente vuoi condividere la tua esperienza da noi? Siamo qui per te!<br> Di seguito i nostri contatti. <br> <br>

<strong> Indirizzo </strong> <br>
<em>Tè e patate</em>, Via delle Patate, 5 - 
San Martino di Lupari (PD) <br> <br>

 <strong> Telefono</strong>:
049 595 2326 <br> <br>

<strong> Email</strong>:
te&patate@e-mail.it <br> <br>

<strong> Orari di Apertura</strong>: <br>

Lunedì - Venerdì: 10:00 - 20:00<br>
Sabato - Domenica: 10:00 - 22:00<br><br>

Vieni a trovarci e lasciati conquistare dal nostro mondo di tè e patate!


            </p>
        </div>
    </div>

    <div id="shop" class="section">
     <div class="container mt-5 comingsoon">
            <h1> Il nostro Shop </h1>
            <p style ="color: black"> E' in arrivo il merchandizing di Tè e Patate! Rimanete sintonzzati per non perdere le novità! </p>
            <img src="https://i.postimg.cc/2yBcHwRg/59e7adfd-e5b0-4a3f-ae55-65fbb14b9d2c.png";>
      </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>

    <!-- Script per gestire la navigazione e la ricerca -->
    <script>
      function showSection(sectionId) {
          var sections = document.querySelectorAll('.section');
          sections.forEach(function(section) {
              section.style.display = 'none';  // Nasconde tutte le sezioni
          });
          document.getElementById(sectionId).style.display = 'block';  // Mostra la sezione selezionata
      }

      function performSearch(event) {
          event.preventDefault();  // Impedisce il comportamento di invio del modulo
          var searchQuery = document.getElementById('searchInput').value.toLowerCase();
          var sections = document.querySelectorAll('.section');

          sections.forEach(function(section) {
              if (section.id === 'home' || section.id === 'idea' || section.id === 'materia' || section.id === 'menu' || section.id === 'spazi' || section.id === 'contatti' || section.id === 'shop') {
                  var sectionText = section.innerText.toLowerCase();
                  if (sectionText.includes(searchQuery)) {
                      showSection(section.id);  // Mostra la sezione se il testo corrisponde
                  }
              }
          });
      }
    </script>

</body>
</html>

/* Colori della palette */
:root {
    --color-viola: rgb(141, 106, 159);      /* Viola */
    --color-grigio: #C5CBD3;     /* Grigio */
    --color-verde-acqua: #8CBCB9; /* Verde acqua */
    --color-giallo: #DDA448;      /* Giallo */
    --color-rosso: #BB342F;       /* Rosso */
}


/* Navbar */
.navbar {
    background-color: var(--color-grigio); /* Colore di sfondo della navbar */
    font-family: "Afacad Flux", sans-serif; /* Cambia con il font desiderato*/
    
}

/* Brand */
.navbar-brand {
    font-family: "Barriecito", system-ui; 
    font-size: 24px; /* Cambia la dimensione del testo */
    color: var(--color-viola); /* Colore del brand */
}

/* Colore dei link della navbar */
.navbar-nav .nav-link {
    font-family: "Afacad Flux", sans-serif; /* Cambia il font dei link */
    color: var(--color-rosso); /* Colore iniziale dei link */
    font-size: 18px; /* Cambia la dimensione del testo */
    transition: color 0.3s ease; /* Aggiunge una transizione per l'hover */
}

/* Colore dei link al passaggio del mouse */
.navbar-nav .nav-link:hover {
    color: var(--color-giallo); /* Colore giallo al passaggio del mouse */
}

/* Colore attivo dei link */
.navbar-nav .nav-link.active {
    color: var(--color-giallo); /* Colore giallo per il link attivo */
}

/* Colore del pulsante "Search" */
.btn-outline-success {
    color: var(--color-verde-acqua); /* Colore del testo del pulsante */
    border-color: var(--color-verde-acqua); /* Colore del bordo */
}

/* Colore di sfondo e del testo del pulsante "Search" al passaggio del mouse */
.btn-outline-success:hover {
    background-color: var(--color-verde-acqua); /* Sfondo verde acqua */
    color: white; /* Testo bianco */
}

/* Colore dei link IT/EN */
.navbar-nav .nav-item .nav-link {
    color: var(--color-viola); /* Colore viola per IT/EN */
}

/* Colore al passaggio del mouse per IT/EN */
.navbar-nav .nav-item .nav-link:hover {
    color: var(--color-giallo); /* Colore giallo per IT/EN */
}

.section{
  margin: 0% !important;
  padding: 0% !important;
}

.container{    
    background-color: rgba(67, 38, 80, 0.7);/*rgba(0, 0, 0, 0.7);*/
    padding: 5%;
    margin-top: 0% !important;
    margin: 60px;
    border-radius: 15px;
}
/* Colore del titolo delle sezioni */
h1 {
    font-family: "Barriecito", system-ui;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    font-size: 70px; /* Corretto da size a font-size */
    color: var(--color-grigio); /* Assicurati che la variabile sia definita correttamente */
}

h2{
    font-family: "Barriecito", system-ui;
    font-size: 45px;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    font-variation-settings: "slnt" 0;
    color:#8CBCB9;
}

p{
    font-family: "Afacad Flux", sans-serif;
    font-size: 18px;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "slnt" 0;
    color: var(--color-grigio);
}

ul{
  font-family: "Afacad Flux", sans-serif;
    font-size: 18px;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "slnt" 0;
    color: var(--color-grigio);
}


/* Immagini di sfondo delle varie pagine*/
#home{
    background-image: url(https://i.postimg.cc/G2gz9CLk/7968d7ca-d22c-4c5b-bb25-446a3b11a55b.jpg);
    height: 100vh; /* Imposta l'altezza al 100% della viewport */
    background-size: cover; /* L'immagine copre l'intero schermo */
    background-repeat: no-repeat; /* Evita che l'immagine si ripeta */
    background-position: center; /* Centra l'immagine */
    background-attachment: fixed; /* L'immagine rimane fissa durante lo scroll */
}

#idea{
    background-image: url(https://i.postimg.cc/sxFQT6Kk/6d9abcd8-60be-4006-a808-20ff8544728e.jpg);
    height: 100vh; /* Imposta l'altezza al 100% della viewport */
    background-size: cover; /* L'immagine copre l'intero schermo */
    background-repeat: no-repeat; /* Evita che l'immagine si ripeta */
    background-position: center; /* Centra l'immagine */
    background-attachment: fixed; /* L'immagine rimane fissa durante lo scroll */
}

#materia{
  background-image: url(https://www.laterradipuglia.it/wp-content/uploads/tavoliere-puglie-cosa-sapere.jpg);
    height: 100vh; /* Imposta l'altezza al 100% della viewport */
    background-size: cover; /* L'immagine copre l'intero schermo */
    background-repeat: no-repeat; /* Evita che l'immagine si ripeta */
    background-position: center; /* Centra l'immagine */
    background-attachment: fixed; /* L'immagine rimane fissa durante lo scroll */
}

#materia img{
  width: 33%;
  height: 200px;
  max-width: 100%;
}

#menu{
    background-image: url(https://i.postimg.cc/9fWv7chS/Senza-titolo-Presentazione.jpg);
    height: 100vh; /* Imposta l'altezza al 100% della viewport */
    background-size: cover; /* L'immagine copre l'intero schermo */
    background-repeat: no-repeat; /* Evita che l'immagine si ripeta */
    background-position: center; /* Centra l'immagine */
    background-attachment: fixed; /* L'immagine rimane fissa durante lo scroll */
}

.proposte_menu {
    display: flex;
    justify-content: space-between;
}

.box {
    width: 33%;
    margin: 2%;
    padding-top: 40px !important;
    padding: 12%;    
    border: 1px solid var(--color-rosso);
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
    border-radius: 15px;
    position: relative; /* Aggiunta per gestire il posizionamento interno */
}

.box p {
    font-family: "Barriecito", system-ui; 
    font-size: 24px; /* Cambia la dimensione del testo */
    color: var(--color-viola); /* Colore del brand */
    text-align: center; /* Centra il testo all'interno del box orizzontalmente */
    margin: 0; /* Rimuove margini che potrebbero spostare il testo */
    position: absolute;
    top: 10px; /* Posiziona il testo in alto, regolabile */
    left: 50%;
    transform: translateX(-50%); /* Assicura che il testo sia centrato orizzontalmente */
}

#small {
    background-image: url(https://storage.googleapis.com/a1aa/image/fj0vlXg8TsxzT6T1FTKsqkqr4eTm34NubdKzSfgUpbZVfvhOB.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


#medium{
    background-image: url(https://storage.googleapis.com/a1aa/image/iKaOR3FjCiLEJRfttzl3bNKoV1b9iZARENq9Tx8dDGOLvO0JA.jpg);
    background-size: cover; /* Rende l'immagine di sfondo coprente */
    background-position: center; /* Centra l'immagine nello sfondo */
    background-repeat: no-repeat; /* Evita che l'immagine si ripeta */
}

#large{
    background-image: url(https://storage.googleapis.com/a1aa/image/YGYouT1U0Ta4NtKtA64vce7XcIbbCDbtXEDAJUBQXp5kzO0JA.jpg);
    background-size: cover; /* Rende l'immagine di sfondo coprente */
    background-position: center; /* Centra l'immagine nello sfondo */
    background-repeat: no-repeat; /* Evita che l'immagine si ripeta */
}

.price{
    justify-content: center; /* Allinea il testo al centro orizzontalmente */
    align-items: flex-start; /* Allinea il testo in alto verticalmente */
    font-size: 50px;
    font-family: "Chicle", serif;
    font-weight: 400;
    font-style: normal;
    text-shadow: 
        -1px -1px 0px var(--color-grigio),  
        1px -1px 0px var(--color-grigio),
        -1px 1px 0px var(--color-grigio),
        1px 1px 0px var(--color-grigio);
}

#spazi{

  background-image: url(https://storage.googleapis.com/a1aa/image/ySFSZg4s2WpxHlN4Uz8nr05qzq0kreQRARnMT4XUFxk05O0JA.jpg);
    height: 100vh; /* Imposta l'altezza al 100% della viewport */
    background-size: cover; /* L'immagine copre l'intero schermo */
    background-repeat: no-repeat; /* Evita che l'immagine si ripeta */
    background-position: center; /* Centra l'immagine */
    background-attachment: fixed; /* L'immagine rimane fissa durante */
}

#caffetteria-e-salotto{
  display: flex; 
}

#spazi img{
  max-width: 100%;
}

#contatti{
  background-image: url(https://i.postimg.cc/xdpZsBms/Progetto-senza-titolo-1.jpg);
    height: 100vh; /* Imposta l'altezza al 100% della viewport */
    background-size: cover; /* L'immagine copre l'intero schermo */
    background-repeat: no-repeat; /* Evita che l'immagine si ripeta */
    background-position: center; /* Centra l'immagine */
    background-attachment: fixed; /* L'immagine rimane fissa durante lo scroll */
}

#shop{
  background-image: url(https://i.postimg.cc/4x4kBDyc/Progetto-senza-titolo-4.jpg);
    height: 100vh; /* Imposta l'altezza al 100% della viewport */
    background-size: cover; /* L'immagine copre l'intero schermo */
    background-repeat: no-repeat; /* Evita che l'immagine si ripeta */
    background-position: center; /* Centra l'immagine */
    background-attachment: fixed; /* L'immagine rimane fissa durante lo scroll */
}
#shop h1{
  color:#BB342F !important;
}

.comingsoon{
  background-color: rgba(197, 203, 211, 0.4) !important;
}