body {background-image: url(http://www.frasidamore.eu/immagini/amore.gif);}
img{border:0px;}

.box_img {
    float:left;
    width:33.33%;
    margin:6px auto;
    text-align:center;
}
.box_img_cent {
    float:center;
    width:80%;
    margin:10px auto;
    text-align:center;
}
div.distanziato {
	padding: 10px;
	text-align: justify;
}
div.distanziato20 {
	padding: 20px;
	text-align: justify;
}
div.distanziatoCentrato {
	padding: 10px;
	text-align: center;
}
div.distanziatoCentrato5 {
	padding: 5px;
	text-align: center;
}
div.GG {
	padding-top: 25px;
	padding-bottom: 25px;
	width:97%;
    text-align:center;
}

/*  per menu Basso   */
p {line-height: 44px}
span.MenuBasso {
	padding: 6px;
	font: 19px Arial, Verdana, sans-serif;
	color: #CC0000;
}
span.MenuBassoDistanz {
	padding-left: 7px;
	padding-right: 4px;
	font: 13px Arial, Verdana, sans-serif;
	color: #CC0000;
}
/*  fine menu Basso   */

a.nonSottolineato{
	text-decoration: none;
}

div.distanz25sugiu {
	padding-top: 25px;
	padding-bottom: 25px;
}

span.testoAnteprime {
	color: #CC0000;
	font: 16px Arial, Verdana, sans-serif;
}

span.testoDescrizImmag {
	color: #CC0000;
	font: 18px Arial, Verdana, sans-serif;
}


span.testoresp {
	color: #CC0000;
	font: 16px Arial, Verdana, sans-serif;
}

/*  per box Social   */
@media (min-width: 351px) {
	.box_social {
	    float:left;
	    width:33.33%;
		height: 32px;
	    margin:8px auto;
	    text-align:center;
	}
	div.social {
		padding-bottom: 50px;
		width: 350px;
		margin: 0 auto;
	}
}
@media (max-width: 350px) {
	.box_social {
	    float:left;
	    width:100%;
		height: 32px;
	    margin:8px auto;
	    text-align:center;
	}
	div.social {
		padding-bottom: 50px;
		width: 100%;
		margin: 0 auto;
	}
}
/*  fine box Social   */

/*  QUI comincia la gestione personalizzata a seconda della dimensione del browser ** considerando che le anteprime sono di 200px   */
/* immagine Grande contenuta nella pagine PHP, misure variabili */
@media (min-width: 621px) {
	.immagineGrande {max-width: 600px}
}
@media (max-width: 620px) {
	.immagineGrande {width: 100%}
}
/* fine gestione immagine Grande */

/*  ... considerando che le anteprime sono di 200px   */
@media (min-width: 880px) {
	.tab855 {
		width: 855px;
		margin: 0 auto;
	}
	.anteprime {max-width: 100%}
}
@media (max-width: 879px) {
	.tab855 {
		width: 100%;
		margin: 0 auto;
	}
	.anteprime {max-width: 100%}
/*  per menu Basso   */
	p {line-height: 50px}
	span.MenuBasso {
		padding: 8px;
		font: 20px Arial, Verdana, sans-serif;
		color: #CC0000;
	}
	span.MenuBassoDistanz {
		padding-left: 9px;
		padding-right: 6px;
		font: 13px Arial, Verdana, sans-serif;
		color: #CC0000;
	}
/*  fine menu Basso   */
}
/*  sotto i 645 px -> metterne 2 in linea invece che 3  (3x200 + 45 margine=645 massimo perchè ce ne stiano 3)  */
@media (max-width: 645px) {
	.box_img {
	    float:left;
	    width:50%;
	    margin:6px auto;
	    text-align:center;
	}
	.tab855 {
		width: 100%;
		margin: 0 auto;
	}
	.anteprime {max-width: 100%}
/*  per menu Basso   */
	p {line-height: 50px}
	span.MenuBasso {
		padding: 8px;
		font: 20px Arial, Verdana, sans-serif;
		color: #000000;
	}
	span.MenuBassoDistanz {
		padding-left: 9px;
		padding-right: 6px;
		font: 13px Arial, Verdana, sans-serif;
		color: #000000;
	}
/*  fine menu Basso   */
}
/*  sotto i 445 px -> riduci anteprime gradualmente, fino a 95% dello spazio disponibile, così da tenerne 2 in linea fino a 220px  */
@media (max-width: 445px) {
	.box_img {
	    float:left;
	    width:50%;
	    margin:6px auto;
	    text-align:center;
	}
	.tab855 {
		width: 100%;
		margin: 0 auto;
	}
	.anteprime {width: 95%;}
/*  per menu Basso   */
	p {line-height: 50px}
	span.MenuBasso {
		padding: 8px;
		font: 20px Arial, Verdana, sans-serif;
		color: #CC0000;
	}
	span.MenuBassoDistanz {
		padding-left: 9px;
		padding-right: 6px;
		font: 13px Arial, Verdana, sans-serif;
		color: #CC0000;
	}
/*  fine menu Basso   */
}
/*  sotto i 219 px -> metterne 1 in linea invece che 2  */
@media (max-width: 250px) {
	.box_img {
	    float:left;
	    width:100%;
	    margin:6px auto;
	    text-align:center;
	}
	.tab855 {
		width: 100%;
		margin: 0 auto;
	}
	.anteprime {width: 60%;}
/*  per menu Basso   */
	p {line-height: 50px}
	span.MenuBasso {
		padding: 8px;
		font: 20px Arial, Verdana, sans-serif;
		color: #CC0000;
	}
	span.MenuBassoDistanz {
		padding-left: 9px;
		padding-right: 6px;
		font: 13px Arial, Verdana, sans-serif;
		color: #CC0000;
	}
/*  fine menu Basso   */
}