*{
	font-family: sans-serif;
	font-size: 10pt;
	border-collapse: collapse;
	box-sizing: border-box;
}
a{
	text-decoration:none;
}
a:hover{
	text-decoration:underline;
}
body{
	margin:0;
}
fieldset{
	column-count: 2;
}
fieldset.blockIndentWithLabel{
    margin: 0 0 10px 150px;
}
fieldset + fieldset{
	width:calc(50% - 4px);
	float:left;
	margin:2px;
}
.columnGrouped {
	display: inline-block;
	vertical-align: top;
}
h1 {
	display:none;
}
h2{
	font-size:15pt;
}
	th > h2 {
	    margin-top: 25px;
	}
h3{
	font-size:12pt;
}
img{
	max-width:90%;
}
#wrapper {
	width: 100%;
	max-width:1000px;
	margin: 0 auto;
}
header#topHeader {
  display: block;
  min-height: 160px;
  width: 100%;
  position:relative;
}
	header#topHeader img.logo{
		width: 65%;
		height: auto;
		position: absolute;
		right: 15px;
		top: 5px;
		max-width: 250px;
	}
	header#topHeader #feedBack{
		position:fixed;
		width:200px;
		border:1px solid gray;
		left:calc(50% - 100px);
		top:10%;
		background:#efefef;
		padding:10px;
		display:none;
		text-align:center;
		z-index:15
	}
	header#topHeader nav#mainNav {
		background: #5dac21;
		padding: 5px 19px 5px 8px;
		position: absolute;
		text-align:left;
		bottom: 0;
		width: 100%;
		height:50px;
		line-height:3em;
	}
		header#topHeader nav#mainNav{
			z-index:10;
		}
					header#topHeader nav#mainNav ul{
						list-style: none;
						padding-left: 0;
						margin-top: 0;
						margin-bottom: 0;
					}
						header#topHeader nav#mainNav ul li{
							width: auto;
							float: left;
							padding: 0 8px 0;
							white-space: nowrap;
						}
							header#topHeader nav#mainNav ul li:hover ul{
								display:block;
								position:absolute;
								background:#fff;
								min-width:150px;
								overflow:hidden;
								border:1px solid #d5d5d5;
							}
								header#topHeader nav#mainNav ul li:hover ul li{
									float:none;
									padding:0 15px 0 20px;
								}
									header#topHeader nav#mainNav ul li:hover ul li a{
										color:#000;
									}

							header#topHeader nav#mainNav ul li ul{
								display:none;
								background:white;
							}
					header#topHeader nav#mainNav a{
						color:#fff;
					}





	header#topHeader h2 {
		font-size: 15pt;
		line-height:20px;
		position: absolute;
		top: 72px;
		text-align: left;
		width: 100%;
		color: #2775a8;
		margin: 0;
		left: 15px;
	}
input[type='password'],input[type='email'],input[type='text'],input[type='tel'],
	input[type='number'],input[type='date'],select,textarea {
	height:30px;
	font-size:1em;
}
input[type="button"] {
    margin: 5px;
    background: #5dac21;
    color: white;
    padding: 10px;
    line-height: 1em;
    font-size: 1em;
    border-radius: 5px;
    border: none;
}
	input[type="button"]:hover {
		background:gray;
	}
	input[type="button"]:active {
		background:#2775a8;
	}
label {
    display: inline-block;
    width: 150px;
    font-size: 11pt;
    vertical-align: top;
}
	label.small {
		border: 1px solid lightgray;
		background: #e1e1e1;
		border-radius: 3px;
		font-size: 9px;
		line-height: 9px;
		vertical-align: top !important;
		white-space: nowrap;
		overflow: hidden;
	}
	label + select, label + input {
	    width: calc(100% - 160px);
	}
		label + input[type='checkbox']{
			width:initial;
		}
nav.buttons a {
    display: inline-block;
    background: lightgray;
    padding: 3px 10px;
	margin: 2px 2px 0 0;
    font-size: 9pt;
    border-radius: 3px;
    color: black;
}
	nav.buttons a.selected {
	    background: #549bc7;
	}
p{
	font-size:1em;
}
	p.note {
	    background: #efefef;
	    padding: 11px;
	    text-align: left;
	    font-weight: normal;
		font-size:.95em;
	}
	p.warning {
		font-style: italic;
		background: #ffff79;
		padding: 20px;
		border: 1px dotted;
	}
section{
	float: left;
	border: 2px ridge;
	padding: 20px;
	margin: 0 5px 10px 0;
	width:calc(50% - 5px);
}
table{
	table-layout: fixed;
	width:100%;
}
	table tr.disabled {
		background: #595959 !important;
		color: #808080 !important;
	}
	table tr.disabled td input{
		background:transparent;
		color:#808080;
	}
	table.zebra tr:nth-child(even) {
		background-color: #dbdbdb;
	}
		table.zebra tr:first-of-type{
			background:#fff;
			top:0;
		}
			table tr th{
				position:sticky;
			}
	table tr th, table tr td{
		text-align:left;
		vertical-align:middle;
		padding:10px 5px;
	}
		table th.sticky {
			position: sticky;
			top: 0;
			z-index: 5;
			background-color: white;
		}
		table.ingredients tr th, table.ingredients tr td{
			padding: 2px 1px;
		}
	table tr td input{
		padding:0;
	}
label + textarea {
    width: calc(100% - 160px);
	min-height:40px;
}
div#ingredientsList{
	float:right;
	width:calc(100% - 160px);
	height:200px;
	overflow-y:scroll;
}
small{
	font-size:.6em;
}
span.alert {
    background: red;
    color: white;
    padding: 1px 7px;
    border-radius: 5px;
    border: 1px solid white;
    display: inline-block;
    line-height: 1em;
}
#content{
	padding:10px;
	margin:5px;
}
	#content #banner{
		width: calc(100% + 30px);
		height: 250px;
		position: relative;
		left: -15px;
		top: -15px;
	}
		#content #banner div#banner1{
			background: url('/images/banners/food-banner-01.jpg');
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
			animation: crossfade 20s infinite;
		}
		#content #banner div#banner2{
			background: url('/images/banners/food-banner-02.jpg');
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
		}
		#content #banner div{
			position:absolute;
			width:100%;
			height:100%;
		}
		@keyframes crossfade{
			0% {
				opacity:1;
			}
			40%{
				opacity:1;
			}
			50%{
				opacity:0;
			}
			90%{
				opacity:0;
			}
			100%{
				opacity:1;
			}
		}

#dialogueWrapper {
	  display:none;
	  background: #000000ab;
	  position: fixed;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  text-align: center;
}
	#dialogueWrapper #dialogue {
		position: relative;
		overflow:hidden;
		padding:20px;
		text-align: left;
		min-width: 375px;
		max-width:65%;
		height: 200px;
		background: #fff;
		margin: 0 auto;
		margin-top: 18%;
		border-radius: 5px;
		box-shadow: 0 2px 8px #0000006e;
	}
		#dialogueWrapper #dialogue img{
			position: absolute;
			right:20px;
		}
		#dialogueWrapper #dialogue h2 {
			font-size:20px;
			text-align: left;
			margin: 20px 0px 35px 0;
		}
		#dialogueWrapper #dialogue h3{
			font-size: 17pt;
			margin: -25px 0 -5px 0;
		}
		#dialogueWrapper #dialogue input[type="button"]{
		    float: right;
		    margin: 20px 0 0 10px;
		}
#search fieldset label {
	display: inline;
	white-space: nowrap;
}
#search fieldset {
	width: 100%;
}
.tabMenu{
	color:white;
	position:relative;
	border-bottom: 0px solid gray;
	height: 2em;
}
	.tabMenu a{
		background:#E5FAFF;
		position:relative;
		top:0;
		height:2em;
		line-height: 1.3em;
		display:inline-block;
		border:1px solid gray;
		border-bottom:1px solid gray;
		padding:3px 7px;
		margin:0 1px;
		border-radius:3px 3px 0 0;
		text-decoration:none;
		min-width:30px;
	}
		.tabMenu a::before{
			content:"";
			display:inline-block;
			border-bottom:1px solid gray;
			width:7px;
			position:absolute;
			bottom:-1px;
			left:-7px;
		}
		.tabMenu a::after{
			content:"";
			display:inline-block;
			border-bottom:1px solid gray;
			width:7px;
			position:absolute;
			bottom:-1px;
			right:-7px;
		}
		.tabMenu a:hover{
			background:#efefef;
		}
		.tabMenu a.selected{
			top: 0px;
			border-bottom:0;
			background:white;
			height: 2em;
		}
			.tabMenu a.selected::after,.tabMenu a.selected::before{
				border:0;
			}
	p.tabMenu::before {
		content: "";
		border-bottom: 1px solid gray;
		position: absolute;
		width: 100%;
		display: block;
		height: 5px;
		top:1.5em;
	}
/*.tabPane{
	border:1px solid gray;
	border-radius:3px;
	padding:0 10px;
	margin:10px 0;
}*/
/*------*/
@media all and (max-width :750px){
	#wrapper{
		overflow-x:hidden;
	}
	header#topHeader{
		text-align:center;
	}
	header#topHeader img.logo{
		position:relative;
		margin:0 auto;
		right:initial;
	}
	div#ingredientsList{
		width:100%;
	}
	fieldset{
		margin:4px 0;
	}
		fieldset.blockIndentWithLabel{
			margin:4px 0;
		}
		fieldset + fieldset{
			width:100%;
		}
	header#topHeader h2 {
		text-align: center;
		top:85px;
		left:0;
	}
	input[type='password'],input[type='email'],input[type='text'],input[type='tel'],
		input[type='number'],input[type='date'],select,textarea {
		width: 100% !important;
		height: 50px;
		font-size:1.5em;
		padding:0 3px;
	}
	label {
		width: 100%;
		font-style: italic;
		color: gray;
		font-size: .95em;
	}
	section{
		width:100%;
	}
}