@charset "utf-8";
@import "../css/font.css";

body 
	{
 margin: 0px 0px 0px 0px;
 background: white;
 text-align: left;
 font-size: 14px;
 font-family: "Litterbox ICG", "Times New Roman",Georgia,Serif;
 color: #000000; 
 	}

#CONTAINER {
	width: 1130px;
	height:auto;
	text-decoration: none;
	border: solid 2px #FF0000;
	border-radius: 8px 8px 8px 8px;
	background-color: transparent;
	padding: 8px;
	}
 
 .c1 {
 position:absolute;
 top: 10px;
 left: auto;
 height:25px; 
 width:1130px;
 background-color: #FF0000;
 border: 0px; 
 color: #FFFF00;
 font-family: 'Litterbox ICG', 'Times New Roman',Georgia,Serif;
 font-size: 20px; 
 z-index: -1;
 text-align: center;
 	}
 
 .c2 {
 text-align: center;
 border: 0px;
 text-decoration: none;
 	}
 .c3 {
 position:relative;
 left: 300px;
 text-align: center;
 border: 0px;
 text-decoration: none;
 	} 
 
.immagine 
	{
 border: 0px;
 text-decoration: none;
	}

.rosso
	{
 background-color : rgb(255, 255, 255); 
 color: rgb(255, 0, 0);
 font-style: italic;
 font-weight: 900;
 font-family: "Litterbox ICG", "Times New Roman",Georgia,Serif; 
 font-size: 25px;
	}

a:link {
text-decoration: none;
color: #ff0000;
}
a:hover{
	
text-decoration: none;
color: #ff0000;
}

a:visited{
text-decoration: none;
color: #ff0000;	

}

.spazio{
 background-image: url(../immagini/twt.png);
 background-repeat: no-repeat; 
 background-position: center center;
 height:48px;
 width:1130px;
 text-align:right;
 top: -18px;
 z-index: 1;
 border-radius: 4px 4px 4px 4px;
}

.bottom{
 height:65px; 
 text-align:right;
 z-index: 1;
 bottom: 0px;
}



.per {
 background-image: url(../immagini/home.png);
 background-color: #ffffff;
 background-repeat: no-repeat; 
 background-position: center center;
 height:48px; 
 width:48px;
 position:relative;
 top: -18px;
 z-index: 1;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.per:hover {
 background-image: url(../immagini/perladidattica.gif);
 background-repeat: no-repeat; 
 background-position: center center;
 top:-13px;
 height:48px; 
 width:48px;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.tw {
 background-image: url(../immagini/tw.png);
 background-color: #cccccc;
 background-repeat: no-repeat; 
 background-position: center center;
 height:48px; 
 width:48px;
 position:relative;
 top: -18px;
 z-index: 1;
 border: solid 2px #328CC5;
 border-radius: 4px 4px 4px 4px;
}

.tw:hover {
 background-image: url(../immagini/twr.png);
 background-repeat: no-repeat; 
 background-position: center center;
 top:-13px;
 height:48px; 
 width:48px;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.inf {
 background-image: url(../immagini/perlainfanzia.jpg);
 background-repeat: no-repeat; 
 background-position: center center;
 height:48px; 
 width:48px;
 position:relative;
 top: -18px;
 z-index: 1;
 background-color: #ffffff;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.inf:hover {
 background-image: url(../immagini/perlainfanzia.jpg);
 background-repeat: no-repeat; 
 background-position: center center;
 top:-13px;
 height:48px; 
 width:48px;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.pri {
 background-image: url(../immagini/perlaprimaria.jpg);
 background-repeat: no-repeat; 
 background-position: center center;
 height:48px; 
 width:48px;
 position:relative;
 top: -18px;
 z-index: 1;
 background-color: #ffffff;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.pri:hover {
 background-image: url(../immagini/perlaprimaria.jpg);
 background-repeat: no-repeat; 
 background-position: center center;
 top:-13px;
 height:48px; 
 width:48px;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}			

.sec {
 background-image: url(../immagini/perlaprimogrado.jpg);
 background-repeat: no-repeat; 
 background-position: center center;
 background-color: #ffffff;
 height:48px; 
 width:48px;
 position:relative;
 top: -18px;
 z-index: 1;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.sec:hover {
 background-image: url(../immagini/perlaprimogrado.jpg);
 background-repeat: no-repeat; 
 background-position: center center;
 top:-13px;
 height:48px; 
 width:48px;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.secsec {
 background-image: url(../immagini/perlasecondogrado.jpg);
 background-repeat: no-repeat; 
 background-position: center center;
 height:48px; 
 width:48px;
 position:relative;
 top: -18px;
 z-index: 1;
 
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.secsec:hover {
 background-image: url(../immagini/perlasecondogrado.jpg);
 background-repeat: no-repeat; 
 background-position: center center;
 top:-13px;
 height:48px; 
 width:48px;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.tutte {
 background-image: url(../immagini/tutte.png);
 background-repeat: no-repeat; 
 background-position: center center;
 height:48px; 
 width:48px;
 position:relative;
 top: -18px;
 z-index: 1;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}

.tutte:hover {
 background-image: url(../immagini/tutte.png);
 background-repeat: no-repeat; 
 background-position: center bottom;
 top:-13px;
 height:48px; 
 width:48px;
 border: solid 2px #ff0000;
 border-radius: 4px 4px 4px 4px;
}
.centrale{
 text-decoration: none;
 text-align:left;
 display: table;
 padding: 20px;
 background-color: #ffffff;
 height:auto; 
 width:auto;
 padding: 10px;
 font-family: "Litterbox ICG", "Times New Roman",Georgia,Serif; 
 font-style: italic;
 font-weight: 900;
 font-size: 0px;
 color: #ff0000;
 margin: 1px;
 display: table;
/*  position:relative;
 top: -18px;
 z-index: 1; 
 border: solid 0px #ff0000;
 border-radius: 4px 4px 4px 4px;*/
 }
table {
    display: table;
    border-collapse: separate;
    border-spacing: 2px;
	border: solid 0px;
    border-color: red;
}


#tasto1 div{	
			display: table-cell;
			width: 244px;
			height: 127px;
			border: solid 3px #ff0000;
			text-align: center;
			vertical-align: middle;
			background:	#ffffff;
			border-radius: 0px;			
			
			font-size: 20px;
			font-weight:bold;
			padding: 10px;
			
}		
		
#tasto1 div:hover {
			width: 244px;
			height: 127px;
			border: solid 3px #686868;			
			text-decoration: none;
			text-align: center;
			background-image: none;
			BACKGROUND-COLOR: #BEBEBE;
			color:#ffffff;
		}
#tasto2h div{	
			display: table-cell;
			width: 244px;
			height: 240px;
			border: solid 3px #ff0000;
			text-align: center;
			vertical-align: middle;
			background:	#ffffff;
			border-radius: 0px;			
			font-size: 20px;
			font-weight:bold;
			padding: 10px;
			
}		
		
#tasto2h div:hover {
			width: 244px;
			height: 240px;
			border: solid 3px #686868;			
			text-decoration: none;
			text-align: center;
			background-image: none;
			BACKGROUND-COLOR: #BEBEBE;
			color:#ffffff;
		}
#tasto4h div{	
			display: table-cell;
			width: 244px;
			
			border: solid 3px #ff0000;
			text-align: center;
			vertical-align: middle;
			background:	#ffffff;
			border-radius: 0px;			
			
			font-size: 20px;
			font-weight:bold;
			padding: 5px;
			
}		
		
#tasto4h div:hover {
			width: 244px;
			
			border: solid 3px #686868;			
			text-decoration: none;
			text-align: center;
			background-image: none;
			BACKGROUND-COLOR: #BEBEBE;
			color:#ffffff;
		}