suptag by @odlanir 20200425

T1 template/modello NEW

Debugging T1
T1test01 #suptagT1test01

html #suptagHTMLT1 html t1

body #suptagBODYT1 body t1

main #suptagMAINT1 main t1

section #suptagSECTIONT1 section t1

article #suptagARTICLET1 article t1

aside #suptagASIDET1 aside t1

div #suptagDIVT1 div t1

T1 modello ridotto (lato user) #supertagLATOUSERT1

Collezione codici - Repository

Pagina base #USDpaginabasewysiwyg Esempio di programmazione

E book #USDBOOKwysiwyg Esempio di programmazione

E book #USDBOOKxmpwysiwyg Book di 26 pagine

repository css #USDBOOKrepository

codici colori personalizzati x123 #codicicoloripersonalizzati Un colore ha sempre la prevalenza

spinner02 #spinner02 spinner classico senza document

showhide javascript #showhide showhide

Tavola semantic #tablesemantic

Celled grid #celledgrid

Icone standard #icone-standard Usate frequentemente

Icone svg #icone-sprite

PHP LOGIN #codicelogin Login Logout Index

debugging modello T1

<?php session_start(); /* Starts the session */ if(!isset($_SESSION['UserData']['Username'])){ header("location:iLogin.php"); exit; } ?> <!doctype html> <html lang="it"> <head> <meta http-equiv="content-type"content="text/html; charset=UTF-8" /> <meta name="viewport"content="width=device-width, initial-scale=1,shrink-to-fit=no"/> <meta name="generator"content="AlterVista - Editor HTML" /> <title>T1 20200425 0832 t1 minimale creek@odlanir</title> </head> <body onload="attesax()" class="sfondo" style=""> <main class="ui container" > <section style="position:relative;"> <article class="ui internally celled grid"> <aside class="row"> <div class="sixteen wide column"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. </div> </aside> </article> <article class="ui internally celled grid"> <aside class="row"> <div class="sixteen wide column"> <img src="http://veneziavi.altervista.org/flowers/flowers.jpg" /> </div> </aside> </article> </section> </main>  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <script src="https://code.jquery.com/jquery-3.1.1.min.js"integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="crossorigin="anonymous"> </script> <link rel="stylesheet"href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css"> <script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"> </script> <script src="https://github.com/Semantic-Org/Semantic-UI-React/blob/master/src/elements/Button/Button.js"> </script>  <article id="intestazionepiedipagina"></article>  <script type="application/javascript" src="t1intestazionepiedipagina.js" async></script> <article id="L5indicatorescorrimentopagina"></article>  <script type="application/javascript" src="t1L5indicatorescorrimentopagina.js async" async></script> <article style="position:static;"> <div class="avviso" id="girandolalivello1" style=""> <table style="position:fixed;top:0%;left:0%; border:solid 0px black;z-index:0;"><tbody><tr><td id="mostra-percentuale"class="ui secondary mini button"style="cursor:default !important;" > </td><td class="ui secondary mini loading button">  </td><td class="ui secondary mini button"style="cursor:default !important;"> Loading... Il sistema sta trattando la richiesta, ti preghiamo di attendere. </td> </tr> <tbody> </table> </div> <script> var i = 0; if (i == 0) { i = 1; var elem = document.getElementById("mostra-percentuale"); // var width = 10; var width = 0; // var id = setInterval(frame, 10); var id = setInterval(frame, 30000); function frame() { if (width >= 100) { clearInterval(id); i = 0; } else { width++; elem.innerHTML = width + "%"; } } } </script> </article> <script> function attesa(){ if (document.all){ document.all["girandolalivello1"].style.visibility="hidden"; document.all["girandolalivello2"].style.visibility="visible"; } else if (document.getElementById){ node = document.getElementById("girandolalivello1").style.visibility='hidden'; node = document.getElementById("girandolalivello2").style.visibility='visible'; } } </script> <article class=""style=""> <aside class="row"> <div class="ui dropdown" style=" position:fixed; top:2.3em; left:0em; background-color:orange; background-color:burlywood; background-color:rgba(222,184,135,0.25); color:black; border-radius:0.4em; box-shadow:0px 0px 0px black; visibility:show; "> <input type="hidden" name="numero"> <cite style="font-size:1em;padding-left:0.6em;"> <i class="bars icon"></i> </cite> <div class="default massive text" style="visibility:hidden;" ></div> <div class="menu" style=" background-color:rgba(26,26,26,1); color:oldlace; text-align:right; "> <div class="" data-value="numero1"style="z-index:2000;"> <p> <span style="visibility:show;"> <a href="#fine" style=" margin-left:1.0em; margin-right:1.0em; border-radius:0.4em 0em 0em 0.4em; overflow:visible !important;"> <i class="normal chevron circle down icon"> </i> </a> </span><span style="visibility:show;"> <a href="#" style=" margin-left:1.0em; margin-right:1.0em; border-radius:0.4em 0em 0em 0.4em; overflow:visible !important;"> <i class="normal chevron circle up icon"> </i> </a> </span> <span id=""style="margin-left:1.0em; margin-right:1.0em; padding:0.1em; border-radius:0.2em;display:none;"> <a href="#modale"> <i class="large info circle icon"style="font-size:normal;"> </i> </a> </span> <span id=""style="margin-left:1.0em; margin-right:1.0em; padding:0.1em; border-radius:0.2em;"><a href="#modale"> <i class="large info circle icon"style="font-size:normal;"> </i> </a> </span> <span style="display:none;"> <a href="http://edoraandiamo.altervista.org/"> <span style=" margin-left:1.0em; margin-right:1.0em; padding:0.1em;font-size:0.6em; background-color:dodgerblue; color:black; border-radius:0.5em; visibility:show;"> <i class="home icon"> </i></span></a> </span> </p> <hr/> <p id="" style="font-size:0.8em; color:oldlace;"> </p> </div> <div class="item" data-value="numero2"> <p style="font-size:0.8em;"></p> </div> <div class="" data-value="numero3"> <a href="http://edoraandiamo.altervista.org/"> <span style="padding:0.1em;font-size:1em; background-color:dodgerblue; color:black; border-radius:0.5em; visibility:hidden;"> <i class="home icon"> </i> </span> </a> </div> </div> </div> </aside> </article> <script> $('.ui.dropdown') .dropdown() ; </script> <article id="L1dialogomodal"> <script type="application/javascript" src="t1L1dialogomodal.js" async></script>  <script src="http://edoraandiamo.altervista.org/aforall/aforall.js" async></script> </article> <script type="application/javascript" src="t1showhide.js" async></script>   <link rel="stylesheet" href="t1stile.css" /> <?php $actual_link = "http://{$_SERVER['HTTP_HOST']}{$_SERVER['REQUEST_URI']}"; $oggi_est = date("l") . " "; $oggi_est = $oggi_est . date("Y/m/d"); $oggi_est_time = date("h:i:sa"); $fp = fopen('/membri/nomeaccount/text.txt', 'w'); fwrite($fp, $actual_link. " " .$oggi_est. " ". $oggi_est_time); fclose($fp); $myfile = fopen("/membri/nomeaccount/logs.txt", "a") or die("Unable to open file!"); // $actual_link = "cronologia"; fwrite($myfile, "\n". $actual_link. " " .$oggi_est. " ". $oggi_est_time); fclose($myfile); ?> <div id="fine"></div>  </body> </html>

Questa versione di t1 comprende sia il codice inlinea che quello esterno in commento.

t1test01 eseguibile

Gli adattamenti richiesti riguardano la necessità del repositiory dei file css e js .
In questo test01 sono collocati nella stessa cartella (folder) del documento web. Ma in una versione definitiva saranno collocati in un repository accessibile a ogni programma di qualsiasi dominio.

I codic php si riferiscono e funzionano solamente in file con estensione php.
Riguardano la possibilità di essere fruiti in un'area riservata accessibile mediante password. Questa occorrenza richiede tutti i file con estensione php.
A complemento di ciò in fondo al codice si trova un php che permette la tracciatura molto soft della navigazione di un ipotetico utente ( ricordarsi però di avvisare il navigante di questa feature del programma ) .

La parte che attiene al LoginLogout è reperibile Qui

t1 html

t1 body

t1 main

t1 section

t1 article

t1 aside

t1 div

t1 lato user

t1 semantic link

t1 intestazioni e pie' di pagina

<article> <cite id="L5"></cite> <script> document.getElementById('L5').innerHTML= ' '+ ' <cite class="indicatore-container"> '+ ' <p class="indicatore-bar" id="indicatore"> '+ ' </p> '+ ' </cite> '+ '<style> '+ '.indicatore-container { '+ ' position:fixed;top:0;left:0; '+ ' width: 100%; '+ ' height: 0.21em; '+ ' background: burlywood; '+ '} '+ '.indicatore-bar { '+ ' height: 0.21em; '+ ' background: maroon; '+ ' width: 0%; '+ '} '+ '</style> '+ ' ' ; window.onscroll = function() {indicatore()}; function indicatore() { var winScroll = document.body.scrollTop || document.documentElement.scrollTop; var height = document.documentElement.scrollHeight - document.documentElement.clientHeight; var scrolled = (winScroll / height) * 100; document.getElementById("indicatore").style.width = scrolled + "%"; } </script> </article>

t1 progressione documento

<article style="position:static;"> <div class="avviso" id="girandolalivello1" style=""> <table style="position:fixed;top:0%;left:0%; border:solid 0px black;z-index:0;"><tbody><tr><td id="mostra-percentuale"class="ui secondary mini button"style="cursor:default !important;" > </td><td class="ui secondary mini loading button">  </td><td class="ui secondary mini button"style="cursor:default !important;"> Loading... Il sistema sta trattando la richiesta, ti preghiamo di attendere. </td> </tr> <tbody> </table> </div> <script> var i = 0; if (i == 0) { i = 1; var elem = document.getElementById("mostra-percentuale"); // var width = 10; var width = 0; // var id = setInterval(frame, 10); var id = setInterval(frame, 30000); function frame() { if (width >= 100) { clearInterval(id); i = 0; } else { width++; elem.innerHTML = width + "%"; } } } </script> </article> <script> function attesa(){ if (document.all){ document.all["girandolalivello1"].style.visibility="hidden"; document.all["girandolalivello2"].style.visibility="visible"; } else if (document.getElementById){ node = document.getElementById("girandolalivello1").style.visibility='hidden'; node = document.getElementById("girandolalivello2").style.visibility='visible'; } } </script>

t1 spinner loading percentuale

<section class=""style=""> <article class=""style=""> <aside class="row"> <div class="ui dropdown" style=" position:fixed; top:2.3em; left:0em; background-color:orange; background-color:burlywood; background-color:rgba(222,184,135,0.25); color:black; border-radius:0.4em; box-shadow:0px 0px 0px black; visibility:show; "> <input type="hidden" name="numero"> <cite style="font-size:1em;padding-left:0.6em;"> <i class="bars icon"></i> </cite> <div class="default massive text" style="visibility:hidden;" ></div> <div class="menu" style=" background-color:rgba(26,26,26,1); color:oldlace; text-align:right; "> <div class="" data-value="numero1"style="z-index:2000;"> <p> <span style="visibility:show;"> <a href="#fine" style=" margin-left:1.0em; margin-right:1.0em; border-radius:0.4em 0em 0em 0.4em; overflow:visible !important;"> <i class="normal chevron circle down icon"> </i> </a> </span><span style="visibility:show;"> <a href="#" style=" margin-left:1.0em; margin-right:1.0em; border-radius:0.4em 0em 0em 0.4em; overflow:visible !important;"> <i class="normal chevron circle up icon"> </i> </a> </span> <span id=""style="margin-left:1.0em; margin-right:1.0em; padding:0.1em; border-radius:0.2em;display:none;"> <a href="#modale"> <i class="large info circle icon"style="font-size:normal;"> </i> </a> </span> <span id=""style="margin-left:1.0em; margin-right:1.0em; padding:0.1em; border-radius:0.2em;"><a href="#modale"> <i class="large info circle icon"style="font-size:normal;"> </i> </a> </span> <span style="display:none;"> <a href="http://edoraandiamo.altervista.org/"> <span style=" margin-left:1.0em; margin-right:1.0em; padding:0.1em;font-size:0.6em; background-color:dodgerblue; color:black; border-radius:0.5em; visibility:show;"> <i class="home icon"> </i></span></a> </span> </p> <hr/> <p id="" style="font-size:0.8em; color:oldlace;"> </p> </div> <div class="item" data-value="numero2"> <p style="font-size:0.8em;"></p> </div> <div class="" data-value="numero3"> <a href="http://edoraandiamo.altervista.org/"> <span style="padding:0.1em;font-size:1em; background-color:dodgerblue; color:black; border-radius:0.5em; visibility:hidden;"> <i class="home icon"> </i> </span> </a> </div> </div> </div> </aside> </article> </section> <script> $('.ui.dropdown') .dropdown() ; </script>

t1 dropmenu

<article> <div id="L1"></div> <script> document.getElementById('L1').innerHTML = ''+ ' <p style="display:none;"> '+ ' Size iniziale '+window.innerWidth+ 'px '+ ' </p> '+ ' <style> '+ ' .modale{'+ ' position:fixed;'+ ' top:0;left:0;bottom:0;right:0; '+ ' pointer-events:none;opacity:0; '+ ' background-color:black;'+ ' padding:1em;'+ ' overflow:auto !important;'+ ' border-radius:0.0em;'+ ' z-index:100;'+ ' }'+ ' .modale:target{'+ ' pointer-events:auto;opacity:1; '+ ' }'+ ' .modalecontenuto{'+ ' width:70%;height:70%; '+ ' margin-left:15%;'+ ' padding:1em;'+ ' border:solid 0.2em burlywood;'+ ' background-color:oldlace;'+ ' border-radius:0.6em;'+ ' }'+ ' </style> '+ ' <div class="modale" id="modale">'+ ' <div class="modalecontenuto">'+ ' <a href="#" style="'+ ' font-size:2em;'+ ' border:solid 0.05em rgba(0,0,0,0.0);'+ ' ">'+ ' <i class="times circle icon"'+ ' style="color:maroon;">'+ ' </i>'+ ' </a>'+ '<a href="http://venexiatre.altervista.org/WORKOU/OGGI/20191119/20191119f_1-CREEK.html"'+ 'style="font-size:2em;'+ 'border:solid 1px black;'+ 'border-radius:0.2em;" >'+ '<i class="home icon"></i></a>'+ '<a href="http://edoraandiamo.altervista.org/i/index.html"'+ 'style="margin-left:0.5em; '+ 'font-size:2em;'+ 'border:solid 1px black;'+ 'border-radius:0.2em;" >'+ '<i class="user circle outline icon"></i></a>'+ '<p><hr/></p>'+ ' <p style="'+ ' position:relative;'+ ' padding:0.1em;'+ ' border:solid 0.2em rgba(0,0,0,0.1);'+ ' border-radius:0.4em; '+ '"> '+ ' <span onclick="showElement()" '+ ' style=" cursor:pointer; font-size:1.5em; "'+ ' >'+ ' <i class="eye icon">'+ '</i></span> '+ ' <span onclick="hideElement()" '+ ' style=" cursor:pointer; font-size:1.5em; "'+ ' >'+ ' <i class="eye slash icon">'+ '</i></span> '+ ' <table class="versionedelprogramma"'+ ' style="position:absolute; top:50%;'+ ' visibility:hidden;">'+ ' <tbody><tr><td>'+ ' vers.202004220812 '+ ' </td>'+' <td>'+' '+' </td>'+ ' <td style="visibility:show;">'+ ' <span style="cursor:pointer;"'+ ' onclick="dimschermo()" '+ ' >'+ ' <i class="tablet alternate icon">'+ ' </i></span>'+ ' </td>'+ ' <td>'+ ' <span class="ui mini secondary button"'+ ' onClick="window.location.reload();"'+ ' > '+ ' <i class="undo icon"></i>'+ ' </span>'+ ' '+ ' '+ ' </td>'+ ' </tr>'+ ' </tbody>'+ ' </table>'+ ' </p> '+ ' <p style="border:solid 0.05em rgba(0,0,0,0.1);"> '+ ' underground software distillery ©2020 '+ ' </p> '+ ' <article class="sixteen wide column">'+ ' <div id="aforall"style="">' ' </div>'+ ' </article>'+ ' '+ ' </div>'+ ' </div>'+ '' ; function dimschermo() { function gebID(id){ return document.getElementById(id); } function gebTN(tagName, parentEl){ if( typeof parentEl == "undefined" ) var parentEl = document; return parentEl.getElementsByTagName(tagName); } function setStyleToTags(parentEl, tagName, styleString){ var tags = gebTN(tagName, parentEl); for( var i = 0; i<tags.length; i++ ) tags[i].setAttribute('style', styleString); } function testSizes(){ gebID( 'screen.Width' ).innerHTML = screen.width; gebID( 'screen.Height' ).innerHTML = screen.height; gebID( 'window.Width' ).innerHTML = window.innerWidth; gebID( 'window.Height' ).innerHTML = window.innerHeight; gebID( 'documentElement.Width' ).innerHTML = document.documentElement.clientWidth; gebID( 'documentElement.Height' ).innerHTML = document.documentElement.clientHeight; gebID( 'body.Width' ).innerHTML = gebTN("body")[0].clientWidth; gebID( 'body.Height' ).innerHTML = gebTN("body")[0].clientHeight; } var table = document.createElement('table'); table.innerHTML = "<tr><th>SOURCE</th><th>WIDTH</th><th>x</th><th>HEIGHT</th></tr>" +"<tr><td>screen</td><td id='screen.Width' /><td>x</td><td id='screen.Height' /></tr>" +"<tr><td>window</td><td id='window.Width' /><td>x</td><td id='window.Height' /></tr>" +"<tr><td>document<br>.documentElement</td><td id='documentElement.Width' /><td>x</td><td id='documentElement.Height' /></tr>" +"<tr><td>document.body</td><td id='body.Width' /><td>x</td><td id='body.Height' /></tr>" ; gebTN("body")[0].appendChild( table ); table.setAttribute( 'style', "border: 2px solid black !important; position: fixed !important;" +"left: 50% !important; top: 0px !important; padding:10px !important;" +"width: 150px !important; font-size:18px; !important" +"white-space: pre !important; font-family: monospace !important;" +"z-index: 9999 !important;background: white !important;" ); setStyleToTags(table, "td", "color: black !important; border: none !important; padding: 5px !important; text-align:center !important;"); setStyleToTags(table, "th", "color: black !important; border: none !important; padding: 5px !important; text-align:center !important;"); table.style.setProperty( 'margin-left', '-'+( table.clientWidth / 2 )+'px' ); setInterval( testSizes, 200 ); } </script> <script src="http://edoraandiamo.altervista.org/aforall/aforall.js" async></script> </article>

t1 modale

t1 hide/show

<style> main { padding-left:0em; padding-right:0em; padding-top:4em; padding-bottom:4em; border:solid 0.0em maroon !important; border:solid 0.1em maroon !important; } section { margin-left:0em; margin-right:0em; margin-top:1em; margin-bottom:1em; padding-left:2em; padding-right:2em; padding-top:1em; padding-bottom:1em; /* background-color:rgba(222,184,135,0.25); burlywood */ font-size:1em; font-family:monospace !important; border:solid 0.0em orange !important; border:solid 0.1em orange !important; } article { background-color:rgba(222,184,135,0.25); /* burlywood */ border:solid 0.0em navy !important; border:solid 0.1em navy !important; } aside { border:solid 0.0em teal !important; border:solid 0.1em teal !important; } div { border:solid 0.0em fuchsia !important; border:solid 0.1em fuchsia !important; } p { border:solid 0.0em red !important; border:solid 0.1em red !important; } span { border:solid 0.0em black !important; border:solid 0.1em black !important; } img { border:solid 0.0em lime!important; border:solid 0.1em lime !important; } .sfondo{ background-image:url('https://ed-ora-andiamo.com/immagini/carta01x.gif'); background-repeat: repeat; background-attachment: fixed; background-color:rgba(253,245,230,0.5); /* old lace */ } .versionedelprogramma{ text-align:center; background-color:rgba(25,1,104,1); color:white; padding-top:0.25em; padding-bottom:0.25em; padding-left:0.2em; padding-right:0.2em; font-size:0.8em; font-family:monospace; z-index:4000; visibility:hidden;} .intestazione{ position:fixed; left:0; top:0; width:100%; height:4em; background-color:rgba(50,128,13,1); background-color:transparent; } .piedipagina{ position:fixed; left:0; bottom:0; width:100%; height:1em; background-color:rgba(50,128,13,1); background-color:transparent; } </style>

t1 style

<?php $actual_link = "http://{$_SERVER['HTTP_HOST']}{$_SERVER['REQUEST_URI']}"; $oggi_est = date("l") . " "; $oggi_est = $oggi_est . date("Y/m/d"); $oggi_est_time = date("h:i:sa"); $fp = fopen('/membri/nomeaccount/text.txt', 'w'); fwrite($fp, $actual_link. " " .$oggi_est. " ". $oggi_est_time); fclose($fp); $myfile = fopen("/membri/nomeaccount/logs.txt", "a") or die("Unable to open file!"); // $actual_link = "cronologia"; fwrite($myfile, "\n". $actual_link. " " .$oggi_est. " ". $oggi_est_time); fclose($myfile); ?>

t1 cronologia php

t1 id fine

copiare manualmente

<!doctype html> <html lang="it"> <head> <meta http-equiv="content-type"content="text/html; charset=UTF-8"> <meta name="viewport"content="width=device-width, initial-scale=1,shrink-to-fit=no"> <meta name="generator"content="AlterVista - Editor HTML"> <title> </title> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <script src="https://code.jquery.com/jquery-3.1.1.min.js"integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="crossorigin="anonymous"> </script> <link rel="stylesheet"href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css"> <script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"> </script> <style> /* udstile css versione 2020 03 29a */ /* foglio di stile base */ body{background-color:oldlace;} body, main, section, article, div, p, span, header, footer { font-size:1em; overflow:visible !important; } main{ margin-top:4.5em; margin-bottom:0.0em; margin-left:3em; margin-right:3em; border-top:solid 0em maroon; border-bottom:solid 0em maroon; border-left:solid 0.2em maroon !important; border-right:solid 0.2em maroon !important; padding:0.4em; background-color:rgba(222,184,135,0.25); /* burlywood */ color:black; } section{ margin-left:4em !important;margin-right:4em !important; margin-top:0em; margin-bottom:0em; font-family:monospace;} header, footer{ margin-top:4.5em; } img{ width:100%;} div.testo{ text-align:left; max-height:9em; overflow:auto !important; } div.immagine{ text-align:left; max-height:9em; overflow:auto !important; } .centro{ text-align:center !important; margin:auto !important; padding:0 !important; } .sfondo{ background-image:url(https://ed-ora-andiamo.com/immagini/carta01x.gif); background-repeat: repeat; background-attachment: fixed; background-color:rgba(253,245,230,0.5); /* old lace */ } .bordofooter{border:solid 1px rgba(0,0,0,0);} /* debugging */ .bordo{border:solid 0px lime !important;} /* .bordo000{border:solid 2px black !important;} .bordo111{border:solid 2px red !important;} .bordo121{border:solid 2px orange !important;} .bordo131{border:solid 2px green !important;} */ .bordo4{font-size:1.2em;border:solid 2px gray;} p#code{background-color:burlywood;} p#effe{background-color:orange;} p.testo{ text-align:left; max-height:9em; overflow:auto !important; } p.immagine{ text-align:left; max-height:9em; overflow:auto !important; } </style> </head> <body onload="AttendereLoading()" class="sfondo"> <main class="bordo1" style=""> </main> <div id="L0"> <p> <small> underground_software_distillery©2020 se leggi questo messaggio qualcosa non ha funzionato</small> </p> </div> <script async> document.getElementById('L0').innerHTML= ' '+ '<div id="L1"></div> '+ '<div id="L2"></div> '+ '<div id="L3"></div> '+ '<div id="L4"></div> '+ '<div id="L5"></div> '+ '<div id="L6"></div> ' ; document.getElementById('L1').innerHTML = ''+ ' <p style="display:none;"> '+ ' Size iniziale '+window.innerWidth+ 'px '+ ' </p> '+ ' <style> '+ ' .modale{'+ ' position:fixed;'+ ' top:0;left:0;bottom:0;right:0; '+ ' pointer-events:none;opacity:0; '+ ' background-color:black;'+ ' padding:1em;'+ ' overflow:auto !important;'+ ' z-index:100;'+ ' }'+ ' .modale:target{'+ ' pointer-events:auto;opacity:1; '+ ' }'+ ' .modalecontenuto{'+ ' width:70%;height:70%; '+ ' margin-left:15%;'+ ' padding:1em;'+ ' border:solid 0.2em burlywood;'+ ' background-color:oldlace;'+ ' }'+ ' </style> '+ ' <div class="modale" id="modale">'+ ' <div class="modalecontenuto">'+ ' <a href="#" style="'+ ' font-size:2em;'+ ' border:solid 0.05em rgba(0,0,0,0.0);'+ ' ">'+ ' <i class="times circle icon"></i>'+ ' </a>'+ ' <p style="border:solid 0.05em rgba(0,0,0,0.1);"> '+ ' underground software distillery ©2020'+ ' </p> '+ ' </div>'+ ' </div>'+ '' ; document.getElementById('L2').innerHTML = ' <style>'+ ' .drop111L2{'+ ' position:fixed;top:0;left:0;'+ ' width:'+1.5+'em;'+ ' height:'+2+'em;'+ ' height:'+2.5+'em;'+ ' border:solid 0px red;'+ ' '+ '}'+ ' .drop121L2{'+ ' width:'+1.5+'em;'+ ' height:'+2+'em;'+ ' height:'+2.5+'em;'+ ' border:solid 0px green;'+ ' '+ '}'+ ' .drop131L2{'+ ' position:relative;top:0;left:0;'+ ' width:'+window.innerWidth+'px;'+ ' height:'+2+'em;'+ ' height:'+2.5+'em;'+ ' font-size:2em;'+ ' display:none;'+ ' border:solid 0px blue;'+ ' '+ '}'+ ' .drop111L2:hover '+ ' .drop131L2{display:block;}'+ ' .drop111L2:hover '+ ' .drop121L2{display:none;}'+ ' </style>'+ ' <div class="drop111L2">'+ ' <div class="drop121L2">'+ ' <p style="font-size:1.4em;"> '+ ' <i class="bars icon"></i> '+ ' </p> '+ ' </div>'+ ' <div class="drop131L2">'+ ' <span style="display:none;">'+ ' '+window.innerWidth+' '+ ' </span>'+ ' <p style="position:absolute;'+ ' top:0; left:30%;'+ ' ">'+ ' <a href="#modale">'+ ' <i class="info circle icon"></i>'+ ' </a> '+ ' </p>'+ ' <p style="position:absolute;'+ ' top:0; left:50%;'+ ' ">'+ ' <a href="#fine">'+ ' <i class="chevron circle down icon"></i> '+ ' </p>'+ ' </a> '+ ' <a href="#">'+ ' <p style="position:absolute;'+ ' top:0; left:70%;'+ ' ">'+ ' <i class="chevron circle up icon"></i> '+ ' </p>'+ ' </a> '+ ' </div>'+ ' </div>'+ ' '+ '' ; window.addEventListener('resize', function(event){ document.getElementById('L3').innerHTML = ''+ ' <p style="display:none;"> '+ 'Size attuale '+window.innerWidth+ 'px '+ ' </p> '+ ' <style>'+ ' .drop111L3{'+ ' position:fixed;top:0;left:0;'+ ' width:'+1.5+'em;'+ ' height:'+2+'em;'+ ' height:'+2.5+'em;'+ ' border:solid 0px red;'+ ' '+ '}'+ ' .drop121L3{'+ ' width:'+1.5+'em;'+ ' height:'+2+'em;'+ ' height:'+2.5+'em;'+ ' border:solid 0px green;'+ ' '+ '}'+ ' .drop131L3{'+ ' position:relative;top:0;left:0;'+ ' width:'+window.innerWidth+'px;'+ ' height:'+2+'em;'+ ' height:'+2.5+'em;'+ ' font-size:2em;'+ ' display:none;'+ ' border:solid 0px blue;'+ ' '+ '}'+ ' .drop111L3:hover '+ ' .drop131L3{display:block;}'+ ' .drop111L3:hover '+ ' .drop121L3{display:none;}'+ ' </style>'+ ' <div class="drop111L3">'+ ' <div class="drop121L3">'+ ' <p style="font-size:1.4em;"> '+ ' <i class="bars icon"></i> '+ ' </p> '+ ' </div>'+ ' <div class="drop131L3">'+ ' <span style="display:none;">'+ ' '+window.innerWidth+' '+ ' </span>'+ ' <p style="position:absolute;'+ ' top:0; left:30%;'+ ' ">'+ ' <a href="#modale">'+ ' <i class="info circle icon"></i>'+ ' </a> '+ ' </p>'+ ' <p style="position:absolute;'+ ' top:0; left:50%;'+ ' ">'+ ' <a href="#fine">'+ ' <i class="chevron circle down icon"></i> '+ ' </a> '+ ' </p>'+ ' <p style="position:absolute;'+ ' top:0; left:70%;'+ ' ">'+ ' <a href="#">'+ ' <i class="chevron circle up icon"></i> '+ ' </a> '+ ' </p>'+ ' </div>'+ ' </div>'+ ' '+ ' '+ ''; }); document.getElementById('L4').innerHTML= ' <div id="Loaded" '+ ' style="'+ ' position:fixed;'+ ' top:50%; '+ ' left:50%; margin-left:-5.4em; '+ ' "> '+ ' <div class="ui primary '+ ' loading small button ">'+ ' Loading '+ ' </div>'+ ' <div id="percento" style="" '+ ' class="ui secondary '+ ' small button " '+ ' > '+ ' Loading...'+ ' </div> '+ ' '+ ' </div> '+ ' ' ; function AttendereLoading() { if (document.all) {document.all['AttendereLoading'].style.visibility='hidden'; } else if (document.getElementById) {node=document.getElementById('Loaded').style.visibility='hidden'; } } var percento=document.getElementById('percento'); var contatore=1; var intervallo=setInterval( function(){ percento.innerHTML=contatore+'%'; contatore++; if (contatore===101) {clearInterval(intervallo);} }, 30000 ) document.getElementById('L6').innerHTML= ' <style>'+ ' </style>'+ '' ; document.getElementById('L5').innerHTML= ' '+ ' <div class="indicatore-container"> '+ ' <div class="indicatore-bar" id="indicatore"> '+ ' </div> '+ ' </div> '+ '<style> '+ '.indicatore-container { '+ ' position:fixed;top:0;left:0; '+ ' width: 100%; '+ ' height: 0.21em; '+ ' background: burlywood; '+ '} '+ '.indicatore-bar { '+ ' height: 0.21em; '+ ' background: maroon; '+ ' width: 0%; '+ '} '+ '</style> '+ ' ' ; window.onscroll = function() {indicatore()}; function indicatore() { var winScroll = document.body.scrollTop || document.documentElement.scrollTop; var height = document.documentElement.scrollHeight - document.documentElement.clientHeight; var scrolled = (winScroll / height) * 100; document.getElementById("indicatore").style.width = scrolled + "%"; } </script> <div id="fine"></div> </body> </html>

copiare manualmente da ebook 26 pagine

<!doctype html> <html lang="it"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0, shrink-to-fit=no"> <title>202004020850 num-pages 26</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="icon" href="http://www.beatsupernovarasa.com/immagini/peace_flag.jpg" alt="" title="" type="image/png" sizes="16x16"> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"> </script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css"> <script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"> </script> <link rel="stylesheet" href="http://edoraandiamo.altervista.org/usdebook/seb/usdceb01.css" /> <script type="text/javascript" src="http://edoraandiamo.altervista.org/usdebook/seb/usdjeb01.js"></script>   <script type="text/javascript" src="http://edoraandiamo.altervista.org/usdebook/seb/usdjeb02.js"> </script> <script type="text/javascript"> var num_pages = 100; var num_pages = 6; var num_pages = 26; var num_loaded_pages = 100; var num_loaded_pages = 6; var num_loaded_pages = 26; </script>   <link rel="stylesheet" href="http://edoraandiamo.altervista.org/usdebook/seb/usdCEB01_1.css" />  <script type="text/javascript"> var map_area_opacity = 0.6; var force_one_page = false; var banner_height = 90; var maps = new Array(); for(var p=0; p<num_pages; p++) maps[p] = new Array(); function createMapsEvents() { } </script>  <script type="text/javascript" src="http://edoraandiamo.altervista.org/usdebook/seb/usdjeb03.js"> </script> <link rel="stylesheet" href="http://edoraandiamo.altervista.org/usdebook/seb/usdceb02.css" /> </head> <body onresize="myFunzioneFunction()" onLoad="AttendereLoading()">  <div id="Loaded" style=" position:fixed; top:4em; left:1.5em; "> <div class="ui secondary loading small button "> Loading </div> <div id="percento" style="" class="ui secondary small button" > Loading... </div> </div> <script> function AttendereLoading() { if (document.all) {document.all['AttendereLoading'].style.visibility='hidden'; } else if (document.getElementById) {node=document.getElementById('Loaded').style.visibility='hidden'; } } var percento=document.getElementById('percento'); var contatore=1; var intervallo=setInterval( function(){ percento.innerHTML=contatore+'%'; contatore++; if (contatore===101) {clearInterval(intervallo);} }, 30000 ) </script>  <div id="preload_bg" class="preloadUnderscoreBg" style=""> <div id="preload" class="preloadPlain" style=""> <div id="preload_text">100% </div> <div id="preload_bar" class="preloadUnderscoreBar" style=""> </div> </div> </div> <div id="header" class="headerTopSinistraDestra" style=""> <div id="header_left" class="headerMappaPos"> <div class="thumb headerMappaThumb" id_thumb="25" style=""> <span class="fa fa-map-o headerMappaThumbIcona" style="font-size:1.4em;margin-top:0.3em; margin-left:2.5em;opacity:0.3;"> </span> </div> </div> <div id="header_left" class="headerPaginaCopertinaPos" style=""> <div class="thumb headerPaginaCopertinaThumb" id_thumb="0" style="margin-left:-6.5em !important;"> <span class="fa fa-home headerPaginaCopertinaThumbIcona" style="font-size:1.8em;margin-top:0.1em;opacity:0.3;"> </span> </div> </div> <div id="header_left" class="headerRefreshSchermoPos"> <p onclick="ricaricaPagina()" class="fa fa-refresh headerRefreshSchermoThumbIcona" style="cursor:pointer; background-color:transparent; margin-left:1em; font-size:1.5em; border-radius:4px; padding:2px 4px 2px 2px;opacity:0.3;"> </p> </div> <div id="header_left" class="headerSchermoInteroPos"> <p onclick="toggleFullScreen(document.body)" class="fa fa-arrows-alt headerSchermoInteroThumbIcona" style="cursor:pointer; background-color:transparent; font-size:1.5em;border-radius:4px; padding:2px 4px 2px 2px;opacity:0.3;"> </p> </div>   <div id="header_right" class="headerPaginaCopertinaPos" style=" width:200px; height:50px; width:25%; height:50px; overflow:auto; border:solid 0px white;">  <style> .headerPaginaCopertinaThumbPagine{ margin:0; font-family:sans-serif; } .headerPaginaCopertinaThumbPagineIcona{ font-size:1.2em; font-weight:bold; font-family:sans-serif; color:maroon; } table#ThumbPagine,{ background-color:black; } td { background-color:black;padding:0px;} </style> <table id="ThumbPagine" align="left"><tr> <td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="1" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">1 </span> </div> </td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="2" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">2 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="3" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">3 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="4" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">4 </span> </div></td> <td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="5" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">5 </span> </div> </td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="6" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">6 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="7" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">7 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="8" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">8 </span> </div></td> <td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="9" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">9 </span> </div> </td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="10" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">10 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="11" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">11 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="12" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">12 </span> </div></td> <td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="13" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">13 </span> </div> </td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="14" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">14 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="15" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">15 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="16" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">16 </span> </div></td> <td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="17" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">17 </span> </div> </td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="18" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">18 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="19" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">19 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="20" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">20 </span> </div></td> <td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="21" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">21 </span> </div> </td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="22" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">22 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="23" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">23 </span> </div></td><td> <div class="thumb headerPaginaCopertinaThumbPagine" id_thumb="24" style=""> <span class="headerPaginaCopertinaThumbPagineIcona" style="">24 </span> </div></td> </tr></table>  </div>   </div> <div id="thumbs" style="top: 0px; transform: translate3d(0px, -200px, 0.9px); width: 916px; overflow: hidden; -moz-user-select: none; touch-action: none;"> <div class="iscrollH" style="pointer-events: none; transition-property: opacity; transition-duration: 350ms; overflow: hidden; opacity: 0;"> <div style="pointer-events: none; transition-property: transform; transition-timing-function: cubic-bezier(0.33, 0.66, 0.66, 1); transform: translate(0px, 0px) translateZ(0px); width: 31px;"> </div> </div> </div> <div id="sommario" style="left: 0px; transform: translate3d(-240px, 0px, 0.3px); height: 607px; width: 180px; overflow: hidden; -moz-user-select: none; touch-action: none;"> <div id="sommario_content" style="transition-property: transform; transform-origin: 0px 0px 0px; transform: translate(0px, 0px) translateZ(0px); -moz-user-select: none; touch-action: none;"> </div> </div>  <style> img{ width:auto; height:auto; text-align:center !important; margin:auto !important; padding:0 !important;} .sfondo-pagina{background-color:black;} </style> <div id="book" style="perspective: 1432px; height: 577px; width: 818px; transform: translate3d(-155.5px, 0px, 0.1px); transform-origin: 75% center 0px; opacity: 1; ">  <div id="p0" class="page transformApari sfondo-pagina" n="0" style=""> <article id="0" class=""> <div class="row"> <p class=""> <img src="http://edoraandiamo.altervista.org/img0/non-si-scrive-sui-muri.jpg" alt="" title="Non si scrive sui muri, stencil, fotografia di Rinaldo Rasa, 1 maggio 2014." style="width:100%;"> </p> </div> </article> </div> <div id="p1" class="page transformAdispari sfondo-pagina" n="1" style=""> <article id="1" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p2" class="page transformApari sfondo-pagina" n="2" style=""> <article id="2" class="articolo"> <div class="row paginaTesto" style=""> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2007-arici-venezia-c07-04-05_0481717-FOTO-COLOR-ARICI.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p3" class="page transformAdispari sfondo-pagina" n="3" style=""> <article id="3" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p4" class="page transformApari sfondo-pagina" n="4" style=""> <article id="4" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2015-arici-2015gennaio--227.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p5" class="page transformAdispari sfondo-pagina" n="5" style=""> <article id="5" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p6" class="page transformApari sfondo-pagina" n="6" style=""> <article id="6" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2017-arici-2017-1197-venice-IMG_5751.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p7" class="page transformAdispari sfondo-pagina" n="7" style=""> <article id="7" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p8" class="page transformApari sfondo-pagina" n="8" style=""> <article id="8" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2017-arici-2017-2247-venice-IMG_6967.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p9" class="page transformAdispari sfondo-pagina" n="9" style=""> <article id="9" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p10" class="page transformApari sfondo-pagina" n="10" style=""> <article id="10" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2017-arici-2017-267-venice-IMG_4553.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p11" class="page transformAdispari sfondo-pagina" n="11" style=""> <article id="11" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p12" class="page transformApari sfondo-pagina" n="12" style=""> <article id="12" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2017-arici-c2017-0506-b016.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p13" class="page transformAdispari sfondo-pagina" n="13" style=""> <article id="13" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p14" class="page transformApari sfondo-pagina" n="14" style=""> <article id="14" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2018-arici-20180308--194-IMG_8738.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p15" class="page transformAdispari sfondo-pagina" n="15" style=""> <article id="15" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p16" class="page transformApari sfondo-pagina" n="16" style=""> <article id="16" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2018-arici-20180319--194-IMG_8738.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p17" class="page transformAdispari sfondo-pagina" n="17" style=""> <article id="17" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p18" class="page transformApari sfondo-pagina" n="18" style=""> <article id="18" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2018-arici-20180609--013-IMG_0014.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p19" class="page transformAdispari sfondo-pagina" n="19" style=""> <article id="19" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p20" class="page transformApari sfondo-pagina" n="20" style=""> <article id="20" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2018-arici-20180610--016-IMG_0017.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p21" class="page transformAdispari sfondo-pagina" n="21" style=""> <article id="19" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p22" class="page transformApari sfondo-pagina" n="22" style=""> <article id="22" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/venezia/arici/2019-arici-20190513-168-IMG_8075.jpg" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p23" class="page transformAdispari sfondo-pagina" n="23" style=""> <article id="23" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p24" class="page transformApari sfondo-pagina" n="24" style=""> <article id="24" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-black.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div> <div id="p25" class="page transformAdispari sfondo-pagina" n="25" style=""> <article id="25" class="articolo"> <div class="row paginaTesto"> <p class="paragrafoTesto"> <img src="http://veneziavi.altervista.org/ebook/pagine/nsssm-pag-oldlace.png" alt="" title="" style="width:100%;"> </p> </div> </article> </div>  </div>  <div id="arrow_left" style="opacity:1;"> <i class="fa fa-angle-left" style="position:fixed;left:0%;top:30%;color:#a00;font-size:4em;"> </i> </div> <div id="arrow_right" style="opacity:1;"> <i class="fa fa-angle-right" style="position:fixed;right:0%;top:30%;color:#a00;font-size:4em;"> </i> </div> </body> </html>

Implementazione

Questo codice risolve il problema del mancato sincronismo che invalida il loading avvertenza.
Quando un codice javascript è incluso in un document inner si ha un ritardo nell'avviso loading percentuale tale che l'user non viene aiutato.
L'unico modo per ovviare all'inconveniente è inserire il loading avviso nel codice stesso extrapolandolo dal document.inner

<div id="Loaded" style=" position:fixed; top:4em; left:1.5em; "> <div class="ui secondary loading small button "> Loading </div> <div id="percento" style="" class="ui secondary small button" > Loading... </div> </div> <script> function AttendereLoading() { if (document.all) {document.all['AttendereLoading'].style.visibility='hidden'; } else if (document.getElementById) {node=document.getElementById('Loaded').style.visibility='hidden'; } } var percento=document.getElementById('percento'); var contatore=1; var intervallo=setInterval( function(){ percento.innerHTML=contatore+'%'; contatore++; if (contatore===101) {clearInterval(intervallo);} }, 30000 ) </script>

Un altro esempio si può trovare in spinner classico che però non usa il semantic user interface

Altre implementazioni sono deprecate.

Repository elenco file css e js

http://edoraandiamo.altervista.org/usdebook/seb/usdceb01.css

http://edoraandiamo.altervista.org/usdebook/seb/usdjeb01.js

http://edoraandiamo.altervista.org/usdebook/seb/usdjeb02.js

http://edoraandiamo.altervista.org/usdebook/seb/usdCEB01_1.css

http://edoraandiamo.altervista.org/usdebook/seb/usdjeb03.js

http://edoraandiamo.altervista.org/usdebook/seb/usdceb02.css

Siti mirror /usdbook/seb/ su domini Altervista:

http://venexiatre.altervista.org/

http://veneziavi.altervista.org/

Siti mirror /usdbook/seb/ su altri domini:

https://ed-ora-andiamo.com/

http://beatsupernovarasa.com/

usdceb01.css usdjeb01.js usdjeb02.js vanno posizionati immediatamente dopo i files Semantic UI CND (in head)

usdCEB01_1.css va posizionato alla fine dello script dei settaggi num_pages num_loaded_pages

usdjeb03.js usdceb02.css vanno posizionati immediatamente prima di </head>

Il corretto posizionamento dei file css e javascript sono molto importanti per il funzionamento del programma.

Naturalmente non possono essere in alcun modo editati senza sapere esattamente che cosa si sta facendo. Una qualsiasi modificazione dei loro codici puo' portare al malfunzionamento dell'intero programma introducendo cosi' bug insidiosi da cui e' poi difficile uscire. Percio' molta cautela!

Tavolozza : composizione colori rgba base 1 1+1 1+1+1 fattore x min 0 max 255 combinazioni 123 132 213 231 312 321

copiare manualmente

<article style=""> <div class="avviso" id="girandolalivello1" style="margin:0 auto; text-align:center; padding:0px; background-color:rgba(0,0,0, 1); color:oldlace;"> <span style="padding-left:0.4em;padding-right:0.4em; "> Loading... Il sistema sta trattando la richiesta, ti preghiamo di attendere. </span> <div id="" style=""> <div class="ui secondary mini loading button"style="background-color:black !important;"> Loading </div> </div> <div id="mostra-percentuale" style="position:fixed; top:0; left:0px; padding-left:0.4em;padding-right:0.4em; background-color:black; color:white;"></div> </div> <script> var i = 0; if (i == 0) { i = 1; var elem = document.getElementById("mostra-percentuale"); // var width = 10; var width = 0; // var id = setInterval(frame, 10); var id = setInterval(frame, 30000); function frame() { if (width >= 100) { clearInterval(id); i = 0; } else { width++; // elem.style.width = width + "%"; // elem.style.width = width + "%"; // elem.innerHTML = width + "%"; // elem.innerHTML = width + "%"; elem.innerHTML = width + "%"; } } } </script> </article> <script> function attesa(){ if (document.all){ document.all["girandolalivello1"].style.visibility="hidden"; document.all["girandolalivello2"].style.visibility="visible"; } else if (document.getElementById){ node = document.getElementById("girandolalivello1").style.visibility='hidden'; node = document.getElementById("girandolalivello2").style.visibility='visible'; } } </script>

ricordarsi di inserire in body onload="attesa()"

copiare manualmente

seleziona poi copia&incolla (da effettuarsi manualmente)

<table class="ui table" style=""> <thead> <tr> <th colspan="2"> titolo </th> </tr> </thead> <tbody> <tr> <td data-label=""> <button class="mini ui button" style=";">row </button> </td> </tr> <tr> <td data-label=""> <button class="mini ui button" style=";">row </button> </td> </tr> </tbody> </table>

Uniformare le grid in un main container per evitare disallineamenti e margini fuori linea

ui grid container uniforma mentre la class centro ha la stessa funzione del vecchio comando <center> considerato deprecabile

.centro{ text-align:center !important; margin:auto !important; padding:0 !important; }

Celled grid

<section class="ui container"> <article class="ui internally celled grid"> <aside class="row"> <div class="three wide column"> </div> <div class="ten wide column"> <p class="testo"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. </p> </div> <div class="three wide column"> <img src="http://placekitten.com/200/260"> </div> </aside> </article> </section>

bullhorn icon file outline icon hand point right icon bars icon clipboard outline icon code icon book icon paperclip icon

La lista completa delle icone disponibili

ICONE SVG

Visualizzazione delle icone svg sprite

icone svg bootstrap italia link

<?xml version="1.0" encoding="utf-8"?> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs> <svg viewBox="0 0 24 24" id="it-arrow-down" xmlns="http://www.w3.org/2000/svg"><path d="M17.9 13.2l-5.4 5.3V3h-1v15.5l-5.4-5.3-.7.7 6.6 6.5 6.6-6.5zM12 19z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-down-circle" xmlns="http://www.w3.org/2000/svg"><path d="M15.6 13.2l.7.7-4.3 4.3-4.3-4.3.7-.7 3.1 3.1V7h1v9.2zM22 12A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-down-triangle" xmlns="http://www.w3.org/2000/svg"><path d="M9.2 12h5.6a1 1 0 01.7 1.7L12 17.3l-3.5-3.6a1 1 0 01.7-1.7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-left" xmlns="http://www.w3.org/2000/svg"><path d="M21 11.5H5.5l5.3-5.4-.7-.7L3.6 12l6.5 6.6.7-.7-5.3-5.4H21zM5 12z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-left-circle" xmlns="http://www.w3.org/2000/svg"><path d="M7.7 11.5H17v1H7.8l3 3.1-.7.7L5.8 12l4.3-4.3.7.7zM22 12A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-left-triangle" xmlns="http://www.w3.org/2000/svg"><path d="M12 9.2v5.6a1 1 0 01-1.7.7L6.8 12l3.5-3.5a1 1 0 011.7.7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-right" xmlns="http://www.w3.org/2000/svg"><path d="M13.9 5.4l-.7.7 5.3 5.4H3v1h15.5l-5.3 5.4.7.7 6.6-6.6zM19 12z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-right-circle" xmlns="http://www.w3.org/2000/svg"><path d="M13.9 7.7l4.3 4.3-4.3 4.3-.7-.7 3.1-3.1H7v-1h9.2l-3-3.1zM22 12A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-right-triangle" xmlns="http://www.w3.org/2000/svg"><path d="M12 14.8V9.2a1 1 0 011.7-.7l3.5 3.5-3.5 3.5a1 1 0 01-1.7-.7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-up" xmlns="http://www.w3.org/2000/svg"><path d="M18.6 10.1L12 3.5l-6.6 6.6.7.7 5.4-5.3V21h1V5.5l5.4 5.3zM12 5z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-up-circle" xmlns="http://www.w3.org/2000/svg"><path d="M12 5.8l4.3 4.3-.7.7-3.1-3.1V17h-1V7.8l-3.1 3-.7-.7zM22 12A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-arrow-up-triangle" xmlns="http://www.w3.org/2000/svg"><path d="M14.8 12H9.2a1 1 0 01-.7-1.7L12 6.8l3.5 3.5a1 1 0 01-.7 1.7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-behance" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M7.83 5.75a8 8 0 011.6.15 3.38 3.38 0 011.24.51c.345.233.62.554.8.93.202.456.298.952.28 1.45a2.68 2.68 0 01-.42 1.54 3.05 3.05 0 01-1.25 1 2.92 2.92 0 011.68 1.15c.393.59.59 1.29.56 2a3.39 3.39 0 01-.32 1.59 3.08 3.08 0 01-1 1.11 4.27 4.27 0 01-1.4.64A6 6 0 018 18H2V5.75h5.83zm-.35 5a2 2 0 001.19-.35c.328-.27.5-.687.46-1.11A1.47 1.47 0 009 8.54a1.16 1.16 0 00-.42-.43A1.8 1.8 0 008 7.9a3.26 3.26 0 00-.7-.06H4.74v2.87l2.74.04zm.15 5.22c.252.003.503-.02.75-.07a2 2 0 00.62-.3 1.39 1.39 0 00.44-.49 1.73 1.73 0 00.16-.8A1.64 1.64 0 009.09 13a2.33 2.33 0 00-1.41-.4H4.74v3.38l2.89-.01zm8.54-.08a2.18 2.18 0 001.58.54 2.24 2.24 0 001.25-.37 1.6 1.6 0 00.65-.79h2.15a4.06 4.06 0 01-1.58 2.29 4.64 4.64 0 01-2.58.69 5.23 5.23 0 01-1.9-.33 4 4 0 01-2.33-2.44 5.25 5.25 0 01-.32-1.89 5.12 5.12 0 01.33-1.86 4.14 4.14 0 01.93-1.49 4.48 4.48 0 011.44-1 4.59 4.59 0 011.85-.36 4.31 4.31 0 012 .44A4 4 0 0121 10.5c.37.505.636 1.08.78 1.69a6.18 6.18 0 01.17 2h-6.38a2.5 2.5 0 00.6 1.7zM19 11.22a1.83 1.83 0 00-1.38-.49 2 2 0 00-1 .2 1.8 1.8 0 00-.62.49 1.62 1.62 0 00-.33.62 2.87 2.87 0 00-.11.59h4a2.4 2.4 0 00-.56-1.41zm-3.93-4.65h4.98v1.21h-4.98V6.57z"/></svg> <svg viewBox="0 0 24 24" id="it-burger" xmlns="http://www.w3.org/2000/svg"><path d="M22 5v1H2V5zM2 12.5h20v-1H2zM2 19h20v-1H2z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-calendar" xmlns="http://www.w3.org/2000/svg"><path d="M20.5 4H17V3h-1v1H8V3H7v1H3.5A1.5 1.5 0 002 5.5v13A1.5 1.5 0 003.5 20h17a1.5 1.5 0 001.5-1.5v-13A1.5 1.5 0 0020.5 4zm.5 14.5a.5.5 0 01-.5.5h-17a.5.5 0 01-.5-.5v-13a.5.5 0 01.5-.5H7v1h1V5h8v1h1V5h3.5a.5.5 0 01.5.5zM4 8h16v1H4z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-camera" xmlns="http://www.w3.org/2000/svg"><path d="M20.5 20h-17A1.5 1.5 0 012 18.5v-10A1.5 1.5 0 013.5 7h4.3l1.5-2.3a1.5 1.5 0 011.2-.7h3a1.5 1.5 0 011.2.7L16.2 7h4.3A1.5 1.5 0 0122 8.5v10a1.5 1.5 0 01-1.5 1.5zM3.5 8a.5.5 0 00-.5.5v10a.5.5 0 00.5.5h17a.5.5 0 00.5-.5v-10a.5.5 0 00-.5-.5h-4.8l-1.8-2.8-.4-.2h-3l-.4.2L8.3 8zM12 18a5 5 0 115-5 5 5 0 01-5 5zm0-9a4 4 0 104 4 4 4 0 00-4-4zM7 5H4v1h3z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-card" xmlns="http://www.w3.org/2000/svg"><path d="M20.5 5h-17A1.5 1.5 0 002 6.5v11A1.5 1.5 0 003.5 19h17a1.5 1.5 0 001.5-1.5v-11A1.5 1.5 0 0020.5 5zM3 9h18v3H3zm18 8.5a.5.5 0 01-.5.5h-17a.5.5 0 01-.5-.5V13h18zM3 8V6.5a.5.5 0 01.5-.5h17a.5.5 0 01.5.5V8zm5 7H4v-1h4z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-check" xmlns="http://www.w3.org/2000/svg"><path d="M9.6 16.9L4 11.4l.8-.7 4.8 4.8 8.5-8.4.7.7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-check-circle" xmlns="http://www.w3.org/2000/svg"><path d="M17.1 7.9l.7.7-7.8 7.6-4.7-4.6.7-.7 4 3.9zM22 12A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-chevron-left" xmlns="http://www.w3.org/2000/svg"><path d="M14.6 17.2L9 11.6 14.6 6l.8.7-4.9 4.9 4.9 4.9z"/></svg> <svg viewBox="0 0 24 24" id="it-chevron-right" xmlns="http://www.w3.org/2000/svg"><path d="M9.8 17.2l-.8-.7 4.9-4.9L9 6.7l.8-.7 5.6 5.6z"/></svg> <svg viewBox="0 0 24 24" id="it-clip" xmlns="http://www.w3.org/2000/svg"><path d="M11 22a2.9 2.9 0 01-3-3V6a4 4 0 018 0v10h-1V6a3 3 0 00-6 0v13a2 2 0 004 0V8a1 1 0 00-2 0v8h-1V8a2 2 0 014 0v11a2.9 2.9 0 01-3 3z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-clock" xmlns="http://www.w3.org/2000/svg"><path d="M11.5 5h1v7.5H7v-1h4.5zM22 12A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-close" xmlns="http://www.w3.org/2000/svg"><path d="M12.7 12l3.7 3.6-.8.8-3.6-3.7-3.6 3.7-.8-.8 3.7-3.6-3.7-3.6.8-.8 3.6 3.7 3.6-3.7.8.8z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-close-big" xmlns="http://www.w3.org/2000/svg"><path d="M12.7 12l6.7 6.6-.8.8-6.6-6.7-6.6 6.7-.8-.8 6.7-6.6-6.7-6.6.8-.8 6.6 6.7 6.6-6.7.8.8z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-close-circle" xmlns="http://www.w3.org/2000/svg"><path d="M16.3 8.3L12.6 12l3.7 3.6-.7.7-3.7-3.6-3.6 3.6-.7-.7 3.6-3.6-3.6-3.7.7-.7 3.6 3.7 3.7-3.7zM22 12A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-code-circle" xmlns="http://www.w3.org/2000/svg"><path d="M19 12l-2.9 2.9-.7-.8 2.1-2.1-2.1-2.1.7-.8zM7.9 9.1L5 12l2.9 2.9.7-.8L6.5 12l2.1-2.1zM22 12A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9zM9.6 16.5l1 .3 3.7-9.3-.9-.3z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-collapse" xmlns="http://www.w3.org/2000/svg"><path d="M16.5 15.4l-4.9-4.9-4.9 4.9-.7-.8L11.6 9l5.6 5.6z"/></svg> <svg viewBox="0 0 24 24" id="it-comment" xmlns="http://www.w3.org/2000/svg"><path d="M19 3H5a2 2 0 00-2 2v10a2 2 0 002 2h2v5.4l1.7-1.7 3.7-3.7H19a2 2 0 002-2V5a2 2 0 00-2-2zm1 12a.9.9 0 01-1 1h-7l-4 4v-4H5a.9.9 0 01-1-1V5a.9.9 0 011-1h14a.9.9 0 011 1zM9 10a.9.9 0 01-1 1 .9.9 0 01-1-1 .9.9 0 011-1 .9.9 0 011 1zm4 0a1 1 0 01-2 0 1 1 0 012 0zm4 0a1 1 0 01-2 0 1 1 0 012 0z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-copy" xmlns="http://www.w3.org/2000/svg"><path d="M19.5 4H18v-.6A1.5 1.5 0 0016.5 2h-11A1.5 1.5 0 004 3.4v15.2A1.5 1.5 0 005.5 20H7v.6A1.5 1.5 0 008.5 22h11a1.5 1.5 0 001.5-1.4V5.4A1.5 1.5 0 0019.5 4zM5 18.6V3.4a.5.5 0 01.5-.4h11a.5.5 0 01.5.4v15.2a.5.5 0 01-.5.4h-11a.5.5 0 01-.5-.4zm15 2a.5.5 0 01-.5.4h-11a.5.5 0 01-.5-.4V20h8.5a1.5 1.5 0 001.5-1.4V5h1.5a.5.5 0 01.5.4z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-designers-italia" xmlns="http://www.w3.org/2000/svg"><path d="M8.663 20.675V7.641H12.3v13.057H8.663v-.023zM22.952 10.61h-3.325v5.357c0 .534.024.882.048 1.113.024.21.12.395.289.557.169.162.434.232.795.232l2.072-.046.169 2.783c-1.205.255-2.145.394-2.771.394-1.639 0-2.747-.348-3.325-1.067-.603-.696-.892-1.994-.892-3.896V4h3.639v3.618h3.325v2.992h-.024zm-19.76.997c-.626 0-1.156-.209-1.565-.626A2.113 2.113 0 011 9.45c0-.604.217-1.114.602-1.531.41-.418.94-.603 1.567-.603.626 0 1.156.208 1.566.626.41.417.602.927.602 1.554 0 .626-.192 1.113-.602 1.53-.386.371-.892.58-1.542.58z"/></svg> <svg viewBox="0 0 24 24" id="it-download" xmlns="http://www.w3.org/2000/svg"><path d="M12 14.2L7.7 9.9l.7-.7 3.1 3.1V3h1v9.2l3.1-3 .7.7zm7-2.2v7.5a.5.5 0 01-.5.5h-13a.5.5 0 01-.5-.5V12H4v7.5A1.5 1.5 0 005.5 21h13a1.5 1.5 0 001.5-1.5V12z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-error" xmlns="http://www.w3.org/2000/svg"><path d="M11.5 14.2V5.7h1.2v8.5zm-.1 4.1h1.2v-1.8h-1.2zM22 7.9v8.3L16.1 22H7.9L2 16.2V7.9L7.9 2h8.2zm-1 .4L15.7 3H8.3L3 8.3v7.5L8.3 21h7.4l5.3-5.2z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-exchange-circle" xmlns="http://www.w3.org/2000/svg"><path d="M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 19a9 9 0 119-9 9 9 0 01-9 9zm5.1-8.9l.8.8-4.3 4.3a1.5 1.5 0 01-1.1.4 1.5 1.5 0 01-1.1-.4L9 14.7V17H8v-4h4v1H9.7l2.4 2.5h.8zm-6-4.6l-4.2 4.4-.8-.8 4.3-4.3a1.5 1.5 0 011.1-.4 1.5 1.5 0 011.1.4L15 9.3V7h1v4h-4v-1h2.3l-2.4-2.5h-.8z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-expand" xmlns="http://www.w3.org/2000/svg"><path d="M11.6 15.4L6 9.8l.7-.8 4.9 4.9L16.5 9l.7.8z"/></svg> <svg viewBox="0 0 24 24" id="it-external-link" xmlns="http://www.w3.org/2000/svg"><path d="M21 3v6h-1V4.7l-7.6 7.7-.8-.8L19.3 4H15V3zm-4 16.5a.5.5 0 01-.5.5h-12a.5.5 0 01-.5-.5v-12a.5.5 0 01.5-.5H12V6H4.5A1.5 1.5 0 003 7.5v12A1.5 1.5 0 004.5 21h12a1.5 1.5 0 001.5-1.5V12h-1z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-facebook" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M13.55 22v-9.11h3.07l.46-3.56h-3.53V7.05c0-1 .29-1.73 1.77-1.73h1.87V2.14A25.14 25.14 0 0014.45 2c-2.72 0-4.58 1.66-4.58 4.7v2.62H6.81v3.57h3.06V22h3.68z"/></svg> <svg viewBox="0 0 24 24" id="it-facebook-square" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M20 3H4a1 1 0 00-1 1v16a1 1 0 001 1h8.63v-6.95h-2.37v-2.74h2.34v-2a3.28 3.28 0 013.5-3.6c.705 0 1.41.04 2.11.12v2.44h-1.44c-1.13 0-1.34.53-1.34 1.32v1.74h2.7l-.35 2.72h-2.35v7H20a1 1 0 001-1V4a1 1 0 00-1-1z"/></svg> <svg viewBox="0 0 24 24" id="it-file" xmlns="http://www.w3.org/2000/svg"><path d="M14.7 2H6.5A1.5 1.5 0 005 3.5v17A1.5 1.5 0 006.5 22h11a1.5 1.5 0 001.5-1.5V6.3zm.3 1.7L17.3 6h-1.8a.5.5 0 01-.5-.5zM17.5 21h-11a.5.5 0 01-.5-.5v-17a.5.5 0 01.5-.5H14v2.5A1.5 1.5 0 0015.5 7H18v13.5a.5.5 0 01-.5.5zM8 9h8v1H8zm0 2h8v1H8zm0 2h4v1H8z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-files" xmlns="http://www.w3.org/2000/svg"><path d="M15.7 2H7.5A1.5 1.5 0 006 3.5V4h-.5A1.5 1.5 0 004 5.5v15A1.5 1.5 0 005.5 22h11a1.5 1.5 0 001.5-1.5V20h.5a1.5 1.5 0 001.5-1.5V6.3zm.3 1.7L18.3 6h-1.8a.5.5 0 01-.5-.5zm1 16.8a.5.5 0 01-.5.5h-11a.5.5 0 01-.5-.5v-15a.5.5 0 01.5-.5H6v13.5A1.5 1.5 0 007.5 20H17zm1.5-1.5h-11a.5.5 0 01-.5-.5v-15a.5.5 0 01.5-.5H15v2.5A1.5 1.5 0 0016.5 7H19v11.5a.5.5 0 01-.5.5zM9 9h8v1H9zm0 2h8v1H9zm0 2h4v1H9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-flickr" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><circle cx="6.73" cy="12" r="4.73"/><circle cx="17.27" cy="12" r="4.73"/></svg> <svg viewBox="0 0 24 24" id="it-flickr-square" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M20 4a3.26 3.26 0 00-2.38-1H6.38A3.26 3.26 0 004 4a3.26 3.26 0 00-1 2.37v11.25A3.26 3.26 0 004 20a3.26 3.26 0 002.39 1h11.24A3.38 3.38 0 0021 17.62V6.37A3.26 3.26 0 0020 4zm-9.56 9.77a2.5 2.5 0 01-3.51 0 2.49 2.49 0 010-3.52 2.5 2.5 0 013.51 0 2.49 2.49 0 010 3.52zm6.61 0A2.49 2.49 0 0112.82 12a2.49 2.49 0 014.24-1.76 2.49 2.49 0 010 3.52l-.01.01z"/></svg> <svg viewBox="0 0 24 24" id="it-folder" xmlns="http://www.w3.org/2000/svg"><path d="M20 6h-8l-2-2H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2zm1 12a.9.9 0 01-1 1H4a.9.9 0 01-1-1V6a.9.9 0 011-1h5.6l1.7 1.7.3.3H20a.9.9 0 011 1zM4 8h16v1H4z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-github" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7C6.73 19.91 6.14 18 6.14 18A2.69 2.69 0 005 16.5c-.91-.62.07-.61.07-.61a2.13 2.13 0 011.53 1 2.14 2.14 0 002.91.83 2.16 2.16 0 01.63-1.34c-2.14-.21-4.52-1.07-4.52-4.9a3.89 3.89 0 011-2.69 3.57 3.57 0 01.1-2.64s.84-.27 2.75 1a9.63 9.63 0 015 0c1.91-1.29 2.75-1 2.75-1 .37.835.405 1.78.1 2.64a3.89 3.89 0 011 2.69c0 3.84-2.34 4.68-4.57 4.93.482.49.73 1.164.68 1.85v2.75c0 .33.18.58.69.48A10 10 0 0012 2z"/></svg> <svg viewBox="0 0 24 24" id="it-hearing" xmlns="http://www.w3.org/2000/svg"><path d="M20 9a6.8 6.8 0 01-3.5 6l-2 1.1a3.3 3.3 0 00-1.5 2.7A3.2 3.2 0 019.8 22h-.6a3.4 3.4 0 01-3-2.1l.9-.5A2.3 2.3 0 009.2 21h.6a2.1 2.1 0 001.6-.7 2 2 0 00.6-1.5 4 4 0 012-3.5l2-1.2A5.9 5.9 0 0019 9a6 6 0 00-6-6 6 6 0 00-4.8 2.4l-.8-.6A7 7 0 0113 2a7 7 0 017 7zM7.5 12A5.5 5.5 0 002 6.5v1a4.5 4.5 0 010 9v1A5.5 5.5 0 007.5 12zM5 12a2.9 2.9 0 00-3-3v1a2 2 0 010 4v1a2.9 2.9 0 003-3zm5 0a8 8 0 00-8-8v1a7 7 0 010 14v1a8 8 0 008-8zm5.9.3a4.5 4.5 0 001.2-3.2 4.5 4.5 0 00-1.2-3.2 4.5 4.5 0 00-3.2-1.4A4.8 4.8 0 009.5 6l-.3.3.2.3a8.8 8.8 0 011.3 3v.4h.4a1.5 1.5 0 010 3v1a2.5 2.5 0 002.5-2.5 2.6 2.6 0 00-2-2.5 8.5 8.5 0 00-1.1-2.6 3.9 3.9 0 012.2-.9 3.5 3.5 0 012.4 1 3.5 3.5 0 011 2.6 3.5 3.5 0 01-1 2.6z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-help" xmlns="http://www.w3.org/2000/svg"><path d="M12.8 22h-1.4v-2.1h1.4zm-.1-4.9h-1.2a9.7 9.7 0 01-.1-1.7 2.7 2.7 0 01.3-1.2 5.6 5.6 0 01.7-1.3l2.3-2.1a9.6 9.6 0 001.8-2.1 4.5 4.5 0 00.5-2.3 3 3 0 00-1.1-2.6 6.2 6.2 0 00-3.4-.7 22.9 22.9 0 00-3.6.5l-1 .3-.2-1.2h.1a18.1 18.1 0 014.7-.8 7.4 7.4 0 014.3 1 4.2 4.2 0 011.4 3.5 5 5 0 01-.5 2.7 8.6 8.6 0 01-1.9 2.2 19.7 19.7 0 00-1.8 1.6 6.2 6.2 0 00-.9 1.2 2.3 2.3 0 00-.4 1.4z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-help-circle" xmlns="http://www.w3.org/2000/svg"><path d="M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 19a9 9 0 119-9 9 9 0 01-9 9zm-1.2-4.5H12v1.8h-1.2zm4.5-8a4.2 4.2 0 01-.3 1.8 5.4 5.4 0 01-1.3 1.4L12.3 13a2.8 2.8 0 00-.4 1.2v.6H11a3 3 0 01-.2-1 2.1 2.1 0 01.5-1.2 9 9 0 011.4-1.4 6.4 6.4 0 001.2-1.3 2.6 2.6 0 00.3-1.4 1.7 1.7 0 00-.6-1.4 3.5 3.5 0 00-2-.4L9.3 7h-.5v-.8a10.2 10.2 0 013-.5 4.9 4.9 0 012.7.6 2.7 2.7 0 01.8 2.2z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-horn" xmlns="http://www.w3.org/2000/svg"><path d="M5 9a3 3 0 000 6h.5L7 19.3A2.5 2.5 0 009.3 21h.2a1.4 1.4 0 001.2-.6 1.4 1.4 0 00.2-1.4l-1.3-4h1.8l8.6 3.8V4.7L11.4 9zm5 10.3a.7.7 0 01-.1.5l-.4.2h-.2a1.5 1.5 0 01-1.4-1l-1.3-4h1.9zM5 14a2 2 0 010-4h6v4zm14 3.2l-7-3V9.8l7-3.5zM22 9v6h-1V9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-info-circle" xmlns="http://www.w3.org/2000/svg"><path d="M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 19a9 9 0 119-9 9 9 0 01-9 9zm-.7-15h1.5v2h-1.5zm0 3h1.5v9h-1.5z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-instagram" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 4.62l-.01.08H8.35a5.12 5.12 0 00-1.67.31c-.38.15-.72.382-1 .68-.298.28-.53.62-.68 1a5.12 5.12 0 00-.3 1.68v7.28c.01.57.114 1.134.31 1.67.15.38.382.72.68 1 .28.298.62.53 1 .68.536.196 1.1.3 1.67.31.95.05 1.24.05 3.64.05 2.4 0 2.64-.05 3.64-.05a5.12 5.12 0 001.67-.31A3.08 3.08 0 0019 17.31a5.12 5.12 0 00.3-1.68c.05-.95.05-1.24.05-3.64 0-2.4-.05-2.64-.05-3.64a5.12 5.12 0 00-.31-1.67 2.77 2.77 0 00-.68-1 2.77 2.77 0 00-1-.68 5.12 5.12 0 00-1.67-.38H12zM12 3v.05h3.71a6.9 6.9 0 012.19.42 4.64 4.64 0 012.68 2.63A6.9 6.9 0 0121 8.29c0 .96.05 1.27.05 3.71S21 14.71 21 15.71a6.9 6.9 0 01-.47 2.24 4.64 4.64 0 01-2.63 2.63 6.9 6.9 0 01-2.19.42c-.96.05-1.27.05-3.71.05S9.29 21 8.29 21a6.9 6.9 0 01-2.19-.47 4.64 4.64 0 01-2.63-2.63 6.9 6.9 0 01-.42-2.19V12 8.29a6.9 6.9 0 01.42-2.19A4.64 4.64 0 016.1 3.42 6.9 6.9 0 018.29 3H12zm0 4.38a4.62 4.62 0 110 9.24 4.62 4.62 0 010-9.24zM12 15a3 3 0 100-6 3 3 0 000 6zm4.8-6.72a1.08 1.08 0 110-2.16 1.08 1.08 0 010 2.16z"/></svg> <svg viewBox="0 0 24 24" id="it-key" xmlns="http://www.w3.org/2000/svg"><path d="M18 10a2 2 0 102 2 2 2 0 00-2-2zm0 3a1 1 0 111-1 .9.9 0 01-1 1zm-1-6a5.1 5.1 0 00-4.6 3H3.3l-2 2 3 3H7v-1h.3l1 1H11v-1h1.4a5.1 5.1 0 004.6 3 5 5 0 000-10zm0 9a4.1 4.1 0 01-3.8-2.7V13H10v1H8.7l-1-1H6v1H4.7l-2-2 1-1h9.4v-.3A4.1 4.1 0 0117 8a4 4 0 010 8z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-less-circle" xmlns="http://www.w3.org/2000/svg"><path d="M12 3a9 9 0 016.36 15.36A9 9 0 015.64 5.62 8.93 8.93 0 0112 3m0-1a10 10 0 107.07 2.93A9.93 9.93 0 0012 2z"/><rect x="7" y="11.25" width="10" height="1.5" rx=".75"/></svg> <svg viewBox="0 0 24 24" id="it-link" xmlns="http://www.w3.org/2000/svg"><path d="M13.4 13.4l-.7-.7a2.9 2.9 0 00.9-2.1 2.7 2.7 0 00-.9-2.1L9.2 4.9a3.2 3.2 0 00-4.3 0 3.2 3.2 0 000 4.3L7.8 12l-.7.7-2.9-2.8a4.2 4.2 0 010-5.7 4.2 4.2 0 015.7 0l3.5 3.6a3.6 3.6 0 011.2 2.8 3.6 3.6 0 01-1.2 2.8zm6.4 6.4a4.2 4.2 0 000-5.7l-2.9-2.8-.7.7 2.9 2.8a3.2 3.2 0 010 4.3 3.2 3.2 0 01-4.3 0l-3.5-3.6a2.7 2.7 0 01-.9-2.1 2.9 2.9 0 01.9-2.1l-.7-.7a3.6 3.6 0 00-1.2 2.8 3.6 3.6 0 001.2 2.8l3.5 3.6a3.8 3.8 0 002.8 1.1 3.9 3.9 0 002.9-1.1zm-6.7-6.7"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-linkedin" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M16.53 8.68A3.94 3.94 0 0013 10.62V9H9.37v12h3.73v-5.95c0-1.57.29-3.09 2.24-3.09 1.95 0 1.93 1.8 1.93 3.19V21H21v-6.6c0-3.23-.69-5.72-4.47-5.72zM5.16 3a2.17 2.17 0 102.16 2.18A2.16 2.16 0 005.16 3zM3.29 9v12H7V9H3.29zm13.24-.3A3.94 3.94 0 0013 10.62V9H9.37v12h3.73v-5.95c0-1.57.29-3.09 2.24-3.09 1.95 0 1.93 1.8 1.93 3.19V21H21v-6.6c0-3.23-.69-5.72-4.47-5.72v.02zM3.29 21H7V9H3.29v12zM5.16 3a2.17 2.17 0 102.16 2.18A2.16 2.16 0 005.16 3z"/></svg> <svg viewBox="0 0 24 24" id="it-linkedin-square" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M19.67 3H4.33A1.32 1.32 0 003 4.3v15.4A1.32 1.32 0 004.33 21h15.34A1.32 1.32 0 0021 19.7V4.3A1.32 1.32 0 0019.67 3zM8.34 18.34H5.67V9.75h2.67v8.59zM7 8.57A1.55 1.55 0 118.55 7 1.54 1.54 0 017 8.57zm11.34 9.77h-2.67v-4.18c0-1 0-2.28-1.39-2.28s-1.6 1.09-1.6 2.21v4.25H10V9.75h2.56v1.17a2.83 2.83 0 012.53-1.39c2.7 0 3.2 1.78 3.2 4.1l.05 4.71z"/></svg> <svg viewBox="0 0 24 24" id="it-list" xmlns="http://www.w3.org/2000/svg"><path d="M4 12a.9.9 0 01-1 1 1 1 0 010-2 .9.9 0 011 1zM3 4.5a.9.9 0 00-1 1 .9.9 0 001 1 .9.9 0 001-1 .9.9 0 00-1-1zm0 13a1 1 0 000 2 1 1 0 000-2zM6 5v1h16V5zm0 7.5h16v-1H6zM6 19h16v-1H6z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-lock" xmlns="http://www.w3.org/2000/svg"><path d="M18.5 8.5H17V8A5 5 0 007 8v.5H5.5A1.5 1.5 0 004 10v8.5A1.5 1.5 0 005.5 20h13a1.5 1.5 0 001.5-1.5V10a1.5 1.5 0 00-1.5-1.5zM8 8a4 4 0 018 0v.5H8zm11 10.5a.5.5 0 01-.5.5h-13a.5.5 0 01-.5-.5V10a.5.5 0 01.5-.5h13a.5.5 0 01.5.5z"/><path d="M12 13.25a1 1 0 11-1 1 1 1 0 011-1m0-1a2 2 0 102 2 2 2 0 00-2-2z"/></svg> <svg viewBox="0 0 24 24" id="it-locked" xmlns="http://www.w3.org/2000/svg"><path d="M16.5 12H16V7a4 4 0 00-8 0v5h-.5a1.1 1.1 0 00-1.1 1.1v6.8A1.1 1.1 0 007.5 21h9a1.1 1.1 0 001.1-1.1v-6.8a1.1 1.1 0 00-1.1-1.1zM9 7a3 3 0 016 0v5H9zm7.6 12.9a.1.1 0 01-.1.1h-9a.1.1 0 01-.1-.1v-6.8h9.2zM13 15.5a.8.8 0 01-.5.8v1.5h-1v-1.5a.8.8 0 01-.5-.8 1 1 0 012 0z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-mail" xmlns="http://www.w3.org/2000/svg"><path d="M20.5 5h-17A1.5 1.5 0 002 6.5v11A1.5 1.5 0 003.5 19h17a1.5 1.5 0 001.5-1.5v-11A1.5 1.5 0 0020.5 5zm-.3 1l-7.1 7.2a1.6 1.6 0 01-2.2 0L3.8 6zM3 17.3V6.6L8.3 12zm.7.7L9 12.7l1.2 1.2a2.7 2.7 0 003.6 0l1.2-1.2 5.3 5.3zm12-6L21 6.6v10.7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-medium" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M5 7.63A.72.72 0 004.82 7L3.13 5v-.3h5.22l4 8.84 3.54-8.84h5V5l-1.42 1.4a.43.43 0 00-.16.4v10.12a.45.45 0 00.16.41l1.4 1.37v.3h-7v-.3l1.45-1.41c.14-.14.14-.18.14-.4V8.71L11.37 19h-.55L6.12 8.71v6.88a.93.93 0 00.26.79l1.89 2.29V19H2.91v-.3l1.89-2.32a.92.92 0 00.2-.79V7.63z"/></svg> <svg viewBox="0 0 24 24" id="it-medium-square" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M3 3h18v18H3V3zm4.3 11.36a.64.64 0 01-.17.54l-1.27 1.54v.2h3.6v-.2L8.19 14.9a.67.67 0 01-.19-.54V9.74l3.16 6.9h.37l2.71-6.9v5.5c0 .15 0 .17-.09.27l-1 1v.2h4.74v-.2l-.89-.98a.27.27 0 01-.11-.27v-6.8a.28.28 0 01.11-.27l1-.93v-.2h-3.39L12.23 13 9.52 7.06H6v.2l1.14 1.36A.5.5 0 017.3 9v5.36z"/></svg> <svg viewBox="0 0 24 24" id="it-minus" xmlns="http://www.w3.org/2000/svg"><path d="M20 12.5H4v-1h16z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-minus-circle" xmlns="http://www.w3.org/2000/svg"><path d="M6.9 11.5h10v1h-10zM22 12A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-more-actions" xmlns="http://www.w3.org/2000/svg"><path d="M6 10a2 2 0 102 2 2 2 0 00-2-2zm0 3a1 1 0 010-2 1 1 0 010 2zm6-3a2 2 0 102 2 2 2 0 00-2-2zm0 3a1 1 0 111-1 .9.9 0 01-1 1zm6-3a2 2 0 102 2 2 2 0 00-2-2zm0 3a1 1 0 111-1 .9.9 0 01-1 1z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-more-items" xmlns="http://www.w3.org/2000/svg"><path d="M12 18a1 1 0 11-1 1 .9.9 0 011-1m0-1a2 2 0 102 2 2 2 0 00-2-2zm0-6a1 1 0 11-1 1 .9.9 0 011-1m0-1a2 2 0 102 2 2 2 0 00-2-2zm0-6a.9.9 0 011 1 1 1 0 01-2 0 .9.9 0 011-1m0-1a2 2 0 102 2 2 2 0 00-2-2z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-note" xmlns="http://www.w3.org/2000/svg"><path d="M18.5 4h-13A1.5 1.5 0 004 5.5v13A1.5 1.5 0 005.5 20h10.2l4.3-4.3V5.5A1.5 1.5 0 0018.5 4zM5 18.5v-13a.5.5 0 01.5-.5h13a.5.5 0 01.5.5V15h-2.5a1.5 1.5 0 00-1.5 1.5V19H5.5a.5.5 0 01-.5-.5zM18.3 16L16 18.3v-1.8a.5.5 0 01.5-.5zM16 9H8V8h8zm0 2H8v-1h8zm-2 1v1H8v-1z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-pa" xmlns="http://www.w3.org/2000/svg"><path d="M3 21h18v1H3zm0-1h18v-1H3zM22 9H2l10-7zM5.2 8h13.6L12 3.2zM6 18v-8H5v8zm4 0v-8H9v8zm5 0v-8h-1v8zm4 0v-8h-1v8z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-password-invisible" xmlns="http://www.w3.org/2000/svg"><path d="M15 12a3.2 3.2 0 00-.7-1.9l.4-1.1a4.2 4.2 0 011.3 3 4 4 0 01-3.9 4l.4-1.1A2.9 2.9 0 0015 12zM3.1 12A9.8 9.8 0 0112 6.5h.4l.4-.9H12a10.9 10.9 0 00-9.8 6L2 12l.2.5a11 11 0 006.1 5.3l.3-.9A9.8 9.8 0 013.1 12zm18.7-.5a11 11 0 00-6.1-5.3l-.3.9a9.8 9.8 0 015.5 4.9 9.8 9.8 0 01-8.9 5.5h-.4l-.4.9h.8a10.9 10.9 0 009.8-6l.2-.4zM11.5 9.1l.4-1.1A4 4 0 008 12a4.2 4.2 0 001.3 3l.4-1.1A3.2 3.2 0 019 12a2.9 2.9 0 012.5-2.9zm3.1-5.7L8.5 20.3l.9.3 6.1-16.9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-password-visible" xmlns="http://www.w3.org/2000/svg"><path d="M21.8 11.5a11 11 0 00-19.6 0L2 12l.2.5a11 11 0 0019.6 0l.2-.5zm-9.8 6A9.8 9.8 0 013.1 12 9.8 9.8 0 0112 6.5a9.8 9.8 0 018.9 5.5 9.8 9.8 0 01-8.9 5.5zM12 8a4 4 0 104 4 4 4 0 00-4-4zm0 7a3 3 0 113-3 2.9 2.9 0 01-3 3z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-pencil" xmlns="http://www.w3.org/2000/svg"><path d="M20.5 3.5a2.9 2.9 0 00-2.1-.9 3.1 3.1 0 00-2.2.9L4.6 15.2l-1 5.2 5.2-1L20.5 7.8a3 3 0 000-4.3zm-5.7 2.8l.7-.7 2.9 2.9-.7.7zm-.7.8l1.1 1-8.4 8.4-1.1-1.1zM5.7 18.3a.7.7 0 00-.6-.3l.3-1.5 2.1 2.1-1.5.3a.7.7 0 00-.3-.6zm2.9 0l-1.1-1.1 8.4-8.4 1 1.1zM19.8 7.1l-.7.7-2.9-2.9.7-.7a2.2 2.2 0 011.5-.6 2 2 0 011.4.6 2.1 2.1 0 010 2.9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-pin" xmlns="http://www.w3.org/2000/svg"><path d="M18.1 14L15 10.3V4.6L16.3 2H7.7L9 4.6v5.7L5.9 14h5.6v8h1v-8zM10 5h4v5h-4zm4.7-2l-.5 1H9.8l-.5-1zm-5 8h4.6l1.6 2H8.1z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-plus" xmlns="http://www.w3.org/2000/svg"><path d="M20 12.5h-7.5V20h-1v-7.5H4v-1h7.5V4h1v7.5H20z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-plus-circle" xmlns="http://www.w3.org/2000/svg"><path d="M12.4 11.5h4.5v1h-4.5V17h-1v-4.5H6.9v-1h4.5V7h1zm9.6.5A10 10 0 1112 2a10 10 0 0110 10zm-1 0a9 9 0 10-9 9 9 9 0 009-9z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-presentation" xmlns="http://www.w3.org/2000/svg"><path d="M4 5v10.6A2.4 2.4 0 006.4 18h3.1l-1.1 4h1l1.1-4h2.7l1.2 4h1l-1.2-4h3.5a2.3 2.3 0 002.3-2.3V5zm15 10.7a1.3 1.3 0 01-1.3 1.3H6.4A1.4 1.4 0 015 15.6V6h14zM21 3v1H3V3zm-9 13a4.5 4.5 0 10-4.5-4.5A4.5 4.5 0 0012 16zm-.5-7.9V11H8.6a3.4 3.4 0 012.9-2.9zm1 3.9V8a3.5 3.5 0 01-.5 7 3.4 3.4 0 01-3.4-3z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-print" xmlns="http://www.w3.org/2000/svg"><path d="M21 9.5A1.5 1.5 0 0019.5 8H17V3H7v5H4.5A1.5 1.5 0 003 9.5V16h2v3h2v2h10v-2h2v-3h2zM8 4h8v4H8zM6 18v-4h1v4zm10 2H8v-6h8v6zm2-2h-1v-4h1v4zm2-3h-1v-2H5v2H4V9.5a.5.5 0 01.5-.5h15a.5.5 0 01.5.5zM6 11h4v1H6z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-search" xmlns="http://www.w3.org/2000/svg"><path d="M21.9 21.1L16 15.3a8.3 8.3 0 002-5.3 8 8 0 10-8 8 8.3 8.3 0 005.3-2l5.8 5.9zM10 17a7 7 0 117-7 7 7 0 01-7 7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-settings" xmlns="http://www.w3.org/2000/svg"><path d="M12 7.5a4.5 4.5 0 104.5 4.5A4.5 4.5 0 0012 7.5zm0 8a3.5 3.5 0 113.5-3.5 3.5 3.5 0 01-3.5 3.5zm9.8-1.6A12.3 12.3 0 0022 12a12.3 12.3 0 00-.2-1.9l-2.1-.3a8.7 8.7 0 00-.7-1.7l1.3-1.7a8.7 8.7 0 00-2.7-2.7L15.9 5l-1.7-.7-.3-2.1L12 2l-1.9.2-.3 2.1-1.7.7-1.7-1.3a8.7 8.7 0 00-2.7 2.7L5 8.1a8.7 8.7 0 00-.7 1.7l-2.1.3A12.3 12.3 0 002 12a12.3 12.3 0 00.2 1.9l2.1.3a8.7 8.7 0 00.7 1.7l-1.3 1.7a8.7 8.7 0 002.7 2.7L8.1 19l1.7.7.3 2.1 1.9.2 1.9-.2.3-2.1 1.7-.7 1.7 1.3a8.7 8.7 0 002.7-2.7L19 15.9a8.7 8.7 0 00.7-1.7zm-2.9-.7l-.2.7a3.9 3.9 0 01-.6 1.5l-.3.6.4.5.8 1.1a9.3 9.3 0 01-1.4 1.4l-1.1-.8-.5-.4-.6.3a3.9 3.9 0 01-1.5.6l-.7.2v.7l-.2 1.3h-2l-.2-1.3v-.7l-.7-.2a3.9 3.9 0 01-1.5-.6l-.6-.3-.5.4-1.1.8A9.3 9.3 0 015 17.6l.8-1.1.4-.5-.3-.6a3.9 3.9 0 01-.6-1.5l-.2-.7h-.7L3.1 13a3.4 3.4 0 01-.1-1 3.4 3.4 0 01.1-1l1.3-.2h.7l.2-.7a3.9 3.9 0 01.6-1.5l.3-.6-.4-.5L5 6.4 6.4 5l1.1.8.5.4.6-.3a3.9 3.9 0 011.5-.6l.7-.2v-.7l.2-1.3h2l.2 1.3v.7l.7.2a3.9 3.9 0 011.5.6l.6.3.5-.4 1.1-.8A9.3 9.3 0 0119 6.4l-.8 1.1-.4.5.3.6a3.9 3.9 0 01.6 1.5l.2.7h.7l1.3.2a3.4 3.4 0 01.1 1 3.4 3.4 0 01-.1 1l-1.3.2z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-share" xmlns="http://www.w3.org/2000/svg"><path d="M17.5 15a2.5 2.5 0 00-2 1l-7.6-3.4A1.3 1.3 0 008 12a1.3 1.3 0 00-.1-.6L15.5 8a2.5 2.5 0 10-.5-1.5 1.3 1.3 0 00.1.6l-7.6 3.4a2.5 2.5 0 100 3l7.6 3.4a1.3 1.3 0 00-.1.6 2.5 2.5 0 102.5-2.5zm0-10A1.5 1.5 0 0119 6.5a1.5 1.5 0 01-3 0A1.5 1.5 0 0117.5 5zm-12 8.5a1.5 1.5 0 010-3 1.5 1.5 0 010 3zm12 5.5a1.5 1.5 0 111.5-1.5 1.5 1.5 0 01-1.5 1.5z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-star-full" xmlns="http://www.w3.org/2000/svg"><path d="M12 1.7L9.5 9.2H1.6L8 13.9l-2.4 7.6 6.4-4.7 6.4 4.7-2.4-7.6 6.4-4.7h-7.9L12 1.7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-star-outline" xmlns="http://www.w3.org/2000/svg"><path d="M12 4.9l1.5 4.6.2.7h5.7l-4 2.9-.6.4.2.7 1.5 4.7-3.9-2.9-.6-.4-.6.4-3.9 2.9L9 14.2l.2-.7-.6-.4-4-2.9h5.7l.2-.7L12 4.9m0-3.2L9.5 9.2H1.6L8 13.9l-2.4 7.6 6.4-4.7 6.4 4.7-2.4-7.6 6.4-4.7h-7.9L12 1.7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-team-digitale" xmlns="http://www.w3.org/2000/svg"><path d="M23.648 24H.352A.353.353 0 010 23.648V.352C0 .158.158 0 .352 0h23.296c.194 0 .352.158.352.352v23.296a.353.353 0 01-.352.352zM5.814 11.792a1.596 1.596 0 100-3.192 1.596 1.596 0 000 3.192zM10 18.994V19h4.418C19.13 19 20 16.685 20 12.253 20 7.93 18.995 6 14.418 6H10v12.994zm4.418-10.702c2.586 0 2.838 1.11 2.838 3.955 0 2.89-.252 4.455-2.838 4.455h-1.756v-8.41h1.756z"/></svg> <svg viewBox="0 0 24 24" id="it-telephone" xmlns="http://www.w3.org/2000/svg"><path d="M5 3h.18M20 11.56A7.59 7.59 0 0012.48 4h-.06a.49.49 0 00-.49.48.5.5 0 00.49.51A6.61 6.61 0 0119 11.62a.51.51 0 00.54.46.49.49 0 00.45-.46s.01-.04.01-.06z"/><path d="M16.93 11.68a4.5 4.5 0 00-4.48-4.48.51.51 0 000 1 3.5 3.5 0 013.49 3.49.5.5 0 00.5.5.51.51 0 00.5-.51zM15.68 21.19a13.32 13.32 0 01-12.8-13.1.92.92 0 01.62-.88c1.74-.56 4-1 4.7.06a7.39 7.39 0 01.85 2.91v.21a1.48 1.48 0 01-.7 1.68.81.81 0 00-.49.71 12.55 12.55 0 003.38 3.51.88.88 0 00.48-.56c.09-.53.58-1 1.7-.85h.21a7 7 0 012.85.87c1 .72.62 3 .09 4.72a1 1 0 01-.89.72zM6.55 7.52a9.5 9.5 0 00-2.78.55 12.41 12.41 0 0011.91 12.22c.73-2.26.66-3.54.31-3.78a6.66 6.66 0 00-2.46-.72h-.22c-.32 0-.65 0-.68.12a1.9 1.9 0 01-1.27 1.34l-.21.07-.15-.15a13.44 13.44 0 01-3.9-4L7 13a1.68 1.68 0 011-1.7c.12-.07.33-.18.25-.75v-.22a6.84 6.84 0 00-.7-2.54c-.2-.18-.55-.27-1-.27z"/></svg> <svg viewBox="0 0 24 24" id="it-tool" xmlns="http://www.w3.org/2000/svg"><path d="M7.7 5a3.1 3.1 0 011.7.5 3.1 3.1 0 011.6 3 3 3 0 00.8 2.4l6.3 6.3a1 1 0 01.2 1.3 1 1 0 01-.8.5.9.9 0 01-.7-.3l-6.4-6.4a3 3 0 00-2.1-.8h-.6a2.8 2.8 0 01-2.2-1h2.7V6.4H5.1a2.7 2.7 0 011.1-1A2.8 2.8 0 017.7 5m0-1a4.6 4.6 0 00-2 .5 4.1 4.1 0 00-2.1 2.9h3.6v2.1H3.7a5.4 5.4 0 001 1.8 4.4 4.4 0 003 1.2h.6a2.4 2.4 0 011.4.5l6.4 6.4a2 2 0 001.4.6 1.9 1.9 0 001.6-.9 2 2 0 00-.3-2.6l-6.3-6.3a1.8 1.8 0 01-.5-1.6 4.4 4.4 0 00-2-4A4.6 4.6 0 007.7 4z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-twitter" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M8.08 20a10.93 10.93 0 0011-11v-.5a8 8 0 001.92-2 7.85 7.85 0 01-2.22.61A3.89 3.89 0 0020.48 5a8 8 0 01-2.48.91 3.87 3.87 0 00-6.59 3.52 11 11 0 01-8-4 3.85 3.85 0 001.19 5.16 3.76 3.76 0 01-1.75-.48A3.87 3.87 0 006 13.91a3.73 3.73 0 01-1 .14 4.3 4.3 0 01-.73-.05 3.87 3.87 0 003.61 2.68 7.73 7.73 0 01-4.8 1.66 7 7 0 01-.92-.06A10.9 10.9 0 008.08 20"/></svg> <svg viewBox="0 0 24 24" id="it-twitter-square" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M19.5 22h-15A2.5 2.5 0 012 19.5v-15A2.5 2.5 0 014.5 2h15A2.5 2.5 0 0122 4.5v15a2.5 2.5 0 01-2.5 2.5zm-9.82-4.92A7.24 7.24 0 0017 9.79v-.33a5.22 5.22 0 001.28-1.33 5.22 5.22 0 01-1.48.4 2.56 2.56 0 001.14-1.42 4.93 4.93 0 01-1.64.62 2.53 2.53 0 00-1.86-.81 2.57 2.57 0 00-2.57 2.57c.003.195.026.39.07.58a7.26 7.26 0 01-5.32-2.68 2.59 2.59 0 00.8 3.43 2.78 2.78 0 01-1.16-.32 2.57 2.57 0 002.05 2.52 2.46 2.46 0 01-1.15.04 2.55 2.55 0 002.39 1.78A5.13 5.13 0 016.37 16a6.08 6.08 0 01-.61 0 7.23 7.23 0 003.92 1.14v-.06z"/></svg> <svg viewBox="0 0 24 24" id="it-unlocked" xmlns="http://www.w3.org/2000/svg"><path d="M16.5 12H16V6a4 4 0 00-8 0v3h1V6a3 3 0 016 0v6H7.5a1.1 1.1 0 00-1.1 1.1v6.8A1.1 1.1 0 007.5 21h9a1.1 1.1 0 001.1-1.1v-6.8a1.1 1.1 0 00-1.1-1.1zm.1 7.9a.1.1 0 01-.1.1h-9a.1.1 0 01-.1-.1v-6.8h9.2zM13 15.5a.8.8 0 01-.5.8v1.5h-1v-1.5a.8.8 0 01-.5-.8 1 1 0 012 0z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-upload" xmlns="http://www.w3.org/2000/svg"><path d="M8.4 7.3l-.7-.7L12 2.3l4.3 4.3-.7.7-3.1-3.1v9.3h-1V4.2zM19 12v7.5a.5.5 0 01-.5.5h-13a.5.5 0 01-.5-.5V12H4v7.5A1.5 1.5 0 005.5 21h13a1.5 1.5 0 001.5-1.5V12z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-user" xmlns="http://www.w3.org/2000/svg"><path d="M12 13a4 4 0 004-4V6a4 4 0 00-8 0v3a4 4 0 004 4zM9 6a3 3 0 016 0v3a3 3 0 01-6 0zm11 16h-1a7 7 0 00-14 0H4a8 8 0 0116 0z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-video" xmlns="http://www.w3.org/2000/svg"><path d="M17.5 7.3V6A1.5 1.5 0 0016 4.5H5.5A1.5 1.5 0 004 6v8a1.5 1.5 0 001.5 1.5h3.4L7.4 21h1l1.6-5.5h1.8l1.6 5.5h1l-1.6-5.5H16a1.5 1.5 0 001.5-1.5v-1.3l4 1.5V5.8zm3 5.5l-4-1.5V14a.5.5 0 01-.5.5H5.5A.5.5 0 015 14V6a.5.5 0 01.5-.5H16a.5.5 0 01.5.5v2.7l4-1.5zM2 8h1v4H2z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-warning" xmlns="http://www.w3.org/2000/svg"><path d="M12.5 17h-1V2h1zm0 3h-1v2h1z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-warning-circle" xmlns="http://www.w3.org/2000/svg"><path d="M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 19a9 9 0 119-9 9 9 0 01-9 9zm-.5-6.8V5.7h1.2v8.5zm-.1 2.3h1.2v1.8h-1.2z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-whatsapp" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M19.09 4.63a10 10 0 00-15.68 12L2 21.8l5.28-1.38A10 10 0 0012 21.63a10 10 0 007.05-17h.04zM12 20a8.18 8.18 0 01-4.21-1.16l-.31-.18-3.13.83.84-3.06-.19-.36A8.28 8.28 0 1112 20zm4.54-6.2c-.25-.13-1.47-.73-1.7-.81-.23-.08-.39-.13-.56.12-.246.347-.51.68-.79 1-.14.16-.29.18-.54.06a6.92 6.92 0 01-2-1.23 7.27 7.27 0 01-1.38-1.73c-.15-.25 0-.38.11-.51s.25-.29.37-.43a1.51 1.51 0 00.25-.42.46.46 0 000-.43c-.04-.2-.54-1.42-.75-1.92-.21-.5-.4-.42-.56-.43h-.47a1 1 0 00-.67.31A2.81 2.81 0 007 9.45 4.73 4.73 0 008 12a11 11 0 004.25 3.76c.464.2.938.378 1.42.53a3.28 3.28 0 001.56.09 2.54 2.54 0 001.68-1.18 2.09 2.09 0 00.15-1.2c-.06-.07-.23-.13-.48-.25l-.04.05z"/></svg> <svg viewBox="0 0 24 24" id="it-whatsapp-square" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M16 8.07a5.34 5.34 0 00-9.11 3.77 5.28 5.28 0 00.82 2.84l.12.2-.53 2 2-.53.2.11c.82.49 1.756.75 2.71.75A5.34 5.34 0 0016 8.07zm-.83 5.83a1.66 1.66 0 01-1.08.76 2.23 2.23 0 01-1-.06c-.23-.08-.53-.18-.91-.34a7.16 7.16 0 01-2.78-2.42 3.13 3.13 0 01-.66-1.66 1.83 1.83 0 01.56-1.34.59.59 0 01.43-.2H10c.1 0 .23 0 .36.27.13.27.45 1.11.49 1.19a.3.3 0 010 .28 1.2 1.2 0 01-.16.27c-.08.1-.17.21-.24.28-.07.07-.17.17-.07.33.239.413.54.787.89 1.11.38.34.816.612 1.29.8.16.08.25.06.34 0 .09-.06.4-.47.51-.63.11-.16.21-.14.36-.08.15.06.94.44 1.1.52.16.08.26.12.3.19a1.36 1.36 0 01-.03.73h.03z"/><path d="M21 7.09a8.26 8.26 0 00-.09-1.15 3.49 3.49 0 00-1.85-2.51 3.89 3.89 0 00-1-.32A8.36 8.36 0 0016.91 3H7.09a8.26 8.26 0 00-1.15.09A3.49 3.49 0 003.43 5a3.89 3.89 0 00-.32 1A8.36 8.36 0 003 7.09v9.82c.003.385.033.77.09 1.15A3.49 3.49 0 005 20.57a3.89 3.89 0 001 .32c.384.06.771.094 1.16.1h9.82a8.26 8.26 0 001.15-.09 3.49 3.49 0 002.51-1.85 3.89 3.89 0 00.32-1 8.36 8.36 0 00.1-1.16V7.57c-.06-.1-.06-.31-.06-.48zm-8.8 11.17a6.39 6.39 0 01-3.06-.78l-3.41.89.92-3.32a6.33 6.33 0 01-.86-3.21 6.41 6.41 0 0111-4.53 6.33 6.33 0 011.88 4.54 6.42 6.42 0 01-6.47 6.41z"/></svg> <svg viewBox="0 0 24 24" id="it-youtube" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"/><path d="M21.56 7.2a2.5 2.5 0 00-1.76-1.77C18.24 5 12 5 12 5s-6.24 0-7.8.42A2.5 2.5 0 002.44 7.2 25.72 25.72 0 002 12c-.01 1.61.13 3.217.42 4.8a2.5 2.5 0 001.78 1.77C5.76 19 12 19 12 19s6.24 0 7.8-.42a2.5 2.5 0 001.76-1.77A25.72 25.72 0 0022 12a25.72 25.72 0 00-.44-4.8zM10 15V9l5.19 3L10 15z"/></svg> <svg viewBox="0 0 24 24" id="it-zoom-in" xmlns="http://www.w3.org/2000/svg"><path d="M10.4 9.5h3.3v1h-3.3v3.2h-1v-3.2H6.2v-1h3.2V6.2h1zm10.7 12.4L15.3 16a8.3 8.3 0 01-5.3 2 8 8 0 118-8 8.3 8.3 0 01-2 5.3l5.9 5.8zM17 10a7 7 0 10-7 7 7 7 0 007-7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> <svg viewBox="0 0 24 24" id="it-zoom-out" xmlns="http://www.w3.org/2000/svg"><path d="M6.2 9.5h7.5v1H6.2zm14.9 12.4L15.3 16a8.3 8.3 0 01-5.3 2 8 8 0 118-8 8.3 8.3 0 01-2 5.3l5.9 5.8zM17 10a7 7 0 10-7 7 7 7 0 007-7z"/><path fill="none" d="M0 0h24v24H0z"/></svg> </defs></svg>

Le icone sprite sono molto ben delineate nel segno e rievocano lo stile delle icone microsoft windows10. Quelle presentate nel riquadro di sinistra sono riferite a boostrap italia con miei adattamenti. Il file che si trova al link offre un'idea di come studiare gli sprite. Come si può notare gli viewboxes hanno un id="nome semantico dello sprite" utilissimo per non frammentare e raccogliere in un unico file tutti gli sprite svg.
Purtroppo questa facilitazione funziona solo con il browser Edge/IExplorer. In sostanza si perde questa utilità se si usano altri browser. Nel link trovate i file scompattati
Conviene perciò estrarre gli sprite in modo singolo e poi trattarli come immagini <img> in questo caso fare molta attenzione a settare i giusti valori dei parametri width height
Le immagini degli sprite possono essere molto grandi e sforare le dimensioni della fruizione standard di una pagina web riguardo la semantica dei segni visivi.

copiare manualmente LOGIN PHP

Logout

<?php session_start(); /* Starts the session */session_destroy(); /* Destroy started session */header("location:login.php"); /* Redirect to login page */exit; ?>

Index

<?php session_start(); /* Starts the session */ if(!isset($_SESSION['UserData']['Username'])){ header("location:login.php"); exit; } ?> <a href="logout.php">Logout</a>

copiare manualmente

<section id="copiaremanualmente" class="ui grid container centro bordo2"> <article id="" class="twelve wide column left aligned column bordo3"> <div class="bordo4" style="overflow:auto !important;"> <span> <i class="bullhorn icon"></i>copiare manualmente </span> <p class=""> <xmp style="color:green;overflow:auto;"> </xmp> </p> </div> </article> <article class="four wide column left aligned column bordo3"> <div class="bordo4"> </div> </article> </section>

underground software distillery,2020 wysiwyg vers.202004251130