
 body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #999999;

	padding: 0;

	color: #000000;
} 


.bb #contenitore { 
	width:900px;
	background: #000000;
	margin: 0 auto; /* i margini auto (insieme a una larghezza) centrano la pagina */
	border: 1px solid #000000;
	text-align: left; /* sostituisce l'impostazione text-align: center nell'elemento body. */
} 
.bb #header { background-image:url(images/discoteca-shilling-ostia-foto.jpg) ;
height:215px;
	padding: 0 10px;  /* questo padding corrisponde all'allineamento a sinistra degli elementi nei div sottostanti. Se in #header viene utilizzata un'immagine anziché un testo, può essere utile rimuovere il padding. */
} 
.bb #header2 { background:#000000 ;
height:55px;
	padding: 10px 1px 25px;  /* questo padding corrisponde all'allineamento a sinistra degli elementi nei div sottostanti. Se in #header viene utilizzata un'immagine anziché un testo, può essere utile rimuovere il padding. */
} 
.bb h1 {

margin-top:0px; 

color:#FFFFFF;
	margin: 0px 0px 0px -10px;

	padding: 0px 0; /* l'uso del valore padding al posto di margin consente di distanziare l'elemento dai bordi del div */
	font-size:20px;
}

/* Suggerimenti per sidebar1:
1. Se si imposta un valore font-size per questo div, la larghezza globale del div viene modificata di conseguenza.
2. Poiché si lavora in ems, è meglio non applicare un padding alla barra laterale, poiché, nei browser conformi agli standard, verrebbe aggiunto alla larghezza producendo una larghezza effettiva non prevedibile. 
3. Per creare spazio tra il lato del div e gli elementi al suo interno, è possibile applicare un margine sinistro e destro a tali elementi, come descritto nella regola ".bb #sidebar1 p".
*/
.bb #sidebar1 {
	float: left; 
	width: 210px; /* poiché questo elemento è mobile, occorre specificare una larghezza */
	background: #212121; /* il colore di sfondo verrà visualizzato per tutta la lunghezza del contenuto all'interno della colonna, ma non oltre */
	padding: 0px 0; /* un padding superiore e inferiore creano uno spazio visivo all'interno di questo div */
}
.bb #sidebar1 h3, .bb #sidebar1 p {
	margin-left:5px; /* è necessario applicare un margine sinistro e destro a ogni elemento che verrà inserito nelle colonne laterali */
	margin-right:5px;
}

/* Suggerimenti per main:
1. Se si assegna a questo div #main un valore font-size diverso dal div #sidebar1, i margini del div #main e la larghezza del div #sidebar1 saranno basati sui rispettivi valori font-size. Può essere utile modificare i valori di questi div.
2. Lo spazio tra main e sidebar1 viene creato con il margine sinistro del div main.  Indipendentemente dalla quantità di contenuto presente nel div sidebar1, lo spazio della colonna rimane inalterato. È possibile rimuovere questo margine sinistro se si desidera che il testo del div #main riempia lo spazio di #sidebar1 quando il contenuto di #sidebar1 finisce.
3. Per evitare il problema del 'float drop', può essere necessario eseguire una prova per determinare le dimensioni massime approssimative dell'immagine o elemento, poiché questo layout è basato sulle dimensioni di carattere dell'utente combinate con i valori impostati. Tuttavia, se nel browser dell'utente la dimensione del carattere è impostata su un valore più basso del normale, nel div #main sarà disponibile meno spazio di quello evidenziato nella prova.
4. Nel commento condizionale di Internet Explorer riportato di seguito, la proprietà zoom viene utilizzata per assegnare "hasLayout" a main, al fine di evitare vari bug specifici di IE che potrebbero verificarsi.
*/
.bb #main { 
width: 680px;
margin-top:0px;
	margin-left:224px;
	margin-bottom:5px;
	margin-right:2px;
} 
.bb #footer { 
	padding: 0 10px; /* questo padding corrisponde all'allineamento a sinistra degli elementi nei div sovrastanti. */
	background: #000000;
} 
.bb #footer p {
	margin: 0; /* azzerando il valore margin del primo elemento del footer si evita il rischio di compressione del margine, con la creazione di uno spazio tra i div */
	padding: 10px 0; /* il padding di questo elemento crea uno spazio, così come avverrebbe specificando un valore margin, senza il problema della compressione del margine */
}

/* Classi varie riutilizzabili */
.fltrt { /* questa classe può essere utilizzata per rendere mobile un elemento a destra nella pagina. L'elemento reso mobile deve precedere l'elemento al quale deve essere affiancato sulla pagina. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* questa classe può essere utilizzata per rendere mobile un elemento a sinistra nella pagina.*/
	float: left;
	margin-right: 8px;
}
.clearfloat { /* questa classe deve essere inserita in un elemento div o break e deve essere l'elemento finale prima della chiusura di un contenitore che deve contenere per intero un elemento mobile */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}



.testo {
	color: #000000;
	font-family: Verdana;
	font-size: 14px;
}

.testo2 {
	color: #000000;
	font-family: Verdana;
	font-size: 14px;
}

.clear { clear:both;}

.fleft { float:left;}
.fright { float:right;}

.alignright { text-align:right;}
.aligncenter { text-align:center;}
.testo-bianco {
	color: #FFFFFF;
	font-family: Verdana;
	font-size: 11px;
	font-weight:bold;
}

.testo-bianco-piccolo {
	color: #FFFFFF;
	font-family: Tahoma;
	font-size: 12px;
	
}


.container { width:100%;}

p { margin-bottom:18px;}

/*==================forms====================*/
input, select { vertical-align:middle; font-weight:normal;}





/*content*/
#content { width:100%; padding-bottom:2px;}
#content .indent { padding:16px 0 0 0;}

/*footer*/
#footer { background:#000000; text-align:center;}
#footer p { color:#f9dcf0; font-size:.91em;}
#footer p a {color:#f9dcf0;}

.TextBox
{
	background: #FF0000;
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
    }
	
	
	.TextBox1
{
	background: #f84210;
	color: #FFFFFF;
	font-family: Tahoma;
	font-size: 12px;
	text-decoration: none;

    }
	
	
	 .link2 {
 width:121px;
 height:25px;
	
	border:0;
	background-image:url(images/sms-list-discoteche-roma.jpg no-repeat);

	cursor:pointer;
}
	
	.testoverde {
	font-family: Tahoma;
	font-size: 16px;
	text-decoration: none;
	color: #00B832;
}

}
	
	.testoverde-sot {
	font-family: Tahoma;
	font-size: 16px;
	text-decoration: underline;
	color: #00B832;
}

		.testoverdepiccolo {
	font-family: Tahoma;
	font-size: 16px;
	text-decoration: none;
	color: #00B832;
}
.testorosso { 
color:#d43320; 
font-size:16px; 
font-weight:bold;}


img {
	border: none;
}
.tah10 {
	font-family: Tahoma;
	font-size: 10px;
	text-decoration: none;
	color: #000000;
}
.tah11 {
	font-family: Tahoma;
	font-size: 16px;
	text-decoration: none;
	color: #000000;
}
.ver10 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-decoration: none;
	color: #000000;
}
.ver11 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	text-decoration: none;
	color: #000000;
}
.tah9 {
	font-family: Tahoma;
	font-size: 9px;
	text-decoration: none;
	color: #000000;
}
.ver9 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	text-decoration: none;
	color: #000000;
}
.Stile1 {
	color: #FFFFFF;
	font-weight: bold;
}
.Stile5 {color: #00B832}
ul { list-style:none;}

.menu { padding:5px 0px 0px 0px; width:100%;}
.menu li { display:inline;}
.menu li a { display:block; float:left; background:url(images/menu_bgd1.gif) left top; width:125px; text-align:center; font-family:tahoma; color:#fff; font-weight:bold; margin-right:0px; text-transform:uppercase; text-decoration:none; padding:5px 0 10px 2px;}
.menu li a:hover { background:url(images/menu_bgd2.gif)  left top repeat-x; }
.menu li a.current { background:url(images/menu_bgd2.gif) left top repeat-x;}
.menu li a.last { margin-right:0; width:125px;}
.menu li a.first { width:125px;}

.footer_menu { padding:21px 0 0 0;}
.footer_menu li { display:inline;}
.footer_menu li a {background:url(images/foot_divider.gif) no-repeat right 3px; color:#9f698e; text-decoration:none; text-transform:uppercase; padding:0 8px 0 6px;}
.footer_menu li a:hover { color:#fff;}
.footer_menu li a.last { background:none;}

.list1 { background:#fff; margin:16px -14px 18px -16px; position:relative; padding:19px 0 4px 17px;}
.list1 li { display:inline;}
.list1 li a { display:block; padding:0 0 19px 0; background:url(images/list_marker1.jpg) no-repeat left top; padding-left:32px; color:#d43320; font-weight:bold;}
.list1 li a.marker2 {background:url(images/list_marker2.jpg) no-repeat left top;}
.list1 li a.marker3 {background:url(images/list_marker3.jpg) no-repeat left top;}

.list2 li { display:inline;}
.list2 li a { display:block; position:relative; margin:-1px -14px 0 -16px; background:url(images/bull1.gif) no-repeat 16px 7px #fcdfc5; padding:2px 0 2px 27px; text-decoration:none; color:#1e3849; font-size:1.1em;}
.list2 li a.bg {background:url(images/bull1.gif) no-repeat 16px 7px;}
.list2 li a:hover { color:#fff; background:url(images/bull1.gif) no-repeat 16px 7px #4c2047;}

.list3 li a { background:url(images/arrow1.gif) no-repeat left 3px; padding-left:11px; color:#d43320; font-weight:bold; font-size:1.1em; line-height:1.67em;}

/*==================other====================*/
.img_indent { margin:0 20px 0 0; float:left;}
.img_box { padding:0 0 13px 0;}
.img_box img { float:left; margin:0 15px 0 0;}

.p1 { margin-bottom:2px;}
.p2 { margin-bottom:14px;}
.p3 { margin-bottom:9px;}
.p4 { margin-bottom:11px;}


/*==================txt, links, lines, titles====================*/
a {color:#000;}
a:hover{text-decoration:none;}

h3 {font-size:1em; font-family:tahoma; color:#fff; text-transform:uppercase; font-weight:bold; padding:10px 0 11px 51px; background:url(images/marker.gif) no-repeat 15px 5px #ad458d;}
h3.marker1 {background:url(images/marker1.gif) no-repeat 15px 5px #af5050; padding-left:46px;}
h3.marker2 {background:url(images/marker2.gif) no-repeat 13px 12px #fff5d6; padding-left:46px; color:#000; padding:15px 0 11px 46px;}
h3.marker3 {background:url(images/marker3.gif) no-repeat 13px 5px #4d2b30; padding-left:46px;}
h3.marker4 {background:url(images/marker4.gif) no-repeat 13px 5px #7f3367;}
h3.marker5 {background:url(images/marker5.gif) no-repeat 15px 8px #af5050; padding-left:46px;}
h3.marker6 {background:url(images/marker6.gif) no-repeat 15px 5px #fcdfc5; color:#31162a;}
h4 { font-size:1.1em; margin-bottom:5px;}

h5 { color:#d43320; font-size:1em; margin-bottom:7px;}
h5 a {color:#d43320;}

.txt1 { font-size:1.1em;}

.link1 { display:block; float:right; background:url(images/link1_bgd.gif) left top repeat-x; color:#000; text-decoration:none;}
.link1 b { display:block; background:url(images/link1_left.gif) no-repeat left top; padding:3px 11px 4px 33px; border-right:1px solid #77c356;}
.link1:hover { text-decoration:underline;}
.link2 { background:url(images/arrow1.gif) no-repeat left 5px; padding-left:10px; color:#d43320; font-size:1.1em; display:block; margin-bottom:9px; font-weight:bold;}

.line_hor { background:url(images/line1.gif) left bottom repeat-x; padding-bottom:31px; margin-bottom:35px;}
.line_hor1 { background:url(images/line1.gif) left bottom repeat-x; padding-bottom:25px; margin-bottom:26px;}

.title { margin-bottom:13px;}


/*==================blocks====================*/

.block {background:#fff; margin:12px -14px 18px -16px; position:relative; padding:10px 10px 18px 17px;}
.block .ind { padding:0 0 0 0;}

.box1 { border:1px solid #ecc1df;}
.box1 .inner { padding:1px 1px 29px 1px;}
.box1 .inner1 { padding:20px 13px 0 15px;}

.box2 { border:1px solid #f1d5b7; background:#f9ede0;}
.box2 .inner { padding:1px 1px 26px 1px;}
.box2 .inner1 { padding:14px 13px 0 15px;}

.box3 { border:1px solid #f5d056; background:#fff5d6;}
.box3 .inner { padding:1px 1px 25px 1px;}
.box3 .inner1 { padding:4px 13px 0 15px;}

.box4 { border:1px solid #baacae;}
.box4 .inner { padding:1px 1px 29px 1px;}
.box4 .inner1 { padding:20px 18px 0 15px;}

.box5 { border:1px solid #ecc1df; background:#fee2f5;}
.box5 .inner { padding:1px 1px 25px 1px;}
.box5 .inner1 { padding:17px 18px 0 15px;}

.box6 { border:1px solid #ecc1df; background:#fff5d6;}
.box6 .inner { padding:1px 1px 25px 1px;}
.box6 .inner1 { padding:17px 18px 0 15px;}

/*==========================================*CALENDARIO*==========================


.dpDiv {
}


/* the table (within the div) that holds the date picker calendar */

.dpTable {

	font-family: Tahoma, Arial, Helvetica, sans-serif;

	font-size: 12px;

	text-align: center;

	color: #505050;

	background-color: #ffffff;

	border: 1px solid #AAAAAA;

	}





/* a table row that holds date numbers (either blank or 1-31) */

.dpTR {

	}





/* the top table row that holds the month, year, and forward/backward buttons */

.dpTitleTR {

	}





/* the second table row, that holds the names of days of the week (Mo, Tu, We, etc.) */

.dpDayTR {

	}





/* the bottom table row, that has the "This Month" and "Close" buttons */

.dpTodayButtonTR {

	}





/* a table cell that holds a date number (either blank or 1-31) */

.dpTD {

	border: 1px solid #ece9d8;

	}





/* a table cell that holds a highlighted day (usually either today's date or the current date field value) */

.dpDayHighlightTD {

	background-color: #CCCCCC;

	border: 1px solid #AAAAAA;

	}





/* the date number table cell that the mouse pointer is currently over (you can use contrasting colors to make it apparent which cell is being hovered over) */

.dpTDHover {

	background-color: #aca998;

	border: 1px solid #888888;

	cursor: pointer;

	color: red;

	}





/* the table cell that holds the name of the month and the year */

.dpTitleTD {

	}





/* a table cell that holds one of the forward/backward buttons */

.dpButtonTD {

	}





/* the table cell that holds the "This Month" or "Close" button at the bottom */

.dpTodayButtonTD {

	}





/* a table cell that holds the names of days of the week (Mo, Tu, We, etc.) */

.dpDayTD {

	background-color: #CCCCCC;

	border: 1px solid #AAAAAA;

	color: white;

	}





/* additional style information for the text that indicates the month and year */

.dpTitleText {

	font-size: 12px;

	color: gray;

	font-weight: bold;

	}





/* additional style information for the cell that holds a highlighted day (usually either today's date or the current date field value) */ 

.dpDayHighlight {

	color: 4060ff;

	font-weight: bold;

	}





/* the forward/backward buttons at the top */

.dpButton {

	font-family: "Trebuchet MS";

	font-size: 12px;

	color: gray;

	background: #d8e8ff;



	padding: 0px;

	}





/* the "This Month" and "Close" buttons at the bottom */

.dpTodayButton {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: gray;
	background: #d8e8ff;
	font-weight: bold;

	}