.box{
	width: 5%;
}	
.titolo{
	width: 46%;
}
.organizzazione{
	width: 120px;
	margin-top: -200px;
	right: 50px; /*sempre allineata a 50px dal margine destro del rettangolo, inl inea con il testo*/
}
.mail{
	width: 70px;
	margin-top: -200px;
	right: 50px; /*sempre allineata a 50px dal margine destro del rettangolo, inl inea con il testo*/
}


@media (min-width: 2200px) { /*fuchsia*/
	
}

@media (max-width: 1850px) { /*yellow*/
	
	.titolo{
		width: 60%;
	}
	.box{
	}
}		


@media (max-width: 1350px) { /*pink*/
	
	.titolo{
		width: 70%;
	}
	.organizzazione{
		width: 110px;
		margin-top: -220px;
	}
	.mail{
		width: 60px;
		margin-top: -220px;
	}
}	

@media (max-width: 1200px) { /*orange*/
	
	.titolo{
		width: 85%;
	}
	.organizzazione{
		width: 100px;
		margin-top: -220px;
	}
	.mail{
		width: 55px;
		margin-top: -240px;
	}
}

@media (max-width: 1000px){ /*green*/

	.titolo{
		width: 80%;
	}
	.box{
		width: 10%;
	}
	.organizzazione{
		width: 100px;
		margin-top: -220px;
		right: 20px;  /*per le immagini dei riquadri di SINISTRA, mettere right 20px così è allineato al testo che ha padding-right 20px*/
	}
	.mail{
		width: 55px;
		margin-top: -240px;
	}
}

@media (max-width: 850px){ /*aqua*/
			
	.titolo{
		width: 80%;
	}
	.box{
		width: 10%;
	}
	.organizzazione{
		width: 100px;
		margin-top: -260px;
	}
	.mail{
		width: 50px;
		margin-top: -240px;
	}
}	

@media (max-width: 768px) { /*red*/
	.box{
		width: 10%;
	}
	.titolo{
		width: 90%;
	}
	.organizzazione{
		width: 95px;
		margin-top: -270px;
	}
	.mail{
		width: 50px;
		margin-top: -270px;
		right: 30px;  /*per le immagini dei riquadri di DESTRA, mettere right 30px così è allineato al testo che ha padding-right 30px*/
	}		
}	

@media (max-width: 570px) { /*brown*/
	.titolo{
		/*color: brown;*/
	}
}