body {
	font-family: 'Montserrat', sans-serif;
	background-color: #f9f9f9;

}

/* BEGIN ADVANCED SETTINGS */
.state_switch {
	background-color: #1557AE;
	width: 200px;
	height: 50px;
	display: inline-block;
	margin: 1em;
	/*text-anchor: middle;*/
	text-align: center;
}
.state_switch.selected {
	background-color: red;
}

.temp_override {
	width: 200px;
	height: 50px;
	background-color: #1557AE;
	display: inline-block;
	text-align: center;
	margin: 1em;
}

.temp_override.selected {
	background-color: red;
}

#state_holder {

}

/* BEGIN NAVBAR */
.navbar {
	display: flex;
	background-color: blue;
	justify-content: space-between;
	align-items: center;
	/*background-color: #06331b;*/
	/*background-color: #96bdb8;*/
	background-color: black;
	color: white;
	width: 100%;
	z-index: 20;
	position: absolute;
	position: fixed;
	top: 0;
	-webkit-box-shadow: 0px 2px 9px -1px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 2px 9px -1px rgba(0,0,0,0.75);
box-shadow: 0px 2px 9px -1px rgba(0,0,0,0.75);
}

.navbar-container {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	align-items: center;
}

.navbar-container-logo {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	align-items: center;
}

.title {
	font-size: 24px;
}

.navbar-container-menu {
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	align-items: center;
}

.navbar-container-menu span a {
	color: white;
	text-decoration: none;
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	transition: 350ms;
}

.navbar-container-menu span:active, .navbar-container-menu span a:active {
	font-weight: 700;
	/*color: yellow;*/
}

.navbar-container-menu span:hover, .navbar-container-menu span a:hover {
	transform: scale(1.1);
}
/* END NAVBAR */

/* BEGIN FARM LIST */
#user-farms-container {
	background-color: #f4f4f4;
	background-color: white;
	overflow: scroll;
}

#user-farms-container a {
	/*color: #b2b2b2;*/
	/*color: green;*/
	color: black;
	background-color: white;
}

#user-farms-container h2 {
	text-align: left;
	color: #444444;
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
}
#user-farms a {
	color: black;
}

/* END FARM LIST */

/* BEGIN SETTINGS OVERVIEW */
#farm-settings-container {
	display: flex;
	flex-direction: row;
	padding-top: 20px;
	margin-left: 20%;
	width: 80%;
}

.farm-settings-header {
	font-family: 'Montserrat', sans-serif;
	width: 30%;
	display: inline-block;
}

#center_header {
	text-align: center;
}

#left_header {
	text-align: left;
	font-size: 1.2em;
	color: #1557AE;
	padding-left: 3%;
}

#right_header {
	text-align: right;
	font-size: 1.2em;
	color: #1557AE;
}

.offline {
	color: black;
	background: rgb(178, 26, 10);

}
.online {
	color: black;
	background-color: green;
}
#farm-online p {

}

#farm-online {
	/*width: 20%;*/
	display: inline-block;
	/*padding-right: 5%;*/
}

#farm-online {
	/*width:10em;*/
	color:black;
	font-weight: 1000;
	margin: 0 auto;
	text-align: center;
	padding-left: 30px;
	padding-right: 30px;
	border-style: dotted;
	border-color:black;
	border-width: 5px;
	align-items: center;
}
/* END SETTINGS OVERVIEW */

/* BEGIN CROP STATUS OVERVIEW */
#harvest_container {
	width: 100%;
	margin: 0 auto;
	/*height: 410px;*/
	height: 100%;
	vertical-align: top;
	/*border-bottom: 1px solid #c1c1c1;*/
	background: white;
	box-shadow: 0 0px 6px rgba(0,0,0,0.16), 0 0px 6px rgba(0,0,0,0.23);
	margin: 25px 0;
	float:center;
}

.harvest_inner_container {
	width: 49.5%;
	height: 100%;
	display: inline-block;
	vertical-align: top;
	width: 40%;
	padding-left: 9.5%;
}

.harvest_box {
	width: 100%;
	height: 160px;
	/*line-height: 100px;*/
}

#harvest_title {
	margin: 0 3%;
	padding-top: 20px;
}

#harvest_left {
}

#harvest_right {
}

.days {
	border: 1px solid #c1c1c1;
	width: 100px;
	height: 100px;
	display: inline-block;
	vertical-align: top;
	text-align: center;
	font-weight: 300;
	margin-top: 25px;
}

.days p {
	padding-top: 10px;
}

.recipe {
	padding-top: 25px;
	width: 100px;
	display: inline-block;
	vertical-align: top;
	font-weight: 400;
	text-align: center;
	padding-left: 50px;
	font-size: 1.15em;
	line-height: 100px;
}

.number_days {
	font-size: 1.4em;
	font-weight: 400;
	color: rgb(178, 26, 10);
}
/* END CROP STATUS OVERVIEW */

/* BEGIN RECIPE UPDATER */
#recipe_table {
	width: 100%;
	background: white;
	margin: 25px 0;
	box-shadow: 0 0px 6px rgba(0,0,0,0.16), 0 0px 6px rgba(0,0,0,0.23);

}

#recipe_title {
	font-weight: 300;
	padding-right: 10px;
	padding-left: 17px;
}

.RecipeChooser {
	margin: 0 auto;
	width: 33%;
	padding-bottom: 25px;
	display: inline-block;
	/*padding-left: 10%;*/
}

.RecipeChooser_block {
	display: inline-block;
	width: 100%;
}

.RecipeChooser_block p {
	margin: 20px;
	font-weight: 300;
}

.RecipeChooser_block select {
	display: block;
	margin: 20px auto;
}

#recipe_table table tr th {
	font-weight: 300;
	padding: 5px;
}

#recipe_header {
	text-align: left;
    /*padding-left: 3%;*/
}

/* END RECIPE UPDATER */

#settings-icons {
	float:right;
	position:relative;
	left:100px;
}

@media (max-width: 1200px) {
	#img-logo-home {
		width: 40px;
		height: 40px;
		padding: 10px;
	}

	#button-new-farm {
		margin-left: 30px;
		color: #B21A0A;
		font-weight: 700;
	}

	#button-expand-navbar {
		display: none;
	}

	#expandable-menu {
		display: none;
	}

	.navbar-container-menu {
		margin-left: 15px;
		margin-right: 15px;
	}

	.navbar-container-menu span {
		margin-left: 15px;
		margin-right: 15px;
	}

	#farm-content {
		margin-top: 60px;
	}

	#farm-extras {
		display: flex;
		flex-direction: column;
		align-content: flex-start;
		text-align: center;
	}

	#user-farms-container {
		position: fixed;
		top: 0;
		bottom: 0;
		z-index: 10;
		width: 20%;
		padding-top: 20px;
		box-shadow: 2px 0px 5px #c1c1c1;
		border-top: 1px solid #c1c1c1;
	}

	#user-farms-container h2 {
		margin: 20%;
		font-size: 3vw;
	}

	#user-farms-container a {
		font-size: 2vw;
		padding: 10% 20%;
		border-bottom: 1px solid #c1c1c1;
	}

	#user-farms-container h2 {
		margin-bottom: 20px;
	}

	#user-farms {
		display: flex;
		flex-direction: column;
	}

	#farm-settings-container {
		display: flex;
		flex-direction: row;
		padding-top: 20px;
		margin-left: 25%;
		/*width: 30%;*/
		width: 80%;

	}

/*	.farm-settings-header {
		font-family: 'Montserrat', sans-serif;
		width: 30%;
    	display: inline-block;
	}*/

/*	#center_header {
		text-align: center;
	}

	#left_header {
		text-align: left;
		font-size: 1.2em;
		color: #1557AE;
		padding-left: 3%;
	}

	#right_header {
		text-align: right;
		font-size: 1.2em;
		color: #1557AE;
	}*/


	#farm-settings {
		/*margin-right: 100px;*/
		width: 100%;
	}

	#form-farm-settings, #form-farm-settings input {
    	box-sizing: border-box;
    	-moz-box-sizing: border-box;
    	-webkit-box-sizing: border-box;
	}

	#form-farm-settings label, #form-farm-settings input {
	    display: inline-block;
		vertical-align: baseline;
	}

	#form-farm-settings label, #form-farm-settings input {
		/*width: 120px;*/
		vertical-align: middle;
	}

	#button-update {
		width: 240px;
		height: 30px;
		border-radius: 28px;
		border: none;
		background-color: #B21A0A;
		color: white;
		font-family: 'Montserrat', sans-serif;
		transition: 200ms;
		margin-top: 15px;
		margin-bottom: 10px;
	}

	.switch-title, .switch {
		display: inline-block;
		vertical-align: middle;
		/*margin: 9px;*/
		font-weight: 300;
	}

	.switch-title {
		width: 150px;
		margin: 5px 0px;
		text-align: center;
	}

	/*#farm-setup-header {
		margin-bottom: 20px;
	}*/

	#data-vis-block {
		/*width: 70%;
		height: 50vw;*/
		/*margin-top: 20px;*/
		/*margin-left: 3%;*/
	}

	#svg-update {
		width: 150px;
		height: 30px;
		border-radius: 2px;
		border: none;
		background-color: #B21A0A;
		color: white;
		margin-left: 20px;
	}

	.input-viz {
		margin: 0 5px;
	}
}

@media (min-width: 1201px) {
	#img-logo-home {
		width: 40px;
		height: 40px;
		padding: 10px;
	}

	#button-new-farm {
		margin-left: 30px;
		color: #B21A0A;
		font-weight: 700;
	}

	#button-expand-navbar {
		display: none;
	}

	#expandable-menu {
		display: none;
	}

	.navbar-container-menu {
		margin-left: 15px;
		margin-right: 15px;
	}

	.navbar-container-menu span {
		margin-left: 15px;
		margin-right: 15px;
	}

	#farm-content {
		margin-top: 60px;
	}

	#farm-extras {
		display: flex;
		flex-direction: column;
		align-content: flex-start;
	}

	#user-farms-container {
		position: fixed;
		top: 0;
		bottom: 0;
		z-index: 10;
		width: 250px;
		padding-top: 20px;
		/*box-shadow: 2px 0px 5px #c1c1c1;*/
		border-right: 1px solid #c1c1c1;
		border-top: 1px solid #c1c1c1;
	}

	#user-farms-container h2 {
		margin: 50px;
	}

	#user-farms-container a {
		font-size: 18px;
		padding: 20px 50px 20px 50px;
		border-bottom: 1px solid #c1c1c1;
	}

	#user-farms-container h2 {
		margin-bottom: 20px;
	}

	#user-farms {
		display: flex;
		flex-direction: column;
	}

/*	#farm-settings-container {
		display: flex;
		flex-direction: row;
		padding-top: 20px;
		margin-left: 20%;
		width: 80%;
	}*/

/*	.farm-settings-header {
		font-family: 'Montserrat', sans-serif;
		font-weight: 300;
		font-size: 1.5em;
		width: 30%;
	    display: inline-block;
	}*/

/*	#center_header {
		text-align: center;
	}

	#left_header {
		text-align: left;
		font-size: 1.2em;
		color: #1557AE;
		padding-left: 3%;
	}

	#right_header {
		text-align: right;
		font-size: 1.2em;
		color: #1557AE
	}*/


	#farm-settings {
		/*margin-right: 100px;*/
		width: 100%;
	}

	#form-farm-settings, #form-farm-settings input {
    	box-sizing: border-box;
    	-moz-box-sizing: border-box;
    	-webkit-box-sizing: border-box;
	}

	#form-farm-settings label, #form-farm-settings input {
	    display: inline-block;
		vertical-align: baseline;
	}

	#form-farm-settings label, #form-farm-settings input {
		/*width: 120px;*/
		vertical-align: middle;
	}

	#button-update {
		width: 240px;
		height: 30px;
		border-radius: 28px;
		border: none;
		background-color: #B21A0A;
		color: white;
		font-family: 'Montserrat', sans-serif;
		transition: 200ms;
		margin-top: 15px;
		margin-bottom: 10px;
	}

	.switch-title, .switch {
		display: inline-block;
		vertical-align: middle;
		display: inline-block;
    vertical-align: middle;
    /*margin: 9px;*/
		font-weight: 300;
	}

	.switch-title {
		width: 200px;
		margin: 15px 0px;
		text-align: center;
	}

	/*#farm-setup-header {
		margin-bottom: 20px;
	}*/

	#data-vis-block {
		width: 100%;
		/*margin-top: 20px;*/
	}

	#data-vis-block h3 {
		font-weight: 400;
		/*margin-left: 3%;*/
	}

	#svg-update {
		width: 150px;
		height: 30px;
		border-radius: 2px;
		border: none;
		background-color: #B21A0A;
		color: white;
		margin-left: 20px;
	}

	.input-viz {
		margin: 0 5px;
	}
}

.farm_wrapper_inner {
	width: 95%;
	margin: 0 auto;
}

#current_status_header {
	font-family: 'Montserrat', sans-serif;
    display: inline-block;
    width: 50%;
    /* padding: 20px 7% 20px 3%; */
    padding-left: 3%;
    font-weight: 400;
    padding-top: 20px;
    font-size: 1em;
}



#day_start {
	width: 90%;
	display: block;
	padding: 10px 3%;
}

#day_start_header {
	width: 100%;
	text-align: center;

}

.day_title {
	width: 50%;
  font-weight: 400;
  display: inline-block;
  padding: 3% 0;
	padding-left: 3%;
  text-align: center;
}

#settings_day_start_header {
	width: 100%;
	font-weight: 400;
	text-align: center;
	padding: 0;
	padding-bottom: 4px;
	display: block;
}

#day_start_hr {
	margin: 40px auto;
}

.day_start_hour {
	width: 40%;
	display: inline-block;
	padding-left: 10px;
}

/**** STATUS ****/

.status_container {
	background: white;
	margin: 25px 0;
	box-shadow: 0 0px 6px rgba(0,0,0,0.16), 0 0px 6px rgba(0,0,0,0.23);
	padding: 10px;
}

.status_left, .status_right {
	width: 44.5%;
	display: inline-block;
	padding-left: 5%;
}

.status_container h4 {
	display: inline-block;
	font-weight: 200;
	/*color: rgb()*/
}

.status_bar {
	width: 50%;
	margin: 0 auto;
}

.status_bar h3 {
	text-align: center;
}

/**** ENVIRONMENT ****/

.environment_container {
	height: 100%;
	width: 100%;
	margin: 0 auto;
	border-top: 1px solid #c1c1c1;
	border-bottom: 1px solid #c1c1c1;
	background: white;
	box-shadow: 0 0px 6px rgba(0,0,0,0.16), 0 0px 6px rgba(0,0,0,0.23);
}

#environment_table {
	width: 75%;
	margin: 0 auto;
}

#cycle_table {
	width: 75%;
  margin: 0 auto;
  padding: 40px;
}

#cycle_table tr {
	width: 50%;
	display: inline-block;
}

/**** RECIPES ****/



.settings_left_right_container {
	width: 100%;
	padding: 10px 0;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.left_right_header {
	width: 33%;
	display: inline-block;
	margin: 0;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	font-weight: 300;
	/*color: #B21A0A;*/
	color: #1557AE;
	text-align: center;

}


/**** SETUP ****/

hr {
	width: 90%;
	margin: 0 auto;
}

#farm-setup {
    background: white;
    margin: 35px 10px;
    margin-bottom: 0;
    /*height: 200px;*/
    padding-left: 2.5%;
    text-align: left;
}

#farm_setup_top {
	width: 100%;
	margin: 0 auto;
}

.farm_setup_header {
	width: 200px;
  float: left;
	display: inline-block;
	width: 40%;
	vertical-align: top;
	padding-left: 10%;
	padding-bottom: 30px;
}

#main-switch {
	/*float: left;*/
	display: inline-block;
	vertical-align: top;

}

.farm_setup_header h3 {
	display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	vertical-align: middle;
	padding: 0 20px;
}

#switch_container {
	width: 80%;
    margin: 0 auto;
    display: block;
    padding-top: 20px;
		margin-bottom: 30px;
}

#csrf, #recipe_code {
	font-weight: 300;
}

#button-update:hover {
	transform: scale(1.05);
}

.override_button {
	display: inline-block;
	width: 45%;
	padding-left: 2.5%;
}

.override_bottom {
	padding: 20px 0 0 2.5%;
}

/**** EDIT DAYS ****/

.edit_days {
	/*box-shadow: 0 0px 6px rgba(0,0,0,0.16), 0 0px 6px rgba(0,0,0,0.23);*/
	background: white;
	margin: 25px 0;
	height: 100px;
	padding: 10px;
	padding-left: 2.5%;
}

.switch_block1 {
	width: 30%;
	display: inline-block;
}

.home_box_header {
	font-size: 1.275em;
	font-weight: 400;
	padding-top: 20px;
	margin-left: 3%;
}

/**** IMAGE ****/

.show_image_container {
	box-shadow: 0 0px 6px rgba(0,0,0,0.16), 0 0px 6px rgba(0,0,0,0.23);
	background: white;
	margin: 25px 0;
	padding-bottom: 100px;
}

.latest_image_text {
	padding: 20px;
	display: block;
	margin: 0 auto;
}

.latest_image_text p {
	padding-left: 10px;
}

#show_img[type="checkbox"] {
	margin: 0 10px;
}

.show_image_container img {
	padding: 0 30px;
	box-sizing: border-box;
}