@font-face {
  font-family: 'geely';
  font-style: normal;
  src: url(geely.ttf);
}

@font-face {
	font-family: 'Inter';
	font-style: normal;
	src: url(inter.ttf);
  }
  
body {
	margin:0;
	background-color:#0c0908;
	font-family: 'Inter';
}

a {
	color:#ffffff;
}

.fontInter {
	font-family: 'Inter';
}

.mainContainer {
	width:100%;
	margin:0 auto;
	font-family:geely;
	font-size:18px;
	line-height:22px;
	background-color:#0c0908;
	color:#ffffff;
	background-image:url(../img/gnd.jpg);
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center top;
}

.mainContainerHeader {
	text-align:center;
}

.mainContainerHeader img {
	width:100%;
}

.topLogo {
	padding:50px 0 0 50px;
	width:280px;
}

.bottomLogo {
	padding:0 0 50px 50px;
	width:280px;
}

.bottomLogo img {
	width:100%;
}

.topMasterpiece {
	padding-top:30%;
	text-align:center;
}

.topMasterpiece img {
	width:95%;
	max-width:920px;
}

.arrow img {
	padding-top:20px;
	padding-bottom:50px;
	max-width:100px;
	width:50%;
}

.payoff img {
	width:95%;
	max-width:800px;
	padding-bottom:20px;
}

.mainContainerFooter {
	text-align:center;
	bottom:0px;
	max-width:1000px;
	margin:0 auto;
}

.mainContainerFooter img {
	width:100%;
}

.comeArrivare img {
	width:50px;
}

.anagraficaHeader {
	padding-top:50px;
	text-align:center;
}

.anagraficaHeader h1 {
	font-size:32px;
	line-height:34px;
	font-weight:bold;
}

.anagraficaTitle {
	display:table;
	margin:0 auto;
}

.anagraficaTitleBar {
	display:table-cell;
}

.anagraficaTitleName {
	display:table-cell;
}

.inputField {
	width:100%;
	height:40px;
	font-size:16px;
	font-family: 'Inter';
	box-sizing: border-box;
	padding:0 15px;
}

button {
	width:200px;
	height:40px;
	background-color:#ffffff;
	color:black;
	border:0;
	font-size:20px;
	font-family:geely;
}

#errorMsg {
	color:#ee2222;
	font-weight:bold;
	line-height:20px;
	padding-bottom:10px;
}

.topHeader {
	font-size:24px;
	line-height:26px;
	font-weight:bold;
	text-align:center;
	padding:5px 0 15px 0;
}

.topHeader h1 {
	font-size:28px;
	line-height:30px;
	font-weight:bold;
}

#step1 {
	width:100%;
	max-width:840px;
	margin:0 auto;
	text-align:center;
}
	
#step2 {
	display:none;
	text-align:left;
}

#confirmOK {
	display:none;
	text-align:center;
	width:80%;
	margin:0 auto;
}

#confirmKO {
	display:none;
	text-align:center;
	width:80%;
	margin:0 auto;
}

.field {
	font-family: 'Inter';
	width:400px;
	display:inline-block;
	text-align:left;
}

.fieldSeparator {
	width:30px;
	display:inline-block;
}

.fieldLabel {
	display:inline-block;
	width:140px;
}

.fieldInput {
	display:inline-block;
	width:300px;
}

.fieldLabelLarge {
	display:inline-block;
	width:300px;
}

.fieldLarge {
	font-family: inter;
	width:100%;
	display:inline-block;
}

.fieldInputLarge {
	display:inline-block;
	width:100%;
}

.fieldPrivacy {
	text-align:left;
	padding-top:20px;
}

.confirmTopLogo {
	position:absolute;
	top:50px;
	left:50px;
	width:280px;
}

.confirmContainer {
	width:100%;
	height:100vh;
	margin:0 auto;
	font-family:inter;
	font-size:30px;
	line-height:40px;
	background-color:#0c0908;
	color:#ffffff;
	background-image:url(../img/gnd2.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center top;
	text-align:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
}

.confirmText {
	width:90%;
	margin:0 auto;
}

.confirmContainerFooter {
	text-align:center;
	bottom:0px;
	max-width:1000px;
	margin:0 auto;
}

.confirmContainerFooter img {
	width:100%;
}

.anagraficaTitle {
	display: flex;
	align-items: center;
	width: 100%;
	margin: 20px 0;
}

.anagraficaTitleBar {
	flex: 1;
	height: 1px;
	background-color: #ffffff;
	margin: 0 15px;
}

.anagraficaTitleName {
	color: #ffffff;
	font-weight: bold;
	white-space: nowrap;
	padding: 0 10px;
}


@media screen and (max-width: 1000px) {
	.field {
		padding-bottom:20px;
	}

	.hideMobile {
		display:none;
	}

	.fieldInputLarge {
		display:block;
		margin-top:10px;
		max-width:100%;
	}
}	
	


@media screen and (max-width: 680px) {

	.anagraficaHeader {	
		text-align:left;
	}


	.anagraficaHeader h1 {
		font-size:22px;
		line-height:24px;
	}

	.topLogo {
		padding:20px 0 0 20px;
		text-align:left;
	}

	.topLogo img {
		width:140px;
	}

	.bottomLogo {
		padding:0 0 20px 20px;
	}

	.bottomLogo img {
		width:140px;
	}

	.confirmTopLogo img {
		width:140px;
	}


	.fieldLabel {
		display:block;
		width:100%;
		text-align: center;
	}

	.fieldInputLarge {
		width:80%;
		margin:0 auto;
	}

	.fieldLarge {
		width:100%;
	}

	.fieldLabel {
		text-align: center;
	}

	.field {
		width:100%;		
	}

	#step1 {
		width:95%;
	}

	.step1 {
		text-align: center;
	}

	.mainContainer {
		width:95%;
	}

	.mainContainerFooter {
		position:fixed;
	}

	.fieldPrivacy {
		padding-top:0px;
	}

	.arrow {
		display:none;
	}
}