/* CSS Document */

@font-face {
	/*https://nicholasmarmonti.com/tutorial/font-personalizzati-tecniche/*/
	/*https://anyconv.com/it/ttf-convertitore/*/
   font-family: 'TrajanPro';
   font-display: swap; /* swap: ordina al browser di caricare provvisoriamente un font di sistema fintantochè il font indicato non viene caricato. */
   font-style: normal;
   font-weight: 100;
   src: local('TrajanPro'), url('font/trajanpro/TrajanPro-Regular.eot'); /* IE9 */
   src: local('TrajanPro'), url('font/trajanpro/TrajanPro-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        local('TrajanPro'), url('font/trajanpro/TrajanPro-Regular.woff2') format('woff2'), /* Browser Super Moderni */
        local('TrajanPro'), url('font/trajanpro/TrajanPro-Regular.woff') format('woff'), /* Browser Moderni */
        local('TrajanPro'), url('font/trajanpro/TrajanPro-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
        local('TrajanPro'), url('font/trajanpro/TrajanPro-Regular.svg#TrajanPro-Regular') format('svg'); /* Legacy iOS */
}

@font-face {
    font-family: 'Roboto';
	font-display: swap; /* swap: ordina al browser di caricare provvisoriamente un font di sistema fintantochè il font indicato non viene caricato. */
    src: url('font/roboto/Roboto-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: 100;
}

html{
	font-family: 'Roboto', sans-serif;
	font-size:100%;/*di default è 16px*/
	 -ms-text-size-adjust:100%; 
	 -webkit-text-size-adjust:100%;
	 word-wrap: break-word;/*spezza e manda a capo le parole troppo lunghe che altrimenti sforerebbero i confini del box contenitore*/
    color:rgb(153,153,153);
}

footer{
	color:rgb(210,210,210);
}

.break_word{
	word-break:break-all;/*spezza e manda a capo le parole troppo lunghe che altrimenti sforerebbero i confini del box contenitore*/
}

.trajanpro{
	font-family: 'TrajanPro', serif;
}

.h1_title{
	font-size:1.2rem;
	font-weight: 100;
	letter-spacing:3px;
	margin-top:10px;
}

.name, .role{
	font-weight: 100;
	letter-spacing:3px;
	white-space: nowrap;/*evita alle parole di andare a capo*/
}

.menu{
	letter-spacing:2px;
}

.maiuscolo{
	text-transform:uppercase;
}

.titolo{
	color:rgb(199,199,199);
}

.lang li a{
	letter-spacing:2px;
}

.lang li a:link{
	 color:rgb(0,0,0);
	}
.lang li a:visited{
	 color: #cccccc;
	}
.lang li a:hover{
	 color: #ffffff;
	}



.name_mobile{
	font-size:1.8rem;/*parte da 54.4px*/
	font-weight: 100;
    letter-spacing:5px;
    line-height:2.0rem;

	height:100%;
	margin:10px;
}
.role_mobile{
	font-size:.9rem;
	font-weight: 100;
    letter-spacing:5px;
	margin:0px 10px 10px 10px;
}

@media only screen
and (min-device-width : 650px){
	.name{
		font-size:3.4rem;/*16 x 3.4 = 54.4px*/
	}
	.role{
		font-size:1.7rem;
	}
}
@media only screen
and (max-device-width : 649px){
	.name{
		font-size:8.2vw;/*parte da 54.4px*/
	}
	.role{
		font-size:4.1vw;
		
	}
}

@media only screen 
and (max-device-width : 499px) {
	body,h3{
		font-size:1.1rem;
	}
	h1,h2{
		font-size:1.2rem;
	}
	p,ul,ol{
	line-height:1.6rem;	
	}
footer{
font-size:0.9rem;
    }
	small{
	font-size:1.0rem;
	line-height:1.5rem;	
    }
}

@media only screen 
and (min-device-width : 500px){
	body,h3{
		font-size:0.9rem;
	}
	h1,h2{
		font-size:1.0rem;
	}
	p,ul,ol{
	line-height:1.5rem;	
	}
    footer{
    font-size:0.8rem;
    }
small{
	font-size:0.8rem;
	line-height:1.4rem;	
    }
}