/*
//Utility
*/

.hide-this {
	visibility: hidden;
}

.remove-this {
	display: none;
}

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

.center-item {
	display: inline-block;
	margin: 0 auto;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

.to-do-green {
	background: #659E65;
}

.to-do-red {
	background: #9E6565;
}

.columnize {
	-webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 3em;
    -moz-column-gap: 3em;
    column-gap: 3em;
    -webkit-column-rule: 1px solid #e5e5e5;
    -moz-column-rule: 1px solid #e5e5e5;
    column-rule: 1px solid #e5e5e5;
    margin: 0 0 1.313em;
}

@media screen and (max-width: 600px) {
	.columnize {
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
	}	
}

.vertical-margin-medium {
	margin: 30px 0;
}	

@media screen and (max-width: 900px) {
	.vertical-margin-medium {
		margin: 15px 0;
	}	
}

/*
//General
*/

html, body {
	height: 100%;
	width: 100%;
}

body {
	font-size: 16px;
    font-style: normal;
    font-weight: 400;
    font-family: 'Lato', sans-serif;
    color: #999999;
    background-color: #f3f3f3;
}

a:hover, a:active, a:link {
	text-decoration: none;
}

ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

li {
	line-height: 1.7;
}

.fa {
	margin: 0 7px 0 0;
}

.glyphicon {
	margin: 0 10px 0 0;
}

#map-div .tooltip {  
	opacity: 1;  
}  

.sweet-alert p {
	color: #333 !important;
}

/*
//Font Sizes
*/

#main-page h1, #main-page h2, #main-page h3, #main-page h4, #main-page h5 {
	margin: 0px 0px 15px 0px;
	padding: 0px;
}

@media screen and (max-width: 900px) {
	#main-page h2 {
		margin: 0px 0px 8px 0px;
		font-size: 22px
	}
	
	#main-page h3 {
		margin: 0px 0px 8px 0px;
		font-size: 18px
	}
}

@media screen and (max-width: 350px) {
	#main-page h2 {
		margin: 0px 0px 5px 0px;
		font-size: 18px
	}
	
	#main-page h3 {
		margin: 0px 0px 5px 0px;
		font-size: 14px
	}
}

/*
//Main Content - Right
*/

/* mMenu, toolbar, and profile box */

#main-page {
	width: 78%;
	float: right;
}

#main-page #toolbar-div {
	height: 40px;
	width: 100%;
	background-color: white;
	border-bottom: 1px solid #ccc;
}

#main-page #toolbar-div #toolbox-menu-button, #main-page #toolbar-div #profile-button {
	height: 100%;
    text-align: center;
    padding: 10px;
	color: black;
}

#main-page #profile-box {
	width: 140px;
    float: right;
	display: none;
	position: absolute;
	right: 0;
	z-index: 999999;
	background-color: white;
	border-bottom: 1px solid #ccc;
	border-left: 1px solid #ccc;
}

#main-page #profile-box a {
	display: block;
	padding: 0px 10px 5px 10px;
	color: black;
}

#main-page #profile-box a:hover {
	background: #E0E0E0;
}

/* Content */

#main-page #content-div {
	float: right;
	width: 100%;
	color: #444444;
	margin: 0px;
	padding: 30px 10%;
}

/* Big buttons page */

#main-page #content-div .page-options{
	margin: 50px 0px;
}

#main-page #content-div .page-options .btn {
	padding: 35px 25px 25px 25px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px;
	margin: 0px 20px 15px 20px;
	min-width: 170px;
}

#main-page #content-div .page-options .btn .glyphicon {
    font-size: 65px;
	margin: 0 0px 18px 0;
}

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

	#main-page {
		border-left: 1px solid #ccc;
	}

    #main-page #toolbar-div #toolbox-menu-button {
        display: none;
    }
	
	#main-page #content-div {
		padding: 50px 5%;
	}
}

/* Projects */
#main-page #content-div #to-do-legend h4 {
	margin: 0 0 5px 0;
	font-size: 15px;
}

#main-page #content-div #to-do-legend div.project-details {
	text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    font-weight: 400;
    height: 50px;
    padding: 8px 0px;
    text-align: center;
    width: 100%;
    border-radius: 0px;
    color: #333;
    background-color: #fff;
    border: 1px solid #ccc;
	font-size: 12px;
}

#main-page #content-div #to-do-legend div.progress-bar-details {
	height: 6px;
}

#main-page #content-div #new-proposal-button {
	margin: 5px 0px 20px 0px;
	width: 100%;
	border-color: #D0D0D0;
}

#main-page #content-div #submitted-projects {
	margin: 0px 0px 60px 0px;
}

#main-page #content-div .project-list .project-list-item {
	margin: 0px 0px 10px 0px;
	width: 100%;
	border: 1px solid #D0D0D0;
}

#main-page #content-div #to-do-legend .glyphicon,
#main-page #content-div .project-list .project-list-item .glyphicon {
	margin: 0px;
}

#main-page #content-div #to-do-legend {
	float: right;
	width: 24%;
}

#main-page #content-div #to-do-legend .option-container {
	width: 50%;
	display: inline-block;
	margin-right: -3px;
	vertical-align: top;
	height: 80px;
}

#main-page #content-div #to-do-legend .option-container button {
	text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    font-weight: 400;
    height: 70px;
    padding: 10px 15px;
    text-align: center;
    width: 100%;
	border-radius: 0px;
	cursor: default;
}

#main-page #content-div .project-list .project-list-item .option-container, 
#main-page #content-div .project-list .project-list-item  form {
	width: 12%;
	height: 80px;
	display: inline-block;
	margin-right: -4px;
	vertical-align: top;
}

#main-page #content-div .project-list .project-list-item a button {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    font-weight: 400;
    height: 70px;
    padding: 10px 0px;
    text-align: center;
    width: 100%;
	border-radius: 0px;
	border-color: #D0D0D0;
}

#main-page #content-div .project-list .project-list-item button.project-submission,
#main-page #content-div #submitted-projects .project-list-item a button {
	height: 80px ;
}

#main-page #content-div .project-list .project-list-item div.project-basics {
	display: inline-block;
	height: 80px;
	padding: 10px 15px;
	width: 52%;
	text-align: left;
	vertical-align: top;
	margin-right: -3px;
	background: #fff;
	border: 1px solid #ccc;
    border-right: 0px;
}

#main-page #content-div .project-list .project-list-item div.project-basics-submitted {
	width: 88%;
}

#main-page #content-div .project-list .project-list-item .progress-bar-to-do,
#main-page #content-div #to-do-legend .progress-bar-to-do {
	height: 10px;
	width: 100%;
}

#main-page #content-div .project-list .project-list-item form a button {
	width: 100%;
}


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

	#to-do-legend {
		display: none;
	}

	#main-page #content-div .project-list .project-list-item .option-container,
	#main-page #content-div .project-list .project-list-item form {
		width: 100%;
	}

	#main-page #content-div .project-list .project-list-item div.project-basics,
	#main-page #content-div .project-list .project-list-item div.project-basics-submitted {
		width: 100%;
		text-align: center;
		padding: 8px;
	}
	
	#main-page #content-div .project-list .project-list-item div.project-basics h4 {
		font-size: 14px;
	}

}

/* Add New Project */

#main-page #content-div .ninja-forms-cont .progressbar {
	margin: 0px 0px 20px 0px;
}

#main-page #content-div .ninja-forms-cont .ninja-forms-required-items {
	margin: 0px 0px 15px 0px;
}
#ui-datepicker-div {
	padding: 10px;
	border: 1px solid black;
	position: fixed !important;
    top: 0px !important;
    left: 50% !important;
}

#ui-datepicker-div .ui-datepicker-calendar td {
	border: 1px solid black;
}

#ui-datepicker-div .ui-datepicker-title {
	color: black;
}

#ui-datepicker-div thead {
	color: black;
}

/* Edit Project */

#main-page #content-div .acf_postbox .inside {
	font-size: 16px;
}

#main-page #content-div .acf_postbox p.label label {
	font-size: 16px;
	text-align: left;
}

#main-page #content-div .acf-form #acf-tax-impaired,
#main-page #content-div .acf-form #acf-acf-reduction-nitrogen,
#main-page #content-div .acf-form #acf-acf-reduction-phosphorus,
#main-page #content-div .acf-form #acf-acf-reduction-sediment {
	display: none;
}

#main-page #content-div .acf-form {
	background: white;
    padding: 0px 30px 20px 30px;
    border-radius: 5px;
    border: 1px solid #ccc;
	margin: 0 0 15px 0;
}

#acf-acf-report-json {
	display: none;
}

/* View Project */

#main-page #content-div #report-button {
	margin: 20px 0px;
	height: 55px;
}


#main-page #content-div .meta-table,
#main-page #content-div #project-map-div {
	width: 49%;
    display: inline-block;
	vertical-align: top;
}

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

	#main-page #content-div .meta-table,
	#main-page #content-div #project-map-div {
		width: 100%;
	}

}

#main-page #content-div  .meta-table#landcover-meta-table {
	width: 100%;
}

#main-page #content-div  .meta-table .panel-heading {
	color: #FFF;
    background-color: #3969A2;
    border-color: #274B6B;
}

#main-page #content-div td {
	padding: 15px;
}

#main-page #content-div .meta-label {
	font-weight: bold;
}

#main-page #content-div #project-map-div {
	height: 300px;
    border-radius: 4px;
    margin: 0px 0 15px 0;
}

/* Login */

.um-form .um-left {
	width: 100%;
}

.um-form .um-right {
	display: none;
}

/* Profile */

#main-page .um-account-meta {
	display: none;
}

/* Analysis Pages */

#main-page #content-div .project-select-box {
	margin: 0px 0px 20px 0px;
}

#main-page #content-div #analysis-container {
	width: 100%;
	height: 400px;
	background: white;
	margin: 20px 0px;
}

#main-page #content-div #analysis-container #analysis-tool-div {
	width: 20%;
	height: 100%;
	display: inline-block;
	margin-right: -4px;
	vertical-align: top;
	background: rgb(243, 243, 243);
}

#main-page #content-div #analysis-container #analysis-tool-div button {
	border-radius: 0px;
	width: 100%;
	height: 80px;
}

#main-page #content-div #analysis-container #map-div {
	width: 80%;
	height: 100%;
	display: inline-block;
	margin-right: -4px;
	position: relative;
}

#main-page #content-div #analysis-container #map-div #basemap-toggle{
	position: absolute;
    top: 10px;
    right: 10px;
    z-index: 50;
}

/* Geography */

#main-page #content-div #address-search-container {
	margin: 20px 0px;
}

#main-page #content-div #address-search-container #address-search-container_input {
	width: 500px;
}

#main-page #content-div #ninja_forms_field_128 {
	font-size: 18px;
}

#main-page #content-div #landcover-table {
	width: 100%;
	margin: 15px 0 0 0;
}

#main-page #content-div #landcover-table th,
#main-page #content-div #landcover-table td {
    padding: 10px 15px;
}

#main-page #content-div #landcover-table .table-header,
#main-page #content-div #landcover-meta-table .table-header{
	background-color: #E6E6E6;
}

#main-page #content-div #landcover-table #bayfast-instructions {
	padding: 10px 40px;
}

#main-page #content-div #landcover-table #bayfast-instructions li {
	padding: 2px 0px;
}

#main-page #content-div #landcover-table .project-acres {
	background-color: #A92A1F;
    color: white;
}

#main-page #content-div #landcover-table .treatment-acres {
	background-color: #4479D6;
    color: white;
}

.esriPopup .titlePane {
	background-color: #2C66AD; 
} 

.esriPopup .titleButton.maximize {
	display: none;
}

.esriPopup .titleButton.close {
	opacity: 1;
}

.popover-title {
	padding: 8px !important;
	color: white !important;
	background-color: #286090 !important;
    border-color: #204d74 !important;
}

.popover-content {
	padding: 9px 14px !important;
	color: black !important;
}

/* Reductions */

#main-page #content-div #reduction-table {
	margin: 25px 0 0 0;
}

#main-page #content-div #reduction-form {
	padding: 25px;
}

/*
//mMenu - Left
*/

#toolbox-menu:not( .mm-menu ) {
    display: none;
    width: 22%;
	float: left;
}

#toolbox-menu {
	background: white;
	font-size: 16px;
}

#toolbox-menu .mm-listview li {
	border-color: #D0D0D0;
}

#toolbox-menu .link-red {
	color: #D21616;
}

#toolbox-menu #main-logo {
	padding: 45px 0 40px 0;
}

#toolbox-menu #main-logo img {
	width: 90%;
	display: block;
	margin: 0px auto;
	padding: 10px;
	background: black;
	max-height: 100px;
}

#toolbox-menu .mm-listview  li > a{
	white-space: normal;
}