/* HTML
----------------------------------------------------------------------------------------------------------------------*/
div {
	box-sizing:border-box;
}


/* Material icons
----------------------------------------------------------------------------------------------------------------------*/
.material-icons {
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 24px;  /* Preferred icon size */
	display: inline-block;
	line-height: 1;
	text-transform: none;
	letter-spacing: normal;
	word-wrap: normal;
	white-space: nowrap;
	direction: ltr;

	/* Support for all WebKit browsers. */
	-webkit-font-smoothing: antialiased;
	/* Support for Safari and Chrome. */
	text-rendering: optimizeLegibility;

	/* Support for Firefox. */
	-moz-osx-font-smoothing: grayscale;

	/* Support for IE. */
	font-feature-settings: 'liga';
}

.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }

/* Rules for using icons as black on a light background. */
.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }

/* Rules for using icons as white on a dark background. */
.material-icons.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }



/* Social Icon Fonts
----------------------------------------------------------------------------------------------------------------------*/
[class^="socicon-"].m:before,
[class*=" socicon-"].m:before {
	font-size:24px;
}

[class^="socicon-"].l:before,
[class*=" socicon-"].l:before {
	font-size:32px;
}

[class^="socicon-"].xl:before,
[class*=" socicon-"].xl:before {
	font-size:48px;
}



/* Horizontal rule base style
----------------------------------------------------------------------------------------------------------------------*/
hr {
	color:#999;
	background-color:#999;
	width:100%;
	height:1px;
	text-align:left;
	margin:0 auto 0 0;
	border:none;
}


/* Container
----------------------------------------------------------------------------------------------------------------------*/
.container {
	position:relative;
	width:100%;
	max-width:1200px;
	margin:30px auto;
}

@media only screen and (max-width: 1260px) {
	.container {
		width:auto;
		margin:30px;
	}
}

.squeeze, .squeeze-60 {
	margin-left:auto;
	margin-right:auto;
}

.squeeze {
	width:80%;
}

.squeeze-60 {
	width:60%;
}

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

	.squeeze {
		width:100%;
	}

	.squeeze-60 {
		width:100%;
	}
}



/* Backgrounds
----------------------------------------------------------------------------------------------------------------------*/
.background-fixed, .background-absolute {
	position:fixed;
	width:100%;
	height:100%;
	top:0;
	left:0;
	bottom:0;
	right:0;
    background: no-repeat center bottom;
    background-size:cover;
}

.background-absolute {
	position:absolute;
}

#order-container .background-absolute {
	background-size:contain;
}


/* Grid basics
----------------------------------------------------------------------------------------------------------------------*/
.grid {
	margin-left:auto;
	margin-right:auto;
}

.grid:after {
	content:"";
	display:table;
	clear:both;
}


/* Grid gaps
----------------------------------------------------------------------------------------------------------------------*/
.grid.gap-1 {
	margin-left:-10px;
	margin-right:-10px;
}
.grid.gap-1 .column {
	padding-left:10px;
	padding-right:10px;
}

.grid.gap-2 {
	margin-left:-20px;
	margin-right:-20px;
}
.grid.gap-2 .column {
	padding-left:20px;
	padding-right:20px;
}

.grid.gap-3 {
	margin-left:-30px;
	margin-right:-30px;
}
.grid.gap-3 .column {
	padding-left:30px;
	padding-right:30px;
}

.grid.gap-4 {
	margin-left:-40px;
	margin-right:-40px;
}
.grid.gap-4 .column {
	padding-left:40px;
	padding-right:40px;
}

.grid.gap-5 {
	margin-left:-50px;
	margin-right:-50px;
}
.grid.gap-5 .column {
	padding-left:50px;
	padding-right:50px;
}


/* Grid column separated through vertical line
----------------------------------------------------------------------------------------------------------------------*/
.grid .column.separated {
	border-right:1px solid #eee;
}

@media only screen and (min-width: 601px) {
	.grid .column.separated-m {
		border-right:1px solid #eee;
	}
}

@media only screen and (min-width: 993px) {
	.grid .column.separated-l {
		border-right:1px solid #eee;
	}
}

@media only screen and (min-width: 1119px) {
	.grid .column.separated-xl {
		border-right:1px solid #eee;
	}
}


/* Grid column
----------------------------------------------------------------------------------------------------------------------*/
.grid .column {
	float:left;
	box-sizing:border-box;
	margin-left:auto;
	left:auto;
	right:auto;
}


/* Grid columns small and up
----------------------------------------------------------------------------------------------------------------------*/
.grid .column.s1 {
	width:8.3333333333%
}

.grid .column.s2 {
	width:16.6666666667%
}

.grid .column.s3 {
	width:25%
}

.grid .column.s4 {
	width:33.3333333333%
}

.grid .column.s5 {
	width:41.6666666667%
}

.grid .column.s6 {
	width:50%
}

.grid .column.s7 {
	width:58.3333333333%
}

.grid .column.s8 {
	width:66.6666666667%
}

.grid .column.s9 {
	width:75%
}

.grid .column.s10 {
	width:83.3333333333%
}

.grid .column.s11 {
	width:91.6666666667%
}

.grid .column.s12 {
	width:100%
}


/* Grid columns medium and up
----------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 601px) {

	.grid .column.m1 {
		width:8.3333333333%
	}

	.grid .column.m2 {
		width:16.6666666667%
	}

	.grid .column.m3 {
		width:25%
	}

	.grid .column.m4 {
		width:33.3333333333%
	}

	.grid .column.m5 {
		width:41.6666666667%
	}

	.grid .column.m6 {
		width:50%
	}

	.grid .column.m7 {
		width:58.3333333333%
	}

	.grid .column.m8 {
		width:66.6666666667%
	}

	.grid .column.m9 {
		width:75%
	}

	.grid .column.m10 {
		width:83.3333333333%
	}

	.grid .column.m11 {
		width:91.6666666667%
	}

	.grid .column.m12 {
		width:100%
	}
}


/* Grid columns large and up
----------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 993px) {

	.grid .column.l1 {
		width:8.3333333333%
	}

	.grid .column.l2 {
		width:16.6666666667%
	}

	.grid .column.l3 {
		width:25%
	}

	.grid .column.l4 {
		width:33.3333333333%
	}

	.grid .column.l5 {
		width:41.6666666667%
	}

	.grid .column.l6 {
		width:50%
	}

	.grid .column.l7 {
		width:58.3333333333%
	}

	.grid .column.l8 {
		width:66.6666666667%
	}

	.grid .column.l9 {
		width:75%
	}

	.grid .column.l10 {
		width:83.3333333333%
	}

	.grid .column.l11 {
		width:91.6666666667%
	}

	.grid .column.l12 {
		width:100%
	}
}


/* Grid columns very large and up
----------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 1119px) {

	.grid .column.xl1 {
		width:8.3333333333%
	}

	.grid .column.xl2 {
		width:16.6666666667%
	}

	.grid .column.xl3 {
		width:25%
	}

	.grid .column.xl4 {
		width:33.3333333333%
	}

	.grid .column.xl5 {
		width:41.6666666667%
	}

	.grid .column.xl6 {
		width:50%
	}

	.grid .column.xl7 {
		width:58.3333333333%
	}

	.grid .column.xl8 {
		width:66.6666666667%
	}

	.grid .column.xl9 {
		width:75%
	}

	.grid .column.xl10 {
		width:83.3333333333%
	}

	.grid .column.xl11 {
		width:91.6666666667%
	}

	.grid .column.xl12 {
		width:100%
	}
}


/* Layout
----------------------------------------------------------------------------------------------------------------------*/
.push-up-0 {
	margin-top:0;
}

.push-down-0 {
	margin-bottom:0;
}

.push-left-0 {
	margin-left:0;
}

.push-right-0 {
	margin-right:0;
}

.push-v-0 {
	margin-top:0;
	margin-bottom:0;
}

.push-h-0 {
	margin-left:0;
	margin-right:0;
}


/* Pseudo table columns
----------------------------------------------------------------------------------------------------------------------*/
.pseudo-table {
	display:table;
	width:100%;
}

.pseudo-table .column {
	display:table-cell;
	vertical-align:top;
	width:auto;
}

.pseudo-table .column.r1 {
	padding-right:10px;
}
.pseudo-table .column.r2 {
	padding-right:20px;
}
.pseudo-table .column.r3 {
	padding-right:30px;
}

.pseudo-table .column.l1 {
	padding-left:10px;
}
.pseudo-table .column.l2 {
	padding-left:20px;
}
.pseudo-table .column.l3 {
	padding-left:30px;
}


/* Fixed / flexible columns
----------------------------------------------------------------------------------------------------------------------*/
.fixed-xs, .fixed-s, .fixed-m, .fixed-l, .fixed-xl, .flexible-xs, .flexible-s, .flexible-m, .flexible-l, .flexible-xl {
	display:inline-block;
	vertical-align:top;
}



.fixed-xs {
	width:20px;
}

.fixed-s {
	width:30px;
}

.fixed-m {
	width:50px;
}

.fixed-l {
	width:80px;
}

.fixed-xl {
	width:200px;
}

.flexible-xs {
	width:calc(100% - 20px);
}

.flexible-s {
	width:calc(100% - 30px);
}

.flexible-m {
	width:calc(100% - 50px);
}

.flexible-l {
	width:calc(100% - 80px);
}

.flexible-xl {
	width:calc(100% - 205px);
}

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

	.fixed-xs.fold-s, .fixed-s.fold-s, .fixed-m.fold-s, .fixed-l.fold-s, .fixed-xl.fold-s,
	.flexible-xs.fold-s, .flexible-s.fold-s, .flexible-m.fold-s, .flexible-l.fold-s, .flexible-xl.fold-s {
		display:block;
		width:auto;
		float:none;
	}
}

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

	.fixed-xs.fold-m, .fixed-s.fold-m, .fixed-m.fold-m, .fixed-l.fold-m, .fixed-xl.fold-m,
	.flexible-xs.fold-m, .flexible-s.fold-m, .flexible-m.fold-m, .flexible-l.fold-m, .flexible-xl.fold-m {
		display:block;
		width:auto;
		float:none;
	}
}

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

	.fixed-xs.fold-l, .fixed-s.fold-l, .fixed-m.fold-l, .fixed-l.fold-l, .fixed-xl.fold-l,
	.flexible-xs.fold-l, .flexible-s.fold-l, .flexible-m.fold-l, .flexible-l.fold-l, .flexible-xl.fold-l {
		display:block;
		width:auto;
		float:none;
	}
}


/* Tables
----------------------------------------------------------------------------------------------------------------------*/
table {
	border-collapse:collapse;
	text-align:left;
	font-size:16px;
	width:100%;
}

table th {
	font-weight:normal;
	padding:10px 8px;
	border-bottom:2px solid #ccc;
}

table td {
	padding:10px 8px;
	border-bottom:1px solid #ddd;
}

table tbody tr:hover td {
	background-color:#f9f9f9;
}



/* tooltip 0.1.0 - 18th Dec 2013 | https://github.com/darsain/tooltip
----------------------------------------------------------------------------------------------------------------------*/
.tooltip {
	position:absolute;
	padding:10px 14px;
	top:10px;
	max-width:200px;
	color:#fff;
	background:#353a40;
	border-radius:6px;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	user-select:none;
	pointer-events:none;
	z-index:9999;
}

/* Arrow styles */
.tooltip:after {
	content:'';
	position:absolute;
	width:10px;
	height:10px;
	margin:-5px;
	background:inherit;
	-webkit-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	transform:rotate(45deg);
}

.tooltip.top:after, .tooltip.top-left:after, .tooltip.top-right:after { bottom:0; }

.tooltip.bottom:after, .tooltip.bottom-left:after, .tooltip.bottom-right:after { top:0; }

.tooltip.top:after, .tooltip.bottom:after { left:50%; }

.tooltip.top-left:after, .tooltip.bottom-left:after { right:15px; }

.tooltip.top-right:after, .tooltip.bottom-right:after { left:15px; }

.tooltip.left:after, .tooltip.left-top:after, .tooltip.left-bottom:after { right:0; }

.tooltip.right:after, .tooltip.right-top:after, .tooltip.right-bottom:after { left:0; }

.tooltip.left:after, .tooltip.right:after { top:50%; }

.tooltip.left-top:after, .tooltip.right-top:after { bottom:15px; }

.tooltip.left-bottom:after, .tooltip.right-bottom:after { top:15px; }

/* Fade */
.tooltip.fade { opacity:0; transition:opacity 200ms ease-out; }

.tooltip.fade.in { opacity:1; transition-duration:100ms; }

/* Slide */
.tooltip.slide {
	opacity:0;
	transition:-webkit-transform 100ms ease-out;
	transition:transform 100ms ease-out;
	transition-property:-webkit-transform, opacity;
	transition-property:transform, opacity;
}

.tooltip.slide.top,
.tooltip.slide.top-left,
.tooltip.slide.top-right {
	-webkit-transform:translateY(15px);
	transform:translateY(15px);
}

.tooltip.slide.bottom,
.tooltip.slide.bottom-left,
.tooltip.slide.bottom-right {
	-webkit-transform:translateY(-15px);
	transform:translateY(-15px);
}

.tooltip.slide.left,
.tooltip.slide.left-top,
.tooltip.slide.left-bottom {
	-webkit-transform:translateX(15px);
	transform:translateX(15px);
}

.tooltip.slide.right,
.tooltip.slide.right-top,
.tooltip.slide.right-bottom {
	-webkit-transform:translateX(-15px);
	transform:translateX(-15px);
}

.tooltip.slide.in {
	opacity:1;
	-webkit-transform:none;
	transform:none;
	transition-duration:100ms;
}

/* Grow */
.tooltip.grow {
	-webkit-transform:scale(0);
	transform:scale(0);
	transition:-webkit-transform 120ms ease-out;
	transition:transform 120ms ease-out;
}

.tooltip.grow.top {
	-webkit-transform:translateY(60%) scale(0);
	transform:translateY(60%) scale(0);
}

.tooltip.grow.top-left {
	-webkit-transform:translateY(60%) translateX(40%) scale(0);
	transform:translateY(60%) translateX(40%) scale(0);
}

.tooltip.grow.top-right {
	-webkit-transform:translateY(60%) translateX(-40%) scale(0);
	transform:translateY(60%) translateX(-40%) scale(0);
}

.tooltip.grow.bottom {
	-webkit-transform:translateY(-60%) scale(0);
	transform:translateY(-60%) scale(0);
}

.tooltip.grow.bottom-left {
	-webkit-transform:translateY(-60%) translateX(40%) scale(0);
	transform:translateY(-60%) translateX(40%) scale(0);
}

.tooltip.grow.bottom-right {
	-webkit-transform:translateY(-60%) translateX(-40%) scale(0);
	transform:translateY(-60%) translateX(-40%) scale(0);
}

.tooltip.grow.left {
	-webkit-transform:translateX(53%) scale(0);
	transform:translateX(53%) scale(0);
}

.tooltip.grow.left-top {
	-webkit-transform:translateX(53%) translateY(40%) scale(0);
	transform:translateX(53%) translateY(40%) scale(0);
}

.tooltip.grow.left-bottom {
	-webkit-transform:translateX(53%) translateY(-40%) scale(0);
	transform:translateX(53%) translateY(-40%) scale(0);
}

.tooltip.grow.right {
	-webkit-transform:translateX(-53%) scale(0);
	transform:translateX(-53%) scale(0);
}

.tooltip.grow.right-top {
	-webkit-transform:translateX(-53%) translateY(40%) scale(0);
	transform:translateX(-53%) translateY(40%) scale(0);
}

.tooltip.grow.right-bottom {
	-webkit-transform:translateX(-53%) translateY(-40%) scale(0);
	transform:translateX(-53%) translateY(-40%) scale(0);
}

.tooltip.grow.in {
	-webkit-transform:none;
	transform:none;
	transition-duration:100ms;
}

/* Types */
.tooltip.light { color:#3a3c47; background:#fff; text-shadow:none; }

.tooltip.success { background:#8dc572; }

.tooltip.warning { background:#ddc12e; }

.tooltip.error { background:#be6464; }







/* System notices and Errors
----------------------------------------------------------------------------------------------------------------------*/
.cake-error,
.cake-debug,
.notice,
p.error,
p.notice {
	display: block;
	clear: both;
	background-repeat: repeat-x;
	margin-bottom: 18px;
	padding: 7px 14px;
	border-radius: 3px;
	box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
}

.cake-debug,
.notice,
p.notice {
	color: #000000;
	background: #ffcc00;
}

.cake-error,
p.error {
	color: #fff;
	background: #C3232D;
}

pre {
	background: none repeat scroll 0 0 #fff;
	margin: 15px 0;
	color: rgba(0, 0 ,0 , 0.74);
	padding:5px;
	border:2px dashed #c7e2f0;
	border-radius:4px;
}

.cake-error .cake-stack-trace {
	margin-top:10px;
}

.cake-stack-trace code {
	background: inherit;
	border:0;
}

.cake-code-dump .code-highlight {
	display: block;
	background-color: #FFC600;
}

.cake-error a,
.cake-error a:hover {
	color:#fff;
	text-decoration: underline;
}