diff --git a/_layouts/default.html b/_layouts/default.html index 0d3cfa9..3dc7b0e 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -1,81 +1,75 @@ - - + {% seo %} - + + {% if page.tags %} {% endif %} - - - - - - - - + + + + + + + + + + + + - - - - {{ content }} - - -
-
-
-
#buoncittadino #servizio #fede
-
+ +
+ + +
+ {{ content }} +
- - + + - - + + diff --git a/_layouts/evento.html b/_layouts/evento.html index 90f7f71..fe6bf8d 100644 --- a/_layouts/evento.html +++ b/_layouts/evento.html @@ -1,200 +1,194 @@ --- layout: default --- - -
-
-
-
- {% include edit-button.html %} - - - - -
-

{{ page.hero.title }}

-

{{ page.hero.subtitle }}

-

- {{ page.hero.location }} | {{ page.hero.date }} | {{ page.hero.target }} -

- {{ page.cta.primary.text }} -
- - - -
-

{{ page.highlights_title | default: '10 motivi per cui questo evento è unico' }}

- {% for highlight in page.highlights %} -

{{ forloop.index }}. {{ highlight }}

- {% endfor %} -
- - -
- - - - - -

🎯 Questo evento è per te se...

-
    - {% for item in page.target_audience %} -
  • {% if item.icon contains 'fa-' %}{% else %}{{ item.icon }}{% endif %} {{ item.text }} "{{ item.highlight }}" {{ item.tail }}
  • - {% endfor %} -
-
- - - - - -
-

⚡ Se vieni, vivrai...

- {% for item in page.programma %} -
-

{{ item.title }}

-

{{ item.desc }}

-
- {% endfor %} -
- - {% if page.outcomes %} - -
-
-
-

🎓 {{ page.outcomes_title | default: 'Cosa porterai a casa' }}

-
    - {% for outcome in page.outcomes %} -
  • {{ outcome }}
  • - {% endfor %} -
- {% endif %} -
-
- - -
-

🚀 Logistica

-
-
- {% if page.logistica.quando.icon contains 'fa-' %}{% else %}{{ page.logistica.quando.icon }}{% endif %} {{ page.logistica.quando.label }} -

{{ page.logistica.quando.date }}
- Arrivo: {{ page.logistica.quando.arrivo }}
- Partenza: {{ page.logistica.quando.partenza }}

-
-
- {% if page.logistica.dove.icon contains 'fa-' %}{% else %}{{ page.logistica.dove.icon }}{% endif %} {{ page.logistica.dove.label }} -

{{ page.logistica.dove.citta }}
{{ page.logistica.dove.luogo }}

-
-
- {% if page.logistica.per_chi.icon contains 'fa-' %}{% else %}{{ page.logistica.per_chi.icon }}{% endif %} {{ page.logistica.per_chi.label }} -

{{ page.logistica.per_chi.text }}

-
-
- {% if page.logistica.posti.icon contains 'fa-' %}{% else %}{{ page.logistica.posti.icon }}{% endif %} {{ page.logistica.posti.label }} -

{{ page.logistica.posti.max }} massimo
- {{ page.logistica.posti.min }} minimo per confermare
- Waiting list: {{ page.logistica.posti.waiting }} persone

-
-
- {% if page.logistica.come_arrivare.icon contains 'fa-' %}{% else %}{{ page.logistica.come_arrivare.icon }}{% endif %} {{ page.logistica.come_arrivare.label }} -

{{ page.logistica.come_arrivare.text }}

-
-
- {% if page.logistica.cosa_portare.icon contains 'fa-' %}{% else %}{{ page.logistica.cosa_portare.icon }}{% endif %} {{ page.logistica.cosa_portare.label }} -

{{ page.logistica.cosa_portare.items }}

-
-
-
- {{ page.cta.secondary.text }} -
-
- - -
-

❓ FAQ

- {% for faq in page.faq %} -
-

{{ faq.q }}
{{ faq.a }}

-
- {% endfor %} -
- - -
- {{ page.hero.title }} -
- - -
-

📱 {{ page.social.title }}

-

{{ page.social.description }}
{{ page.social.hashtags }}

-
- - - {{ content }} - - -
-
+ +
+ + {% include edit-button.html %} + + +
+

{{ page.hero.title }}

+

{{ page.hero.subtitle }}

+

+ {{ page.hero.location }} + | {{ page.hero.date }} + | {{ page.hero.target }} +

+ {{ page.cta.primary.text }} +
+ + + {% if page.event_status == 'upcoming' %} +
+ PROSSIMO EVENTO +
+ {% elsif page.event_status == 'soldout' %} +
+ SOLD OUT +
+ {% elsif page.event_status == 'last_chance' %} +
+ ULTIMI POSTI +
+ {% endif %} + + {% if page.benefits %} + +
+

{{ page.benefits_title | default: 'Perché partecipare' }}

+
+ {% for benefit in page.benefits %} +
+
+ +
+

{{ benefit.title }}

+

{{ benefit.desc }}

+
+ {% endfor %} +
+
+ {% endif %} + + +
+

{{ page.highlights_title | default: '10 motivi per cui questo evento è unico' }}

+ {% for highlight in page.highlights %} +

{{ forloop.index }}. {{ highlight }}

+ {% endfor %} +
+ + +
+ + + + + +

🎯 Questo evento è per te se...

+
    + {% for item in page.target_audience %} +
  • + + {{ item.text }} "{{ item.highlight }}" {{ item.tail }} +
  • + {% endfor %} +
+
+ + + + + +
+

⚡ Se vieni, vivrai...

+ {% for item in page.programma %} +
+

{{ item.title }}

+

{{ item.desc }}

+
+ {% endfor %} +
+ + {% if page.outcomes %} + +
+

🎓 {{ page.outcomes_title | default: 'Cosa porterai a casa' }}

+
    + {% for outcome in page.outcomes %} +
  • {{ outcome }}
  • + {% endfor %} +
+
+ {% endif %} + + +
+

🚀 Logistica

+
+
+ {{ page.logistica.quando.label }} +

{{ page.logistica.quando.date }}
+ Arrivo: {{ page.logistica.quando.arrivo }}
+ Partenza: {{ page.logistica.quando.partenza }}

+
+
+ {{ page.logistica.dove.label }} +

{{ page.logistica.dove.citta }}
{{ page.logistica.dove.luogo }}

+
+
+ {{ page.logistica.per_chi.label }} +

{{ page.logistica.per_chi.text }}

+
+
+ {{ page.logistica.posti.label }} +

{{ page.logistica.posti.max }} massimo
+ {{ page.logistica.posti.min }} minimo per confermare
+ Waiting list: {{ page.logistica.posti.waiting }} persone

+
+
+ {{ page.logistica.come_arrivare.label }} +

{{ page.logistica.come_arrivare.text }}

+
+
+ {{ page.logistica.cosa_portare.label }} +

{{ page.logistica.cosa_portare.items }}

+
+
+ +
+ + +
+

❓ FAQ

+ {% for faq in page.faq %} +
+

{{ faq.q }}
{{ faq.a }}

+
+ {% endfor %} +
+ + +
+ {{ page.hero.title }} +
+ + +
+

📱 {{ page.social.title }}

+

{{ page.social.description }}
{{ page.social.hashtags }}

+
+ + + {{ content }}
diff --git a/_layouts/page.html b/_layouts/page.html index 98a5858..5b803d1 100644 --- a/_layouts/page.html +++ b/_layouts/page.html @@ -1,18 +1,25 @@ --- layout: default --- - -
-
-
-
- - {% include edit-button.html %} -
-

{% if page.subtitle %} – {{ page.subtitle }}{% endif %}

-
- {{ content }} -
+ + +
+
+

{{ page.title }}

+ {% if page.subtitle %} +

{{ page.subtitle }}

+ {% endif %} +
+
+ + +
+
+
+ {% include edit-button.html %} +
+ {{ content }}
-
+
+ diff --git a/_layouts/post.html b/_layouts/post.html index 2618d5e..97d7ed7 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -1,20 +1,43 @@ --- layout: default --- - -
-
-
-
- - {% include edit-button.html %} -
-

{{ page.title }}

-
-
- {{ content }} -
-
+ + +
+
+

{{ page.title }}

+ {% if page.date %} +

{{ page.date | date: "%d %B %Y" }}

+ {% endif %} +
+
+ + +
+
+
+ {% if page.featured %} +
+ {{ page.title }} +
+ {% endif %} + + {% include edit-button.html %} + +
+ {{ content }}
-
+ + {% if page.tags %} +
+ +
+ {% endif %} +
+ diff --git a/_pages/about/about.md b/_pages/about/about.md index fae5cd0..ea247dc 100644 --- a/_pages/about/about.md +++ b/_pages/about/about.md @@ -4,8 +4,5 @@ permalink: /about/ title: About Bit Prepared Staff tags: [bitprepared, staff] modified: 2014-05-20 -image: - feature: about/staff_low.jpg - credit: Bit Prepared - creditlink: http:// +image: /assets/images/_fullsize/about/staff_low.jpg --- diff --git a/_pages/eventi/README_EVENTO.md b/_pages/eventi/README_EVENTO.md index 4d2576f..7d9e22b 100644 --- a/_pages/eventi/README_EVENTO.md +++ b/_pages/eventi/README_EVENTO.md @@ -203,6 +203,59 @@ Vedi `_pages/eventi/epppi_rs.md` per un esempio completo di tutti i campi utiliz --- +## Nuove Features (2026) + +### Event Status Badge + +Mostra automaticamente un badge animato in base allo stato dell'evento: + +```yaml +event_status: upcoming # upcoming, past, soldout, last_chance +event_date: 2026-07-29 # YYYY-MM-DD (richiesto per upcoming, opzionale per altri) +``` + +**Valori possibili:** +- `upcoming` — Badge verde "PROSSIMO EVENTO" (con animazione pulse) +- `soldout` — Badge grigio "SOLD OUT" (senza animazione) +- `last_chance` — Badge rosso "ULTIMI POSTI" (con animazione pulse) +- `past` — Nessun badge (evento passato) + +### Benefits Section + +Sezione di cards iconate per mostrare i vantaggi dell'evento: + +```yaml +benefits_title: "Perché partecipare" +benefits: + - icon: "fa-camera" + title: "Fotografia" + desc: "Descrizione breve del benefit" + - icon: "fa-map-marked-alt" + title: "Mapping" + desc: "Descrizione breve del benefit" + # ... minimo 4 benefits raccomandati +``` + +**Note:** +- Minimo 4 benefits raccomandati per layout grid bilanciato +- Usa icone FontAwesome Free (prefisso `fa-`) +- Le cards hanno hover effect con lift e shadow + +### Countdown Timer (Opzionale) + +Timer dinamico per eventi futuri: + +```yaml +event_status: upcoming +event_date: 2026-07-29 # YYYY-MM-DD +``` + +Il countdown appare automaticamente per eventi con `event_status: upcoming` e `event_date` definito. + +**Nota:** Richiede JavaScript `/assets/js/countdown.js` (implementazione futura) + +--- + ## Note Importanti - **Immagini**: Carica le locandine in `assets/images/` diff --git a/_pages/eventi/campo_eg.md b/_pages/eventi/campo_eg.md index fc34137..f846ed6 100644 --- a/_pages/eventi/campo_eg.md +++ b/_pages/eventi/campo_eg.md @@ -1,30 +1,156 @@ --- -layout: page -title: Bit Prepared -description: Campo di competenza per Esploratori e Guide -modified: {} -author: enrico +layout: evento permalink: /eventi/campo-eg/ -category: articles -tags: - - bitprepared - - eg - - specializzazioni -featured: images/esploratori-della-rete.png -published: true ---- +title: Campo di Competenza Esploratori e Guide +subtitle: Tecnologia scout per il digitale +tags: [bitprepared, eg, specializzazioni, campo competenza, esploratori, guide] +modified: 2026-04-21 +image: /assets/images/pages/campo-eg.jpg +event_status: upcoming +event_date: 2026-07-29 +benefits_title: "Perché partecipare al Campo EG" +benefits: + - icon: "fa-camera" + title: "Fotografia Digitale" + desc: "Impara a scattare foto fantastiche con smartphone e fotocamere digitali" + - icon: "fa-map-marked-alt" + title: "Mapping e Orienteering" + desc: "Crea mappe digitali e usa strumenti GPS per avanzate orienteering" + - icon: "fa-mobile-alt" + title: "Sviluppo App Mobile" + desc: "Scopri come funzionano le app e crea la tua prima applicazione" + - icon: "fa-wifi" + title: "Wireless e Reti" + desc: "Capisci come funziona internet e impara a configurare reti wireless" -Cosa è cambiato nello scautismo rispetto al 1907, al primo campo di Brownsea? -Come è cambiato il TUO modo di fare scoutismo, grazie alle tecnologie? -Sei in cammino per la conquista dei brevetti di Animazione grafica e multimediale, Animazione giornalistica e Amico della natura? +target_audience: + - icon: "fa-user-graduate" + text: "Sei un" + highlight: "Esploratore o Guida" + tail: "curioso di tecnologia" + - icon: "fa-laptop-code" + text: "Vuoi imparare" + highlight: "skill digitali" + tail: "da applicare nel tuo reparto" + - icon: "fa-users" + text: "Vuoi incontrare" + highlight: "altri ragazzi e ragazze" + tail: "con la tua passione" + - icon: "fa-certificate" + text: "Vuoi conseguire il" + highlight: "Brevetto Maestro delle Tecnologie" + tail: "" -![Sala computer](/assets/images/pages/campo-eg.jpg) +programma: + - title: "WELCOME DIGITAL" + desc: "Icebreaker tecnologici e presentazione attraverso strumenti digitali innovativi" + - title: "FOTOGRAFIA SCOUT" + desc: "Workshop fotografico: composizione, luce, editing con app e software gratuiti" + - title: "MAPPING ORIENTEERING" + desc: "Creazione mappe digitali e gara di orienteering con GPS e smartphone" + - title: "CODING GAMES" + desc: "Impara a programmare giocando: block coding, logica, algoritmi divertenti" + - title: "WIRELESS LAB" + desc: "Esperimenti pratici con reti wireless, antenna, segnale e comunicazione" + - title: "PROJECT SHOWCASE" + desc: "Presentazione finale dei lavori realizzati durante il campo" -Se vuoi avventurarti nella scoperta delle tecniche scout applicate all'informatica (e dell'informatica applicata alle tecniche scout), allora hai trovato il campo che fa per te! -Avrai la possibilità di utilizzare quello che già sai e di scoprire nuove possibili applicazioni di quello che pensi di conoscere... -Metterai a fuoco la fotografia come un vero fotoreporter, scoprirai come mappare l'ambiente che ti circonda dal palmo della mano, imparerai come gestire il tuo blog e...potrai contribuire allo sviluppo di una app utile a tutti gli EG d'Italia! -Google, social network, blog, connessioni wireless al campo, non saranno più un tabù per lo scautismo, mantenendo però lo stile che ci contraddistingue! -Potrai diventare anche tu molto geek (o molto nerd, se geek lo sei già!). +highlights: + - "L'unico campo che unisce SCOUTISMO e TECHNOLOGY" + - "Brevetto Maestro delle Tecnologie riconosciuto a livello nazionale" + - "Staff con anni di esperienza in campo educativo digitale" + - "Tutte le attività sono progettate per essere trasferibili nel reparto" + - "Kit di strumenti digitali da portare a casa" + - "Base scout immersa nella natura, perfetta per attività outdoor" + - "Max 20 partecipanti per un'esperienza di qualità" + - "Equilibrio perfetto tra momenti tecnici e vita scout" + - "Networking con altri EG da tutta Italia" + - "Diventerai punto di riferimento digitale nel tuo reparto" + +outcomes: + - "Brevetto Maestro delle Tecnologie conseguito" + - "Kit di strumenti digitali pratici per il reparto" + - "Competenze fotografiche e editing base" + - "Capacità di creare mappe digitali e usare GPS" + - "Nozioni base di programmazione e coding" + - "Consapevolezza sull'uso sicuro di internet e reti wireless" + - "Contatti e network con altri EG tech-enthusiast" + +hero: + title: "Campo di Competenza Esploratori e Guide" + subtitle: "Tecnologia scout per il digitale" + location: "Costigiola" + date: "29 Luglio - 2 Agosto 2026" + target: "Esploratori e Guide AGESCI" + +cta: + primary: + url: "https://buonacaccia.net/Event.aspx?e=24769" + text: "ISCRIVITI SUBITO - SOLO 20 POSTI" + secondary: + url: "https://buonacaccia.net/Event.aspx?e=24769" + text: "PRENOTA IL TUO POSTO SU BUONACACCIA.NET" +logistica: + quando: + icon: "fa-calendar" + label: "Quando" + date: "29 Luglio - 2 Agosto 2026" + arrivo: "29/7 pomeriggio" + partenza: "2/8 mattina" + dove: + icon: "fa-map-marker" + label: "Dove" + citta: "Costigiola" + luogo: "Base Scout Costigiola" + per_chi: + icon: "fa-users" + label: "Per chi" + text: "Esploratori e Guide AGESCI (11-16 anni)" + posti: + icon: "fa-bullseye" + label: "Posti" + max: 20 + min: 12 + waiting: 5 + come_arrivare: + icon: "fa-car" + label: "Come arrivare" + text: "Info dettagliate verranno inviate agli iscritti. La base è raggiungibile in auto o con i mezzi pubblici fino a Alba." + cosa_portare: + icon: "fa-backpack" + label: "Cosa portare" + items: "Sacco a pelo, Abbigliamento comodo e sportivo, Smartphone/Telefono, Quaderno e penna, Buona volontà :)" +faq: + - q: "L'evento è solo per AGESCI?" + a: "Sì, riservato a Esploratori e Guide AGESCI." + - q: "Servono competenze informatiche pregresse?" + a: "No, il campo è adatto a tutti i livelli. Partiamo dalle basi!" + - q: "Cosa include la quota?" + a: "Vitto, alloggio in base scout, materiali, assicurazione, attività e kit digitale da portare a casa." + - q: "Ci sono requisiti fisici particolari?" + a: "Attività scout normali. Serve solo voglia di partecipare e curiosità." + - q: "Le attività sono all'aperto?" + a: "Sì, alterniamo attività indoor e outdoor sfruttando la bellezza della base." + - q: "Posso annullare? Dubbi su buonacaccia?" + a: "https://buonacaccia.net/problem.aspx?Issue=Refunds" + - q: "Ho altre domande?" + a: "Scrivi a info@bitprepared.it" + +social: + title: "Condividi con il tuo reparto" + description: "Passaparola tra Esploratori e Guide della tua zona. Più siamo, più ci divertiamo!" + hashtags: "#AGESCI #BrancaEG #CampoEG #MaestroTecnologie #BitPrepared #ScoutTech #DigitalScout" +--- + +Cosa è cambiato nello scautismo rispetto al 1907, al primo campo di Brownsea? +Come è cambiato il TUO modo di fare scoutismo, grazie alle tecnologie? +Sei in cammino per la conquista dei brevetti di Animazione grafica e multimediale, Animazione giornalistica e Amico della natura? + +Se vuoi avventurarti nella scoperta delle tecniche scout applicate all'informatica (e dell'informatica applicata alle tecniche scout), allora hai trovato il campo che fa per te! +Avrai la possibilità di utilizzare quello che già sai e di scoprire nuove possibili applicazioni di quello che pensi di conoscere... +Metterai a fuoco la fotografia come un vero fotoreporter, scoprirai come mappare l'ambiente che ti circonda dal palmo della mano, imparerai come gestire il tuo blog e...potrai contribuire allo sviluppo di una app utile a tutti gli EG d'Italia! +Google, social network, blog, connessioni wireless al campo, non saranno più un tabù per lo scautismo, mantenendo però lo stile che ci contraddistingue! +Potrai diventare anche tu molto geek (o molto nerd, se geek lo sei già!). diff --git a/_pages/eventi/epppi_rs.md b/_pages/eventi/epppi_rs.md index bc70322..4876427 100644 --- a/_pages/eventi/epppi_rs.md +++ b/_pages/eventi/epppi_rs.md @@ -15,7 +15,7 @@ hero: subtitle: "Come essere persone concrete in un mondo sempre più digitale?" location: "Bologna" date: "8-10 Maggio 2026" - target: "Rover e Scolte in cammino" + target: "Rover e Scolte AGESCI" cta: primary: diff --git a/_pages/eventi/index.md b/_pages/eventi/index.md new file mode 100644 index 0000000..dc0f5e8 --- /dev/null +++ b/_pages/eventi/index.md @@ -0,0 +1,106 @@ +--- +title: Eventi Bit Prepared +layout: page +permalink: /eventi/ +tags: [bitprepared, eventi, campi, stage] +--- + +
+
+ + +
+

Il Percorso Bit Prepared

+

Dagli EG ai Capi: un cammino di crescita digitale

+
+ + +
+ + +
+ +
+ + + +
+ +

Esploratori/Guide

+

11-16 anni

+ + +
+

Campo di Competenza

+

+ Google, social network, fotoritocco, video editing, coding. Scopri le tecnologie mantenendo lo stile scout! +

+ + Scopri il campo + +
+
+ + +
+ +
+ + + +
+ +

Rover/Scolte

+

16-21 anni

+ + +
+

EPPPI

+

+ La scelta politica nelle società iperconnesse. Come usare i social per agire? Workshop intensivi su cittadinanza digitale. +

+ + Scopri EPPPI + +
+
+ + +
+ +
+ + + +
+ +

Capi

+

Adulti

+ + +
+

Stage per Capi

+

+ Essere scout nell'era del Web 2.0. La legge scout riletta per il sempre connesso. Strumenti per la tua comunità. +

+ + Scopri lo stage + +
+
+ +
+
+
diff --git a/_pages/eventi/stage.md b/_pages/eventi/stage.md index d985fa6..61d8bc6 100644 --- a/_pages/eventi/stage.md +++ b/_pages/eventi/stage.md @@ -1,30 +1,160 @@ --- -title: Vivere ed educare nell'era digitale -subtitle: digito ergo sum -published: true -layout: page -description: Stage per capi 2018 -modified: 2016-09-24 -author: bitprepared -category: articles -tags: - - bitprepared - - stage - - specializzazioni -featured: images/pages/stage.jpg +layout: evento permalink: /eventi/stage/ +title: Stage per Capi - Vivere ed educare nell'era digitale +subtitle: digito ergo sum +tags: [bitprepared, stage, specializzazioni, formazione capi, digitale] +modified: 2026-04-21 +image: /assets/images/pages/stage.jpg +event_status: past + +benefits_title: "Perché partecipare allo Stage" +benefits: + - icon: "fa-chalkboard-teacher" + title: "Metodologie Educative" + desc: "Apprendi metodologie per educare i ragazzi all'uso consapevole del digitale" + - icon: "fa-users" + title: "Comprendere i Digital Natives" + desc: "Capisci come pensano e comunicano i ragazzi nativi digitali" + - icon: "fa-balance-scale" + title: "Etica Digitale" + desc: "Strumenti per affrontare temi come cyberbullismo, privacy, fake news" + - icon: "fa-tools" + title: "Strumenti Pratici" + desc: "Kit di attività e strumenti da usare subito nella tua unità" + +target_audience: + - icon: "fa-user-tie" + text: "Sei un" + highlight: "capo/unità" + tail: "AGESCI" + - icon: "fa-child" + text: "Vuoi comprendere meglio" + highlight: "il mondo digitale" + tail: "dei tuoi ragazzi" + - icon: "fa-graduation-cap" + text: "Vuoi acquisire" + highlight: "competenze educative" + tail: "per l'era digitale" + - icon: "fa-hands-helping" + text: "Vuoi condividere" + highlight: "best practices" + tail: "con altri capi" + +programma: + - title: "IMMERSIONE DIGITALE" + desc: "Esperienza diretta dei mondi digitali dei ragazzi: social, gaming, contenuti" + - title: "PSICOLOGIA DELL'ETA' EVOLUTIVA" + desc: "Come si sviluppa la mente digitale nei ragazzi E/G, R/S" + - title: "RISCHI E OPPORTUNITA'" + desc: "Cyberbullismo, dipendenze, ma anche opportunità educative del digitale" + - title: "STRUMENTI EDUCATIVI" + desc: "Kit di attività concrete da proporre nella tua unità" + - title: "LABORATORIO PRATICO" + desc: "Progettazione di percorsi educativi personalizzati per la tua unità" + - title: "RETENTION E CONFRONTO" + desc: "Momenti di condivisione e creazione rete tra capi partecipanti" + +highlights: + - "L'unico stage che unisce PEDAGOGIA e DIGITALE in ambito scout" + - "Staff con esperienza pluriennale in formazione capi" + - "Kit di 20+ attività pronte all'uso per la tua unità" + - "Equilibrio tra momenti formativi e vita scout" + - "Base scout immersa nella natura, ideale per riflessione e confronto" + - "Max 15 partecipanti per favorire il dialogo" + - "Attestato di partecipazione riconosciuto" + - "Networking con capi da tutta Italia" + - "Materiale didattico completo da portare a casa" + - "Momenti di spiritualità legati al tema del digitale" + +outcomes: + - "Consapevolezza su come il digitale influenza l'educazione scout" + - "Kit di 20+ attività educative pronte all'uso" + - "Competenze per affrontare cyberbullismo e rischi online" + - "Strumenti per guidare i ragazzi all'uso consapevole del digitale" + - "Capacità di progettare percorsi educativi digitali" + - "Network di capi con cui condividere esperienze" + - "Attestato di formazione continua riconosciuto" + +hero: + title: "Vivere ed educare nell'era digitale" + subtitle: "Come essere fratelli maggiori in un mondo che non conosciamo bene?" + location: "Costigiola" + date: "15-17 Settembre 2018" + target: "Capi AGESCI" + +cta: + primary: + url: "https://buonacaccia.net" + text: "SCOPRI I PROSSIMI EVENTI" + secondary: + url: "mailto:info@bitprepared.it" + text: "CONTATTACI PER INFO" + +logistica: + quando: + icon: "fa-calendar" + label: "Quando" + date: "15-17 Settembre 2018" + arrivo: "15/9 sera" + partenza: "17/9 pomeriggio" + dove: + icon: "fa-map-marker" + label: "Dove" + citta: "Costigiola" + luogo: "Base Scout Costigiola" + per_chi: + icon: "fa-users" + label: "Per chi" + text: "Capi AGESCI" + posti: + icon: "fa-bullseye" + label: "Posti" + max: 15 + min: 8 + waiting: 3 + come_arrivare: + icon: "fa-car" + label: "Come arrivare" + text: "Info dettagliate verranno inviate agli iscritti. La base è raggiungibile in auto." + cosa_portare: + icon: "fa-backpack" + label: "Cosa portare" + items: "Sacco a pelo, Abbigliamento comodo, Quaderno e penna, Laptop/Tablet se possibile, Buona volontà :)" + +faq: + - q: "L'evento è solo per AGESCI?" + a: "Sì, riservato a Capi AGESCI." + - q: "Servono competenze informatiche?" + a: "No, il focus è pedagogico ed educativo, non tecnico." + - q: "Cosa include la quota?" + a: "Vitto, alloggio in base scout, materiali, assicurazione, kit didattico, attestato." + - q: "L'attestato è valido per la formazione?" + a: "Sì, viene rilasciato attestato di partecipazione utilizzabile per la formazione continua." + - q: "Le attività sono all'aperto?" + a: "Sì, alterniamo momenti formativi indoor e attività outdoor scout." + - q: "Posso annullare? Dubbi su buonacaccia?" + a: "https://buonacaccia.net/problem.aspx?Issue=Refunds" + - q: "Ho altre domande?" + a: "Scrivi a info@bitprepared.it" + +social: + title: "Condividi con la tua zona" + description: "Passaparola tra capi della tua zona. Più siamo, più ricco il confronto!" + hashtags: "#AGESCI #FormazioneCapi #StageDigitale #BitPrepared #EducazioneDigitale #Scout" --- -Nella splendida cornice della [base di Costigiona](costigiola.it), da tre anni si tiene uno stage per capi sul tema delle tecnologie digitali applicate allo scautismo e sulla comunicazione 2.0. Il tema è sicuramente scottante all'interno della nostra associazione: come coniugare le nuove tecnologie con lo scautismo? Cosa attirra così tanto i ragazzi in questi mondi virtuali che ci sembrano così lontani? Cosa cambia nei rapporti personali? Tanti interrogativi e spunti che ci portano però al nocciolo della questione ben individuata dall'[articolo di PE](http://pe.agesci.it/digitale-uno-strumento-un-ambiente/) del mese scorso: come essere i loro fratelli maggiori in un mondo che noi neanche conosciamo bene? -In questi tre anni in cui lo stage si è tenuto, abbiamo mostrato l'uso creativo della tecnologia nello scautismo, attraverso programmi ed applicazioni da utilizzare durante le attività, per specialità e brevetti e ... poerché no?.... anche per organizzare campi, route o hike. Ci siamo confrontati cercando insieme una strada in questi strani mondi digitali che i nostri ragazzi abitano con una naturalezza, mentre per noi sono sconosciuti e a volte ... siamo onesti... ci fanno anche un po'paura e tendiamo a demonizzarli. +Nella splendida cornice della [base di Costigiola](http://www.costigiola.it), da tre anni si tiene uno stage per capi sul tema delle tecnologie digitali applicate allo scautismo e sulla comunicazione 2.0. Il tema è sicuramente scottante all'interno della nostra associazione: come coniugare le nuove tecnologie con lo scautismo? Cosa attira così tanto i ragazzi in questi mondi virtuali che ci sembrano così lontani? Cosa cambia nei rapporti personali? Tanti interrogativi e spunti che ci portano però al nocciolo della questione ben individuata dall'[articolo di PE](http://pe.agesci.it/digitale-uno-strumento-un-ambiente/) del mese scorso: come essere i loro fratelli maggiori in un mondo che noi neanche conosciamo bene? + +In questi tre anni in cui lo stage si è tenuto, abbiamo mostrato l'uso creativo della tecnologia nello scautismo, attraverso programmi ed applicazioni da utilizzare durante le attività, per specialità e brevetti e ... perché no?.... anche per organizzare campi, route o hike. Ci siamo confrontati cercando insieme una strada in questi strani mondi digitali che i nostri ragazzi abitano con una naturalezza, mentre per noi sono sconosciuti e a volte ... siamo onesti... ci fanno anche un po' paura e tendiamo a demonizzarli. -La pattugli Bit Prepared con lo stage porta avanti una ricerca condivisa del significato di essere scout nell'era del Web 2.0. Esistono hardware che ci permettono di essere essenziali, laboriosi ed economi; cosi come esiste un modo di usare software e hardware in modo etico. Anche la nostra legge scout può essere riletta in chiave 2.0! +La pattuglia Bit Prepared con lo stage porta avanti una ricerca condivisa del significato di essere scout nell'era del Web 2.0. Esistono hardware che ci permettono di essere essenziali, laboriosi ed economi; così come esiste un modo di usare software e hardware in modo etico. Anche la nostra legge scout può essere riletta in chiave 2.0! Cosa ci fanno i ragazzi con quegli schermi onnipresenti? Cerchiamo una risposta nel più classico dei racconti giungla: [La caccia di Kaa](https://100giungla.wordpress.com/tag/la-caccia-di-kaa/); nel racconto ad attrarre Mowgli è la possibilità di vivere senza regole, sarà poi Kaa a ricondurlo nella strada più opportuna. A noi capi quindi spetta il compito di educare ad una libertà che nasce dalla condivisione delle conoscenze, facendo loro notare i rischi di un uso senza regole e senza etica. -Dobbiamo essere testimoni di cosa significa essere un cittadino attivo, essere al servizio degli altri e testimoni di fede all'interno di questo digitale/reale che i nostri ragazzi abitano consciamente o inconsciamente. +Dobbiamo essere testimoni di cosa significa essere un cittadino attivo, essere al servizio degli altri e testimoni di fede all'interno di questo digitale/reale che i nostri ragazzi abitano consciamente o inconsciamente. -Per capi impegnati come noi, sarà certo uno sforzo in più partecipare da un ennesimo momento formativo, ma la responsabilità di tenersi al passo cone le esigenze educative è una sfida che ci viene proposta e come capi non possiamo ignorarla. +Per capi impegnati come noi, sarà certo uno sforzo in più partecipare da un ennesimo momento formativo, ma la responsabilità di tenersi al passo con le esigenze educative è una sfida che ci viene proposta e come capi non possiamo ignorarla. Vi aspettiamo perciò numerosi, certi che i temi non smetteranno di essere caldi e attendendovi proprio per quella formazione continua così importante per il nostro servizio. diff --git a/_pages/software/software.md b/_pages/software/software.md index 6853414..a52eb07 100644 --- a/_pages/software/software.md +++ b/_pages/software/software.md @@ -10,7 +10,7 @@ image: creditlink: http://www.bitprepared.it --- -### Programmi Utili per una scout digitale "leale" +### Programmi Utili per una scout digitale leale ![Debian]({{ site.url }}/assets/images/pages/software/debian.png) [Debian](https://www.debian.org/) diff --git a/assets/css/evento-custom.css b/assets/css/evento-custom.css deleted file mode 100644 index cd821e8..0000000 --- a/assets/css/evento-custom.css +++ /dev/null @@ -1,300 +0,0 @@ -/* Evento Custom Styles */ - -/* Hero Section */ -.evento-hero { - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); - padding: 60px 40px; - border-radius: 12px; - color: white; - text-align: center; - margin: 40px 0; - box-shadow: 0 10px 30px rgba(102, 126, 234, 0.3); -} - -.evento-hero h2 { - color: #ffffff !important; - font-size: 2.2em; - margin-bottom: 20px; - line-height: 1.4; - max-width: 800px; - margin-left: auto; - margin-right: auto; - word-wrap: break-word; - overflow-wrap: break-word; - hyphens: none; - text-shadow: 0 2px 4px rgba(0,0,0,0.3); -} - -.evento-hero h3 { - color: #ffffff !important; - font-size: 1.6em; - margin-bottom: 15px; - line-height: 1.4; - max-width: 700px; - margin-left: auto; - margin-right: auto; - text-shadow: 0 2px 4px rgba(0,0,0,0.3); -} - -.evento-hero p { - color: rgba(255, 255, 255, 0.95); - font-size: 1.2em; - line-height: 1.6; - text-shadow: 0 1px 2px rgba(0,0,0,0.3); -} - -.evento-hero strong { - color: #ffffff !important; - text-shadow: 0 1px 2px rgba(0,0,0,0.3); -} - -/* CTA Button */ -.evento-cta { - display: inline-block; - background: #ff6b6b; - color: white !important; - padding: 18px 36px; - border-radius: 50px; - text-decoration: none !important; - font-weight: bold; - font-size: 1.15em; - box-shadow: 0 6px 20px rgba(255, 107, 107, 0.4); - transition: all 0.3s ease; - margin: 20px 10px; - border: 3px solid #ff6b6b; -} - -.evento-cta:hover { - background: #ff5252; - transform: translateY(-3px); - box-shadow: 0 8px 25px rgba(255, 107, 107, 0.6); - text-decoration: none !important; -} - -.evento-cta-secondary { - background: #80BA8E; - border-color: #80BA8E; -} - -.evento-cta-secondary:hover { - background: #6ea87d; -} - -/* Benefits Section */ -.evento-highlight { - background: #f8f9fa; - padding: 40px; - border-radius: 12px; - margin: 40px 0; - border-left: 5px solid #667eea; -} - -.evento-highlight h3 { - color: #667eea !important; - font-size: 1.8em; - margin-bottom: 20px; - text-shadow: 0 1px 2px rgba(0,0,0,0.1); -} - -.evento-highlight ul { - list-style: none; - padding-left: 0; -} - -.evento-highlight li { - padding: 15px 0; - border-bottom: 1px solid #e9ecef; - font-size: 1.1em; - line-height: 1.7; - color: #333; -} - -.evento-highlight li:last-child { - border-bottom: none; -} - -.evento-highlight strong { - color: #667eea; -} - -/* Box Section */ -.evento-box { - background: white; - padding: 50px; - border-radius: 12px; - box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); - margin: 50px 0; - border: 1px solid #e9ecef; -} - -.evento-box h2 { - color: #667eea !important; - font-size: 2em; - margin-bottom: 25px; - text-shadow: 0 1px 2px rgba(0,0,0,0.1); -} - -.evento-box h3 { - color: #667eea !important; - font-size: 1.8em; - margin-bottom: 25px; - text-shadow: 0 1px 2px rgba(0,0,0,0.1); -} - -.evento-box h4 { - color: #764ba2 !important; -} - -.evento-box p { - color: #333; -} - -.evento-box ul { - color: #333; -} - -.evento-box li { - color: #333; -} - -/* Info Grid */ -.evento-info-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); - gap: 25px; - margin: 40px 0; -} - -.evento-info-item { - background: #f8f9fa; - padding: 25px; - border-radius: 10px; - text-align: center; - border: 2px solid #e9ecef; - transition: all 0.3s ease; - color: #333; -} - -.evento-info-item p { - color: #333; -} - -.evento-info-item:hover { - border-color: #667eea; - transform: translateY(-5px); - box-shadow: 0 6px 20px rgba(102, 126, 234, 0.2); -} - -.evento-info-item strong { - display: block; - color: #667eea; - font-size: 1.3em; - margin-bottom: 10px; - text-shadow: 0 1px 1px rgba(0,0,0,0.1); -} - -/* Program Item */ -.evento-program-item { - background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%); - padding: 30px; - margin: 25px 0; - border-radius: 10px; - border-left: 5px solid #764ba2; - box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); - transition: all 0.3s ease; -} - -.evento-program-item:hover { - transform: translateX(10px); - box-shadow: 0 6px 20px rgba(118, 75, 162, 0.15); -} - -.evento-program-item h4 { - color: #764ba2 !important; - font-size: 1.5em; - margin-bottom: 15px; - text-shadow: 0 1px 2px rgba(0,0,0,0.1); -} - -.evento-program-item p { - color: #333; - line-height: 1.6; -} - -/* FAQ Item */ -.evento-faq-item { - background: #f8f9fa; - padding: 25px; - margin: 20px 0; - border-radius: 10px; - border-left: 4px solid #80BA8E; - color: #333; -} - -.evento-faq-item p { - color: #333; - line-height: 1.6; -} - -.evento-faq-item strong { - color: #80BA8E; - font-size: 1.2em; - display: block; - margin-bottom: 10px; - text-shadow: 0 1px 1px rgba(0,0,0,0.1); -} - -/* Social Section */ -.evento-social { - background: #f8f9fa; - padding: 30px; - border-radius: 12px; - text-align: center; - margin: 40px 0; - border: 2px dashed #80BA8E; - color: #333; -} - -.evento-social p { - color: #667eea; - font-size: 1.1em; - margin: 10px 0; -} - -.evento-social h3 { - color: #667eea !important; - font-size: 1.6em; - margin-bottom: 15px; - text-shadow: 0 1px 2px rgba(0,0,0,0.1); -} - -/* Mobile Responsive */ -@media (max-width: 768px) { - .evento-hero { - padding: 40px 20px; - } - - .evento-hero h2 { - font-size: 1.8em; - } - - .evento-cta { - padding: 16px 28px; - font-size: 1em; - display: block; - margin: 15px 0; - } - - .evento-box, - .evento-highlight { - padding: 30px 20px; - } - - .evento-info-grid { - grid-template-columns: 1fr; - } - - .evento-program-item { - padding: 20px; - } -} diff --git a/assets/css/main.css b/assets/css/main.css new file mode 100644 index 0000000..97538d1 --- /dev/null +++ b/assets/css/main.css @@ -0,0 +1,289 @@ +/* + * Custom CSS for BitPrepared.it + * Essential styles that can't be handled by Tailwind CDN + */ + +/* ===== BASE STYLES ===== */ +body { + background: #161616; + color: #e8f5e8; +} + +#main-content { + margin-top: 60px; +} + +/* ===== FONT AWESOME ===== */ +@font-face { + font-family: 'FontAwesome'; + src: url('font/fontawesome-webfont.eot?v=4.0.1'); + src: url('font/fontawesome-webfont.eot?#iefix&v=4.0.1') format('embedded-opentype'), + url('font/fontawesome-webfont.woff?v=4.0.1') format('woff'), + url('font/fontawesome-webfont.ttf?v=4.0.1') format('truetype'), + url('font/fontawesome-webfont.svg?v=4.0.1#fontawesomeregular') format('svg'); + font-weight: normal; + font-style: normal; +} + +.fa { + text-decoration: none; +} + +.fa:before { + display: inline-block; + font-family: FontAwesome; + font-size: 1.25em; + text-decoration: none; + font-style: normal; + font-weight: normal; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.fa-twitter:before { content: "\f099"; } +.fa-facebook:before { content: "\f09a"; } +.fa-instagram:before { content: "\f16d"; } +.fa-envelope:before { content: "\f0e0"; } +.fa-map-marker:before { content: "\f041"; } +.fa-calendar:before { content: "\f073"; } +.fa-users:before { content: "\f0c0"; } +.fa-calendar-check:before { content: "\f058"; } +.fa-ban:before { content: "\f05e"; } +.fa-clock:before { content: "\f017"; } +.fa-star:before { content: "\f005"; } + +/* ===== SKIP LINK ===== */ +.skip-link { + position: absolute; + top: -40px; + left: 0; + background: #00d9ff; + color: #0a1f0a; + padding: 8px; + z-index: 100; + text-decoration: none; + font-weight: 600; +} + +.skip-link:focus { top: 0; } + +/* ===== HERO BACKGROUND IMAGE ===== */ +.hero { + position: relative; + background: url(../images/header.jpg) no-repeat center center; + background-size: cover; + background-attachment: fixed; + overflow: hidden; + padding-top: 80px; + padding-bottom: 80px; +} + +.hero::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E"); + opacity: 0.3; + pointer-events: none; +} + +.hero-content { + position: relative; + z-index: 1; +} + +/* ===== NAVBAR ===== */ +.navbar { + position: fixed; + top: 0; + left: 0; + right: 0; + background: rgba(10, 31, 10, 0.95); + backdrop-filter: blur(10px); + border-bottom: 1px solid #1a7f1a; + z-index: 1000; + padding: 1rem 1.5rem; +} + +.navbar-content { + max-width: 1200px; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; + position: relative; +} + +.navbar-brand { + font-family: 'JetBrains Mono', monospace; + font-weight: 700; + font-size: 1.25rem; + color: #e8f5e8; + text-decoration: none; +} + +.navbar-toggle { + display: none; + flex-direction: column; + background: none; + border: none; + cursor: pointer; + padding: 0.5rem; + z-index: 1001; +} + +.navbar-toggle span { + width: 25px; + height: 3px; + background: #e8f5e8; + margin: 3px 0; + transition: 0.3s ease-out; + border-radius: 2px; +} + +.navbar-nav { + display: flex; + list-style: none; + margin: 0; + padding: 0; + gap: 2rem; +} + +.navbar-nav li a { + color: #e8f5e8; + text-decoration: none; + transition: color 0.15s ease-out; +} + +.navbar-nav li a:hover { + color: #00d9ff; +} + +@media (max-width: 768px) { + .navbar-toggle { + display: flex; + } + + .navbar-nav { + display: none; + position: absolute; + top: 100%; + left: 0; + right: 0; + background: rgba(10, 31, 10, 0.98); + flex-direction: column; + padding: 1rem; + gap: 1rem; + } + + .navbar-nav.active { + display: flex; + } +} + +/* ===== FOOTER ===== */ +footer { + background: rgba(10, 31, 10, 0.95); + border-top: 1px solid #1a7f1a; + padding: 2rem 1.5rem; + text-align: center; + margin-top: auto; +} + +.footer-social { + display: flex; + justify-content: center; + gap: 1.5rem; + margin-bottom: 1rem; + flex-wrap: wrap; +} + +.footer-social a { + color: #e8f5e8; + text-decoration: none; + transition: color 0.15s ease-out; +} + +.footer-social a:hover { + color: #00d9ff; +} + +.footer-social a span { + display: none; +} + +.footer-links { + margin-bottom: 1rem; +} + +.footer-links a { + color: #e8f5e8; + text-decoration: none; + margin: 0 0.5rem; +} + +.footer-links a:hover { + color: #00d9ff; +} + +.footer-copy { + color: #e8f5e8; + font-size: 0.875rem; + line-height: 1.5; +} + +/* ===== PAGE BODY STYLES ===== */ +.page-body p:first-child { + margin-top: 0; +} + +.page-body p:last-child { + margin-bottom: 0; +} + +.page-body h2, +.page-body h3, +.page-body h4 { + color: #00d9ff; + margin-top: 2rem; + margin-bottom: 1rem; +} + +.page-body h2:first-child, +.page-body h3:first-child, +.page-body h4:first-child { + margin-top: 0; +} + +.page-body a { + color: #00d9ff; + text-decoration: underline; +} + +.page-body ul, +.page-body ol { + margin-bottom: 1rem; + margin-top: 1rem; + padding-left: 2rem; +} + +.page-body li { + margin-bottom: 0.5rem; +} + +.page-body img { + max-width: 100%; + height: auto; + display: block; + margin: 1rem auto; +} + +@media (max-width: 768px) { + .page-body { + font-size: 1rem; + } +} diff --git a/assets/css/scout-tech.css b/assets/css/scout-tech.css new file mode 100644 index 0000000..58590e2 --- /dev/null +++ b/assets/css/scout-tech.css @@ -0,0 +1,515 @@ +/* + * Scout Tech Modern - BitPrepared.it + * Design System: Scout Tech Modern + * Palette: Verde foresta + Matrix rivisitato + Ciano accents + */ + +/* ===== FONT AWESOME ===== */ +/* Powered by Font Awesome by Dave Gandy | http://fontawesome.io */ +/* Licensed under the SIL OFL 1.1 (font), MIT (CSS) */ + +@font-face { + font-family: 'FontAwesome'; + src: url('font/fontawesome-webfont.eot?v=4.0.1'); + src: url('font/fontawesome-webfont.eot?#iefix&v=4.0.1') format('embedded-opentype'), + url('font/fontawesome-webfont.woff?v=4.0.1') format('woff'), + url('font/fontawesome-webfont.ttf?v=4.0.1') format('truetype'), + url('font/fontawesome-webfont.svg?v=4.0.1#fontawesomeregular') format('svg'); + font-weight: normal; + font-style: normal; +} + +.fa { + text-decoration: none; +} + +.fa:before { + display: inline-block; + font-family: FontAwesome; + font-size: 1.25em; + text-decoration: none; + font-style: normal; + font-weight: normal; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.fa-twitter:before { content: "\f099"; } +.fa-facebook:before { content: "\f09a"; } +.fa-instagram:before { content: "\f16d"; } +.fa-envelope:before { content: "\f0e0"; } + +/* ===== CSS VARIABLES ===== */ +:root { + /* Colors */ + --color-primary: #0a3d0a; + --color-secondary: #1a7f1a; + --color-accent: #00d9ff; + --color-dark: #0a1f0a; + --color-light: #e8f5e8; + --color-white: #ffffff; + --color-text: #1a1a1a; + --color-text-muted: #666666; + + /* Typography */ + --font-display: 'JetBrains Mono', 'Courier New', monospace; + --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; + + /* Spacing */ + --spacing-xs: 0.5rem; + --spacing-sm: 1rem; + --spacing-md: 1.5rem; + --spacing-lg: 2rem; + --spacing-xl: 4rem; + + /* Layout */ + --container-max-width: 1200px; + --border-radius: 8px; + --border-width: 1px; + + /* Shadows */ + --shadow-sm: 0 2px 8px rgba(10, 63, 10, 0.1); + --shadow-md: 0 4px 16px rgba(10, 63, 10, 0.15); + --shadow-lg: 0 8px 24px rgba(26, 127, 26, 0.3); + + /* Transitions */ + --transition-fast: 150ms ease-out; + --transition-base: 300ms ease-out; + --transition-slow: 600ms ease-out; +} + +/* ===== RESET & BASE ===== */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +html { + font-size: 16px; + scroll-behavior: smooth; +} + +body { + font-family: var(--font-body); + font-weight: 400; + line-height: 1.6; + color: var(--color-light); + background: #161616; + min-height: 100vh; + overflow-x: hidden; +} + +/* ===== TYPOGRAPHY ===== */ +h1, h2, h3, h4, h5, h6 { + font-family: var(--font-display); + font-weight: 700; + line-height: 1.2; + color: var(--color-primary); +} + +h1 { font-size: 2.5rem; } +h2 { font-size: 2rem; } +h3 { font-size: 1.75rem; } +h4 { font-size: 1.5rem; } +h5 { font-size: 1.25rem; } +h6 { font-size: 1rem; } + +p { + margin-bottom: var(--spacing-sm); +} + +a { + color: var(--color-secondary); + text-decoration: none; + transition: color var(--transition-fast); + position: relative; +} + +a::after { + content: ''; + position: absolute; + bottom: -2px; + left: 0; + width: 0; + height: 2px; + background: var(--color-accent); + transition: width var(--transition-base); +} + +a:hover::after { + width: 100%; +} + +a:hover { + color: var(--color-accent); +} + +/* ===== LAYOUT ===== */ +.container { + width: 100%; + max-width: var(--container-max-width); + margin: 0 auto; + padding: 0 var(--spacing-md); +} + +main { + min-height: 100vh; + display: flex; + flex-direction: column; +} + +/* ===== HERO SECTION ===== */ +.hero { + text-align: center; + padding: var(--spacing-xl) var(--spacing-md); + background: url(../images/header.jpg) no-repeat center center; + background-size: cover; + background-attachment: fixed; + position: relative; + overflow: hidden; +} + +.hero::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E"); + opacity: 0.3; + pointer-events: none; +} + +.hero-content { + position: relative; + z-index: 1; +} + +.hero-logo { + max-width: 300px; + height: auto; + margin: 0 auto var(--spacing-lg); + display: block; +} + +.hero-title { + font-size: 3rem; + color: var(--color-light); + margin-top: var(--spacing-xl); + margin-bottom: var(--spacing-sm); + font-family: var(--font-display); + font-weight: 700; +} + +.hero-subtitle { + font-size: 1.5rem; + color: var(--color-accent); + font-family: var(--font-display); + font-weight: 500; +} + +/* ===== EVENTS GRID ===== */ +.events-section { + padding: var(--spacing-xl) var(--spacing-md); + flex: 1; +} + +.events-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); + gap: var(--spacing-lg); + max-width: var(--container-max-width); + margin: 0 auto; +} + +/* ===== EVENT CARDS ===== */ +.evento-card { + background: var(--color-white); + border: var(--border-width) solid var(--color-secondary); + border-radius: var(--border-radius); + overflow: hidden; + transition: transform var(--transition-base), box-shadow var(--transition-base); + opacity: 0; + transform: translateY(30px); + animation: fadeUp 0.6s ease-out forwards; + display: flex; + flex-direction: column; + height: 100%; +} + +.evento-card:nth-child(1) { animation-delay: 0.1s; } +.evento-card:nth-child(2) { animation-delay: 0.2s; } +.evento-card:nth-child(3) { animation-delay: 0.3s; } + +@keyframes fadeUp { + to { + opacity: 1; + transform: translateY(0); + } +} + +.evento-card:hover { + transform: translateY(-4px); + box-shadow: var(--shadow-lg); +} + +.evento-card img { + width: 100%; + height: 200px; + object-fit: cover; + transition: transform var(--transition-base); +} + +.card-image-wrapper { + position: relative; + overflow: hidden; +} + +.post-date { + position: absolute; + top: var(--spacing-sm); + right: var(--spacing-sm); + background: var(--color-accent); + color: var(--color-dark); + padding: 0.25rem 0.75rem; + border-radius: 1rem; + font-size: 0.75rem; + font-weight: 600; + font-family: var(--font-display); + z-index: 1; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); +} + +.evento-card:hover img { + transform: scale(1.05); +} + +.evento-content { + padding: var(--spacing-md); + display: flex; + flex-direction: column; + flex-grow: 1; +} + +.evento-card h2 { + font-size: 1.5rem; + color: var(--color-primary); + margin-bottom: var(--spacing-sm); +} + +.evento-card p { + color: var(--color-text-muted); + margin-bottom: var(--spacing-md); + line-height: 1.5; + flex-grow: 1; +} + +.evento-card .btn-primary { + margin-top: auto; +} + +/* ===== BUTTONS ===== */ +.btn-primary { + display: inline-block; + padding: var(--spacing-sm) var(--spacing-md); + background: var(--color-secondary); + color: var(--color-white); + border: none; + border-radius: var(--border-radius); + font-family: var(--font-display); + font-weight: 600; + text-align: center; + cursor: pointer; + transition: all var(--transition-fast); + position: relative; + overflow: hidden; +} + +.btn-primary::after { + display: none; +} + +.btn-primary:hover { + background: var(--color-primary); + transform: scale(1.02); + box-shadow: var(--shadow-md); +} + +.btn-primary:active { + transform: scale(0.98); +} + +/* ===== NAVIGATION ===== */ +.navbar { + position: fixed; + top: 0; + left: 0; + right: 0; + background: rgba(10, 31, 10, 0.95); + backdrop-filter: blur(10px); + border-bottom: var(--border-width) solid var(--color-secondary); + z-index: 1000; + padding: var(--spacing-sm) var(--spacing-md); +} + +.navbar-content { + max-width: var(--container-max-width); + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; + position: relative; +} + +.navbar-brand { + font-family: var(--font-display); + font-weight: 700; + font-size: 1.25rem; + color: var(--color-light); +} + +.navbar-brand::after { + display: none; +} + +.navbar-toggle { + display: none; + flex-direction: column; + background: none; + border: none; + cursor: pointer; + padding: 0.5rem; + z-index: 1001; +} + +.navbar-toggle span { + width: 25px; + height: 3px; + background: var(--color-light); + margin: 3px 0; + transition: var(--transition-base); + border-radius: 2px; +} + +.navbar-toggle.active span:nth-child(1) { + transform: rotate(45deg) translate(8px, 8px); +} + +.navbar-toggle.active span:nth-child(2) { + opacity: 0; +} + +.navbar-toggle.active span:nth-child(3) { + transform: rotate(-45deg) translate(7px, -7px); +} + +.navbar-nav { + display: flex; + gap: var(--spacing-md); + list-style: none; +} + +.navbar-nav a { + color: var(--color-light); + font-weight: 500; + padding: var(--spacing-xs) var(--spacing-sm); + border-radius: var(--border-radius); + transition: background var(--transition-fast), color var(--transition-fast); +} + +.navbar-nav a::after { + display: none; +} + +.navbar-nav a:hover { + background: rgba(26, 127, 26, 0.2); + color: var(--color-accent); +} + +/* ===== FOOTER ===== */ +footer { + background: var(--color-dark); + border-top: var(--border-width) solid var(--color-secondary); + padding: var(--spacing-lg) var(--spacing-md); + text-align: center; + color: var(--color-light); +} + +footer a { + color: var(--color-light); + margin: 0 var(--spacing-sm); +} + +footer a::after { + display: none; +} + +.footer-social a { + display: inline-block; + width: 40px; + height: 40px; + line-height: 40px; + text-align: center; + background: var(--color-secondary); + border-radius: 50%; + transition: all var(--transition-fast); + color: var(--color-white); +} + +.footer-social a:hover { + background: var(--color-accent); + transform: scale(1.1); + color: var(--color-white); +} + +.footer-social a span { + display: none; +} + +.footer-social { + margin-bottom: var(--spacing-md); +} + +.footer-links { + margin-bottom: var(--spacing-sm); +} + +.footer-copy { + font-size: 0.875rem; + color: var(--color-text-muted); +} + +/* ===== UTILITY CLASSES ===== */ +.text-center { text-align: center; } +.text-muted { color: var(--color-text-muted); } +.mt-lg { margin-top: var(--spacing-lg); } +.mb-lg { margin-bottom: var(--spacing-lg); } + +/* ===== SCROLL REVEAL ===== */ +.reveal { + opacity: 0; + transform: translateY(30px); + transition: opacity 0.6s ease-out, transform 0.6s ease-out; + display: flex; + flex-direction: column; + height: 100%; +} + +.reveal.active { + opacity: 1; + transform: translateY(0); +} + +/* ===== RESPONSIVE BASE ===== */ +@media (max-width: 1024px) { + .events-grid { + grid-template-columns: repeat(2, 1fr); + } + + .hero-title { + font-size: 2.5rem; + } +} diff --git a/assets/css/skel-noscript.css b/assets/css/skel-noscript.css deleted file mode 100644 index 3abd181..0000000 --- a/assets/css/skel-noscript.css +++ /dev/null @@ -1,168 +0,0 @@ -/* Resets (http://meyerweb.com/eric/tools/css/reset/ | v2.0 | 20110126 | License: none (public domain)) */ - - html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}body{-webkit-text-size-adjust:none} - -/* Box Model */ - - *, *:before, *:after { - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -o-box-sizing: border-box; - -ms-box-sizing: border-box; - box-sizing: border-box; - } - -/* Container */ - - body { - min-width: 1200px; - } - - .container { - width: 1200px; - margin-left: auto; - margin-right: auto; - } - - /* Modifiers */ - - .container.small { - width: 900px; - } - - .container.big { - width: 100%; - max-width: 1500px; - min-width: 1200px; - } - -/* Grid */ - - /* Cells */ - - .\31 2u { width: 100% } - .\31 1u { width: 91.6666666667% } - .\31 0u { width: 83.3333333333% } - .\39 u { width: 75% } - .\38 u { width: 66.6666666667% } - .\37 u { width: 58.3333333333% } - .\36 u { width: 50% } - .\35 u { width: 41.6666666667% } - .\34 u { width: 33.3333333333% } - .\33 u { width: 25% } - .\32 u { width: 16.6666666667% } - .\31 u { width: 8.3333333333% } - .\-11u { margin-left: 91.6666666667% } - .\-10u { margin-left: 83.3333333333% } - .\-9u { margin-left: 75% } - .\-8u { margin-left: 66.6666666667% } - .\-7u { margin-left: 58.3333333333% } - .\-6u { margin-left: 50% } - .\-5u { margin-left: 41.6666666667% } - .\-4u { margin-left: 33.3333333333% } - .\-3u { margin-left: 25% } - .\-2u { margin-left: 16.6666666667% } - .\-1u { margin-left: 8.3333333333% } - - .row > * { - padding: 50px 0 0 50px; - float: left; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -o-box-sizing: border-box; - -ms-box-sizing: border-box; - box-sizing: border-box; - } - - .row + .row > * { - padding-top: 50px; - } - - .row { - margin-left: -50px; - } - - /* Rows */ - - .row:after { - content: ''; - display: block; - clear: both; - height: 0; - } - - .row:first-child > * { - padding-top: 0; - } - - .row > * { - padding-top: 0; - } - - /* Modifiers */ - - /* Flush */ - - .row.flush { - margin-left: 0; - } - - .row.flush > * { - padding: 0 !important; - } - - /* Quarter */ - - .row.quarter > * { - padding: 12.5px 0 0 12.5px; - } - - .row.quarter + .row.quarter > * { - padding-top: 12.5px; - } - - .row.quarter { - margin-left: -12.5px; - } - - /* Half */ - - .row.half > * { - padding: 25px 0 0 25px; - } - - .row.half + .row.half > * { - padding-top: 25px; - } - - .row.half { - margin-left: -25px; - } - - /* One and (a) Half */ - - .row.oneandhalf > * { - padding: 75px 0 0 75px; - } - - .row.oneandhalf + .row.oneandhalf > * { - padding-top: 75px; - } - - .row.oneandhalf { - margin-left: -75px; - } - - /* Double */ - - .row.double > * { - padding: 100px 0 0 100px; - } - - .row.double + .row.double > * { - padding-top: 100px; - } - - .row.double { - margin-left: -100px; - } \ No newline at end of file diff --git a/assets/css/style-1000px.css b/assets/css/style-1000px.css deleted file mode 100644 index 48430e3..0000000 --- a/assets/css/style-1000px.css +++ /dev/null @@ -1,85 +0,0 @@ -/* - Linear by TEMPLATED - templated.co @templatedco - Released for free under the Creative Commons Attribution 3.0 license (templated.co/license) -*/ - -/*********************************************************************************/ -/* Basic */ -/*********************************************************************************/ - - body - { - } - - body,input,textarea,select - { - font-size: 11pt; - } - - header - { - margin-bottom: 1.6em; - } - - header h2 - { - font-size: 2.8em; - } - - header .byline - { - font-size: 1.2em; - } - -/*********************************************************************************/ -/* Main */ -/*********************************************************************************/ - - #main - { - } - - .homepage #content header h2 - { - font-size: 1.8em; - } - - #featured .pennant - { - font-size: 4em; - height: 1.4em; - } - - #sidebar h2 - { - font-size: 2em; - } - -/*********************************************************************************/ -/* Tweet */ -/*********************************************************************************/ - - #tweet - { - } - - #tweet blockquote - { - font-size: 1.6em; - } - -#content .row section header h2 -{ - line-height: 1.2em !important; -} - -/* Article headings */ -article h2 -{ - font-size: 1.8em; - font-weight: 300; - color: #777; - margin-top: 1.5em; - margin-bottom: 0.8em; -} diff --git a/assets/css/style-desktop.css b/assets/css/style-desktop.css deleted file mode 100644 index cb980d2..0000000 --- a/assets/css/style-desktop.css +++ /dev/null @@ -1,140 +0,0 @@ -/* - Linear by TEMPLATED - templated.co @templatedco - Released for free under the Creative Commons Attribution 3.0 license (templated.co/license) -*/ - -/*********************************************************************************/ -/* Basic */ -/*********************************************************************************/ - - body - { - } - - body,input,textarea,select - { - } - - header - { - margin-bottom: 1.6em; - } - - header h2 - { - font-size: 3.4em; - } - - header .byline - { - font-size: 1.7em; - } - -/*********************************************************************************/ -/* Header */ -/*********************************************************************************/ - - #header - { - padding: 10em 0 6em 0; - } - - .homepage #header - { - padding: 16em 0 12em 0; - } - -/*********************************************************************************/ -/* Main */ -/*********************************************************************************/ - - #main - { - padding: 6em 0em; - } - - .homepage #content header h2 - { - padding: 0.70em 0em; - font-size: 2.2em; - } - - #sidebar h2 - { - font-size: 2.4em; - } - -/*********************************************************************************/ -/* Footer */ -/*********************************************************************************/ - - #footer - { - padding: 6em 0em; - } - -/*********************************************************************************/ -/* Featured */ -/*********************************************************************************/ - - #featured - { - padding: 6em 0em; - } - - #featured h3 - { - font-weight:bold; - padding: 1.5em 0em; - font-size: 1.6em; - } - - #featured .pennant - { - font-size: 4em; - height: 1.4em; - } - - #featured header - { - margin-bottom: 3em; - } - - #featured p - { - line-height: 2em; - font-size: 1.2em; - } - -/*********************************************************************************/ -/* Tweet */ -/*********************************************************************************/ - - #tweet - { - padding: 6em 0em; - } - - #tweet blockquote - { - margin: 0; - padding: 1em 4em; - line-height: 1.5em; - font-size: 1.8em; - } - -#content .row section header h2 -{ - line-height: 1.2em !important; -} - -/* Article headings */ -article h2 -{ - font-size: 1.8em; - font-weight: 300; - color: #777; - margin-top: 1.5em; - margin-bottom: 0.8em; -} diff --git a/assets/css/style-mobile.css b/assets/css/style-mobile.css deleted file mode 100644 index fb2cde0..0000000 --- a/assets/css/style-mobile.css +++ /dev/null @@ -1,284 +0,0 @@ -/* - Linear by TEMPLATED - templated.co @templatedco - Released for free under the Creative Commons Attribution 3.0 license (templated.co/license) -*/ - -/*********************************************************************************/ -/* Basic */ -/*********************************************************************************/ - - body,input,textarea,select - { - line-height: 1.75em; - font-size: 10.5pt; - letter-spacing: 0; - } - - body - { - padding-top: 44px; - } - - h2, h3, h4, h5, h6 - { - line-height: 1em; - font-size: 1.5em; - } - - section, - article - { - clear: both; - margin: 2em 0 2em 0 !important; - } - - section > :first-child, - article > :first-child - { - margin-top: 0 !important; - } - - section:first-child, - article:first-child - { - margin-top: 0 !important; - } - - .container - { - padding: 0em 1em; - } - - hr - { - margin: 3em 0 0 0; - padding: 3em 0 0 0; - } - - header - { - margin-bottom: 1.6em; - } - - header h2 - { - font-size: 2em; - } - - header .byline - { - font-size: 1.2em; - } - - .button - { - display: block; - width: 100%; - text-align: center; - } - -/*********************************************************************************/ -/* UI */ -/*********************************************************************************/ - - #titleBar - { - background: #161616; - } - - #titleBar .title a - { - display: block; - color: #fff; - text-align: center; - line-height: 44px; - font-weight: 300; - text-decoration: none; - } - - #titleBar .tag - { - display: none; - } - - #titleBar .toggle - { - position: absolute; - left: 0; - top: 0; - width: 80px; - height: 60px; - } - - #titleBar .toggle:after - { - content: ''; - display: block; - width: 20px; - height: 12px; - position: absolute; - left: 10px; - top: 15px; - background: url('images/toggle.svg') 0px 0px no-repeat; - opacity: 0.5; - } - - #titleBar .toggle:active:after - { - opacity: 0.75; - } - - #navPanel - { - background: #1f1f1f; - } - - #navPanel .link - { - display: block; - color: #888; - text-decoration: none; - height: 44px; - line-height: 44px; - border-top: solid 1px; - border-color: rgba(255,255,255,.05); - padding: 0 1em 0 1em; - letter-spacing: 1px; - } - - #navPanel .link:first-child - { - border-top: 0; - } - - #navPanel .link.depth-0 - { - color: #fff; - } - - #navPanel .indent-1 { display: inline-block; width: 1em; } - #navPanel .indent-2 { display: inline-block; width: 2em; } - #navPanel .indent-3 { display: inline-block; width: 3em; } - #navPanel .indent-4 { display: inline-block; width: 4em; } - #navPanel .indent-5 { display: inline-block; width: 5em; } - #navPanel .depth-0 { color: #fff; } - -/*********************************************************************************/ -/* Header */ -/*********************************************************************************/ - - #header - { - height: 10em; - padding: 0; - background-position: center center; - background-attachment: scroll; - } - -/*********************************************************************************/ -/* Logo */ -/*********************************************************************************/ - - #logo - { - display: none; - } - - #nav - { - display: none; - } - - -/*********************************************************************************/ -/* Main */ -/*********************************************************************************/ - - #main - { - padding: 4em 0em 2em 0em; - } - - .homepage #content header h2 - { - padding: 0.70em 0em; - font-size: 1.4em; - } - - #sidebar h2 - { - font-size: 1.8em; - } - -/*********************************************************************************/ -/* Footer */ -/*********************************************************************************/ - - #footer - { - padding: 4em 0em 2em 0em; - } - -/*********************************************************************************/ -/* Featured */ -/*********************************************************************************/ - - #featured - { - padding: 4em 0em 3em 0em; - } - - #featured h3 - { - padding: 1.5em 0em; - font-size: 1.4em; - } - - #featured .pennant - { - font-size: 4em; - height: 1.4em; - } - -/*********************************************************************************/ -/* Welcome */ -/*********************************************************************************/ - - #welcome - { - padding: 4em 0em 3em 0em; - } - -/*********************************************************************************/ -/* Tweet */ -/*********************************************************************************/ - - #tweet - { - padding: 3em 0em 1em 0em; - background-position: center center; - background-attachment: scroll; - } - - #tweet blockquote - { - margin: 0; - padding: 1em 1em; - font-size: 1.2em; - } - -#content .row section header h2 -{ - line-height: 1.2em !important; -} - -/* Article headings */ -article h2 -{ - font-size: 1.8em; - font-weight: 300; - color: #777; - margin-top: 1.5em; - margin-bottom: 0.8em; -} diff --git a/assets/css/style.css b/assets/css/style.css deleted file mode 100644 index d5aa2f9..0000000 --- a/assets/css/style.css +++ /dev/null @@ -1,1060 +0,0 @@ -/* - Linear by TEMPLATED - templated.co @templatedco - Released for free under the Creative Commons Attribution 3.0 license (templated.co/license) -*/ - -@charset 'UTF-8'; - -@font-face{font-family:'FontAwesome';src:url('font/fontawesome-webfont.eot?v=4.0.1');src:url('font/fontawesome-webfont.eot?#iefix&v=4.0.1') format('embedded-opentype'),url('font/fontawesome-webfont.woff?v=4.0.1') format('woff'),url('font/fontawesome-webfont.ttf?v=4.0.1') format('truetype'),url('font/fontawesome-webfont.svg?v=4.0.1#fontawesomeregular') format('svg');font-weight:normal;font-style:normal} - -/*********************************************************************************/ -/* Basic */ -/*********************************************************************************/ - - body - { - margin: 0; - padding: 0; - background: #161616; - } - - body,input,textarea,select - { - font-family: 'Roboto', sans-serif; - font-size: 11pt; - font-weight: 300; - line-height: 1.75em; - color: #777; - } - - h1,h2,h3,h4,h5,h6 - { - font-weight: 300; - color: #777; - } - - h2 - { - letter-spacing: -0.025em; - } - - h1 a, h2 a, h3 a, h4 a, h5 a, h6 a - { - color: inherit; - text-decoration: none; - } - - strong, b - { - font-weight: 500; - color: #000000; - } - - em, i - { - font-style: italic; - } - - a - { - text-decoration: none; - color: #80BA8E; - } - - a:hover - { - text-decoration: underline; - } - - sub - { - position: relative; - top: 0.5em; - font-size: 0.8em; - } - - sup - { - position: relative; - top: -0.5em; - font-size: 0.8em; - } - - hr - { - border: 0; - border-top: solid 1px #ddd; - margin: 6em 0 0 0; - padding: 6em 0 0 0; - } - - blockquote - { - border-left: solid 0.5em #ddd; - padding: 1em 0 1em 2em; - font-style: italic; - } - - p, ul, ol, dl, table - { - margin-bottom: 1em; - } - - header - { - margin-bottom: 1.6em; - } - - header h2 - { - } - - header .byline - { - display: block; - margin: 1.5em 0 0 0; - padding: 0 0 0.5em 0; - } - - footer - { - margin-top: 1em; - } - - br.clear - { - clear: both; - } - - .pennant - { - color: #bbb; - } - - /* Sections/Articles */ - - section, - article - { - margin-bottom: 3em; - } - - section > :last-child, - article > :last-child - { - margin-bottom: 0; - } - - section:last-child, - article:last-child - { - margin-bottom: 0; - } - - .row > section, - .row > article - { - margin-bottom: 0; - } - - /* Images */ - - .image - { - display: inline-block; - } - - .image img - { - display: block; - width: 100%; - } - - .image.featured - { - display: block; - width: 100%; - margin: 0 0 2em 0; - } - - .image.full - { - display: block; - width: 100%; - margin-bottom: 2em; - } - - .image.medium - { - display: block; - /* margin: 0 auto; */ - width: 60%; - margin-bottom: 2em; - } - - .image.mini - { - display: block; - width: 10%; - margin-bottom: 2em; - } - - - .image.left - { - float: left; - margin: 0 2em 2em 0; - } - - .image.centered - { - display: block; - margin: 0 0 2em 0; - } - - .image.centered img - { - margin: 0 auto; - width: auto; - } - - /* Lists */ - - ul.default - { - margin: 0; - padding: 0em 0em 1.5em 0em; - list-style: none; - } - - ul.default li - { - padding: 0.60em 0em; - font-size: 0.95em; - border-top: 1px solid; - border-color: rgba(0,0,0,.1); - } - - ul.default li:first-child - { - padding-top: 0; - border-top: none; - } - - ul.default { - } - - ul.style li { - margin: 0; - padding: 2em 0em 1.5em 0em; - border-top: 1px solid; - border-color: rgba(0,0,0,.1); - } - - ul.style li:first-child - { - padding-top: 0; - border-top: none; - } - - ul.style img { - float: left; - margin-right: 20px; - } - - ul.style a { - color: #434343; - } - - ul.style .posted { - padding: 0em 0em 1em 0em; - letter-spacing: 1px; - text-transform: uppercase; - font-size: 8pt; - color: #A2A2A2; - } - - ul.style .first { - padding-top: 0px; - border-top: none; - } - - - /* Buttons */ - - .button - { - position: relative; - display: inline-block; - background: #80BA8E; - padding: 0.8em 2em; - text-decoration: none !important; - font-size: 1.2em; - font-weight: 300; - color: #FFF !important; - -moz-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - -webkit-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - -o-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - -ms-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - text-align: center; - border-radius: 0.25em; - } - - .button:hover - { - background: #70AA7E; - color: #FFF !important; - } - -/*********************************************************************************/ -/* Icons */ -/* Powered by Font Awesome by Dave Gandy | http://fontawesome.io */ -/* Licensed under the SIL OFL 1.1 (font), MIT (CSS) */ -/*********************************************************************************/ - - .fa - { - text-decoration: none; - } - - .fa.solo - { - } - - .fa.solo span - { - display: none; - } - - .fa:before - { - display:inline-block; - font-family: FontAwesome; - font-size: 1.25em; - text-decoration: none; - font-style: normal; - font-weight: normal; - line-height: 1; - -webkit-font-smoothing:antialiased; - -moz-osx-font-smoothing:grayscale; - } - - .fa-lg{font-size:1.3333333333333333em;line-height:.75em;vertical-align:-15%} - .fa-2x{font-size:2em} - .fa-3x{font-size:3em} - .fa-4x{font-size:4em} - .fa-5x{font-size:5em} - .fa-fw{width:1.2857142857142858em;text-align:center} - .fa-ul{padding-left:0;margin-left:2.142857142857143em;list-style-type:none}.fa-ul>li{position:relative} - .fa-li{position:absolute;left:-2.142857142857143em;width:2.142857142857143em;top:.14285714285714285em;text-align:center}.fa-li.fa-lg{left:-1.8571428571428572em} - .fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em} - .pull-right{float:right} - .pull-left{float:left} - .fa.pull-left{margin-right:.3em} - .fa.pull-right{margin-left:.3em} - .fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear} - @-moz-keyframes spin{0%{-moz-transform:rotate(0deg)} 100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)} 100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)} 100%{-o-transform:rotate(359deg)}}@-ms-keyframes spin{0%{-ms-transform:rotate(0deg)} 100%{-ms-transform:rotate(359deg)}}@keyframes spin{0%{transform:rotate(0deg)} 100%{transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)} - .fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)} - .fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)} - .fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)} - .fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)} - .fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle} - .fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center} - .fa-stack-1x{line-height:inherit} - .fa-stack-2x{font-size:2em} - .fa-inverse{color:#fff} - .fa-glass:before{content:"\f000"} - .fa-music:before{content:"\f001"} - .fa-search:before{content:"\f002"} - .fa-envelope-o:before{content:"\f003"} - .fa-heart:before{content:"\f004"} - .fa-star:before{content:"\f005"} - .fa-star-o:before{content:"\f006"} - .fa-user:before{content:"\f007"} - .fa-film:before{content:"\f008"} - .fa-th-large:before{content:"\f009"} - .fa-th:before{content:"\f00a"} - .fa-th-list:before{content:"\f00b"} - .fa-check:before{content:"\f00c"} - .fa-times:before{content:"\f00d"} - .fa-search-plus:before{content:"\f00e"} - .fa-search-minus:before{content:"\f010"} - .fa-power-off:before{content:"\f011"} - .fa-signal:before{content:"\f012"} - .fa-gear:before,.fa-cog:before{content:"\f013"} - .fa-trash-o:before{content:"\f014"} - .fa-home:before{content:"\f015"} - .fa-file-o:before{content:"\f016"} - .fa-clock-o:before{content:"\f017"} - .fa-road:before{content:"\f018"} - .fa-download:before{content:"\f019"} - .fa-arrow-circle-o-down:before{content:"\f01a"} - .fa-arrow-circle-o-up:before{content:"\f01b"} - .fa-inbox:before{content:"\f01c"} - .fa-play-circle-o:before{content:"\f01d"} - .fa-rotate-right:before,.fa-repeat:before{content:"\f01e"} - .fa-refresh:before{content:"\f021"} - .fa-list-alt:before{content:"\f022"} - .fa-lock:before{content:"\f023"} - .fa-flag:before{content:"\f024"} - .fa-headphones:before{content:"\f025"} - .fa-volume-off:before{content:"\f026"} - .fa-volume-down:before{content:"\f027"} - .fa-volume-up:before{content:"\f028"} - .fa-qrcode:before{content:"\f029"} - .fa-barcode:before{content:"\f02a"} - .fa-tag:before{content:"\f02b"} - .fa-tags:before{content:"\f02c"} - .fa-book:before{content:"\f02d"} - .fa-bookmark:before{content:"\f02e"} - .fa-print:before{content:"\f02f"} - .fa-camera:before{content:"\f030"} - .fa-font:before{content:"\f031"} - .fa-bold:before{content:"\f032"} - .fa-italic:before{content:"\f033"} - .fa-text-height:before{content:"\f034"} - .fa-text-width:before{content:"\f035"} - .fa-align-left:before{content:"\f036"} - .fa-align-center:before{content:"\f037"} - .fa-align-right:before{content:"\f038"} - .fa-align-justify:before{content:"\f039"} - .fa-list:before{content:"\f03a"} - .fa-dedent:before,.fa-outdent:before{content:"\f03b"} - .fa-indent:before{content:"\f03c"} - .fa-video-camera:before{content:"\f03d"} - .fa-picture-o:before{content:"\f03e"} - .fa-pencil:before{content:"\f040"} - .fa-map-marker:before{content:"\f041"} - .fa-adjust:before{content:"\f042"} - .fa-tint:before{content:"\f043"} - .fa-edit:before,.fa-pencil-square-o:before{content:"\f044"} - .fa-share-square-o:before{content:"\f045"} - .fa-check-square-o:before{content:"\f046"} - .fa-move:before{content:"\f047"} - .fa-step-backward:before{content:"\f048"} - .fa-fast-backward:before{content:"\f049"} - .fa-backward:before{content:"\f04a"} - .fa-play:before{content:"\f04b"} - .fa-pause:before{content:"\f04c"} - .fa-stop:before{content:"\f04d"} - .fa-forward:before{content:"\f04e"} - .fa-fast-forward:before{content:"\f050"} - .fa-step-forward:before{content:"\f051"} - .fa-eject:before{content:"\f052"} - .fa-chevron-left:before{content:"\f053"} - .fa-chevron-right:before{content:"\f054"} - .fa-plus-circle:before{content:"\f055"} - .fa-minus-circle:before{content:"\f056"} - .fa-times-circle:before{content:"\f057"} - .fa-check-circle:before{content:"\f058"} - .fa-question-circle:before{content:"\f059"} - .fa-info-circle:before{content:"\f05a"} - .fa-crosshairs:before{content:"\f05b"} - .fa-times-circle-o:before{content:"\f05c"} - .fa-check-circle-o:before{content:"\f05d"} - .fa-ban:before{content:"\f05e"} - .fa-arrow-left:before{content:"\f060"} - .fa-arrow-right:before{content:"\f061"} - .fa-arrow-up:before{content:"\f062"} - .fa-arrow-down:before{content:"\f063"} - .fa-mail-forward:before,.fa-share:before{content:"\f064"} - .fa-resize-full:before{content:"\f065"} - .fa-resize-small:before{content:"\f066"} - .fa-plus:before{content:"\f067"} - .fa-minus:before{content:"\f068"} - .fa-asterisk:before{content:"\f069"} - .fa-exclamation-circle:before{content:"\f06a"} - .fa-gift:before{content:"\f06b"} - .fa-leaf:before{content:"\f06c"} - .fa-fire:before{content:"\f06d"} - .fa-eye:before{content:"\f06e"} - .fa-eye-slash:before{content:"\f070"} - .fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"} - .fa-plane:before{content:"\f072"} - .fa-calendar:before{content:"\f073"} - .fa-random:before{content:"\f074"} - .fa-comment:before{content:"\f075"} - .fa-magnet:before{content:"\f076"} - .fa-chevron-up:before{content:"\f077"} - .fa-chevron-down:before{content:"\f078"} - .fa-retweet:before{content:"\f079"} - .fa-shopping-cart:before{content:"\f07a"} - .fa-folder:before{content:"\f07b"} - .fa-folder-open:before{content:"\f07c"} - .fa-resize-vertical:before{content:"\f07d"} - .fa-resize-horizontal:before{content:"\f07e"} - .fa-bar-chart-o:before{content:"\f080"} - .fa-twitter-square:before{content:"\f081"} - .fa-facebook-square:before{content:"\f082"} - .fa-camera-retro:before{content:"\f083"} - .fa-key:before{content:"\f084"} - .fa-gears:before,.fa-cogs:before{content:"\f085"} - .fa-comments:before{content:"\f086"} - .fa-thumbs-o-up:before{content:"\f087"} - .fa-thumbs-o-down:before{content:"\f088"} - .fa-star-half:before{content:"\f089"} - .fa-heart-o:before{content:"\f08a"} - .fa-sign-out:before{content:"\f08b"} - .fa-linkedin-square:before{content:"\f08c"} - .fa-thumb-tack:before{content:"\f08d"} - .fa-external-link:before{content:"\f08e"} - .fa-sign-in:before{content:"\f090"} - .fa-trophy:before{content:"\f091"} - .fa-github-square:before{content:"\f092"} - .fa-upload:before{content:"\f093"} - .fa-lemon-o:before{content:"\f094"} - .fa-phone:before{content:"\f095"} - .fa-square-o:before{content:"\f096"} - .fa-bookmark-o:before{content:"\f097"} - .fa-phone-square:before{content:"\f098"} - .fa-twitter:before{content:"\f099"} - .fa-facebook:before{content:"\f09a"} - .fa-github:before{content:"\f09b"} - .fa-unlock:before{content:"\f09c"} - .fa-credit-card:before{content:"\f09d"} - .fa-rss:before{content:"\f09e"} - .fa-hdd-o:before{content:"\f0a0"} - .fa-bullhorn:before{content:"\f0a1"} - .fa-bell:before{content:"\f0f3"} - .fa-certificate:before{content:"\f0a3"} - .fa-hand-o-right:before{content:"\f0a4"} - .fa-hand-o-left:before{content:"\f0a5"} - .fa-hand-o-up:before{content:"\f0a6"} - .fa-hand-o-down:before{content:"\f0a7"} - .fa-arrow-circle-left:before{content:"\f0a8"} - .fa-arrow-circle-right:before{content:"\f0a9"} - .fa-arrow-circle-up:before{content:"\f0aa"} - .fa-arrow-circle-down:before{content:"\f0ab"} - .fa-globe:before{content:"\f0ac"} - .fa-wrench:before{content:"\f0ad"} - .fa-tasks:before{content:"\f0ae"} - .fa-filter:before{content:"\f0b0"} - .fa-briefcase:before{content:"\f0b1"} - .fa-fullscreen:before{content:"\f0b2"} - .fa-group:before{content:"\f0c0"} - .fa-chain:before,.fa-link:before{content:"\f0c1"} - .fa-cloud:before{content:"\f0c2"} - .fa-flask:before{content:"\f0c3"} - .fa-cut:before,.fa-scissors:before{content:"\f0c4"} - .fa-copy:before,.fa-files-o:before{content:"\f0c5"} - .fa-paperclip:before{content:"\f0c6"} - .fa-save:before,.fa-floppy-o:before{content:"\f0c7"} - .fa-square:before{content:"\f0c8"} - .fa-reorder:before{content:"\f0c9"} - .fa-list-ul:before{content:"\f0ca"} - .fa-list-ol:before{content:"\f0cb"} - .fa-strikethrough:before{content:"\f0cc"} - .fa-underline:before{content:"\f0cd"} - .fa-table:before{content:"\f0ce"} - .fa-magic:before{content:"\f0d0"} - .fa-truck:before{content:"\f0d1"} - .fa-pinterest:before{content:"\f0d2"} - .fa-pinterest-square:before{content:"\f0d3"} - .fa-google-plus-square:before{content:"\f0d4"} - .fa-google-plus:before{content:"\f0d5"} - .fa-money:before{content:"\f0d6"} - .fa-caret-down:before{content:"\f0d7"} - .fa-caret-up:before{content:"\f0d8"} - .fa-caret-left:before{content:"\f0d9"} - .fa-caret-right:before{content:"\f0da"} - .fa-columns:before{content:"\f0db"} - .fa-unsorted:before,.fa-sort:before{content:"\f0dc"} - .fa-sort-down:before,.fa-sort-asc:before{content:"\f0dd"} - .fa-sort-up:before,.fa-sort-desc:before{content:"\f0de"} - .fa-envelope:before{content:"\f0e0"} - .fa-linkedin:before{content:"\f0e1"} - .fa-rotate-left:before,.fa-undo:before{content:"\f0e2"} - .fa-legal:before,.fa-gavel:before{content:"\f0e3"} - .fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"} - .fa-comment-o:before{content:"\f0e5"} - .fa-comments-o:before{content:"\f0e6"} - .fa-flash:before,.fa-bolt:before{content:"\f0e7"} - .fa-sitemap:before{content:"\f0e8"} - .fa-umbrella:before{content:"\f0e9"} - .fa-paste:before,.fa-clipboard:before{content:"\f0ea"} - .fa-lightbulb-o:before{content:"\f0eb"} - .fa-exchange:before{content:"\f0ec"} - .fa-cloud-download:before{content:"\f0ed"} - .fa-cloud-upload:before{content:"\f0ee"} - .fa-user-md:before{content:"\f0f0"} - .fa-stethoscope:before{content:"\f0f1"} - .fa-suitcase:before{content:"\f0f2"} - .fa-bell-o:before{content:"\f0a2"} - .fa-coffee:before{content:"\f0f4"} - .fa-cutlery:before{content:"\f0f5"} - .fa-file-text-o:before{content:"\f0f6"} - .fa-building:before{content:"\f0f7"} - .fa-hospital:before{content:"\f0f8"} - .fa-ambulance:before{content:"\f0f9"} - .fa-medkit:before{content:"\f0fa"} - .fa-fighter-jet:before{content:"\f0fb"} - .fa-beer:before{content:"\f0fc"} - .fa-h-square:before{content:"\f0fd"} - .fa-plus-square:before{content:"\f0fe"} - .fa-angle-double-left:before{content:"\f100"} - .fa-angle-double-right:before{content:"\f101"} - .fa-angle-double-up:before{content:"\f102"} - .fa-angle-double-down:before{content:"\f103"} - .fa-angle-left:before{content:"\f104"} - .fa-angle-right:before{content:"\f105"} - .fa-angle-up:before{content:"\f106"} - .fa-angle-down:before{content:"\f107"} - .fa-desktop:before{content:"\f108"} - .fa-laptop:before{content:"\f109"} - .fa-tablet:before{content:"\f10a"} - .fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"} - .fa-circle-o:before{content:"\f10c"} - .fa-quote-left:before{content:"\f10d"} - .fa-quote-right:before{content:"\f10e"} - .fa-spinner:before{content:"\f110"} - .fa-circle:before{content:"\f111"} - .fa-mail-reply:before,.fa-reply:before{content:"\f112"} - .fa-github-alt:before{content:"\f113"} - .fa-folder-o:before{content:"\f114"} - .fa-folder-open-o:before{content:"\f115"} - .fa-expand-o:before{content:"\f116"} - .fa-collapse-o:before{content:"\f117"} - .fa-smile-o:before{content:"\f118"} - .fa-frown-o:before{content:"\f119"} - .fa-meh-o:before{content:"\f11a"} - .fa-gamepad:before{content:"\f11b"} - .fa-keyboard-o:before{content:"\f11c"} - .fa-flag-o:before{content:"\f11d"} - .fa-flag-checkered:before{content:"\f11e"} - .fa-terminal:before{content:"\f120"} - .fa-code:before{content:"\f121"} - .fa-reply-all:before{content:"\f122"} - .fa-mail-reply-all:before{content:"\f122"} - .fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"} - .fa-location-arrow:before{content:"\f124"} - .fa-crop:before{content:"\f125"} - .fa-code-fork:before{content:"\f126"} - .fa-unlink:before,.fa-chain-broken:before{content:"\f127"} - .fa-question:before{content:"\f128"} - .fa-info:before{content:"\f129"} - .fa-exclamation:before{content:"\f12a"} - .fa-superscript:before{content:"\f12b"} - .fa-subscript:before{content:"\f12c"} - .fa-eraser:before{content:"\f12d"} - .fa-puzzle-piece:before{content:"\f12e"} - .fa-microphone:before{content:"\f130"} - .fa-microphone-slash:before{content:"\f131"} - .fa-shield:before{content:"\f132"} - .fa-calendar-o:before{content:"\f133"} - .fa-fire-extinguisher:before{content:"\f134"} - .fa-rocket:before{content:"\f135"} - .fa-maxcdn:before{content:"\f136"} - .fa-chevron-circle-left:before{content:"\f137"} - .fa-chevron-circle-right:before{content:"\f138"} - .fa-chevron-circle-up:before{content:"\f139"} - .fa-chevron-circle-down:before{content:"\f13a"} - .fa-html5:before{content:"\f13b"} - .fa-css3:before{content:"\f13c"} - .fa-anchor:before{content:"\f13d"} - .fa-unlock-o:before{content:"\f13e"} - .fa-bullseye:before{content:"\f140"} - .fa-ellipsis-horizontal:before{content:"\f141"} - .fa-ellipsis-vertical:before{content:"\f142"} - .fa-rss-square:before{content:"\f143"} - .fa-play-circle:before{content:"\f144"} - .fa-ticket:before{content:"\f145"} - .fa-minus-square:before{content:"\f146"} - .fa-minus-square-o:before{content:"\f147"} - .fa-level-up:before{content:"\f148"} - .fa-level-down:before{content:"\f149"} - .fa-check-square:before{content:"\f14a"} - .fa-pencil-square:before{content:"\f14b"} - .fa-external-link-square:before{content:"\f14c"} - .fa-share-square:before{content:"\f14d"} - .fa-compass:before{content:"\f14e"} - .fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"} - .fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"} - .fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"} - .fa-euro:before,.fa-eur:before{content:"\f153"} - .fa-gbp:before{content:"\f154"} - .fa-dollar:before,.fa-usd:before{content:"\f155"} - .fa-rupee:before,.fa-inr:before{content:"\f156"} - .fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"} - .fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"} - .fa-won:before,.fa-krw:before{content:"\f159"} - .fa-bitcoin:before,.fa-btc:before{content:"\f15a"} - .fa-file:before{content:"\f15b"} - .fa-file-text:before{content:"\f15c"} - .fa-sort-alpha-asc:before{content:"\f15d"} - .fa-sort-alpha-desc:before{content:"\f15e"} - .fa-sort-amount-asc:before{content:"\f160"} - .fa-sort-amount-desc:before{content:"\f161"} - .fa-sort-numeric-asc:before{content:"\f162"} - .fa-sort-numeric-desc:before{content:"\f163"} - .fa-thumbs-up:before{content:"\f164"} - .fa-thumbs-down:before{content:"\f165"} - .fa-youtube-square:before{content:"\f166"} - .fa-youtube:before{content:"\f167"} - .fa-xing:before{content:"\f168"} - .fa-xing-square:before{content:"\f169"} - .fa-youtube-play:before{content:"\f16a"} - .fa-dropbox:before{content:"\f16b"} - .fa-stack-overflow:before{content:"\f16c"} - .fa-instagram:before{content:"\f16d"} - .fa-flickr:before{content:"\f16e"} - .fa-adn:before{content:"\f170"} - .fa-bitbucket:before{content:"\f171"} - .fa-bitbucket-square:before{content:"\f172"} - .fa-tumblr:before{content:"\f173"} - .fa-tumblr-square:before{content:"\f174"} - .fa-long-arrow-down:before{content:"\f175"} - .fa-long-arrow-up:before{content:"\f176"} - .fa-long-arrow-left:before{content:"\f177"} - .fa-long-arrow-right:before{content:"\f178"} - .fa-apple:before{content:"\f179"} - .fa-windows:before{content:"\f17a"} - .fa-android:before{content:"\f17b"} - .fa-linux:before{content:"\f17c"} - .fa-dribbble:before{content:"\f17d"} - .fa-skype:before{content:"\f17e"} - .fa-foursquare:before{content:"\f180"} - .fa-trello:before{content:"\f181"} - .fa-female:before{content:"\f182"} - .fa-male:before{content:"\f183"} - .fa-gittip:before{content:"\f184"} - .fa-sun-o:before{content:"\f185"} - .fa-moon-o:before{content:"\f186"} - .fa-archive:before{content:"\f187"} - .fa-bug:before{content:"\f188"} - .fa-vk:before{content:"\f189"} - .fa-weibo:before{content:"\f18a"} - .fa-renren:before{content:"\f18b"} - .fa-pagelines:before{content:"\f18c"} - .fa-stack-exchange:before{content:"\f18d"} - .fa-arrow-circle-o-right:before{content:"\f18e"} - .fa-arrow-circle-o-left:before{content:"\f190"} - .fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"} - .fa-dot-circle-o:before{content:"\f192"} - .fa-wheelchair:before{content:"\f193"} - .fa-vimeo-square:before{content:"\f194"} - .fa-turkish-lira:before,.fa-try:before{content:"\f195"} - .fa-fax:before{content:"\f1ac"} - .fa-share-alt:before{content:"\f1e0"} - .fa-cubes:before{content:"\f1b3"} - .fa-eg:before{ - content:url(../images/loghi_branche/eg.png); - } - .fa-coca:before{ - content:url(../images/loghi_branche/coca.png); - } - .fa-rs:before{ - content:url(../images/loghi_branche/rs.png); - } - -/*********************************************************************************/ -/* Social Icon Styles */ -/*********************************************************************************/ - - ul.contact - { - padding: 1.5em 0 0 0; - list-style: none; - cursor: default; - } - - ul.contact li - { - display: inline-block; - margin: 0 1em; - } - - ul.contact li span - { - display: none; - margin: 0; - padding: 0; - } - - ul.contact li a - { - color: inherit; - font-size: 1.75em; - display: inline-block; - -moz-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - -webkit-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - -o-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - -ms-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out; - } - - ul.contact li a:hover - { - color: #fff; - } - -/*********************************************************************************/ -/* Header */ -/*********************************************************************************/ - - #header - { - position: relative; - background: url(../images/header.jpg) no-repeat bottom center; - background-attachment: fixed; - background-size: cover; - text-align: center; - } - - #header:before - { - content: ''; - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 100%; - background: rgba(64,64,64,0.125); - } - -/*********************************************************************************/ -/* Logo */ -/*********************************************************************************/ - - #logo - { - position: relative; - z-index: 1; - } - - #logo h1 - { - color: #FFF; - } - - #logo a - { - display: block; - text-decoration: none; - font-weight: 300; - line-height: 1em; - font-size: 7em; - color: #FFF; - letter-spacing: -0.05em; - margin: 0 0 0.125em 0; - } - - #logo span - { - font-size: 1.4em; - color: #FFF; - } - -/*********************************************************************************/ -/* Nav */ -/*********************************************************************************/ - - #nav - { - } - - #nav-wrapper - { - background: rgba(0,0,0,.4); - position: absolute; - top: 0; - left: 0; - width: 100%; - } - - #nav > ul - { - margin: 0; - padding: 0; - text-align: center; - } - - #nav > ul > li - { - display: inline-block; - border-right: 1px solid; - border-color: rgba(255,255,255,.1); - } - - #nav > ul > li:last-child - { - padding-right: 0; - border-right: none; - } - - #nav > ul > li > a, - #nav > ul > li > span - { - display: inline-block; - padding: 1.5em 1.5em; - letter-spacing: 0.06em; - text-decoration: none; - text-transform: uppercase; - font-size: 1.1em; - outline: 0; - color: #FFF; - } - - #nav li.active a - { - color: #FFF; - } - - #nav > ul > li > ul - { - display: none; - } - -/*********************************************************************************/ -/* Main */ -/*********************************************************************************/ - - #main - { - position: relative; - background: #fff; - } - - .homepage #content - { - text-align: center; - } - - .homepage #content header h2 - { - } - - #sidebar h2 - { - display: block; - padding-bottom: 0.50em; - } - -/*********************************************************************************/ -/* Footer */ -/*********************************************************************************/ - - #footer - { - position: relative; - text-align: center; - } - - #footer header h2 - { - color: #FFF !important; - } - - #footer header .byline - { - color: rgba(255,255,255,.2); - } - -/*********************************************************************************/ -/* Copyright */ -/*********************************************************************************/ - - #copyright - { - position: relative; - text-align: center; - color: #774535; - } - - #copyright .container - { - padding: 3em 0em; - border-top: 1px solid; - border-color: rgba(255,255,255,.05); - color: rgba(255,255,255,.1); - } - - #copyright a - { - text-decoration: none; - color: rgba(255,255,255,.2); - } - -/*********************************************************************************/ -/* Featured */ -/*********************************************************************************/ - - #featured - { - position: relative; - background: #f2f2f2; - text-align: center; - } - - #featured h3 - { - display: block; - font-weight: 300; - } - - #featured .pennant - { - font-size: 4em; - height: 1.4em; - } - - #featured .button - { - margin-top: 1.5em; - } - -/*********************************************************************************/ -/* Tweet */ -/*********************************************************************************/ - - #tweet - { - position: relative; - text-align: center; - background: url(../images/header.jpg) no-repeat center center; - background-attachment: fixed; - background-size: cover; - } - - #tweet:before - { - content: ''; - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 100%; - background: rgba(64,64,64,0.5); - } - - #tweet section - { - border-top: 1px solid; - border-bottom: 1px solid; - border-color: rgba(255,255,255,.1); - } - - #tweet blockquote - { - position: relative; - border: none; - margin: 0; - font-weight: 300; - color: rgba(255,255,255,.6); - } - -#content .row section header h2 -{ - line-height: 1.2em !important; -} - -/* Article headings */ -article h2 -{ - font-size: 1.8em; - font-weight: 300; - color: #777; - margin-top: 1.5em; - margin-bottom: 0.8em; -} diff --git a/assets/js/scroll-animations.js b/assets/js/scroll-animations.js new file mode 100644 index 0000000..8658f94 --- /dev/null +++ b/assets/js/scroll-animations.js @@ -0,0 +1,141 @@ +/** + * Scout Tech Modern - Scroll Animations + * Vanilla JavaScript with IntersectionObserver + * Zero dependencies, lightweight and performant + */ + +(function() { + 'use strict'; + + // ===== MOBILE MENU TOGGLE ===== + const navbarToggle = document.getElementById('navbar-toggle'); + const navbarNav = document.getElementById('navbar-nav'); + + if (navbarToggle && navbarNav) { + navbarToggle.addEventListener('click', () => { + navbarToggle.classList.toggle('active'); + navbarNav.classList.toggle('active'); + }); + + // Close menu when clicking a link + const navLinks = navbarNav.querySelectorAll('a'); + navLinks.forEach(link => { + link.addEventListener('click', () => { + navbarToggle.classList.remove('active'); + navbarNav.classList.remove('active'); + }); + }); + + // Close menu when clicking outside + document.addEventListener('click', (e) => { + if (!navbarToggle.contains(e.target) && !navbarNav.contains(e.target)) { + navbarToggle.classList.remove('active'); + navbarNav.classList.remove('active'); + } + }); + } + + // ===== INTERSECTION OBSERVER FOR SCROLL REVEAL ===== + const observerOptions = { + root: null, // viewport + rootMargin: '0px', + threshold: 0.1 // trigger when 10% visible + }; + + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('active'); + // Optional: stop observing after reveal + // observer.unobserve(entry.target); + } + }); + }, observerOptions); + + // Observe all elements with .reveal class + const revealElements = document.querySelectorAll('.reveal'); + revealElements.forEach(el => observer.observe(el)); + + // ===== SMOOTH SCROLL FOR ANCHOR LINKS ===== + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + const href = this.getAttribute('href'); + if (href === '#') return; + + const target = document.querySelector(href); + if (target) { + e.preventDefault(); + target.scrollIntoView({ + behavior: 'smooth', + block: 'start' + }); + } + }); + }); + + // ===== PARALLAX EFFECT FOR HERO ===== + // DISABILITATO - Causa scatti durante lo scroll + /* + let ticking = false; + window.addEventListener('scroll', () => { + if (!ticking) { + window.requestAnimationFrame(() => { + const hero = document.querySelector('.hero'); + if (hero) { + const scrolled = window.pageYOffset; + const parallaxSpeed = 0.5; + hero.style.backgroundPositionY = `${scrolled * parallaxSpeed}px`; + } + ticking = false; + }); + ticking = true; + } + }, { passive: true }); + */ + + // ===== TYPING EFFECT CHECK ===== + // Note: The typing effect is now pure CSS in hero-subtitle + // This function ensures it resets properly when element comes into view + const heroSubtitle = document.querySelector('.hero-subtitle'); + if (heroSubtitle) { + const subtitleObserver = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + // Force animation restart + entry.target.style.animation = 'none'; + entry.target.offsetHeight; // Trigger reflow + entry.target.style.animation = 'typing 3.5s steps(40, end), blink-caret 0.75s step-end infinite'; + } + }); + }, { threshold: 0.5 }); + + subtitleObserver.observe(heroSubtitle); + } + + // ===== PREFERS REDUCED MOTION ===== + // Respect user's motion preferences + const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)'); + + if (prefersReducedMotion.matches) { + // Disable all animations + document.documentElement.style.setProperty('--transition-fast', '0ms'); + document.documentElement.style.setProperty('--transition-base', '0ms'); + document.documentElement.style.setProperty('--transition-slow', '0ms'); + + // Show all reveal elements immediately + document.querySelectorAll('.reveal').forEach(el => { + el.classList.add('active'); + }); + } + + // Listen for changes in preference + prefersReducedMotion.addEventListener('change', () => { + location.reload(); + }); + + // ===== CONSOLE SIGNATURE ===== + console.log('%c Bit Prepared ', 'background: #1a7f1a; color: #fff; padding: 5px 10px; border-radius: 3px;'); + console.log('%c Digito ergo sum ', 'background: #00d9ff; color: #0a1f0a; padding: 5px 10px; border-radius: 3px;'); + console.log('https://www.bitprepared.it'); + +})(); diff --git a/assets/js/tailwind-config.js b/assets/js/tailwind-config.js new file mode 100644 index 0000000..0b87bb1 --- /dev/null +++ b/assets/js/tailwind-config.js @@ -0,0 +1,38 @@ +tailwind.config = { + theme: { + extend: { + colors: { + primary: '#0a3d0a', + secondary: '#1a7f1a', + accent: '#00d9ff', + dark: '#0a1f0a', + light: '#e8f5e8', + white: '#ffffff', + }, + fontFamily: { + display: ['JetBrains Mono', 'Courier New', 'monospace'], + body: ['Inter', '-apple-system', 'BlinkMacSystemFont', 'sans-serif'], + }, + spacing: { + 'xs': '0.5rem', + 'sm': '1rem', + 'md': '1.5rem', + 'lg': '2rem', + 'xl': '4rem', + }, + borderRadius: { + 'DEFAULT': '8px', + }, + boxShadow: { + 'sm': '0 2px 8px rgba(10, 63, 10, 0.1)', + 'md': '0 4px 16px rgba(10, 63, 10, 0.15)', + 'lg': '0 8px 24px rgba(26, 127, 26, 0.3)', + }, + transitionDuration: { + 'fast': '150ms', + 'base': '300ms', + 'slow': '600ms', + }, + } + } +} diff --git a/index.html b/index.html index 52a218c..a76f62d 100644 --- a/index.html +++ b/index.html @@ -1,59 +1,100 @@ --- -title: benvenuti +title: Bit Prepared - Digito ergo sum layout: default tags: [agesci,bitprepared,scout,informatica,specializzazioni,competenza,maestro delle tecnologie, esperto del compiuter, digital life] --- - -