.noselect{-webkit-user-select: none; /* Chrome/Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+ */

/* Rules below not implemented in browsers yet */
-o-user-select: none;
user-select: none;}

.buy{
	background-color:darkorange;
	height:40px;
	font-size:20px;
	line-height:40px;
}

.buy a {
	color:white;
}

.buy a:hover{
	color:white;
}
body{
	margin:0px;
	  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	  background-color:#33230d;
	background-image:url('../img/02.webp');
	background-repeat:no-repeat;
	color:white;
	background-size:cover;
	
}

p,h1,h2,h3,h4,h5{
	color:white;
}

.modal h3, .modal p, #tmp{
	color:black;
}

nav a{
	color:white;
}

.removeitem{
	float:right;
	margin-right:5px;
	color:red;
	cursor:pointer;
}



nav{
		width:100%;
		text-align:center;
		color:white;
		background-color:#006666;
	}
	
	nav h1{
		line-height:45px;
		font-size:30px;
		padding:0px;
		margin:0px;
		font-weight:500;
		text-align:left;
		margin-left:10px;
	}
	nav h2{
		line-height:20px;
		font-size:14px;
		padding:0px;
		margin:0px;
		font-weight:400;
				text-align:left;
		margin-left:10px;
	}

	#tab_container{
		width:100%;
		height:70px;
		box-shadow:0px 2px 2px grey;
		margin-bottom:10px;
				cursor:pointer;
				background-color:white;
	}
	
	
	.mytab{
		width:33%;
		margin:0px;
		height:70px;
		text-align:center;
		float:left;
		padding:10px 0px 0px 0px;

	}
	
	.tabselected{
		border-bottom:6px solid #006666;
		opacity:1;
	}
	
	.tabunselected{
		border-bottom:6px solid #white;
		opacity:0.7;
	}
	
	.tab-icon{
		max-width:30px;
	}
	
	.mytab p{
		line-height:16px;
		font-size:14px;
		font-weight:bold;
		color:#006666;
		margin:0px;
	}
	
		.butmid{
		width:calc(33% - 4px);
		display:inline-block;
		padding-top:20px;
	}
	
		.progress {

	margin-bottom:0px;
	width:100%;
	
}

#tachiprogress{
    bottom: 0;
}

.progress-bar{
	background-color:#006666;
}

		#final_riavvia{
		background-color:#006666;
	}
	
		#final_cambia{
		background-color:darkorange;
	}
	
	#perwrapper{
		padding:10px 10px 0px 10px;
	}
	
	#perwrapper h3{
		margin:5px;
	}
	.iconerr{
		color:red;
		width:16px;
		height:16px;
		margin-right:10px;
		float:left;
	}
	
	.parolaerrata{
		color:red;
		line-height:16px;
		font-size:12px;
	}
	
	.lowbuttons{
		margin-bottom:15px;
	}
	@media screen and (min-width:401px) and (max-width:767px){
		

		.left{
			width:50%;
			display:inline-block;
		}
		.right{
			width:50%;
			display:inline-block;
		}
		.right select, .right input{
			line-height:20px;
			font-size:20px;
			width:100%;
			background-color:white;
			height:46px;
		}
		.riga{
			width:100%;
			padding:16px 5%;
			font-size:20px;
		}
			.lowbuttons{
		margin-top:15px;
		width:100%;
		text-align:center;
	}
	
			#salva{
		margin:0px auto;
		padding:5px;
			height:92px;
			line-height:92px;
			font-size:26px;
		text-align:center;
		background-color:darkorange;
		color:white;
		max-width:180px;
		font-weight:bold;
		box-shadow:0px 0px 2px black;
		cursor:pointer;
	}
	
		#avvia{
			margin:0px auto;
			padding:5px;
			height:92px;
			line-height:92px;
			font-size:26px;
			text-align:center;
			background-color:#006666;
			color:white;
			max-width:180px;
			font-weight:bold;
			box-shadow:0px 0px 2px black;
			cursor:pointer;
		}
		
		.rightsubtab{
			display:none;
		}
		
			.parolaerrata{
		color:red;
		line-height:20px;
		font-size:20px;
	}
	
			#tachistoscopio_parola_wrapper{
		height:550px;
		line-height:520px;
	}
	
			#listapersonalizzata_wrapper{
			width:100%;
			padding:20px 5%;
			font-size:16px;
		}
		
	}
	
	@media screen and (min-width:768px){
		
		#mini_schermo_parola{
			width:90%;
			margin:0px auto;
			border-radius:5px;
			border:1px solid black;
		}
		
		#listapersonalizzata_wrapper{
			width:100%;
			padding:20px 5%;
			font-size:16px;
		}
				#mini_schermo{
			width:150px;
			height:150px;
			border:1px solid black;
			border-radius:5px;
			margin:0px auto 20px auto;
			line-height:150px;
			font-size:16px;
			background-color:white;
		}
		
		#feedback{
			margin-top:150px;
		}
		
		#box_riscritta{
			width:100%;
			text-align:center;
		}
		#riscritta{
			width:80%;
			border:0px solid black;
			border-bottom:1px solid black;
			margin:30px auto;
			text-align:center;
		}
		
		#riscrivi{
			margin-top:150px;
		}
		.leftsubtab{
			width:70%;
			float:left;
			border-right:1px solid lightgrey;
		}
		.rightsubtab{
			width:30%;
			float:right;
		}
		.riga{
			width:100%;
			padding:16px 5%;
			font-size:20px;
		}
		.left{
			width:30%;
			display:inline-block;
		}
		.right{
			width:70%;
			display:inline-block;
		}
		.right select, .right input{
			line-height:20px;
			font-size:20px;
			width:100%;
			background-color:white;
			height:46px;
		}
		
					.lowbuttons{
		margin-top:15px;
		width:100%;
		text-align:center;
	}
	
			#salva{
		margin:0px auto 0px auto;
		padding:5px;
			height:62px;
			line-height:62px;
			font-size:20px;
		text-align:center;
		background-color:darkorange;
		color:white;
		max-width:280px;
		font-weight:bold;
		box-shadow:0px 0px 2px black;
		cursor:pointer;
	}
	
			#stampa{
		margin:0px 5px 0px auto;
		padding:5px;
			height:62px;
			line-height:62px;
			font-size:20px;
		text-align:center;
		background-color:darkred;
		color:white;
		max-width:280px;
		font-weight:bold;
		box-shadow:0px 0px 2px black;
		cursor:pointer;
	}	
	
		#avvia{
			margin:0px auto 0px 5px;
			padding:5px;
			height:62px;
			line-height:62px;
			font-size:20px;
			text-align:center;
			background-color:#006666;
			color:white;
			max-width:280px;
			font-weight:bold;
			box-shadow:0px 0px 2px black;
			cursor:pointer;
		}
		

					.parolaerrata{
		color:red;
		line-height:20px;
		font-size:20px;
	}
	
		#tachistoscopio_parola_wrapper{
		height:550px;
		line-height:520px;
	}

	
	}
	
		#listaesistente{
			color:black;
		}
		
			#droputenti{
		color:black;
		min-width:300px;
		font-size:20px;
		margin-top:5px;
		margin-right:20px;
	}
	
	.puls{
		margin-right:5px;
		border-radius:5px;
		display:inline-block; cursor: pointer;padding:10px; 
		min-width:45px;
	}
	
@media screen and (max-width:401px) {
	
			#box_riscritta{
			width:100%;
			text-align:center;
		}
			#riscritta{
			width:80%;
			border:0px solid black;
			border-bottom:1px solid black;
			margin:30px auto;
			text-align:center;
		}

				#droputenti{
		color:black;
		min-width:150px;
		font-size:18px;
		margin-top:5px;
	}
	
	#titoli{
	width:100%;
}
		.puls{
		border-radius:100%;
	}
			.rightsubtab{
			display:none;
		}
		
	.lowbuttons{
		margin-top:15px;
		width:100%;
		text-align:center;
	}

	
	#final_cambia h3{
		font-size:14px;
		margin:10px auto
	}

	#final_riavvia h3{
		font-size:14px;
		margin:10px auto
	}
	
		#final_riavvia{
		background-color:#006666;
	}
	
		#final_cambia{
		background-color:darkorange;
	}
	
	#perwrapper{
		padding:10px 10px 0px 10px;
	}
	
	#perwrapper h3{
		margin:5px;
	}
	.iconerr{
		color:red;
		width:16px;
		height:16px;
		margin-right:10px;
		float:left;
	}
	
	.parolaerrata{
		color:red;
		line-height:16px;
		font-size:12px;
	}
	#riepilogo_wrapper{
		width:100%;
	}
	#riepilogo_wrapper h2{
		text-align:center;
	}
	
	
	#right-column{
		display:none;
	}
	
	#tachistoscopio_wrapper{
		width:100%;

	}
	
	#right-button-wrapper{
		width:100%;
		height:30px;
		color:black;
		text-align:right;
	}
	
	#right-button-wrapper h2{
		margin:0px;
		padding:0px;
		color:red;
	}
	
	#tachistoscopio{
		width:100%;

	}
	

	#tachistoscopio_parola_wrapper{
		height:350px;
		line-height:320px;
	}


	


	
	.riga{
		width:100%;
		padding:12px;
		border-bottom:1px solid lightgrey;
	}
	
	.riga .left{
		width:50%;
		display:inline-block;
		font-size:16px;
		line-height:46px;
	}
	
	.riga .right{
		width:calc(50% - 5px);
		display:inline-block;
	}
	
	.riga .bigleft{
		width:70%;
		display:inline-block;
		font-size:16px;
	}
	
	.riga .smallright{
		width:calc(30% - 5px);
		display:inline-block;
	}	
	
	.riga .right select, .riga .right input{
		width:100%;
		font-size:16px;
		border:0px solid black;
		border-bottom:1px solid grey;
		height:46px;
		line-height:46px;
		padding:0px 5px;
		border-radius:0px;
		background-color:white;
	}
	
	.riga .right .check{
		width:100%;
		font-size:16px;
		border:0px solid black;
		border-bottom:1px solid grey;
		height:36px;
		line-height:46px;
		padding:0px 5px;
		border-radius:0px;
		background-color:white;		
	}
	
	#salva{
		margin:0px auto;
		padding:5px;
		height:46px;
		line-height:36px;
		font-size:16px;
		text-align:center;
		background-color:darkorange;
		color:white;
		width:100%;
		font-weight:bold;
		box-shadow:0px 0px 2px black;
		cursor:pointer;
	}

	#stampa{
		margin:0px auto;
		padding:5px;
		line-height:36px;
		font-size:16px;
		text-align:center;
		background-color:darkred;
		color:white;
		width:100%;
		font-weight:bold;
		box-shadow:0px 0px 2px black;
		cursor:pointer;
	}
	
	#avvia{
		margin:0px auto;
		padding:5px;
		height:46px;
		line-height:36px;
		font-size:16px;
		text-align:center;
		background-color:#006666;
		color:white;
		width:100%;
		font-weight:bold;
		box-shadow:0px 0px 2px black;
		cursor:pointer;
	}

	.butmid{
		width:100%;
		display:inline-block;
		padding-top:20px;
	}
	
	#listapersonalizzata{
		margin-top:16px;
		width:calc(100% - 4px);
		font-size:16px;
	}

	#listaesistente{
		margin:16px auto;
		width:calc(100% - 4px);
		font-size:16px;
	}
	
	#listapersonalizzata_wrapper{
		padding:16px 16px 10px 16px;
		font-size:16px;
	}
	
	#buttons_container{
		padding-bottom:16px;
	}
	
	#secondotesto{
		font-size:16px;
	}
	
			.rightsubtab{
			display:none;
		}
		
	nav h1{
		text-align:center;
		margin-left:0px;
	}
	nav h2{
		text-align:center;
		margin-left:0px;		
	}
}

nav h3 a {
	font-size:18px;
}

	nav h3 a:hover{
		color:white;
		
	}