<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Rose</title>
<meta name="title" content="Titolo sito">
<meta name="description" content="Descrizione sito">
<meta name="keywords" content="Parole chiave per i motori di ricerca, tipo, grafica,accessori web,gadget">
<meta name="author" content="Tuo nome">
<meta name="robots" content="index,follow">

<!--Web set free realizzato da Penelope - http://www.iltelaiodipenelope.it -->

<style type="text/css">
body {background-color: #e9e3d5;
text-align:center;
font-family : "Georgia"; 
color : #756d5b; 
font-size : 14px;
margin-top:0px;
}
h1{margin: 0;font-size:110%; color: #765544;}
h2{margin: 0;font-size: 100%;; color: #765544;
}
.nome_logo {
text-align:center;
font-family: "Dancing Script", cursive;
color: #756d5b; 
font-size: 56px;
margin-top: 5px;
margin-bottom: 10px; 
}
.info {
text-align:center;
font-family: "Dancing Script", cursive;
color: #756d5b; 
font-size: 28px;
margin: 0px; 
}

.testo_colore {
text-align:center;
font-family: "Dancing Script", cursive;
color: #8e6452; 
font-size: 28px;
margin: 0px; 
}
a:link { 
text-decoration: none; 
cursor:nw-resize;
font-family: "Georgia"; 
font-size: 14px;
color:#b37d7b; 
}
a:visited { 
text-decoration: none; 
cursor:nw-resize;
font-family: "Georgia"; 
font-size: 14px;
color:#6d5453; 
}
a:hover {
text-decoration: line-through; 
color: #ffffff;
}
table.base{  
border:0px;
text-align:center;
font-family : "Georgia"; 
color : #756d5b; 
font-size : 14px;
margin-left:auto;
margin-right:auto;
}
table.bordo{  
border:1px dotted #b5ad99;
text-align:center;
font-family : "Georgia"; 
color : #756d5b; 
font-size : 14px;
margin-left:auto;
margin-right:auto;
}
td.img_sfondo {  
border:1px dotted #b5ad99;
background-image: url('images/sfondo-righepanna-1.jpg');
text-align:center;
}
td.bordo_dotted {  
border:1px dotted #b5ad99;
text-align:center;
font-family : "Georgia"; 
color : #756d5b; 
font-size : 14px;
line-height: 1.5;
}
td.menu {  
border:1px dotted #b5ad99;
background-color: #d9d1bc;
text-align:center;
font-family : "Georgia"; 
color : #756d5b; 
font-size : 14px;
}
td.menu_decor {  
border:1px dotted #b5ad99;
text-align:center;
font-family : "Georgia"; 
color : #756d5b; 
font-size : 14px;
}
td.hover{
border:1px dotted #b5ad99;
background-color: #dfd8c7;
text-align:center;
cursor : nw-resize;
}
td.out{
border:1px dotted #b5ad99;
background-color: #e9e3d5;
text-align:center;
}  
table.box_sfondo{  
border:1px dotted #b5ad99;
background-image: url('images/sfondo-righepanna-1.jpg');
text-align:center;
font-family : "Georgia"; 
color : #756d5b; 
font-size : 14px;
margin-left:auto;
margin-right:auto
}
td.colore_sfondo{
border:1px dotted #b5ad99;
background-color: #e9e3d5;
text-align:left;
font-family : "Georgia"; 
color : #756d5b; 
font-size : 14px;
}
table.box_saluti{  
border:1px dotted #b5ad99;
background-color: #d9d1bc;
text-align:center;
font-family : "Georgia"; 
color : #756d5b; 
font-size : 14px;
margin-left:auto;
margin-right:auto
}
</style>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&display=swap" rel="stylesheet">

<script type="text/javascript">
<!-- Original: Andrea Bianchi
// Web Site: https://www.web-link.it
function WebDate() {
var now = new Date();
var year= now.getYear();if (year < 1000) year += 1900;
nameDay = new Array('Domenica','Lunedi','Martedi','Mercoledi','Giovedi','Venerdi','Sabato');
nameMth = new Array('01','02','03','04','05', '06', '07', '08', '09', '10', '11','12');
document.write('' +nameDay[now.getDay()]+ ' ' + now.getDate() + "/" + nameMth[now.getMonth()] + "/" + year+ '');
}
// end -->
</script>
</head>

<body>
<table class="base" cellpadding="4" cellspacing="4" width="80%">
 <tr>
	<td class="img_sfondo" colspan="2" height="350"><table class="base" cellpadding="0" cellspacing="0" width="95%">
 <tr>
	<td width="320"><img border="0" src="images/img_rose_header.png" width="356" height="350" alt=""></td>
	<td><!-- Inizio spazio logo/titolo/frase benvenuto -->
	<p class="nome_logo">Nome o logo del sito...</p>
	<p class="info">Qui si pu scrivere un messaggio<br> 
	di benvenuto o una descrizione del sito,<br> 
	una frase particolare... ecc.. ecc..</p></td>
 </tr>
</table><!-- Fine spazio logo/titolo/frase benvenuto --></td>
 </tr>
 <tr>
	<td class="bordo_dotted" colspan="2" height="35"><!-- Inizio spazio barra con link -->
<table class="base" cellpadding="2" cellspacing="2" width="70%">
 <tr>
	<td><a target="_blank" href="#">LINK</a></td>
	<td><a target="_blank" href="#">LINK</a></td>
	<td><a target="_blank" href="#">LINK</a></td>
	<td><a target="_blank" href="#">LINK</a></td>
	<td><a target="_blank" href="#">LINK</a></td>
 </tr>
</table><!-- Fine spazio barra con link --></td>
 </tr>
 <tr>
	<td class="bordo_dotted" valign="top"><!-- Inzio spazio corpo pagina -->
	<h1>Benvenuti in nome sito...</h1><br>
	Frase descrittiva e informazioni sul sito se non  stata gi scritta sopra,<br>
	questa  la parte "corpo" per i contenuti da gestire come si preferisce<br><br>
	<!-- Inzio box news -->
	<p class="testo_colore"> News del sito...</p>
	<table class="box_sfondo" cellpadding="0" cellspacing="10">
	<tr>
		<td width="182"><img border="0" src="images/img_rose_news.jpg" width="182" height="330" alt=""></td>
		<td class="colore_sfondo" width="320" valign="top">
		<div style="width:330px; height:325px; padding-left:5px; padding-top:5px; overflow-y: scroll"><!-- Inizio testo news -->
		News... 00/00/00<br>
		Testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo<br><br>
		News... 00/00/00<br>
		Testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo<br><br>
		News... 00/00/00<br>
		Testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo<br><br>
		News... 00/00/00<br>
		Testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo<br><br>
		News... 00/00/00<br>
		Testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo<br>
		testo testo testo testo testo testo testo testo testo
	<!-- Fine testo news --></div></td>
	</tr>
	</table><!-- Fine box news --><br>
	
Lo spazio corpo/pagina e la colonna cresceranno man mano che si aggiungono contenuti<br> 
puoi inserire quindi accessori, gadget e tutto ci che ti occorre in base al tipo di spazio che<br> 
vuoi realizzare. Puoi utilizzare lo spazio corpo/pagina per un iframe in cui far visualizzare<br> 
tutte le altre pagine del sito <a target="_blank" href="https://www.iltelaiodipenelope.it/tutorial/html/iframe_sito_web.php">* Tutorial iframe sito web</a><br><br>

Per il testo del nome e dei menu ho inserito un font decorativo, fornito da <a target="_blank" href="https://fonts.google.com/">Google font</a><br> 
puoi modificarlo con quello che preferisci, leggi questo tutorial <a target="_blank" href="https://www.iltelaiodipenelope.it/tutorial/html/font_personalizzato_sito.php">* Font personalizzato</a><br><br>

Visita la sezione <a target="_blank" href="https://www.iltelaiodipenelope.it/tutorial/index.php">* html & script Tutorial</a> per tanti tutorial su come gestire e<br> 
organizzare le pagine web ed anche tanti script per utilit, accessori e gadget<br><br>

- Puoi fare tutte le modifiche che ritieni necessarie alla struttura,<br>
ma non alterare in nessun modo la grafica e non togliere il credits del telaio^^<br><br>	
Buon lavoro... buon sito Penelope &#9829;<br><br>

<!-- Inzio box saluti -->
<p class="testo_colore"> Un saluto veloce...</p>
<table class="box_saluti" cellpadding="0" cellspacing="10" width="550">
 <tr>
	<td class="colore_sfondo"><table class="base" cellpadding="2" cellspacing="2" width="100%">
 <tr>
	<td width="182"><img border="0" src="images/img_rose_box.jpg" width="182" height="301" alt=""></td>
	<td valign="top"><!-- Inserisci testo o il codice Cbox qui -->
	<h2>Tag base per Cbox o messaggi</h2><br>
	- Se la utilizzi per la Cbox setta il codice iframe<br> 
 	con queste misure: width="330" e height="295"<br>

	* Se non conosci la Cbox leggi il tutorial<br>  
	<a target="_blank" href="https://www.iltelaiodipenelope.it/tutorial/html/cbox.php">Cbox - Ciattina per brevi messaggi</a><br><br>
	- Se preferisci scrivere dei messaggi, frasi o altro<br> 
	puoi mettere lo scroll per avere pi spazio<br><br>
	Se non ti serve cancella il codice<!-- Fine spazio testo o codice --></td>
 </tr>
	</table></td>
 </tr>
</table><!-- Fine box saluti --><br><br>

Anteprima Web Set free www.iltelaiodipenelope.it - <a target="_blank" href="https://www.iltelaiodipenelope.it/template/index.php">* Template and more...</a><br><br>	
<!-- Fine spazio corpo pagina Non scrivere dopo questa linea--></td>
 <td class="bordo_dotted" width="30%" valign="top"><!-- Inizio spazio colonna -->
<script type="text/javascript">
// Autore sconosciuto
// Spiegato e commentato da https://www.iltelaiodipenelope.it/tutorial/index.php

var saluto = new Date();
var orario = saluto.getHours();

// Saluto dalle 6 am alle 12
if ((orario > 06) && (orario <= 12)) {
document.write("...Buon giorno!");
}
// Saluto dalle 12 alle 18
if ((orario > 12) && (orario <= 18)) {
document.write("...Buon pomeriggio!");
}
// Saluto dalle 18 alle 24
if ((orario > 18) && (orario <= 24)) {
document.write("...Buona sera!");
}
// Saluto dalle 24 alle 6 am
if ((orario >= 00) && (orario <= 06)) {
document.write("...Buona notte!");
}
</script><br>
<script type="text/javascript">WebDate(); </script>
<script type="text/javascript" language="JavaScript">
// Autore sconosciuto - Spiegato da https://www.iltelaiodipenelope.it/tutorial/index.php
function tS(){ x=new Date(); x.setTime(x.getTime()); return x; } 
function lZ(x){ return (x>9)?x:'0'+x; }
function tH(x){ if(x==0){ x=24; } return (x>24)?x-=24:x; }
function dT(){ if(fr==0){ fr=1; document.write('<span id="tP">'+eval(oT)+'<\/b><\/span>'); } tP.innerText=eval(oT); setTimeout('dT()',1000); }
var fr=0,oT="lZ(tH(tS().getHours()))+':'+lZ(tS().getMinutes())+':'+lZ(tS().getSeconds())";</script><br>
h:. <script type="text/javascript" language="JavaScript">dT();</script><br>

<img border="0" src="images/libro_rose_tag.png" width="250" height="208" alt=""><br>

<!-- Inizio tabella menu  -->
<p class="testo_colore"> Menu </p>
<table class="bordo" cellpadding="3" cellspacing="3" width="210">
 <tr>
	<td class="menu">&nbsp;</td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
 <tr>
	<td class="menu">&nbsp;</td>
 </tr>
</table><!-- Fine tabella menu --><br>

- Spazio accessorio/gadget<br><br>

- Spazio accessorio/gadget<br><br>

<!-- Inizio tabella link amici  -->
<p class="testo_colore"> Link amici </p>
<table class="bordo" cellpadding="3" cellspacing="3" width="210">
 <tr>
	<td class="menu">&nbsp;</td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
	<tr>
	<td class="menu_decor" onmouseover="this.className = 'hover'" onmouseout="this.className = 'out'"><a target="_blank" href="#">* Link ::..</a></td>
 </tr>
 <tr>
	<td class="menu">&nbsp;</td>
 </tr>
</table><!-- Fine tabella link amici --><br>

- Spazio accessorio/gadget<br><br>

- Spazio accessorio/gadget<br><br>

- Spazio accessorio/gadget<br><br>

<!--  Credits Penelope - Non rimuovere grazie -->
<a target="_blank" href="https://www.iltelaiodipenelope.it/template/index.php">WebSet Penelope &#9829;</a><br><br>
<!--  Credits Penelope - Non rimuovere grazie --> 

<!-- Fine sapzio colonna non scrivere dopo questa linea --></td>
 </tr>
 <tr>
	<td class="img_sfondo" colspan="2" height="70"><!-- Inizio spazio footer -->
&#3297; Nome sito <script type="text/javascript">
// Script Calcolo Tempo Trascorso Penelope - https://www.iltelaiodipenelope.it
 var dataIniziale = new Date('2024-5-14'); // Imposta qui la data 
 var dataAttuale = new Date();

 function differenzaDate(inizio, fine) {
    var anni = fine.getFullYear() - inizio.getFullYear();
    var mesi = fine.getMonth() - inizio.getMonth();
    var giorni = fine.getDate() - inizio.getDate();

    if (mesi < 0 || (mesi === 0 && fine.getDate() < inizio.getDate())) {
        anni--;
        mesi += 12;
     }

    if (giorni < 0) {
        var ultimoGiornoMesePrecedente = new Date(fine.getFullYear(), fine.getMonth(), 0).getDate();
        giorni = ultimoGiornoMesePrecedente - inizio.getDate() + fine.getDate();
        mesi--;
     }

      return { anni: anni, mesi: mesi, giorni: giorni };
  }

  var differenza = differenzaDate(dataIniziale, dataAttuale);
  
document.write("online da... " + differenza.anni + " anni, " + differenza.mesi + " mesi e " + differenza.giorni + " giorni");
</script><br>

<script type="text/javascript">
copyright=new Date();
update=copyright.getFullYear();
document.write("Copyright  2024 - "+ update + " - Nome Autore - Tutti i diritti riservati.");
</script><!-- Fine spazio footer --></td>
	</tr>
</table>

</body>

</html>