* {
	padding: 0;
	margin: 0;
}

/** {
	transition:
		margin .3s,
		width .3s,
		height .3s,
		max-height .3s,
		top .3s,
		left .3s,
		right .3s,
		bottom .3s,
		padding .3s,
		opacity .3s;
}*/

html {
	width: 100%;
	height: 100%;
	transition: all 0;
}

body {
	font: 200 15px 'helvetica', 'arial', sans-serif;
	color: #444;
	background: #F2F4F6;
}

p, ul, ol, dl, table, blockquote {
	margin-top: 1em;
	line-height: 1.5em;
}

hr {
	height: 0;
	border: 0;
	border-top: 1px #DDD solid;
	margin: 40px 0;
}

code {
	display: inline-block;
	font: 1em/20px 'lucida console', monospace;
	background: #ECE;
	color: #707 !important;
	padding: 0 7px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

pre {
	font-family: 'ms gothic', monospace;
	line-height: 1.5em;
}

	pre.bill {
		width: 20em;
		margin: 1em auto 0;
	}

	pre.bill em {
		font-size: 2em;
		font-style: normal;
	}

	pre strong {
		letter-spacing: -.062em;
	}

@media screen and ( max-width: 768px ) {
	hr {
		margin: 20px 0 0;
	}
}

/* ========================================

	: links

======================================== */

a {
	color: #007AFF;
	cursor: pointer;
}

/* ========================================

	: images

======================================== */

.image {
	position: relative;
	display: block;
	width: 100%;
	height: 0;
}

.img-container {
	margin-top: 1em;
	line-height: 1.5em;
}

	.image .inner {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}

.origin {
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	text-align: center;
}

	input.overlay {
		position: absolute;
		left: 0; top: 0;
		width: 100%;
		height: 100%;
		opacity: 0;
	}

.ratio43 {
	display: block;
	height: 0;
	padding-bottom: 67%;
	background-color: #EEE;
	background-size: cover;
	background-position: 50% 50%;
}

.image .nav {
	position: absolute;
	right: 15px;
	top: 15px;
}

	.image .nav .menu {
		display: none;
		top: 40px;
	}

	.image .nav .menu.reveal {
		display: block;
	}

/* ========================================

	: custom

======================================== */

.clickable {
	cursor: pointer;
}

.wide {
	width: 100%;
}

.narrow {
	width: 1px;
}

.no-margin {
	margin-top: 0;
}

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

	.gt-1024 {
		display: none !important;
	}

}

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

	.gt-767 {
		display: none !important;
	}

}

@media screen and ( min-width: 767px ) {

	.lt-767 {
		display: none !important
	}

}/* ========================================

	: iframes

======================================== */

iframe {

}

.iframe-wrapper {
	width: 100%;
	height: 100%;
}

iframe.document {
	border: 0;
	width: 100%;
	height: 99.9%;
}

/* ========================================

	: menus

======================================== */

.menu {
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
	margin: 0;
	list-style: none;
	background: #FFF;
	-moz-box-shadow: 3px 3px 4px #444;
	-webkit-box-shadow: 3px 3px 4px #444;
	box-shadow: 0px 3px 10px rgba(0,0,0,.2);
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444');
	white-space: nowrap;
}

	.menu li {
		position: relative;
		line-height: 40px;
	}

		.menu li.bordered {
			border-top: 1px #DDD solid;
		}

	.menu a,
	.menu span {
		display: block;
		line-height: 40px;
		padding: 0 10px;
		text-decoration: none;
		color: #000;
		cursor: pointer;
	}

	.menu a:hover,
	.menu span:hover {
		background: #007AFF;
		color: #FFF;
	}


/* ========================================

	: headings

======================================== */

.hgroup {
	width: 60%;
	margin: auto;
}

h1,h2,h3 {
	margin-top: 1em;
	font: 200 1em 'helvetica', 'arial', sans-serif;
}

h1 {
	font-size: 3em;
}

h2 {
	font: 300 1em 'montserrat', 'arial', sans-serif;
}

h3 {
	font-size: 22px;
}

@media screen and ( max-width: 1024px ) {
	h1 {
		font-size: 2em;
	}

	h3 {
		font-size: 1.3em;
	}
}

/* ========================================

	: tables

======================================== */

table {
	overflow: auto;
	border-collapse: collapse;
	white-space: nowrap;
	margin: 2em auto 0;
}

	.wrap {
		white-space: normal;
	}

	.table-wrapper {
		overflow-x: scroll;
	}

th, td {
	text-align: left;
	padding: 20px 15px;
}

td.green,
table.dnd tr:hover td.green {
	background: #DFA;
}

td.red,
table.dnd tr:hover td.red {
	background: #EAA;
}

tbody {
	border-bottom: 1px #DDD solid;
}

.notbody{
	border-bottom: 0px !important;
}

th {
	background: #626466;
	color: #FFF;
	font-weight: 400;
}

td {
	border-top: 1px #DDD solid;
	background: #FFF;
}

	td.compact {
		padding-top: 10px;
		padding-bottom: 10px;
	}

		table.dnd tr:hover td {
			background: #F6FAFF;
		}

			table.dnd tr:hover .icon.drag,
			table.dnd tr:hover .icon.remove {
				visibility: visible;
			}

table.dnd .icon.drag,
table.dnd .icon.remove {
	visibility: hidden;
}

td.noborder,
th.noborder {
	border-top: 0;
}

.table {
	width: 100%;
	height: 100%;
	display: table;
	overflow: auto;
}

.tr {
	display: table-row;
}

.td {
	display: table-cell;
	vertical-align: middle;
}

.tall {
	height: 100%;
}

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

	.dense th, .dense td, .dense tr {
		display: block;
	}

	table.dense {
		display: block;
		overflow: hidden;
		border: 0;
	}

	.dense thead {
		float: left;
		display: block;
		border: 0;
	}

	.dense tbody {
		overflow: scroll;
		display: block;
		border: 0;
	}

	.dense tr {
		border-top: 1px #CCC solid;
		display: inline-block;
	}

	.dense td {
		border: 0;
		border-right: 1px #CCC solid;
		border-bottom: 1px #CCC solid;
		padding: 10px;
		height: 24px;
		line-height: 24px;
	}

	.dense th {
		padding: 10px;
		height: 24px;
		line-height: 24px;
		border-bottom: 1px #777 solid;
		vertical-align: middle;
	}

	.dense .narrow {
		width: auto;
	}

	table.dense  .primary {
		font-weight: bold;
	}

}

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

	th, td, tr {
		display: block;
	}

	table {
		display: block;
		overflow: hidden;
		border: 0;
	}

	thead {
		float: left;
		display: block;
	}

	tbody {
		overflow: scroll;
		display: block;
		border: 0;
	}

	tr {
		border-top: 1px #CCC solid;
		display: inline-block;
	}

	td {
		border: 0;
		border-right: 1px #CCC solid;
		border-bottom: 1px #CCC solid;
		padding: 10px;
		height: 24px;
		line-height: 24px;
	}

	th {
		padding: 10px;
		height: 24px;
		line-height: 24px;
		border-bottom: 1px #777 solid;
		vertical-align: middle;
	}

	.narrow {
		width: auto;
	}

	table .primary {
		font-weight: bold;
	}

}

/* ========================================

	: lists

======================================= */

dl {

}

	dt {
		font-weight: bold;
	}

	dd {
		margin-left: 24px;
	}

ul, ol {
	margin-left: 24px;
}

.nav {
	margin: 0;
	list-style: none;
}

.checklist {
	list-style: none;
	margin-left: 0;
}

	.checklist li {
		display: block;
		margin: 10px 0 0 24px;
		line-height: 1em;
	}

.checklist.tall {
	height: 200px;
	overflow-y: scroll;
	border: 1px #DDD solid;
	padding: 10px;
}

/* ========================================

	: pagination

======================================= */

.pagination {
	text-align: center;
	overflow: hidden;
	margin-top: 20px;
}

.pagination .icon {
	margin: 0 10px;
}

/* ========================================

	: buttons

======================================= */

.button-group {
	display: block;
	margin-top: 40px;
}

.button {
	overflow: hidden;
	display: inline-block;
	background: #4CA;
	color: #FFF;
	text-decoration: none;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	font: 300 1em/40px 'montserrat', 'arial', sans-serif;
	vertical-align: middle;
	border: 0;
	white-space: nowrap;
}

		.button.wide .label {
			display: block;
				text-align: center;
				float: none;
		}

	.button .icon {
		display: block;
		height: 40px;
		line-height: 40px;
		padding: 0 20px;
		float: left;
		background-color: rgba(0,0,0,.2);
	}

	.button.disabled {
		opacity: .5;
	}

	.button .label {
		display: block;
		height: 40px;
		line-height: 40px;
		padding: 0 20px;
		float: left;
	}

.button.secondary {
	background: #C44;
	color: #FFF;
}

.button.tertiary {
	background: #999;
	color: #C44;
}

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

	table .button,
	table .button .label {
		height: 24px;
		line-height: 24px;
		-webkit-border-radius: 12px;
		-moz-border-radius: 12px;
		border-radius: 12px;
	}

		table .button .label {
			padding: 0 12px;
		}

}

/* ========================================

	: icons

======================================== */

#navicon {
	position: fixed;
	z-index: 2;
	display: block;
	width: 50px;
	height: 50px;
	background: #000;
}

	#navicon span {
		position: absolute;
		left: 15px;
		top: 15px;
		display: block;
		width: 20px;
		height: 2px;
		background: #FFF;
	}

	#navicon .s2 {
		top: 24px;
	}

	#navicon .s3 {
		top: 33px;
	}

.icon {
	display: inline-block;
	height: 24px;
	padding-left: 24px;
	vertical-align: middle;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	text-indent: -9999px;
	text-decoration: none;
	line-height: 24px;
	white-space: nowrap;
}

	.icon.add {
		background-image: url('../images/icon-add.png');
		color: #4CA;
	}

	.icon.check {
		background-image: url('../images/icon-check.png');
	}

	.icon.collapse {
		background-image: url('../images/icon-collapse.png');
		color: #424446;
	}

		.icon.collapse.labeled {
			text-indent: 0;
			padding-left: 24px;
		}

	.icon.circled-plus {
		background-image: url('../images/icon-circled-plus.png');
	}

	.icon.delete {
		background-image: url('../images/icon-delete.png');
		color: #CCC;
	}

	.icon.delete-black {
		background-image: url('../images/icon-delete-black.png');
		color: #CCC;
	}

	.icon.download {
		background-image: url('../images/icon-download.png');
	}

	.icon.drag {
		background-image: url('../images/icon-drag.png');
		color: #ACE;
		cursor: move;
	}

	.icon.drag-vertical {
		background-image: url('../images/icon-drag-vertical.png');
		color: #ACE;
		cursor: ns-resize;
	}

	.icon.edit {
		background-image: url('../images/icon-edit.png');
	}
	.icon.batch_release {
		background-image: url('../images/icon_batch_release.png');
	}
	.icon.batch_shelves {
		background-image: url('../images/icon_batch_shelves.png');
	}
	.icon.export {
		background-image: url('../images/icon_export.png');
	}
	.icon.expand {
		background-image: url('../images/icon-expand.png');
		color: #424446;
	}

		.icon.expand.labeled {
			text-indent: 0;
			padding-left: 24px;
		}

	.icon.error {
		background-image: url('../images/icon-error.png');
	}

	.icon.help {
		background-image: url('../images/icon-help.png');
		color: #007AFF;
	}

	.icon.location {
		background-image: url('../images/icon-location.png');
		background-position: 50% 4px;
	}

	.icon.prev {
		background: #4CA url('../images/icon-laquo.png') 47% 50% no-repeat;
		height: 30px;
		line-height: 30px;
		padding-left: 30px;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
	}

	.icon.progress.none {
		background-image: url('../images/icon-progress-none.png');
	}

	.icon.progress.partial {
		background-image: url('../images/icon-progress-partial.png');
	}

	.icon.progress.done {
		background-image: url('../images/icon-progress-done.png');
	}

	.icon.progress.verified {
		background-image: url('../images/icon-verified.png');
	}

	.icon.next {
		background: #4CA url('../images/icon-raquo.png') 53% 50% no-repeat;
		height: 30px;
		line-height: 30px;
		padding-left: 30px;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
	}

		.icon.next.disabled,
		.icon.prev.disabled {
			background-color: #CCC;
		}

	.icon.overflow {
		height: 40px;
		line-height: 40px;
		padding-left: 40px;
		background-image: url('../images/icon-overflow-white.png');
		background-color: rgba(0,0,0,.7);
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444')";
		filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444');
	}

		.icon.overflow.alt {
			background-image: url('../images/icon-overflow-dark.png');
			background-color: #FFF;
			-webkit-border-radius: 0;
			-moz-border-radius: 0;
			border-radius: 0;
			-webkit-border-top-left-radius: 4px;
			-webkit-border-top-right-radius: 4px;
			-moz-border-radius-topleft: 4px;
			-moz-border-radius-topright: 4px;
			border-top-left-radius: 4px;
			border-top-right-radius: 4px;
			-moz-box-shadow: 3px 3px 4px #444;
			-webkit-box-shadow: 3px 3px 4px #444;
			box-shadow: 0px 3px 10px rgba(0,0,0,.2);
			-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444')";
			filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444');
		}

	.icon.qr {
		background-image: url('../images/icon-qr.png');
		color: #007AFF;
	}

	.icon.remove {
		background-image: url('../images/icon-remove.png');
		color: #FF3A2D;
	}
	.icon.new {
		background-image: url('../images/new-food.png');
		color: #FF3A2D;
	}
.icon.labeled {
	padding-left: 30px;
	text-indent: 0;
	background-position: 0 50%;
}

/* ========================================

	: layout

======================================== */

.wrapper {
	overflow: hidden;
	/*max-width: 1200px;*/
	margin: auto;
}

.left {
	float: left;
}

.right {
	float: right;
}

.align-right {
	text-align: right;
}

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

.clear {
	display: block;
	clear: both;
}

/* ========================================

	: cols

======================================== */


.cols {
	overflow: hidden;
	margin-left: -4%;
}

.col.custom {
	float: left;
	margin-left: 4%;
}

.col12 {
	float: left;
	margin-left: 4%;
	width: 46%;
}

.col15 {
	float: left;
	margin-left: 4%;
	width: 16%;
}

.col25 {
	float: left;
	margin-left: 4%;
	width: 36%;
}

.col14 {
	float: left;
	margin-left: 4%;
	width: 21%;
}

@media screen and ( max-width: 980px ) {
	.cols {
		margin-left: 0;
	}

		.col, .col.custom {
			float: none;
			margin-left: 0;
			width: 100%;
		}

	.col12 {
		float: none;
		margin-left: 0;
		width: 100%;
	}
}

/* ========================================

	: panel

======================================== */

.hbar {
	background: #323436;
	padding: 30px 40px;
	color: #FFF;
}

	.hbar h2 {
		margin-top: 0;
	}

.panel {
	padding: 20px 40px 40px;
	background: #FFF;
}

.panel .row {
	overflow: hidden;
	margin-top: 20px;
}

.panel .col.label {
	float: left;
	width:100px;
	padding-top: 8px;
	color: #000;
}

	.panel .upload .col.label {
		width: 48.5%;
	}

.panel .col.input {
	width: 450px;
	float: left;
	padding-left: 30px;
}

	.panel .upload .col.input {
		width: 48.5%;
		padding-left: 3%;
	}

	.panel .col.input input.text,
	.panel .col.input textarea {
		width: 100%;
	}

		input.text.small,
		select.small,
		.panel .col.input input.text.small,
		.panel .col.input select.small {
			width: auto;
		}

	.panel .col.input select {
		width: 100%;
	}

.panel .col.input.wide {
	/*width: 72%;*/
	width:450px;
}

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

	.panel .row {
		margin-top: 0;
	}

	.panel .col.input,
	.panel .col.label,
	.panel .col.input.wide {
		display: block;
		width: 100%;
		margin-top: 10px;
	}

	.panel .col.input {
		width: 48%;
		padding: 0 2% 0 0;
	}

}

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

	.panel .col.input {
		width: 100%;
		padding: 0;
	}

	.hbar {
		padding: 30px 20px;
	}

	.panel {
		padding: 20px 20px 40px;
	}


}


/* ========================================

	: dialog

======================================== */

.dialog .main {
	z-index: 9;
	position: fixed;
	left: 50%;
	top: 100%;
	width: 980px;
	height: 80%;
	margin: 0 0 0 -490px;
	background: #FFF;
	display: table;
}

	.dialog .closer {
		position: absolute;
		right: 15px;
		top: 15px;
		height: 50px;
		padding-left: 50px;
		background: url('../images/icon-close.png') no-repeat 50% 50%;
		text-indent: -9999px;
	}

	.dialog .main .hbar,
	.dialog .main .toolbar {
		display: table-cell;
	}

	.dialog .main .panel {
		/*height: 100%;*/
		overflow-y: scroll;
	}

	.dialog .main.reveal {
		top: 10%;
	}

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

	.dialog .main {
		width: 768px;
		margin: 0 0 0 -384px;
	}

}

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

	.dialog .main {
		width: 80%;
		margin-left: 0;
		left: 10%;
	}

}

/* ========================================

	: form

======================================= */

[disabled] {
	background: #F2F4F6 !important;
	color: #A2A4A6 !important;
}

label {
	cursor: pointer;
}

input, button, select, textarea, option {
	font: 300 1em 'helvetica', 'arial', sans-serif;
	outline: none;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #FFF;
}

input:focus,
select:focus,
textarea:focus {
	border-color: #4CA !important;
}

input.text {
	padding: 10px;
	border: 1px #DDD solid;
}

	.checklist input.text {
		padding: 5px;
		margin-top: -5px;
	}

	table input.text {
		padding: 5px;
	}

.addremove {
	display: table;
	table-layout: fixed;
	width: 100%;
	height: 300px;
	margin-top: 1em;
}

	.select-wrapper {
		display: block;
		padding: 10px;
		border: 1px #DDD solid;
		height: 100%;
	}

	.addremove .container {
		display: table-row;
	}

	.addremove .col {
		position: relative;
		display: table-cell;
		vertical-align: bottom;
	}

	.addremove .col.choices {
		width: 50%;
		padding-top: 40px;
	}

		.addremove .col.choices .select-wrapper {
			border-top: 0;
		}

	.addremove .col.selected {
		width: 50%;
	}

		.addremove .col.selected select {
			height: 100%;
		}

	.addremove select[multiple] {
		background: 0;
		padding: 0;
		border: 0;
		height: 100%;
	}

	.addremove .col.controls {
		width: 120px;
		padding: 0 20px;
		vertical-align: middle;
	}

		.addremove .col.controls .button,
		.addremove .col.controls .button span {
			display: block;
			text-align: center;
			float: none;
		}

			.addremove .col.controls .button {
				margin: 20px 0;
			}

	.addremove input.text {
		width: 100%;
		margin-top: -40px;
	}

select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	padding: 10px 40px 10px 10px;
	background: #FFF url('../images/icon-daquo.png') no-repeat 100% 50%;
	border: 1px #DDD solid;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	width: 100%;
}

	select[multiple] {
		background: 0;
		padding: 0;
		border: 0;
		overflow-y: scroll;
	}

	.select-wrapper {
		padding: 10px;
		border: 1px #DDD solid;
	}

textarea {
	height: 120px;
	border: 1px #DDD solid;
	resize: none;
	line-height: 1.5em;
	padding: 10px;
}

fieldset {
	padding: 0 20px 20px;
	border: 1px #DDD solid;
	margin-top: 20px;
}

legend {
	background: #FFF;
	padding: 0 5px;
}

.footnote,
.helptext {
	clear: both;
	overflow: hidden;
	white-space: normal;
}

	.panel .footnote {
		margin: 0 0 0 130px;
	}

	.footnote *,
	.helptext * {
		font-size: .9em;
		line-height: 1.4em;
		color: #777;
	}

.checklist label,
label.checlkbox {
	color: #666;
}

label.checkbox {
	display: block;
	margin: 10px 0 0 24px;
	line-height: 24px;
}

	table label.checkbox {
		margin-top: 0;
	}

	.checklist input.checkbox,
	label.checkbox input.checkbox {
		display: block;
		float: left;
		margin: -2px 0 0 -22px;
	}

		label.checkbox input.checkbox {
			/*margin-top: 5px;*/
			margin-top: 2px
		}

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

	.panel .footnote {
		margin: 0;
	}

}

/* ========================================

	: notice

======================================== */

.notice {
	display: block;
	padding: 10px 10px 10px 40px;
	background: #EFC url('../images/icon-success.png') no-repeat 10px 11px;
	border: 1px #DEC solid;
	color: #8C4;
	line-height: 1.4em;
	font-size: .9em;
}

	.notice.error {
		background: #FFFADD url('../images/icon-error.png') no-repeat 10px 11px;
		padding: 10px 10px 10px 40px;
		border-color: #EDC;
		color: #DB8;
	}

/* ========================================

	: sidebar

======================================== */

/*#sidebar{
}*/

	#sidebar .overlay {
		top: 0;
		right: -100%;
	}

	#sidebar .overlay.reveal {
		right: 0;
	}

#sidebar .main {
	position: fixed;
	z-index: 9;
	width: 320px;
	height: 100%;
	background: #323436;
	color: #FFF;
	overflow-y: scroll;
}

	#sidebar a {
		color: #FFF;
		text-decoration: none;
	}

#sidebar .header {
	text-align: center;
	overflow: hidden;
	padding:20px;
}

#sidebar.restaurant .header .banner {
	height: 200px;
	background-size: cover;
	-webkit-filter: blur(10px);
	-moz-filter: blur(10px);
	-o-filter: blur(10px);
	-ms-filter: blur(10px);
	filter: blur(10px);
	overflow: hidden;
}

#dp-restaurant-div {
	background-size: cover;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	position: relative;
}

	#sidebar.restaurant .header .location {
		line-height: 24px;
		color: #AAA;
		font-size: 14px;
		text-align: left;
	}

.r-status {
	display: inline-block;
	background: #000;
	background-repeat: no-repeat;
	background-position: 100% 50%;
	padding: 0 10px 0 5px;
	line-height: 24px;
	height: 24px;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	font-size: .8em;
	text-transform: uppercase;
	color: #FFF;
	text-decoration: none;
}

	.r-status.editable {
		background-image: url('../images/icon-daquo.png');
		padding-right: 26px;
	}

	.r-status.inactive,
	#sidebar .r-status.inactive {
		color: #888;
		background: #DDD;
	}

	.r-status .indicator {
		display: inline-block;
		width: 10px;
		height: 10px;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
		margin-right: 3px;
		vertical-align: 0;
	}

		.r-status.active .indicator {
			background: #0F0;
		}

		.r-status.inactive .indicator {
			width: 6px;
			height: 6px;
			border: 2px #AAA solid;
		}

		.r-status.pending .indicator {
			background: #E60;
		}

#sidebar .nav {
	list-style: none;
	border-top: 1px #444 solid;
/*	border-bottom: 1px #444 solid;*/
}

	#sidebar .nav li {
		line-height: 60px;
	}

	#sidebar .nav a {
		display: block;
		padding: 0 30px;
	}

		#sidebar .nav a:hover {
			background: #424446;
		}

		#sidebar .nav .active a {
			background: #F2F4F6;
			color: #444;
		}

#sidebar .closer {
	position: absolute;
	right: 0;
	top: 0;
	height: 50px;
	padding-left: 50px;
	background: rgba(0,0,0,.2) url('../images/icon-close.png') no-repeat 50% 50%;
	text-indent: -9999px;
}

@media screen and ( min-width: 1200px ) {
	#sidebar .closer {
		display: none;
	}
}

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

	#sidebar .main {
		left: 0;
		width: 250px;
	}

	#sidebar .main.reveal {
		left: 0;
	}

}

/* ========================================

	: content

======================================== */

#content {
	margin-left: 320px;
}

	body.no-sidebar #content {
		margin-left: 0;
	}

	#content .wrapper {
		margin: auto;
		width: auto;
		/*max-width: 980px;*/
		width:100%;

	}

		#content .wrapper.wide {
			max-width: none;
		}

		#content .wrapper.medium {
			max-width: 1400px;
		}

#content .header {
	position: relative;
	min-height: 90px;
	background: #FFF;
}

	#content .header .container {
		overflow: hidden;
		padding: 25px 50px 0;
		height:65px;
	}

	#content .header .back {
		position: absolute;
		left: 40px;
		top: 0;
		height: 50px;
		line-height: 50px;
	}

	#content-nav {
		padding: 20px 0;
		white-space: nowrap;
		position: absolute;
		z-index: 122;
		right: 40px;
		top: 0;
		background: #FFF;
		margin-top: 0;
		list-style: none;
	}

	#content-nav .dp {
		display: inline-block;
		width: 30px;
		height: 30px;
		vertical-align: middle;
		margin-right: 5px;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
	}

		#content-nav li {
			position: relative;
			float: left;
			height: 50px;
			line-height: 50px;
			border-right: 1px #DDD solid;
		}

			#content-nav .has-child {
				padding-right: 30px;
				background: url('../images/icon-daquo.png') no-repeat 100% 50%;
			}

			#content-nav li.bordered {
				border-top: 1px #DDD solid;
			}

			#content-nav li a {
				display: block;
				padding: 0 10px 0 10px;
				text-decoration: none;
				color: #444;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

				#content-nav li a:hover {
					background-color: #007AFF;
					color: #FFF;
				}
#content-nav>li:first-child>a:hover {
	background-color: #fff;
	color: #FFF;
}

		#content-nav ul {
			width: 100%;
			z-index: 9;
			position: relative;
			right: 0;
			display: none;
			background: #FFF;
			list-style: none;
			margin: 0;
			-moz-box-shadow: 3px 3px 4px #444;
			-webkit-box-shadow: 3px 3px 4px #444;
			box-shadow: 0px 3px 10px rgba(0,0,0,.2);
			-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444')";
			filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444');
		}

		#content-nav ul li {
			border: 0;
			float: none;
		}
		#content-nav>li{width:120px;}
		#content-nav>li>ul{overflow: hidden;}
		#content-nav>li:first-child{width: 50px;}
		#content-nav>li:last-child{border-right: none;min-width:150px;width:auto;max-width:300px;}
		#content-nav>li:hover ul {
			display: block;
		}

	#content .header .title {
		float: left;
		margin-left:60px;
	}

		#content .header .title h1 {
			display: inline;
			font-size: 32px;
		}

		#content .header .title .button {
			vertical-align: 0;
			margin-left: 10px;
		}

	#content .header .frm-search {
		float: right;
		margin-right:445px;
	}

		#content .header .frm-search input.txt-search {
			padding-left: 36px;
			width: 240px;
			background: url('../images/icon-search.png') no-repeat 10px 50%;
		}

	#content .header .wizard {
		width: 100%;
		height: 50px;
		display: table;
		margin-top: 20px;
		border-left: 1px #DDD solid;
		overflow: hidden;
		white-space: nowrap;
	}

		#content .header .wizard ol {
			display: table-row;
			list-style: none;
		}

		#content .header .wizard li {
			display: table-cell;
			height: 50px;
			line-height: 50px;
			padding: 0 10px;
			border-right: 1px #DDD solid;
		}

			#content .header .wizard .current {
				background: #F2F4F6;
				color: #000;
			}

		#content .header .wizard a {
			display: block;
			height: 50px;
			line-height: 50px;
			padding: 0 10px;
			color: #777;
			text-decoration: none;
		}

			#content .header .wizard b {
				display: inline-block;
				background: #DDD;
				width: 30px;
				height: 30px;
				-webkit-border-radius: 100%;
				-moz-border-radius: 100%;
				border-radius: 100%;
				margin: 0 10px 0 0;
				line-height: 30px;
				color: #AAA;
				vertical-align: middle;
				text-align: center;
				font-weight: 300;
			}

			#content .header .wizard .done a {
				color: #000;
			}
				#content .header .wizard .done b {
					background: #777;
					color: #FFF;
				}

			#content .header .wizard .current a {
				color: #000;
			}
				#content .header .wizard .current b {
					background: #4CA;
					color: #FFF;
				}

			#content .header .wizard .done a:hover,
			#content .header .wizard .done a:hover {
				text-decoration: underline;
			}

#content .main {
	padding: 33px 50px 100px;
}

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

	#dp-restaurant-div {
		margin: -4rem 0 0 3.5rem;
	}

	#content {
		margin-left: 250px;
	}

	#content .header {
		height: auto;
		min-height: 0;
	}

		#content .header .container {
			padding: 60px 50px 0;
		}

	#content .header .title {
		float: none;
	}

		#content .header .title .button {
			vertical-align: -7px;
		}

	#content .header .frm-search {
		float: none;
		margin: 15px 0 20px;
	}

		#content .header .frm-search input.txt-search {
			width: 100%;
		}

	#content .header .wizard {
		border: 0;
	}

	#content .header .wizard li {
		display: none;
	}

		#content .header .wizard li.current {
			display: block;
			border: 0;
		}

}

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

	#content-nav {
		right: 20px;
	}

	#content .header .container {
		padding: 60px 20px 0;
	}

	#content .header .title h1 {
		display: block;
		margin-bottom: 10px;
	}

	#content .header .title .button {
		vertical-align: 0;
		margin: 0 10px 0 0;
	}

	#content .main {
		padding: 20px;
	}
}

/* ========================================

	: subcontent

======================================== */

#subcontent {
	padding-left: 380px;
}

/* ========================================

	: subsidebar

======================================== */

#subsidebar {
	float: left;
	width: 320px;
	margin-left: -380px;
}

#subsidebar .panel {
	padding: 0;
}

#subsidebar .nav {
	list-style: none;
}

	#subsidebar ul[dnd-list],
	#subsidebar ul[dnd-list] > li {
		position: relative;
	}

	#subsidebar ul[dnd-list]{
		min-height: 60px;
	}

	#subsidebar ul[dnd-list] .dndDraggingSource {
		display: none;
	}

	#subsidebar ul[dnd-list] .dndPlaceholder {
		display: block;
		background-color: #FFFFFF;
		min-height: 60px;
		border: 2px #007AFF dashed;
	}
	#subsidebar ul[dnd-list] .dndPlaceholder.menuDrag {
		margin-bottom: -64px;
		z-index:99;
		background-color: transparent;
		height: 54px;
	}

	#subsidebar .nav li {
		line-height: 60px;
		position: relative;
		padding: 0 0 0 15px;
	}

		#subsidebar .nav.dnd li {
			padding: 0 0 0 60px;
		}

		#subsidebar .terminal {
			position: relative;
			padding: 0 0 0 15px;
			background: #FFF;
			line-height: 60px;
		}

		#subsidebar .nav li.active,
		#subsidebar .nav li:hover.active {
			background: url('../images/bg-subsidebar-active.png') 0 0;
			margin-right: -30px;
		}

			#subsidebar .nav li.active .inner {
				border-top: 0;
				height:60px;
			}

		#subsidebar .nav li.active + li .inner {
			border-top: 0;
			height:60px;
		}

		#subsidebar .nav li .inner,
		#subsidebar .terminal {
			border-top: 1px #DDD solid;
			height: 60px;
		}

		#subsidebar .nav li .icon.remove {
			position: absolute;
			right: 10px;
			top: 0;
			padding-left: 40px;
			height: 60px;
			visibility: hidden;
		}

			#subsidebar .nav li.active .icon.remove {
				right: 40px;
			}

		#subsidebar .nav li .icon.edit {
			position: absolute;
			right: 50px;
			top: 0;
			padding-left: 40px;
			height: 60px;
			visibility: hidden;
		}

			#subsidebar .nav li.active .icon.edit {
				right: 80px;
			}


		#subsidebar .nav li .icon.drag-vertical {
			position: absolute;
			left: 0;
			top: 0;
			height: 60px;
			padding-left: 60px;
			visibility: hidden;
		}

		#subsidebar .icon.check {
			position: absolute;
			right: 10px;
			top: 0;
			padding-left: 40px;
			height: 60px;
		}

		#subsidebar .icon.delete {
			position: absolute;
			right: 50px;
			top: 0;
			padding-left: 40px;
			height: 60px;
		}

			#subsidebar .nav li:hover .icon {
				visibility: visible;
			}
	#subsidebar .nav a.label {
		display: block;
		padding: 0 0;
		color: #323436;
		text-decoration: none;
		width: 220px;
	}

		#subsidebar .nav li:hover,
		#subsidebar .nav li.hover {
			background: #F6FAFF;
		}

		#subsidebar .terminal:hover {
			background: none;
		}

	#subsidebar .terminal .icon.add.labeled {
		padding-left: 45px;
		background-position: 7 px 0;
	}

.table-wrapper tbody[dnd-list],
.table-wrapper tbody[dnd-list] > tr{
	position: relative;
}

.table-wrapper tbody[dnd-list] .dndDraggingSource {
	display:none;
}

.table-wrapper tbody[dnd-list] .dndPlaceholder td .placeholderInner{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height: 60px;
}



/* ========================================

	: subnav

======================================== */

#subnav {
	background: #FFF;
	height: 60px;
	border-top: 1px #DDD solid;
}

	#subnav .nav {
		display: inline-block;
		padding-left: 50px;
	}

	#subnav li {
		display: inline-block;
	}

	#subnav li a {
		line-height: 54px;
		display: inline-block;
		color: #000;
		text-decoration: none;
		padding: 0 10px;
		border-top: 3px transparent solid;
		border-bottom: 3px transparent solid;
		margin-right: 20px;
	}

		#subnav li.current a,
		#subnav li.current a:hover {
			border-bottom-color: #C44;
		}

		#subnav li a:hover {
			border-bottom-color: #DDD;
		}


/* ========================================

	: toolbar

======================================== */

.toolbar {
	width: 100%;
	background: #FFF;
	border-top: 1px #DDD solid;
}

	.toolbar .left .button {
		margin-right: 10px;
	}

	.toolbar .right .button {
		margin-left: 10px;
	}

	#content .toolbar {
		position: fixed;
		bottom: 0;
		left: 0;
	}

	.toolbar .container {
		padding: 20px;
		overflow: hidden;
	}

		#content .toolbar .container {
			padding: 20px 20px 20px 340px;
		}

	body.no-sidebar #content .toolbar .container {
		padding: 20px;
	}

.save-state {
	display: inline-block;
	font-size: .9em;
	color: #AAA;
}

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

	#content .toolbar .container {
		padding-left: 20px;
	}

}

/* ========================================

	: overlay

======================================== */

.overlay {
	z-index: 9;
	position: fixed;
	top: -100%;
	right: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.7);
	cursor: pointer;
}

.overlay.reveal {
	top: 0;
}

/* ========================================

	: TEMPLATE - LOGIN

======================================== */

body.login {
	height: 100%;
	background: #FFF url('../images/bg-login.png') no-repeat 100% 50%;
	background-size: cover;
	transition: all 0;
}

body.login .inner {
	display: table;
	width: 100%;
	max-width: 1200px;
	height: 100%;
	margin: auto;
}

body.login .wrapper {
	display: table-row;
}

body.login .header {
	display: table-cell;
	width: 50%;
	text-align: center;
	vertical-align: middle;
	background: url('../images/divider-login.png') no-repeat 100% 50%;
}

body.login .main {
	display: table-cell;
	width: 50%;
	vertical-align: middle;
}

	body.login .main .container {
		padding: 0 20%;
	}

	body.login .main input.text {
		width: 100%;
	}

body.login .row {
	margin-top: 20px;
}

body.login .button-group {
	margin-top: 40px;
}

body.login .footer {
	margin-top: 30px;
}

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

	body.login .inner,
	body.login .wrapper,
	body.login .header,
	body.login .main {
		display: block;
		width: auto;
	}

	body.login .header {
		background: none;
	}

	body.login .wrapper {
		position: absolute;
		top: 50%;
		width: 100%;
		text-align: center;
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
	}

	body.login .main .container {
		padding: 0;
		width: 300px;
		margin: auto;
	}

	body.login .main {
		padding-top: 40px;
	}

}

/*
/* ========================================

	: TEMPLATE - LOGIN

======================================== */
.alert {
	text-shadow: 0 1px 0 rgba(255, 255, 255, .2);
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
	padding: 15px;
	background: transparent;
	margin-bottom: 20px;
	border: 1px solid transparent;
	border-radius: 4px;
}

.alert-success {
	background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
	background-image:      -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc));
	background-image:         linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
	background-repeat: repeat-x;
	color: #3c763d;
	background-color: #dff0d8;
	border-color: #d6e9c6;
}
.alert-info {
	background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
	background-image:      -o-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#b9def0));
	background-image:         linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
	background-repeat: repeat-x;
	color: #31708f;
	background-color: #d9edf7;
	border-color: #bce8f1;
}
.alert-warning {
	background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
	background-image:      -o-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#f8efc0));
	background-image:         linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
	background-repeat: repeat-x;
	color: #8a6d3b;
	background-color: #fcf8e3;
	border-color: #faebcc;
}
.alert-danger {
	background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
	background-image:      -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3));
	background-image:         linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);
	background-repeat: repeat-x;
	color: #a94442;
	background-color: #f2dede;
	border-color: #ebccd1;
}

/* ========================================

	: Inputs - styling

======================================== */


input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
input[type="number"]{-moz-appearance:textfield;}



/* ========================================

	: TEMPLATE - MODALS (Pop-ups)

======================================== */

.modal-open {
	overflow: hidden;
}
.modal {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1050;
	display: none;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
	outline: 0;
}
.modal.fade .modal-dialog {
	-webkit-transition: -webkit-transform .3s ease-out;
	-o-transition:      -o-transform .3s ease-out;
	transition:         transform .3s ease-out;
	-webkit-transform: translate(0, -25%);
	-ms-transform: translate(0, -25%);
	-o-transform: translate(0, -25%);
	transform: translate(0, -25%);
}
.modal.in .modal-dialog {
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0);
}
.modal-open .modal {
	overflow-x: hidden;
	overflow-y: auto;
}
.modal-dialog {
	position: relative;
	width: auto;
	margin: 10px;
}
.modal-content {
	position: relative;
	background-color: #fff;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	border: 1px solid #999;
	border: 1px solid rgba(0, 0, 0, .2);
	border-radius: 6px;
	height: 100%;
	outline: 0;
	-webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
	box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}
.modal-backdrop {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1040;
	background-color: #000;
}
.modal-backdrop.fade {
	filter: alpha(opacity=0);
	opacity: 0;
}
.modal-backdrop.in {
	filter: alpha(opacity=50);
	opacity: .5;
}

.modal .main .hbar,
.modal .main .toolbar {
	display: table-cell;
}

.hbar > .closer{
	position: absolute;
	right: 15px;
	 top: 15px;
	 height: 50px;
	 padding-left: 50px;
	 background: url('../images/icon-close.png') no-repeat 50% 50%;
	text-indent: -9999px;
}

.modal-header {
	min-height: 16.42857143px;
	padding: 15px;
	border-bottom: 1px solid #e5e5e5;
}
.modal-header .closer {
	margin-top: -2px;
}
.modal-title {
	margin: 0;
	line-height: 1.42857143;
}
.modal-body {
	position: relative;
	padding: 15px;
}
.modal-footer {
	padding: 15px;
	text-align: right;
	border-top: 1px solid #e5e5e5;
}
.modal-footer .btn + .btn {
	margin-bottom: 0;
	margin-left: 5px;
}
.modal-footer .btn-group .btn + .btn {
	margin-left: -1px;
}
.modal-footer .btn-block + .btn-block {
	margin-left: 0;
}
.modal-scrollbar-measure {
	position: absolute;
	top: -9999px;
	width: 50px;
	height: 50px;
	overflow: scroll;
}

/*@media screen and (max-width:1200px){*/
	/*.modal-dialog{*/
		/*width:768px;*/
		/*marigin:0 0 0 -384px;*/
	/*}*/
/*}*/

/*@media screen and ( max-width: 800px){*/
	/**/
/*}*/
@media (min-width: 768px) {
	.modal-dialog {
		width: 600px;
		margin: 30px auto;
	}
	.modal-content {
		-webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
		box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
	}
	.modal-sm {
		width: 300px;
	}
}
@media (min-width: 992px) {
	.modal-lg {
		width: 900px;
	}
}

input[type=checkbox],input[type=radio]{
	width: 20px;
	height: 20px;
}

.horizontal>input,.horizontal>textarea{
    display: inline-block;
}

.horizontal{
	width:72% !important;
}

.horizontal>div{
	margin-bottom: 5px;
}

.horizontal .text-num{
	width:80px !important;
	vertical-align: top;
}

.horizontal textarea{
	width: 150px !important;
	height: 80px;
}
@media only screen and (min-width: 320px) and (max-width: 767px){
    #content-nav{right:0;border-left: none;width:100%;}
    #content-nav li{width:39%;}
    #content-nav li:first-child{width: 20%}
    #content-nav li:last-child{border-right: none;}
    #content-nav ul{width: 100%;}
    *{font-size:14px;}
}
.side-header-left{float: left;}
.side-header-right{float: right;width:170px;padding-left: 10px;padding-top:20px;}
.side-header-right>h3{margin-top:0;font-size:18px;text-align: left;height:50px;overflow: hidden;text-overflow: ellipsis;}

::-webkit-input-placeholder {color:#ccc;}
　　:-moz-placeholder {color:#ccc;}
　　::-moz-placeholder {color:#ccc;}
　　:-ms-input-placeholder {color:#ccc;}
/*tab标签栏有关*/
.main-coolum{overflow: hidden;}
.main-coolum>div{float: left;height:60px;background-color:#323335;color:#fff;line-height: 60px;text-align: center;cursor: pointer;position: relative;}
.main-coolum>div:last-child{overflow: hidden;}
.main-coolum>div.active{background-color: #595758;}
.main-coolum>div>.point-directive{position: absolute;left: 100%;border-left: 20px #595758 solid;border-right: 20px transparent solid;border-top: 30px transparent solid;border-bottom: 30px transparent solid;top:0;z-index: 111;visibility: hidden;}
.main-coolum>div>.point-directive-cover{position: absolute;left: 100%;border-left: 19px #323335 solid;border-right: 19px transparent solid;border-top: 29px transparent solid;border-bottom: 29px transparent solid;top:1px;z-index: 112;visibility: hidden;}
.main-coolum>div.active>.point-directive{border-left: 20px #595758 solid;visibility: hidden;}
.main-coolum>div.active>.point-directive-cover{display: none;visibility: hidden;}


input[type='date']::-webkit-inner-spin-button {
    display:none;
  }

/* 图片选中 */
.photo-select {
	display: block;
	width: 25px;
	height: 25px;
	position: absolute;
	right: 5px;
	top: 5px;
	background: url('../images/icon-check.png') no-repeat 100% 100%;
}
