/* Reset */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,dialog,figure,footer,header,hgroup,nav,section{margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline}article,aside,dialog,figure,footer,header,hgroup,nav,section{display:block}body{line-height:1}a img{border:none}table{border-collapse:separate;border-spacing:0}caption,th,td{text-align:left;font-weight:normal}table,td,th{vertical-align:middle}blockquote:before,blockquote:after,q:before,q:after{content:""}blockquote,q{quotes:""""}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}button::-moz-focus-inner{border:0}

html{
	min-height:100%;
}

body{
  padding:0;
  margin:0;
  overflow-x:hidden;
 background:linear-gradient(to bottom right,#6abaf8,#324b68);
  background-position:fixed;
  background-repeat:no-repeat;
  font-family:arial,sans-serif;
  min-height:100%;
}

body.white{
	background:white;
}


#wrapper{
	width:100%;
	height:100%;
}

.panel{
	margin:0 auto;
	margin-top:80px;
	width:500px;
	
	background-color:rgb(255,255,255);
	border-radius:6px;
	box-shadow:0 0 12px rgba(0,0,0,.5);
	
}

.panel .panel-header{
	text-align:center;
	font-weight:700;
	font-size:32px;
	padding:30px;
	padding-bottom:30px !important;
	position:relative;
	
}

.panel .panel-header {
	color:#555;
	font-weight:400;
	font-size:1.2em;
	text-transform:capitalize;
	font-family:georgia,serif;
	
}

.panel .panel-header img{
	display:block;
	margin:0 auto;
	margin-bottom:20px;
	width:90%;
	max-width:142px;
	height:auto;
	
}

.panel .panel-header .go-back{
	position:absolute;
	top:5px;
	left:5px;
	font-size:13px;
	font-weight:400;
	
	width:108px;
	line-height:17px;
	border-radius:6px;
	cursor:pointer;
}
.panel .panel-header .go-back:hover{
	background-color:#222;
	color:#fff;
}

.panel .panel-header .assistenza{
	position:absolute;
	top:5px;
	right:5px;
	font-size:13px;
	font-weight:400;
	
	width:90px;
	line-height:17px;
	border-radius:6px;
	cursor:pointer;
}
.panel .panel-header .assistenza:hover{
	background-color:#222;
	color:#fff;
}

.panel .panel-content{
	padding:20px 70px 60px 70px;
}

.panel .panel-footer{
	background-color:#fff;
	padding:20px 40px;
	border-radius:6px;
}


.panel .errore{
	padding-bottom:20px;
	font-size:.9em;
	line-height:1.2em;
	margin-top:-15px;
	color:#c00;
	text-align:left;
}

.panel .panel-content .intro{
	padding-bottom:25px;
	font-size:.8em;
	line-height:1.2em;
	text-align:justify;
	margin-top:-15px;
}

.panel .panel-content ul.buttons{
	list-style:none;
	text-align:center;
}

.panel .panel-content ul.buttons li{
	display:inline-block;
	margin:0 16px;
}

.panel .panel-content ul.buttons li img{
	display:block;
	border-radius:50%;
	width:180px;
	height:auto;
	margin-bottom:15px;
}

.panel .panel-content ul.buttons li img:hover{
	box-shadow:0 0 20px rgba(0,0,0,.2);
}


.panel .loading{
	display:none;
	height:70px;
	background-image:url(../images/loading-mini.gif);
	background-repeat:no-repeat;
	background-position:center center;
}

.panel .back{
	text-align:center;
	
}

.panel .back a{
	display:inline-block;
	border-bottom: dotted 1px #339d91;
	
	color:#339d91;
	text-decoration:none;
}

.input{
	display:block;
	
	
}

#recovery-form{
	display:none;
}

.message{
	
	color:#666;
	text-align:center;
	padding-top:20px;
}

.message a{
	text-decoration:none;
	color:#339d91;
	font-weight:bold;
	display:inline-block;
	border-bottom:dotted 1px #339d91;
}

.form .input{
	padding-bottom:20px ;
}

.input input{
	width:calc(100% - 24px);
}

/*** placeholder ***/

.input {
  position: relative;
 
  
  font-size: 16px
}
.input input {
 
  transition: all 1s;
  
}
.input label {
  position: absolute;
  left:0px;
  top: 0;
  font-size:12px;
  font-family:arial;
  line-height:12px;
  transition: all 0.5s;
  overflow: hidden;
  color: #999;
  white-space: nowrap;
  z-index: 1;
  opacity: 0;
  padding-left:12px;
}
.input input:focus + label {
  opacity: 1;
  top: -16px; 
 
}
.input input:focus {
  outline: none;
  border-color: rgba(82, 168, 236, 0.8);
}

/*** fine placeholder ***/

.input button.full-width{
	width:100%;
}

.input .desc{
	display:block;
	color:#999;
	padding:5px 15px 0 15px;
	font-size:.8em;
}

.recovery{
	text-align:center;
	font-size:14px;
	padding-top:10px;
}

.recovery a{
	text-decoration:none;
	color:#580056
}

.recovery a:hover{
	text-decoration:underline;
}

ul.logos{
	list-style:none;
	padding:0;
	margin:0;
}

ul.logos li{
	display:inline-block;
	margin-right:40px;
}

ul.logos li img{
	width:100px;
	height:auto;
	vertical-align:middle;
}

#panel-assistenza{
	position:absolute;
	top:0;
	width:270px;
	right:-270px;
	background-color:#000;
	height:100%;
	color:#fff;
}

#panel-assistenza h2{
	font-size:18px;
	font-weight:700;
	text-align:center;
	padding:10px;
	margin-bottom:5px;
	text-transform:uppercase;
}

#panel-assistenza .close{
	position:absolute;
	top:2px;
	right:2px;
	color:#fff;
	font-size:24px;
	line-height:24px;
	font-weight:400;
	width:24px;
	text-align:center;
	cursor:pointer;
}

.table-container{
	margin:2%;
	width:96%;
}



#main-panel{
	display:none;
}

#main-panel .header {
	text-align:center;
	color:#555;
	font-weight:400;
	font-size:1.2em;
	font-family:georgia,serif;
	position:relative;
}



#logout{
	position:absolute;
	top:10px;
	right:10px;
	cursor:pointer;
	color:#c00;
	font-size:20px;
	width:26px;
	height:26px;
	font-family:arial,sans-serif;
	border:solid 1px #c00;
	border-radius:50%;
	text-align:center;
	line-height:26px;
}

#main-panel .header img{
	display:block;
	margin:0 auto;
	margin-bottom:20px;
	width:80%;
	max-width:400px;
	height:auto;
	
}

.privacy-container{
	margin-bottom:2em;
	color:#666;
}



.privacy{
	font-size:.8em;
	line-height:1.365em;
	color:#666;
	height:7.65em;
	padding:.5em;
	background-color:#f8f8f8;
	overflow-y:scroll;
	margin-bottom:1em;
}

.privacy input{
	display:inline-block;
	vertical-align:middle;
}

.privacy label{
	display:inline-block;
	margin-left:5px;
	vertical-align:middle;
}

@media only screen and ( max-width: 767px ) {
	#logout{
	
		top:2px;
		right:2px;
		
		font-size:20px;
		width:20px;
		height:20px;
		border:none;
		line-height:20px;
	}
}

@media only screen and ( max-width: 1023px ) {
	.panel{
		width:440px;
	}
	.panel .panel-header{
		font-size:28px;
		padding:30px;
		padding-top:40px;
		padding-bottom:20px !important;
	}
	
	.panel .panel-header .assistenza{
		font-size:12px;
		line-height:16px;
		width:80px;
	}
	
	.panel .panel-content{
		padding:20px 70px 40px 70px;
	}
	
	.panel .panel-content ul.buttons li{
	
		margin:0 14px;
		font-size:15px;
	}

	.panel .panel-content ul.buttons li img{
	
		width:160px;
		height:auto;
		margin-bottom:12px;
	}
	
	.panel .panel-footer{
		padding:20px 30px;
	}
	
	ul.logos li{
		margin-right:30px;
	}

	ul.logos li img{
		width:80px;
	}
}

@media only screen and ( max-width: 479px ) {
	
	body,html{
		height:100%;
	}
	
	.panel{
		width:100%;
		height:100%;
		margin-top:0;
		border-radius:0;
		box-shadow:none;
		padding:0;
		
	}
	.panel .panel-header{
		font-size:26px;
		line-height:26px;
		padding:20px;
		padding-top:60px;
	}
	
	.panel .panel-header .assistenza{
		font-size:12px;
		line-height:16px;
		width:80px;
	}
	
	.panel .panel-content{
		padding:20px 60px 40px 60px;
	}
	
	.panel .panel-content ul.buttons li{
		display:block;
		
		width:100%;
		margin:0px;
		margin-bottom:30px;
		font-size:15px;
		text-align:center;
	}

	.panel .panel-content ul.buttons li img{
		display:block;
		width:100px;
		height:auto;
		margin:0 auto 12px auto;
		
	}
	
	.panel .panel-footer{
		margin:0;
		position:absolute;
		bottom:0px;
		width:100%;
		padding:20px 0px;
		border-radius:0;
	}
	
	ul.logos{
		text-align:center;
	}
	
	ul.logos li{
		margin:0 20px;
	}

	ul.logos li img{
		width:auto;
		height:50px;
	}
	
	
	
}

@media only screen and ( max-width: 379px ){
	
	.panel .panel-header {
		font-size:22px;
		padding-top: 40px;
	}
	
	.panel .panel-content{
		padding:20px 30px 40px 30px;
	}
	
	
}

@media only screen and ( max-width: 359px ){
	
	.panel .panel-header {
		
		padding-top: 30px;
	}
	
	.panel .panel-content{
		padding:20px 20px 30px 20px;
	}
	
	.panel .panel-content .intro{
		text-align:left;
	}
	
	.g-recaptcha{
		transform:scale(0.87);-webkit-transform:scale(0.87);transform-origin:0 0;-webkit-transform-origin:0 0;
	}
}

@media only screen and ( max-width: 479px ) and ( max-height: 549px ) {
	.panel .panel-content ul.buttons li{
		display:inline-block;
		
		width:100px;
		margin:0 14px;
		margin-bottom:0px;
		font-size:14px;
		text-align:center;
	}

	.panel .panel-content ul.buttons li img{
		display:block;
		width:100px;
		height:auto;
		margin:0 auto 12px auto;
		
	}
}