  @font-face {
  font-family: 'Roboto Condensed';
  src: url('assets/font/RobotoCondensed-Regular.ttf') format('truetype'); 
}
html {
	font-size: 100%;
	font-family: "Roboto Condensed"
}

@media (max-width: 640px) {
body {
	font-size: 0.9rem;
}
}

@media (min-width: 641px) {
.titolo {
	font-size: 1.7rem;
}
body {
	font-size: 1.0rem;
}
}

@media (min-width:720px) {
.titolo {
	font-size: 1.7rem;
}
body {
	font-size: 1.0rem;
}
}

@media (min-width:960px) {
.titolo {
	font-size: 4.5rem;
}
body {
	font-size: 2.2rem;
}
}

@media (min-width:1025px) {
.mob-img {
	display: none;
}
.ftr-mob {
	display: none
}
.ftr-dk {
	display: block;
}
}

@media (min-width:1100px) {
.titolo {
	font-size: 3.5rem;
}
body {
	font-size: 1.0rem;
}
}
* {
	box-sizing: border-box;
}
body {
	background-color: black;
	display: flex;
	min-height: 100vh;
	flex-direction: column;
	margin: 0;
	color: white;
}
#main {
	display: flex;
	flex: 1;
	background-image: url('assets/img/bg-totosi-2v.png');
	background-size: cover;
	
	 max-width: 100%;
	 box-sizing: border-box;

	 
}
#main > article {
	flex: 1;
	order: 2;
}
#main > nav {
	flex: 0 0 10vw;
}
#main > aside {
	flex: 0 0 10vw;
}
#main > nav {
	/*background: #D7E8D4;*/
	order: 1;
}
#main > aside {
	/*background: beige;*/
	order: 3;
}
header, footer {
	background: white;
	height: auto;
}
header, footer, article, nav, aside {
	padding: 1em;
}
.titolo {
	text-align: left;
	font-weight: 600;
	letter-spacing: 0;
	color: #FFFFFF;
	opacity: 1;
}
.lft-cont {
	width: 45%;
	padding-right: 40px;
	float: left;
	display: inline-block;
}
.rght-cont {
	width: 55%;
	float: right;
}
.dskt-img {
	width: 40%;
	padding-right: 6%;
}
.dskt-titolo {
	width: 60%;
	float: right;
}

@media all and (max-width: 1024px) {
.dskt-img {
	display: none
}
.lft-cont {
	width: 100%
}
.rght-cont {
	width: 100%
}
.mob-img {
	text-align: center
}
.dskt-titolo {
	width: 100%;
	float: none;
}
.titolo {
	text-align: center
}
.ftr-mob {
	display: block
}
.ftr-dk {
	display: none;
}
#main > nav {
	flex: 0 0 6vw;
}
#main > aside {
	flex: 0 0 6vw;
}
}
    a {
  color: white;
}

footer{
	width:100%;
	float:left;
}

#container{
	position:relative;
}

html, body{
	
	height:100%;
	
}

#main{
	width:100%;
float: left;
  in-height: 97%;
}