<!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>
body, main, section, article, div, p,
span, header, footer { font-size:1em; overflow:auto !important; }
main{ margin-top:4.5em; margin-bottom:4.5em;
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); /* burly wood */
color:black; }
main{ /* width:100%; height:100%; */ }
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%;}
.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 */
}
/* bordi standard
.bordo0, .bordo1, .bordo2, .bordo3,
.bordo4, .bordo5, .bordo6, .bordo7,
.bordo8, .bordo9, .bordo10, .bordo11
{border:solid 0.02em rgba(0,0,0,0.0) !important;}
*/
/* bordi debugging */
/**/
.bordo0{border:solid 0.1em rgba(255,255,255,0.5) !important;
}
.bordo1{border:solid 0.02em orange !important;
}
.bordo2{border:solid 0.02em fuchsia !important;
}
.bordo3{border:solid 0.2em blue !important;
}
.bordo4{border:solid 0.04em green !important;
}
/* */
.trasparente{background-color:transparent;
color:transparent;}
</style>
</head>
<body onload="AttendereLoading()" class="sfondo bordo0" >
<main class="bordo1">
<section class="ui grid container centro bordo2">
<article class="sixteen wide column bordo3">
<div class="bordo4">
informazioni iniziali
</div>
</article>
</section>
<section class="ui grid container centro bordo2">
<article class="eight wide column bordo3">
<div class="centro bordo4">
<img src="http://placekitten.com/200/260" alt="" title="" style="width:80%;" />
informazioni iniziali
</div>
</article>
<article class="eight wide column bordo3">
<div class="bordo4">
informazioni iniziali
</div>
</article>
</section>
<section class="ui grid container centro bordo2">
<article class="four wide column bordo3">
<div class="bordo4">
<img src="http://placekitten.com/200/251" />
informazioni iniziali
</div>
</article>
<article class="four wide column bordo3">
<div class="bordo4">
informazioni iniziali renderizzare i text
</div>
</article>
<article class="eight wide column bordo3">
<div class="bordo4" style="overflow:auto !important;">
informazioni iniziali
</div>
</article>
</section>
</main>
<div id="fine" style="">...</div>
<script>
document.getElementById('fine').innerHTML= ' <style>'+
' .rr-bordomodale{ border:solid 4px gray;'+
' overflow:initial !important;'+
'}'+
' .rr-bordocontenutomodale{ padding:6px;'+
' overflow:initial !important;'+
' }'+
' .rr-modale{'+ ' position:fixed; top:0;right:0;'+
' bottom:0;left:0;'+
' background-color:rgba(0,0,0,1.0);'+
' pointer-events:none; opacity:0;'+
' overflow:auto !important;'+
' z-index:100; }'+
' .rr-modale:target {'+
' pointer-events: auto; opacity:1;}'+
' .rr-contenutomodale{ position:static;'+
' width:70%; height:70%; margin-left:15.0%;'+
' padding:0.5em; border-radius:4px;'+
' background-color: rgba(255,229,204, 1.0);'+
' background-color: rgba(204,166,128, 1.0);'+' overflow:auto; }'+
'</style>'+
' <div id="rr-modale" class="rr-modale">'+
' <div class="rr-contenutomodale">'+
' '+
'<p style="overflow:initial !important;">'+
' <span style="margin:0.5em;'+
' border:solid 0px black;'+
' width:auto; height:auto; '+
' overflow:initial !important;'+
' "> '+
' <a href="#" '+
' class="material-icons"'+
' style=" '+
' background-color:orange; '+
' background-color:orange; '+
' color:black; '+
' font-size:2em;'+
' box-shadow:3px 3px 6px black;'+
' border-radius:4px; '+
' overflow:initial !important;'+
' "> '+
' close </a> '+
' </span>'+ ' '+
'</p>'+
' '+
' '+
' '+
' '+
' '+
' '+
' '+
' <hr/>'+
' <article style="height:100%;">'+
' '+
' '+
' <p style="overflow:initial !important;"> '+
' <a href="http://edoraandiamo.altervista.org/'+
' style="overflow:initial !important;"> '+
' <i class="material-icons" '+
' style="font-size:2em;'+
' "> '+
' home</i>'+
' <i style="font-size:1.2em;font-style:normal;'+
' font-variant:small-caps;'+
' font-weight:bold;'+
' ">'+
' pagina iniziale '+
' </i>'+
'</a> '+
' '+
' </p> '+
' '+
' '+
' '+
' '+
' '+
' '+
' <p style="overflow:initial !important;"> '+
' <a href="https://it.altervista.org/"> '+
' <i class="material-icons" '+
' style="font-size:2em;'+
' "> '+
' map</i>'+ '<i '+'style="font-size:1.2em;font-style:normal;'+
' font-variant:small-caps;'+
' font-weight:bold;'+
'">'+
'Accedi al sito host</i> </a> '+
' '+
' '+
' '+
' </p> '+
' '+
' '+
' <a href="http://semantic-ui.com/"'+
' '+
' '+
' style="font-size:1.2em;font-variant:small-caps;'+
' "> '+
' '+
' '+
' '+
' '+
' <i class="folder open icon"></i> '+
' '+
' Suggerimenti semantic framework '+
' '+
' '+
' </a> '+
' '+
' '+
' '+
' '+
' </article> '+
' </div>'+
' </div>'+
' '+
' '+
' '+
' '+
' '+
' <style> /* backdoor */ '+
' .rr-backdoor{ position: fixed; bottom: 0px;'+
'left:0px; font-size:small; '+
'background-color: rgba(153,76,0, 0.5);'+
'background-color:gray;'+ 'background-color:rgba(128,128,128,0.2);'+
'color: rgba(189,183,107, 1.0);'+
'color: rgba(128,128,128, 0.2);'+
' border-radius:4px;'+
'z-index:101;} '+
'</style> '+
' <a href="#" class="material-icons" > '+
' <span class="rr-backdoor" '+
' font-family:sans-serif !important;'+
'>face</span> '+
' </a>'+
' <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> '+
''+' <style> '+
' dropmenu versione 20020 02 14'+
'/* debugging */ '+
' .rr-bordo000{border:solid 0px lime;}'+
' .rr-bordo111{border:solid 0px blue;} '+
' .rr-bordo121{border:solid 0px orange;} '+
' .rr-bordo131{border:solid 0px fuchsia;} '+
''+
'.rr-dropmenu000{'+ ' position: fixed;'+
' top: 0; '+
' left:0; width:100%; '+
''+
' height:3em; '+
' overflow:initial !important;'+
' } '+
'.rr-dropmenu111{'+
' position: fixed;'+
' top: 0px; '+
' left:50%;'+
' margin-left:-50%; '+
' overflow:initial !important;'+
' } '+
'.rr-dropmenu121{ '+
' margin-left:-0em;'+
' border-radius:4px;'+
' overflow:initial !important;'+
' } '+
''+
'.rr-dropmenu131{position:relative;'+
' display:none;'+
' overflow:initial !important;'+
'}'+
' '+
''+
' .rr-dropmenu111:hover .rr-dropmenu131{ '+
' width:32em; '+' width:24em; '+
' height:3em; '+
''+
''+
' border-radius:4px; '+
' display:block;'+
' } '+
' .rr-dropmenu111:hover .rr-dropmenu121{'+
' display:none;}'+
' '+
''+' </style> '+
' <div class="'+
'rr-dropmenu000 rr-bgc000 rr-bordo000'+
'"> </div> '+
'<div class="rr-dropmenu111 rr-bordo111 rr-bgc111">'+
'<div class="material-icons rr-dropmenu121 rr-bgc121"'+
' style="border:solid 0.1px rgba(0,0,0,0.2);'+
' overflow:initial !important;'+
'">'+
'menu</div>'+
''+
'<div class="rr-dropmenu131 rr-bordo131 rr-bgc131">'+
''+
'<a href="#rr-modale">'+
'<span class="material-icons" '+
'style="position:absolute;'+ 'left:30%;'+
'font-size:3em; '+
'border-radius:4px;'+
'">'+
'info</span>'+
'</a>'+
''+
''+
'<a href="#fine">'+
'<span class="material-icons"'+
' style="position:absolute; left:60%;'+
' font-size:3em;'+
' border-radius:4px;'+
' overflow:initial !important;'+
''+
'">'+
'keyboard_arrow_down </span>'+
'</a>'+
''+
'<a href="#">'+
'<span class="material-icons" '+
'style="position:absolute; left:80%;'+
'font-size:3em;'+
'border-radius:4px;'+
' overflow:initial !important;'+
'">'+
'keyboard_arrow_up </span>'+
'</a>'+
''+
' </div> '+
' </div> '+
''+
'<style>'+
' /* vers 20200213 */ '+
'.rr-bordoloading{ position:fixed;'+
'top:0px;'+'top:4em;'+'top:50%;'+
'left:0px;'+'left:50%;'+
'margin-left:-12em;'+
'margin-top:-1em; '+
' '+
'background-color:transparent;'+
' '+
' '+
'font-family:monospace;'+
'font-variant:small-caps;'+
'border:solid 0px orange; '+
'border-radius:4px; '+
'z-index:99; }'+
'.rr-loading-stile{ '+
' background-color:black;'+
' color:white; '+
' font-size:2.05em; '+
' font-family:sans-serif; '+
' padding:0.5em;'+
' border-radius:4px;'+
' '+
'}'+
'.rr-lampeggio'+
'{ animation: blinker 2.5s linear infinite; }'+
'@keyframes blinker { 50% { opacity: 0; } }'+
'</style>'+
'<div id="rr-AttendereLoading"'+ ' class="rr-bordoloading" '+
' style="background-color:transparent;" '+
' >'+
'<span style="background-color:transparent;">'+
''+
'</span>'+
'<span class="ui secondary loading massive button ">'+
' '+
'Loading'+
'</span>'+
'<span class="ui massive secondary button"'+
'> Loading...'+
'<span id="rr-percento">'+
'</span>'+
'</span>'+
'</div>'+
' <section class="bordo2">'+
' <article class="bordo3">'+
' <div class="'+
' ui segment brown inverted bordo4"'+
' style="font-variant:small-caps;"'+
''+
'>'+
' Informazioni sulla versione in uso '+
' 0941'+
'20200222'+
' </div>'+
' </article>'+
' </section>'+
''
function AttendereLoading()
{ if(document.all)
{ document.all["rr-AttendereLoading"].style.visibility="hidden"; }
else if
(document.getElementById)
{ node= document.getElementById("rr-AttendereLoading").style.visibility="hidden"; } }
var percento=document.getElementById("rr-percento");var contatore=1;
var intervallo=setInterval( function()
{ percento.innerHTML=contatore+"%";
contatore++;
if (contatore===101)
{clearInterval(intervallo);} } , 30000)
</script>
<!-- <div id="fine"></div> -->
</body>
</html>