html, body {
	font-family: Tahoma;
	height: 100%;
}
.splashbackground {
	width: 100%;
	height: 100%;
	background-color: black;
	position: absolute;
	opacity: 0.5;
	z-index: 1;
}
@media only screen and (min-device-height: 421px) { /* regular tablet styling */
	#splashscreen {
		min-width: 50%;
		max-width: 80%;
		min-height: 70%;
		max-height: 95%;
		background-color: white;
		position: relative;
		top: 5%;
		z-index: 2;
		padding: 5vh;
		border: solid 10px white;
		box-shadow: inset 0 0 27px 5px;
		text-align: center;
	}
	#splash-content {
		font-size: 16px;
		margin-top: 3vh;
		margin-bottom: 3vh;
	}
	#btnHelp {
		display: none;
	}
	#btnVideo {
		display: none;
	}
	#splashPropertyInfo {
		width: 20vw;
		font-size: 1.2em;
		border: 2px solid #3c3c3c;
		box-shadow:0 0 5px;
		background-color:rgb(73,118,185);
	}
	#disclaimer {
		font-size:12px;
	}
	#btnAgree {
		width: 20vw;
		padding: 10px;
		font:2em;
	}
}
@media only screen and (max-device-height: 420px) { /* this is actually for mobile in landscape mode */
	.splashbackground {
		width: 100%;
		height: 100%;
		background-color: black;
		position: absolute;
		opacity: 0.5;
		z-index: 1;
	}
	#splashscreen {
		height: 90%;
		background-color: white;
		position: absolute;
		left: 1%;
		right: 1%;
		top: 5%;
		z-index: 2;
		padding: 5vh;
		border: solid 10px white;
		box-shadow: inset 0 0 27px 5px;
		text-align: center;
	}
	#splash-content {
		font-size: 12px;
		margin-top: 3vh;
		margin-bottom: 3vh;
	}
	#btnHelp {
		display: none;
	}
	#btnVideo {
		display: none;
	}
	#splashPropertyInfo {
		width: 20vw;
		height: 10vh;
		font-size: 1.4em;
		border: 2px solid #3c3c3c;
		box-shadow:0 0 5px;
		background-color:rgb(73,118,185);
	}
	#disclaimer {
		font-size:12px;
	}
	#btnAgree {
		width: 20vw;
		height: 10vh;
		font:0.5em
	}
	#header {
		width: 750px;
		left: 140px;
		height: 60px;
		bottom: 15px;
		position: absolute;
		background-color: #274D98;
		padding: 3px;
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.75), 0 0 5px rgba(0, 0, 0, 0.75);
	}
	#title{
		font-size:xx-large;
		color:white;
		top: 2%;
		left: 37%;
		position: absolute;
	}
	#nomapButton {
		top: 10%;
		left: 65%;
		width: 150px;
		position: absolute;
		border: 2px solid #3c3c3c;
		box-shadow: 0 0 5px;
		background-color: #4976B9;
		font-weight: bold;
	}
	#menuButton {
		top: 10%;
		left: 87%;
		width: 80px;
		position: absolute;
		border: 2px solid #3c3c3c;
		box-shadow: 0 0 5px;
		background-color: #4976B9;
		font-weight: bold;
	}
	#dropdown-content {
		display: none;
		left: 87%;
		bottom: 95%;
		position: absolute;
		background-color: #4976B9;
		color: white;
		width: 160px;
		box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
		z-index: 1;
	}
	#dropdown-content a {
		color: white;
		padding: 12px 16px;
		text-decoration: none;
		display: block;
	}
	#dropdown-content a:hover {
		background-color: #274D98
	}
	#resetButton {
		top: 140px;
		left: 20px;
		position: absolute;
		border: 2px solid #3c3c3c;
		box-shadow: 0 0 5px;
		font-size: 24pt;
		width: 50px;
		height: 50px;
		border-radius: 25px;
	}
} /* end of mobile landscape */

#viewDiv {
	height: 100%;
	width: 100%;
	background-color: white;
}
#spinner_sm {
	border: 10px solid white;
	border-top: 10px solid #4976B9;
	border-radius: 70%;
	width: 50px;
	height: 50px;
	animation: spin 1s linear infinite;
	top: 20%;
	left: 45%;
	display: none;
	position: absolute;
	opacity: 0.8;
}
#spinner_lg {
	border: 20px solid white;
	border-top: 20px solid #4976B9;
	border-radius: 70%;
	width: 100px;
	height: 100px;
	animation: spin 1s linear infinite;
	top: 20%;
	left: 45%;
	display: none;
	position: absolute;
	opacity: 0.8;
}
@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/* These next 2 say they're for widget buttons, but all buttons on the page except on popup use ESRI widget buttons even if they aren't a widget */
.esri-widget--button {
	background-color: rgb(37,61,122);
	color: white;
	width: 50px;
	height: 50px;
	border-radius: 25px;
}
.esri-widget--button:hover { /* for some reason you need to do this to keep the widget bar button colors blue after selecting it */
	background-color: rgb(37,61,122);
	color: white;
}
/* ------------------ */

/* ---- header and items in header ---- */
#header {
	width: 750px;
	left: 140px;
	height: 60px;
	bottom: 15px;
	position: absolute;
	background-color: rgb(37,61,122);
	padding: 3px;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.75), 0 0 5px rgba(0, 0, 0, 0.75);
}
#logo {
	margin-left:20px;
	height:50px;
	width:199px;
	cursor:pointer;
}
#title{
	font-size:xx-large;
	color:white;
	top: 2%;
	left: 37%;
	position: absolute;
}
#nomapButton {
	top: 10%;
	left: 65%;
	width: 150px;
	position: absolute;
	border: 2px solid #3c3c3c;
	box-shadow: 0 0 5px;
	background-color: #4976B9;
	font-weight: bold;
}
#menuButton {
	top: 10%;
	left: 87%;
	width: 80px;
	position: absolute;
	border: 2px solid #3c3c3c;
	box-shadow: 0 0 5px;
	background-color: #4976B9;
	font-weight: bold;
}
#dropdown-content {
	display: none;
	left: 87%;
	bottom: 95%;
	position: absolute;
	background-color: #4976B9;
	color: white;
	width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;
}
#dropdown-content a {
	color: white;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
}
#transition {
	display: none;
}
/* --------------------------------- */

/* 
/////////////////// STYLE FOR WIDGETS /////////////////////
*/
/* Style for zoom widget */
.esri-component.esri-zoom.esri-widget {
	box-shadow: 0 0 5px;
	width: 60px;
	height: 110px;
	padding-left: 5px;
	padding-top: 5px;
}
#resetButton {
	top: 140px;
	left: 20px;
	position: absolute;
	border: 2px solid #3c3c3c;
	box-shadow: 0 0 5px;
	font-size: 24pt;
	width: 50px;
	height: 50px;
	border-radius: 25px;
}
/* Style for search widget
----------------------------------- */
#searchDiv {
	background-color: white;
	top: 7px;
	right: 15px;
	height: 60px;
	width: 465px;
	position: absolute;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.75), 0 0 5px rgba(0, 0, 0, 0.75);
}
#searchDiv .esri-widget--button {
	margin: 3px;
}
.esri-input.esri-search__input {
	position: absolute;
	font-weight: bold;
	-webkit-text-fill-color: red;
	width: 290px;
	height: 44px;
	left: 60px;
	border: 2px solid blue;
	margin-top: 5px;
}
/* Style for other widgets in top-right container
-------------------------------------------------------------------------------------- */
#widgetsDiv {
	background-color: white;
	top: 63px;
	height: 240px;
	width: 70px;
	position: absolute;
	padding-left: 5px;
	padding-top: 5px;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.75), 0 0 5px rgba(0, 0, 0, 0.75);
}
#widgetsDiv .esri-widget--button {
	margin: 5px;
}

/* Style for basemap gallery widget
----------------------------------- */
.esri-basemap-gallery.esri-widget.esri-widget--panel-height-only {
	box-shadow: 0 0 5px;
	border: 2px solid #3c3c3c;
	background-color: rgb(26,43,86);
}
.esri-icon-basemap {
	font-size: 26px;
}
.esri-basemap-gallery__item-title {
	color: white;
}
.esri-basemap-gallery__item--selected{
	background-color: lightGray;
}
.esri-basemap-gallery__item--selected .esri-basemap-gallery__item-title {
	color: black;
	font-weight: bold;
}
.esri-basemap-gallery__item {
	font-weight: bold;
	background-color: rgb(26,43,86);
	color: white;
	box-shadow: 0 0 5px;
}
/* Style for layer list widget
----------------------------------- */
.esri-layer-list__item-container {
	font-weight: bold;
	background-color: rgb(26,43,86);
	color: white;
	box-shadow: 0 0 5px;
}
.esri-icon-layers {
	font-size: 26px;
}
.esri-layer-list__status-indicator {
	height: 18px;
	width: 18px;
}
.esri-layer-list.esri-widget.esri-widget--panel {
	box-shadow: 0 0 5px;
	border: 2px solid #3c3c3c;
	background-color: white;
}
.esri-layer-list__item--invisible-at-scale .esri-layer-list__item-title {
	color: #929CAC;
}
.esri-icon-non-visible::before {
	content: "\e610";
	margin-right: 20px;
	font-size: 22px;
	border: 2px solid white;
}
.esri-icon-visible::before {
	content: "\e605";
	color: yellow;
	border: 2px solid white;
	font-weight: bold;
	margin-right: 20px;
	font-size: 22px;
}
.esri-layer-list__child-toggle-icon--closed.esri-icon-right-triangle-arrow, .esri-layer-list__child-toggle-icon--opened.esri-icon-down-arrow {
	color: yellow;
	font-weight: bold;
}
/* Style for measure widget
----------------------------------- */
#measureDiv {
	box-shadow: 0 0 5px;
}
.esri-icon-measure {
	font-size: 26px;
}
#measureDiv {
	background: white;
	padding: 10px;
	height: 100px;
	width: 70px;
}
#distanceButton.action-button.esri-icon-measure-line.active, #areaButton.action-button.esri-icon-measure-area.active {
	background-color: #0079c1;
}
.esri-icon-measure-line, .esri-icon-measure-area {
	font-size: 26px;
}
.esri-distance-measurement-2d__container, .esri-area-measurement-2d__container {
	color: black;
	font-weight: bold;
	background-color: white;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.75), 0 0 5px rgba(0, 0, 0, 0.75);
	border: 3px solid #0079c1;
}
.esri-component.esri-distance-measurement-2d.esri-widget.esri-widget--panel, .esri-component.esri-area-measurement-2d.esri-widget.esri-widget--panel {
	top: 60vh;
	right: 1vw;
}
#distanceButton, #areaButton {
	color: white;
	background-color: rgb(26,43,86);
	width: 50px;
	height: 40px;
}
/* Style for export/print widget
----------------------------------- */
.esri-icon-printer {
	font-size: 26px;
}
.esri-print__export-button.esri-button {
	box-shadow: 0 0 10px #808080 inset, 0 0 10px #808080 inset;
	background-color: #95A2D1;
}
.esri-print.esri-widget.esri-widget--panel {
	box-shadow: 0 0 5px;
	color: white;
	background-color: rgb(26,43,86);
	border: 2px solid #3c3c3c;
}
.esri-expand.content esri-expand.content {
	box-shadow: 0 0 5px;
	border: 2px solid #3c3c3c;
}
.esri-print.esri-widget.esri-widget--panel {
	box-shadow: 0 0 5px;
}
.esri-print__export-panel-container {
	background-color: white;
	border: 1px solid black;
	text-align: center;
}
.esri-print__layout-tab {
	color: white;
	background-color: #95A2D1;
	font-weight: bold;
	border: 1px solid black;
	box-shadow: 0 0 5px #808080 inset, 0 0 5px #808080 inset;
}
.esri-select, .esri-print__input-text.esri-input, .esri-print__advanced-options-button-title {
	color: black;
	font-weight: bold;
}
.esri-print__exported-file-link-title {
	color: red;
	font-weight: bold;
	font-size: 16px;
}
.esri-print__advanced-options-section {
	color: black;
}
.esri-print__exported-file {
	padding-left: 55px;
}
/* 
//////////////// END OF  STYLE FOR WIDGETS //////////////////
*/

/* 
///////////////////// STYLE FOR POPUP /////////////////////
*/
.esri-popup__main-container {
	position: fixed;
	left: 10vw !important;
	top: 10vh !important;
	min-width: 35%;
	max-width: 45%;
	max-height: 430px;
	min-height: 410px;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.75), 0 0 5px rgba(0, 0, 0, 0.75);
}
#btnGetInfo {
	background-color: rgb(37,61,122);
	border-radius: 5px;
	min-width: 50%;
	max-width: 80%;
	color: white;
	left: 20%;
	font-weight: bold;
	padding: 2%;
	margin: 2%;
	bottom: 2%;
	text-align: center;
}
/* Hide some unneccessary items for a cleaner-looking popup */
.esri-popup__header-container {
	display: none;
}
.esri-popup__action-text {
	display: none;
}
.esri-popup__icon--dock-icon {
	display: none;
}
.esri-popup__inline-actions-container {
	display: none;
}
/* end of hiding section */
/* 
//////////////// END OF  STYLE FOR POPUP //////////////////
*/

/* 
////////////// STYLE FOR INFO DIV AT BOTTOM //////////////
*/
#infoDiv {
	margin: auto;
	left: 1vw;
	height: 70vh;
	width: 98vw;
	position: fixed !important;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.75), 0 0 5px rgba(0, 0, 0, 0.75);
	top: auto !important;
	bottom: 0 !important;
	background-color: white;
	z-index: 1;
	overflow: vertical;
	display: none;
	resize: vertical;
}
#infoDivHeader {
	background-color: #95A2D1;
	float: left;
	width: 100%;
	height: 20px;
	border: 1px solid black;
	cursor: ns-resize;
}
#infoMinMaxButton {
	background-image: linear-gradient(green, white, green);
	border-radius: 5px;
	cursor: pointer;
	width: 3%;
	float: right;
	height: 20px;
	font-size: 10px;
	vertical-align: 0;
}
#infoCloseButton {
	background-image: linear-gradient(red, pink, red);
	border-radius: 5px;
	cursor: pointer;
	width: 3%;
	float: right;
	height: 20px;
	font-size: 10px;
	vertical-align: 0;
}
#buttonscontainer {
	width: 99%;
	margin-left: 4px;
}
.nav-link {
	background-color: rgb(37,61,122);
	color: white;
	height: 85px;
	cursor: pointer;
	box-shadow: black 4px 3px 7px -3px;
	border: 2px solid white;
}
.nav-link:active {
	background-color: #274D98;
	color: white;
}
@media (orientation: landscape) {
	#basicvalueinfo, #ownership, #econdevel, #photos, #tools, #electedofficials, #faq {
		width: 98%;
		height: 55vh;
		overflow: auto;
		background-color: #DCE1F0;
		box-shadow: black 8px 6px 13px -6px;
		margin: 1%;
	}
}
@media (orientation: portrait) {
	#basicvalueinfo, #ownership, #econdevel, #photos, #tools, #electedofficials, #faq {
		width: 98%;
		height: 60vh;
		overflow: auto;
		background-color: #DCE1F0;
		box-shadow: black 8px 6px 13px -6px;
		margin: 1%;
	}
}
#basic, #value {
	background-color: white;
	height: 94%;
	width: 96%;
	margin: 1%;
	padding: 2%;
	box-shadow: black 8px 6px 13px -6px;
	border: 1px solid gray;
	overflow: auto;
}
#btnGetDetails {
	background-color: rgb(37,61,122);
	border-radius: 5px;
	width: 90%;
	color: white;
	padding-left: 20%;
	font-weight: bold;
	padding: 2%;
	margin: 2%;
	bottom: 2%;
	text-align: center;
}
#firstowner, #secondowner, #otherowners {
	background-color: white;
	height: 94%;
	width: 96%;
	margin: 1%;
	padding: 2%;
	box-shadow: black 8px 6px 13px -6px;
	font-size: 1.2em;
	border: 1px solid gray;
}
#divYear0, #divYear1, #divYear2, #divYear3, #divYear4, #divYear5 {
	background-color: white;
	height: 96%;
	margin: 1%;
	width: 90%;
	box-shadow: black 8px 6px 13px -6px;
	padding: 1%;
	font-size: 1.1em;
	margin-bottom: 1%;
	margin-left: 5%;
}
#lblYear0, #lblYear1, #lblYear2, #lblYear3, #lblYear4, #lblYear5 {
	font-weight: bold;
	font-size: medium;
	margin-left: 20%;
	margin-bottom: 10px;
	border: 1px solid gray;
	text-align: center;
}
#TIFs, #CommImpDist, #TDD, #paytaxes, #correctinfo, #print, #export, #apppeal, #local, #state, #federal, .faq-cols, .photo {
	background-color: white;
	border: 1px solid gray;
	width: 96%;
	margin: 1%;
	padding: 2%;
	box-shadow: black 8px 6px 13px -6px;
	left: 1%;
	height: auto;
}
.tools-title {
	border-bottom: 1px solid gray;
	padding-bottom: 35px;
	font-size: 1.5em;
}
.tools-content {
	text-align: center;
	height: auto;
	padding-bottom: 35px;
	font-size: 1.1em;
	width: 96%;
}
.tools-buttons {
	height: auto;
	text-align:center;
}
.tool-button {
	background-color: #4976B9;
	color: white;
	width: 150px;
	padding: 10px;
	border-radius: 5px;
	border: 1px solid black;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 
		0 1px 5px 0 rgba(0, 0, 0, 0.12), 
		0 3px 1px -2px rgba(0, 0, 0, 0.2);
	transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}
#printTable {
	margin-top:1%;
	margin-bottom:1%;
	margin-left: 20%;
	text-align: left;
	width: 80%;
}
/* 
/////////// END OF STYLE FOR INFO DIV AT BOTTOM ///////////
*/

/*---------------------------------------------------
   Style for the modal photos - disabled for tablets
---------------------------------------------------*/
#theModal {
	display: none;
}