* {margin: 0; padding: 0;}

body {
	width: 100%;
	min-width: 100%;
	font-family: 'Raleway', sans-serif;  /* cambiare qui il google font */
	background: url(sfondo-matite.jpg) no-repeat center center fixed;
	/* sfondo: dev'essere intorno ai 1920*1920px per coprire anche gli schermi più grandi */
	webkit-background-size: 100%;
	-moz-background-size: 100%;
	-o-background-size: 100%;
	background-size: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color: #FFF;
}
    
a:link {
	color: #CCCCCC;
	text-decoration: none;
} 
a:visited {
	text-decoration: none;
	color: #CCCCCC;
}
a:hover {
	text-decoration: underline;
	color: #CCCCCC;
}
a:active {
	text-decoration: none;
	color: #CCCCCC;
}
.box h1 { margin: 1em 0; }
.box .dati { margin-top: 1em;
	font-size: 13px;
	font-weight: bold;
	line-height: 1.5em;
}

span.evidenza {
	color: #CCCCCC;
}

div.box { /* contenitore, stili comuni a tutte le risoluzioni */
	display: block;
	position: absolute;
	top: 50%;
	left: 50%; /* modificare qui l'aspetto */	/* arrotondato */
	/*border-radius: 1em;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	line-height: 2em;*/
}


@media screen and (min-width:961px) { /* tutte le risoluzioni fino a 960px */
	div.box {
		width: 990px; 	/* nel caso serva più testo o si voglia l'immagine del logo più grande, aumentare la larghezza */
		height: 404px;	/* e/o l'altezza del box */
		margin: -202px 0 0 -495px; /* e settare il margine superiore e sinistro pari alla metà del contenitore con il valore negativo */
	} 
}


@media screen and (max-width:960px) {
	div.box {
	width: 450; 	/* nel caso serva più testo, aumentare la larghezza */
	height: 450;	/* e/o l'altezza del box */
	margin: -125px 0 0 -200px; /* e settare il margine superiore e sinistro pari alla metà del contenitore con il valore negativo */
	} 
	
	.box .logo img {
		max-width: 90%;
		margin: 0 auto; 
		max-height: 200px; /* aumentare per loghi non a sviluppo orizzontale */
		/* ogni logo inserito sarà automaticamente ridimensionato per coprire al massimo la larghezza impostata al box e un'altezza di 200px, se il logo è di dimensioni inferiori non viene ridotto */
	}
}

.box .logo {
	width: 100%;
}

@media only screen and (orientation:portrait) and (max-width:768px) {
  div.box {
  	position: fixed;
  	top: 25%;
  	left: 25%;
	margin: 0px;
  }
}

@media only screen and (orientation:portrait) and (max-width:600px) {
  div.box {
  	position: fixed;
  	top: 25%;
  	left: 100px;
	margin: 0px;
  }
}

@media only screen and (max-width:568px) {
	div.box {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0%;
		left: 0%;
		margin: 0px;
		border-radius: 0em;
		-moz-border-radius: 0em;
		-webkit-border-radius: 0em;
	}
}

@media only screen and (max-width:568px) and (orientation: landscape) {
		div.box {
			line-height: 1em;
		}
}

@media only screen and (max-width:568px) and (orientation: portrait) {
		div.box {
			padding-top: 10%;
		}
}
