@font-face {
    font-family: 'Proxima Regular';
    src: url('../font/ProximaNova-Regular.eot');
    src: url('../font/ProximaNova-Regular.eot?#iefix') format('embedded-opentype'),
        url('../font/ProximaNova-Regular.woff2') format('woff2'),
        url('../font/ProximaNova-Regular.woff') format('woff'),
        url('../font/ProximaNova-Regular.ttf') format('truetype'),
        url('../font/ProximaNova-Regular.svg#ProximaNova-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Bold';
    src: url('../font/ProximaNova-Bold.eot');
    src: url('../font/ProximaNova-Bold.eot?#iefix') format('embedded-opentype'),
        url('../font/ProximaNova-Bold.woff2') format('woff2'),
        url('../font/ProximaNova-Bold.woff') format('woff'),
        url('../font/ProximaNova-Bold.ttf') format('truetype'),
        url('../font/ProximaNova-Bold.svg#ProximaNova-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


body, html {
	margin:0;
	background: #681837;
	color:#fff;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	font-family: 'Proxima Regular';
	align-items: center;
	justify-content: center;
	min-height: 100vh;
	font-size: 14px;
	line-height: 1.4;
	position: relative;
}
body {
	padding:40px 0;
	box-sizing: border-box;
}
.container {
}
h1.logo {
	text-indent: -9999px;
	font-size: 0;
	display: block;
	/*width:390px;
	height: 73px;*/
	width:390px;
	height: 58px;
	margin-left: 0;
	background: url(../images/Modus-logo-icona.svg) center center no-repeat;
	background-size: contain;
	margin-bottom: 25px;
	-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;
}
h2.payoff {
	font-weight: normal;
	margin-bottom: 50px;
	letter-spacing: 0.5px;
}
a {color: #fff; text-decoration: none;}
a:hover {text-decoration: underline;}
p {padding:0; margin:0; margin-bottom: 5px; letter-spacing: 1px;}
p:last:child {margin-bottom: 0;}
ul.social {margin:0; padding:0; margin-top: 20px;}
ul.social li {list-style-type: none; margin:0; padding:0 0 0 15px; line-height: 12px; border-left: 8px solid #fff; display: inline-block; margin-right:20px;}
ul.social li:last-child {margin-right: 0;}
ul.social li a {text-transform: uppercase; letter-spacing: 3px; font-size: 12px; line-height: 12px; display: inline-block;}
.testo {border-left: 8px solid #fff; padding:0 0 0 15px;}
br {display: none;}
.contact br {display: block;}

.footer {font-size: 9.5px; width: 100%; opacity: 0.3; position: absolute; bottom:5px; padding-left:15px; padding-right:15px; box-sizing: border-box;}

@media only screen and (max-width:1000px) {
	h1.logo {
		width: 305px;
		height: 57px;
	}
	p {
		font-size: 12px;
	}
	h2.payoff {
		font-size: 17px;
		letter-spacing: 1px;
		line-height: 23px;
	}
	.testo {border-left: 6px solid #fff;}
	ul.social li {border-left: 6px solid #fff;}
	ul.social li a {font-size: 10px; letter-spacing: 2px;}

}

@media only screen and (max-width:767px) {
	.footer {text-align: center;}
	.container {
		width:85%;
		margin-right: auto;
		margin-left: auto;
		text-align: center;
	}
	h1.logo {
		width:41px;
		height: 271px;
		margin-left: auto;
		margin-right: auto;
		background: url(../images/Modus-logo-icona-verticale.svg) center center no-repeat;
		background-size: contain;
		margin-bottom: 35px;
	}
	p br {display: block;}
	ul.social {max-width: 250px; margin-left: auto; margin-right: auto;}
	ul.social li {border-left: 5px solid #fff; margin-right:10px;}
	.testo {border-left: 0; padding:15px 0 0 0; max-width: 250px; border-top: 5px solid #fff; display: inline-block; margin-left: auto; margin-right: auto;}
	
	h2.payoff {
		max-width: 250px; margin-right: auto; margin-left: auto;
		font-weight: normal;
		margin-bottom: 40px;
		font-size: 16px;
		letter-spacing: 1px;
		line-height: 25px;
	}
}
@media only screen and (max-height:600px) {
	body,html {
		min-height: 700px;
	}
}