/******************************************************************
Theme Name: Meal Matrix
Description: A Genesis child theme for Camp Sweeney
Author: Darkspire Media
Author URI: http://Darkspire.Media
Version: 1.0
Tags: html, css3, responsive, hb5
Template: genesis
*/

*{outline:0;}

html{
	margin:0;
	padding:0;
}

body{
	margin:0;
	padding:0;
	background-color:#000000;
	font-family: 'Lato', sans-serif;
	font-size:14px;
	font-weight:400;
	color:#1c1c1b;
}

img{border:none;}

ul{padding-left:20px;}

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

.alignnone{float:none;}
.alignleft{float:left;padding:0 20px 10px 0;}
.aligncenter{display:block; margin:0 auto;}
.alignright{float:right; padding:0 0 10px 20px}

.table{display:table; width:100%; height:100%;}
.table .table-cell{display:table-cell; width:100%; vertical-align: middle;}

@media print {
    .pagebreak{page-break-before: always;}
}

.message{
	display: none;
	position: absolute;
	top: calc(50vh - 80px);
	left: calc(50% - 140px);
	z-index: 10000;
	opacity: 0;
	margin: 0;
	padding: 40px;
	width: 220px;
	height: 120px;
	color: #ffffff;
	font-size: 20px;
	text-align: center;
	background-color: #000000;

	-moz-transition-property: opacity;
	-moz-transition-duration: 0.25s;
	-moz-transition-delay: 0.25s;
	-moz-transition-timing-function: linear;
	-webkit-transition-property: opacity;
	-webkit-transition-duration: 0.25s;
	-webkit-transition-delay: 0.25s;
	-webkit-transition-timing-function: linear;
	transition-property: opacity;
	transition-duration: 0.25s;
	transition-delay: 0.25s;
	transition-timing-function: linear;
}

.message.show{
	display: block;
	opacity: 0.8;
}

.message p{
	margin: 0;
}

.controls{
	display: none;
	width: 100%;
	height: 50px;
	font-size: 20px;
	line-height: 1;
	text-align: center;
}

.controls .control-button{
	width: calc(100%/2);
	height: 50px;
	color: #ffffff;
	text-transform: uppercase;
	text-decoration: none;
}

.controls #back-button{
	float: left;
	background-color: #333333;
}

.controls #start-over{
	float: right;
	background-color: #000000;
}

.grid{
	text-align: center;
}

.grid .grid-item{
	float: left;
	font-size: 20px;
	text-decoration: none;
	color: #ffffff;
	text-transform: uppercase;
}

.grid .grid-item.modified{
	color: #000000;

	-moz-box-shadow: inset 0 0 1px 20px rgb(0 0 0 / 30%);
	-webkit-box-shadow: inset 0 0 1px 20px rgb(0 0 0 / 30%);
	box-shadow: inset 0 0 1px 20px rgb(0 0 0 / 30%);
}

.grid .grid-item.items-1{
	width: calc(100% / 1);
	height: calc((100vh / 1) - (50px / 1));
}

.grid .grid-item.items-2{
	width: calc(100% / 2);
	height: calc((100vh / 1) - (50px / 1));
}

.grid .grid-item.items-3{
	width: calc(100% / 3);
	height: calc((100vh / 1) - (50px / 1));
}

@media(max-width: 1023px){
	.grid .grid-item.items-3{
		width: calc(100% / 1);
		height: calc((100vh / 3) - (50px / 3));
	}
}

.grid .grid-item.items-4{
	width: calc(100% / 2);
	height: calc((100vh / 2) - (50px / 2));
}

.grid .grid-item.items-5,
.grid .grid-item.items-6{
	width: calc(100% / 3);
	height: calc((100vh / 2) - (50px / 2));
}

@media(max-width: 1023px){
	.grid .grid-item.items-5,
	.grid .grid-item.items-6{
		width: calc(100% / 2);
		height: calc((100vh / 3) - (50px / 3));
	}
}

.grid .grid-item.items-7,
.grid .grid-item.items-8,
.grid .grid-item.items-9{
	width: calc(100% / 3);
	height: calc((100vh / 3) - (50px / 3));
}

@media(max-width: 1023px){
	.grid .grid-item.items-7,
	.grid .grid-item.items-8,
	.grid .grid-item.items-9{
		width: calc(100% / 2);
		height: calc((100vh / 4) - (50px / 4));
	}
}

.grid .grid-item.items-10{
	width: calc(100% / 5);
	height: calc((100vh / 2) - (50px / 2));
}

.grid .meals{
	color: #ffffff;
}

.grid .camper-info{
	height: 50px;
	color: #ffffff;
	font-size: 20px;
	line-height: 50px;
	text-align: center;
}

.grid .meals .meal .meal-title{
	display: block;
	height: 49px;
	font-size: 30px;
	line-height: 49px;
	border-bottom: 1px solid #000000;
	cursor: pointer;
}

.grid .meals .meal .meal-content{
	overflow: hidden;
	margin: 0 auto;
	height: calc(100vh - 50px - 50px - 50px - 50px - 50px - 50px);
	max-height: 0;
	font-size: 20px;
	text-transform: uppercase;

	-moz-transition: all 0.5s linear;
	-webkit-transition: all 0.5s linear;
	transition: all 0.5s linear;
}

.grid .meals .meal.open .meal-content{
	max-height: calc(100vh - 50px - 50px - 50px - 50px - 50px - 50px);
}

.grid .meals .meal .meal-content .food-choice{
	float: left;
	width: calc(50% - 1px);
	border-bottom: 1px solid #000000;
}

.grid .meals .meal .meal-content .food-choice:nth-child(odd){
	border-right: 1px solid #000000;
}

.grid .meals .meal.food-count-5 .meal-content .food-choice,
.grid .meals .meal.food-count-6 .meal-content .food-choice{
	height: calc(((100vh - 50px - 50px - 50px - 50px - 50px - 50px) / 3) - 1px);
}

.grid .meals .meal.food-count-7 .meal-content .food-choice,
.grid .meals .meal.food-count-8 .meal-content .food-choice{
	height: calc(((100vh - 50px - 50px - 50px - 50px - 50px - 50px) / 4) - 1px);
}

.grid .meals .meal.food-count-9 .meal-content .food-choice,
.grid .meals .meal.food-count-10 .meal-content .food-choice{
	height: calc(((100vh - 50px - 50px - 50px - 50px - 50px - 50px) / 5) - 1px);
}

.grid .meals .meal.food-count-11 .meal-content .food-choice,
.grid .meals .meal.food-count-12 .meal-content .food-choice{
	height: calc(((100vh - 50px - 50px - 50px - 50px - 50px - 50px) / 6) - 1px);
}

.grid .meals .meal.food-count-13 .meal-content .food-choice{
	height: calc(((100vh - 50px - 50px - 50px - 50px - 50px - 50px) / 7) - 1px);
}

.grid .meals .meal .meal-content .food-choice label{
	display: block;
	margin: 0 0 5px;
}

.grid .meals .meal .meal-content .food-choice select{
	width: 90%;
	height: 30px;
	font-size: 16px;
	line-height: 30px;

}

.grid .save-meal{
	display: block;
	width: 100%;
	height: 50px;
	color: #ffffff;
	font-size: 20px;
	line-height: 1;
	text-decoration: none;
	text-transform: uppercase;
}

.page-template-page-kitchen{
	background-color: #ffffff;
	color: #000000;
}

.page-template-page-kitchen .meal-selection{
	padding: 10px;
	text-align: center;
	font-size: 20px;
}

.page-template-page-kitchen .meal-selection .session,
.page-template-page-kitchen .meal-selection .session-day{
	display: inline-block;
	vertical-align: middle;
}

.page-template-page-kitchen .meal-selection label{
	display: inline-block;
	vertical-align: middle;
}

.page-template-page-kitchen .meal-selection select{
	display: inline-block;
	vertical-align: middle;
	border: 0;
	background: transparent;
	color: #000000;
	font-size: 20px;

	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
}

.page-template-page-kitchen .meal-selection select + .caret{
	display: inline-block;
	vertical-align: middle;
	margin-left: 5px;
	font-size: 12px;
}

.page-template-page-kitchen .kitchen-results{

}

.page-template-page-kitchen .kitchen-results .meal{
	display: inline-block;
	vertical-align: top;
	margin: 0 0.5%;
	width: 30%;
	border: 1px solid #000000;
}

@media(max-width: 1023px){
	.page-template-page-kitchen .kitchen-results .meal{
		display: block;
		width: auto;
		margin: 0 0.5% 20px;
	}
}

.page-template-page-kitchen .kitchen-results .meal .meal-title{
	text-align: center;
	border-bottom: 1px solid #000000;
}

.page-template-page-kitchen .kitchen-results .meal .food-row{
	border-bottom: 1px solid #000000;
}

.page-template-page-kitchen .kitchen-results .meal .food-row .food{
	display: inline-block;
	vertical-align: middle;
	padding: 5px;
	width: 30%;
	border-right: 1px solid #000000;
}

.page-template-page-kitchen .kitchen-results .meal .food-row .count{
	display: inline-block;
	vertical-align: middle;
	width: calc(65% - 20px);
	padding: 5px;
}

.page-template-page-kitchen .kitchen-results .plans{
	margin-top: 20px;
	margin: 20px 0.5%;
	width: 30%;
	border: 1px solid #000000;
}

.page-template-page-kitchen .kitchen-results .plans .plans-title{
	padding: 5px;
	text-align: center;
	border-bottom: 1px solid #000000;
}

.page-template-page-kitchen .kitchen-results .plans .plan{
	text-align: center;
	border-bottom: 1px solid #000000;
}

.page-template-page-kitchen .kitchen-results .plans .plan .name{
	display: inline-block;
	vertical-align: middle;
	padding: 5px;
	width: 100px;
	border-right: 1px solid #000000;
}

.page-template-page-kitchen .kitchen-results .plans .plan .count{
	display: inline-block;
	vertical-align: middle;
	padding: 5px;
	width: calc(100% - 100px - 25px);
}