/* GESTIONE IMPIANTI START */
body {
	font-family: 'Abel', sans-serif !important;
	font-size: 1.4em !important;
}

#col0 {
	padding: 10px; width: 98%;
	
}

#col1 {
	float: left; width: 49%;	
}
#col2 {
	padding: 10px; float: left; width: 49%;
}
#col3 {
	padding: 10px; float: left; width: 28%;
}

#divMessaggio {
	border: 3px solid;
	width: 100%; 
	padding: 10px; 
	height: auto; 
	display: none;
	background-color: #ffffc0;
	-webkit-box-shadow: 5px 5px 5px 0px rgba(87,86,87,1);
	-moz-box-shadow: 5px 5px 5px 0px rgba(87,86,87,1);
	box-shadow: 5px 5px 5px 0px rgba(87,86,87,1);	
}	


.inputRO {
	readonly: true;
	background-color: #d9d9d9;
	
}

.titolo {
	color: red;
	font-weight: bold;
}


/* Style inputs, select elements and textareas */
input[type="date"]::-webkit-calendar-picker-indicator {
    color: rgba(0, 0, 0, 0);
    opacity: 1;
    display: block;
    background: url(../img/calendar-16.png) no-repeat;
    width: 18px;
    height: 18px;
    border-width: thin;
	cursor: pointer;

}
input[type=date]::-webkit-inner-spin-button,
input[type=date]::-webkit-outer-spin-button,
input[type=date]::-webkit-clear-button {
  -webkit-appearance: none;
}
input[type=text], input[type=number], input[type=email], input[type=date], input[type=tel], input[type=email], input[type=time], select, textarea{
  width: 97%;
  padding: 7px;
  border: 0px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-radius: 4px; 
  box-sizing: border-box;
  resize: vertical;
  background-color: #dfffff;
}

input[type=checkbox] {
    height: 15px;
    width: 15px;
    border: 1px solid #34495E;
    border-radius: 5px;
    cursor: pointer;
	color: #000000;
}

/* Style the label to display next to the inputs */
label {
  padding-top: 5px;
  display: inline-block;
}

/* Style the submit button */
input[type=submit], input[type=button] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

/* Style the container */
.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}

/* Floating column for labels: 25% width */
.col-15 {
  float: left;
  width: 15%;
  margin-top: 6px;
}

/* Floating column for inputs: 75% width */
.col-85 {
  float: left;
  width: 85%;
  margin-top: 6px;
}

.row {
	width: 100 !important;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.column {
  float: left;
  width: 100%;
}

.column0 {
	float: left;
	margin-right: 20px;
}
.column10 {
	float: left;
	  width: 10%;
}
.column25 {
  float: left;
  width: 25%;
}
.column20 {
  float: left;
  width: 20%;
}

.column33 {
  float: left;
  width: 33%;
}
.column50 {
  float: left;
  width: 50%;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}


/* ORDINE */
		
		.ingDiv {
			float: left; display:none; margin-top: 10px; margin-right: 10px; padding: 5px; 
			border: 1px solid #c0c0c0; border-radius:3px;
			background-color: #ffffff;
			width: 99%;
		}
		.ingDiv A { text-decoration: none}
		.ingDiv:hover  { background-color: #d7cfcf}
		
		.btnMinus, .btnMinus:hover { background-color: #e44c4c; border-color: #e44c4c; border-radius: 3px; }
		.orderEmpty { margin:5px; color: red }
		.infoCondizioni { color: #c0c000 }
		.btn-primary { background-color: #d8261c; width: 50%; padding: 20px; !important}
		.btn-block { width: 100%; }
}
		.orderError { color: #ff0000 }
		.tipoOnline { color: #197319; } 

		.fa-shopping-cart, .fa-cart-plus, .fa-times-circle-o, .fa-trash, .fa-print, .fa-info, .fa-check {
			cursor: pointer;
			cursor: hand;
		}	
		.center{
			width: 150px;
			margin: 40px auto;
		}
		H3 {
			width:30%; float: left;
		}
		#status {
			float: left;
		}
		#logo { height: 98px; float: left; margin-left: 10px; margin-right: 10px;}
		.mobDiv {
			display: block;
			position: absolute; 
			top: 0px; 
			width: 100%;
			height: 100px;
			padding-right: 10px;
			background-color: #c2d6fe;
			color: #395386;
			border: 1px solid #c2d6fe;

		}	
		.mobDiv A, .mobDiv A:active, .mobDiv  A:hover {
			color: #fe8500;
		}		
		.footer {
			background-color: #d8261c !important;
			border: 2px solid #d8261c !important;	
			border-radius: 10px 10px !important;	
			margin: 10px !important;
			margin-top: 10px !important;
			padding: 30px !important;
			height: auto;
			width: 98% !important;
			color: #ffffff;
			-webkit-box-shadow: 3px 3px 3px 0px rgba(26,22,5,0.32) !important;
			-moz-box-shadow: 3px 3px 3px 0px rgba(26,22,5,0.32) !important;
			box-shadow: 3px 3px 3px 0px rgba(26,22,5,0.32) !important;
		}
		.footer A, .footer A:active, .footer  A:hover {
			color: #80ffff;
		}		
		
		#topOrder { padding: 0 10px 10px 10px; }
		
		#totale { font-weight: bold; background-color: #ff0000; color: #ffffff; border: 1px solid #ff0000; border-radius: 5px; padding: 5px;}
		
		.pannello {
			background-color: #ffffff!important;
			padding: 0px;
			width: 99%;
			border: 2px solid #1066cb;
			border-radius: 20px 20px;	
			text-align: center;
			height: 400px;
			-webkit-box-shadow: 5px 5px 5px 0px rgba(26,22,5,0.32);
			-moz-box-shadow: 5px 5px 5px 0px rgba(26,22,5,0.32);
			box-shadow: 5px 5px 5px 0px rgba(26,22,5,0.32);	
		}
		.bottone {
			height: 100px;
			width: 250px;
			border-radius: 20px;
			text-decoration: none;
			display: inline-block;	
			background-color: #d8261c !important;
			color: #ffffff !important;
		}
			
		.riga20 {
			width: 33% !important;
			display: inline-block;
			float: left;
		}
		
		
		
		/* table, tr, td, tfoot, tbtable.dataTable.no-footer { border: none !important; } */
		/* #myTableMenu tr:hover  { background-color: transparent !important; } */
		
		table.dataTable th  { background-color:  #d8261c; color: #ffffff !important;}
		table.dataTable th A {color: #ffffff;}
		table.tableMain { width: 98% !important; }	
		.sorting_1 {background-color: #ffffff !important;}
		
			table.dataTable tbody tr.odd , .odd {
				font-weight: bold !important;
				padding: 5px !important;
				margin: 5px !important;
				background-color: #ffffff !important;
				color: black !important;
			} 
			table.dataTable tbody tr.even , .even{
				font-weight: bold !important;
				padding: 5px !important;
				margin: 5px !important;
				background-color: #ffffff !important;
				color: black !important;
			}

			table {
				border: 1px solid;
			}
			tr, table.dataTable tbody tr {
					
			}
			th {
				padding: 5px 10px 5px 10px;
				text-align: left;
				font-weight: bold;
				padding: 5px;
				margin: 5px;
				background-color: #c0c0c0;
				color: black;


			}
			td {
				padding: 5px 10px 5px 10px;
				text-align: left;font-weight: bold;
				padding: 5px;
				margin: 5px;

			}
			table.dataTable tbody td.testoCentro , .testoCentro {
				text-align: center !important;
			}		
					
		.jconfirm-cell .container { background-color: transparent !important; }		
		
		A {color: #1066cb}
		A:hover, A:active, A:visited {color: #1066cb}
		
		.btn-number { width: 20px; height; 20px; padding: 2px; }
		.input-number { width: 30px !important; height: 26px !important; font-size: 0.8em !important}
		
		.btn1 {
		  background-color: #d8261c;

    border: 1px solid;
    border-radius: 10px;		  
		  color: white;
		  padding: 12px 16px;
		  font-size: 16px;
		  cursor: pointer;
		}

		/* Darker background on mouse-over */
		.btn1:hover {
		  background-color: #286090;
		}		
		.btn:hover {
		  background-color: #286090;
		}	

			
		.black_overlay{
			display: none;
			position: absolute;
			top: 0%;
			left: 0%;
			width: 100%;
			height: 100%;
			background-color: black;
			z-index:1001;
			-moz-opacity: 0.8;
			opacity:.80;
			filter: alpha(opacity=80);
		}
		.white_content {
			display: none;
			position: absolute;
			top: 5%;
			left: 25%;
			width: 50%;
			height: 93%;
			padding: 5px;
			border: 5px solid #c0c0c0;
			background-color: white;
			z-index:1002;
			overflow: auto;
		}		
 		.white_content_menu {
			display: none;
			position: absolute;
			top: 5%;
			left: 5%;
			width: 90%;
			height: 93%;
			padding: 5px;
			border: 5px solid #c0c0c0;
			background-color: white;
			z-index:1002;
			overflow: auto;
		}


/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
	
	.footer { width: 94% !important; }
	.navbar { width: 94% !important; }
	
	.col-15, .col-85, input[type=submit] , input[type=button]  {
	width: 100%;
	margin-top: 10px;
	}
	.col-15, .col-85, input[type=text], input[type=number], input[type=email], input[type=date], input[type=tel], input[type=email], input[type=time], select, textarea  {
	width: 100%;
	}
	
	#col1 {
		width: 100%;	
	}
	#col2 {
		width: 100%;
	}
	#col3 {
		width: 100%;
	}

	.column, .column0, .column10, .column25, .column20, .column33, .column50 {
	width: 100%;
	}  

	.pannello, .promo {
	width: 100% !important;
	}  

	
	.headLeft {
		width: 95% !important;
	}

	.headRight {
		width: 95% !important;
		margin-top: 20px !important;
	}
  
	 .white_content {
		display: none;
		position: absolute;
		top: 5%;
		left: 5%;
		width: 90%;
		height: 90%;
		padding: 5px;
		border: 5px solid #c0c0c0;
		background-color: white;
		z-index:1002;
		overflow: auto;
	}	
	H3 {
		width:99%; float: left;
	}
	#status {
		width:99%;
		float: left;
		margin-bottom: 10px;
	}			
	.bottone { width: 95%; }
	.riga20  {
		width: 95% !important;
		float: left;
		padding-bottom: 5px;
	}			
	.pannello {	height: 600px; }  
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 1024px) {
	.col-15, .col-85, input[type=submit] , input[type=button]  {
	width: 100%;
	margin-top: 10px;
	}
	.col-15, .col-85, input[type=text], input[type=number], input[type=email], input[type=date], input[type=tel], input[type=email], select, textarea  {
	width: 95%;
	}
	
	.pannello, .promo {
	width: 100% !important;
	}  
	
	
	#col1 {
		width: 100%;	
	}
	#col2 {
		width: 100%;
	}
	#col3 {
		width: 100%;
	}

	.column, .column0, .column10, .column25, .column20, .column33, .column50 {
	width: 100%;
	}  
		  
	.headLeft {
		width: 95% !important;
	}

	.headRight {
		width: 95% !important;
		margin-top: 20px !important;
	}
  
	 .white_content {
		display: none;
		position: absolute;
		top: 5%;
		left: 5%;
		width: 90%;
		height: 90%;
		padding: 5px;
		border: 5px solid #c0c0c0;
		background-color: white;
		z-index:1002;
		overflow: auto;
	}	
	H3 {
		width:99%; float: left;
	}
	#status {
		width:99%;
		float: left;
		margin-bottom: 10px;
	}			
	.bottone { width: 95%; }
	.riga20  {
		width: 95% !important;
		float: left;
		padding-bottom: 5px;
	}			
	.pannello {	height: 600px; }
  
}