/* v.027 */
@media all {
/**************************************************************/
/* Common */

:root {
  --form-max-width: 570px;
}

HTML		{ box-sizing: border-box; }
*, *:before,
*:after		{ box-sizing: inherit; }
IMG.x		{ display: none; }
BODY		{ background-color: #10364C; margin: 0px; padding: 0px; }
P, LI, LABEL{ font: 14pt 'PT Sans',sans-serif; }

/**************************************************************/
/* Home Page */
HTML, BODY	{ height: 100%; margin: 0px; }
/* HEADER replaced with DIV on 7/24/2026 5:42AM */
#idHeader,
.slider-container			{ width: 100%; height: 100%; position: relative; overflow: hidden; }
#Accnt #idHeader,
#Accnt .slider-container	{ overflow: unset; }


.slide				{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 1;
					  transition: opacity 0.5s ease; background-size: cover; background-position: center; }

#slide1			{ background-image: url(/images/Home.jpg); }
#Accnt #slide1	{ background-attachment: fixed; height: auto; }
SECTION	{ position: absolute; margin: 0px; top: 0px; left: 0px; width: 100%; }
#Logo	{	/* position: absolute; right: 20px; */ border: 0px solid red; width: fit-content; transition: all 1.2s ease;
			/* Set position: initial; right: auto; */ margin: 0px 15px 25px 15px;
		}
H1		{ color: #F97A44; margin: 5px 0px 0px 0px; font: 30pt 'PT Serif',times; }
H1 B	{ color: white; font-weight: 400; }
#SearchFilter,
#Login	{ font: 16pt Monda, sans-serif; line-height: 24px; display: block; padding: 5px 15px 7px;
		border-radius: 5px; text-decoration: none; box-shadow: 3px 3px 2px #000000A0; margin: 5px auto;
		top: 0px; right: 20px; width: fit-content; position: relative; /* transition: opacity 1.2s ease; */
		background: linear-gradient(to bottom, #DDD, #888); color: #FFF; text-shadow: 1px 1px #000;	}
#SearchFilter	{ position: absolute; top: 10px; display: none; opacity: 0; transition: all 1.2s ease; }

FORM.Search	{ display: block; position: relative; /* top: 120px; */ margin: 0px auto; background-color: #000000C0;
		  min-height: 120px; min-width: 360px; border: 1px solid #888; width: fit-content;
		  padding: 10px 20px; box-shadow: 8px 8px 8px #000000A0; transition: opacity 1s ease;
	}

FORM.Search DIV.Col				{ display: inline-block; }
FORM.Search DIV.Col:first-child	{ margin-right: 20px; }
FORM.Search LABEL		{ display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; padding: 5px 0px; cursor: pointer; }
FORM.Search LABEL B	{ border: 1px solid #F97A44; display: inline-block; padding: 0px; width: 18px;
				  font: 400 16px FontAwesome; color: #FFF; height: 18px;
				  background-color: #FFF; vertical-align: text-bottom; border-radius: 5px; }
FORM.Search LABEL U	{ color: #FFF; text-decoration: none; display: inline-block; margin: 0px 10px; text-shadow: 2px 2px 0px #000; }

FORM.Search DIV.Row1	{ display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; }
FORM.Search #Sel,
FORM.Search #Clr		{ display: inline-flex; margin: 5px 10px; }
FORM.Search #Sel B		{ background-color: green; }
FORM.Search #Clr B		{ background-color: red; padding-left: 1.4px; }
FORM.Search P			{ color: #FFF; margin: 5px 0px; max-width: var(--form-max-width); }

FORM.Search DIV.Row3	{ display: flex; flex-direction: row; justify-content: space-evenly; align-items: center; }
FORM.Search INPUT[type=text]	{ display: block; width: 100%; font: 15pt 'PT Sans',sans-serif;
		margin: 0px 10px 0px 0px; padding: 4px 2px; }

FORM.Search SELECT		{ display: block; font: 15pt 'PT Sans',sans-serif; margin: 0px 10px; padding: 4px 2px; }

FORM.Search INPUT[type=button]	{ display: block; margin: 10px 0px; box-shadow: 3px 3px 2px #000000A0;
		font: 16pt Monda, sans-serif; line-height: 24px; display: block; padding: 5px 15px 7px;border-radius: 5px;
		background: linear-gradient(to bottom, #DDD, #888); color: #FFF; text-shadow: 1px 1px #000; }

FORM.Search .Warning	{ display: none; font: 14pt 'PT Sans', sans-serif; text-shadow: none; text-align: center; margin: 10px auto;
	color: #FFF; background-color: red; width: fit-content; padding: 10px 20px; border-radius: 5px; max-width: var(--form-max-width); }

/**************************************************************/
/* Account Page - Submit Location Form */
FORM.Account	{ display: block; position: relative; margin: 20px auto; background-color: #000000C0;
		  width: fit-content; max-width: 700px; border: 1px solid #888; padding: 20px 30px;
		  box-shadow: 8px 8px 8px #000000A0; }
FORM.Account LABEL		{ display: block; color: #FFF; margin: 10px 0px 4px; }
FORM.Account INPUT[type=text],
FORM.Account INPUT[type=email],
FORM.Account INPUT[type=tel],
FORM.Account INPUT[type=url]	{ display: block; width: 100%; font: 15pt 'PT Sans',sans-serif; padding: 4px 6px; box-sizing: border-box; }
FORM.Account P			{ color: #FFF; max-width: var(--form-max-width); }
FORM.Account TEXTAREA	{ display: block; width: 100%; height: 56px; font: 12pt 'PT Sans',sans-serif; padding: 4px 6px; box-sizing: border-box; resize: vertical; }
FORM.Account .Warning	{ display: none; font: 14pt 'PT Sans', sans-serif; text-shadow: none; text-align: center; margin: 10px auto;
	color: #FFF; background-color: red; width: fit-content; padding: 10px 20px; border-radius: 5px; max-width: var(--form-max-width); }
FORM.Account .Warning.Success	{ background-color: green; text-align: left; width: fit-content; max-width: 480px; }
FORM.Account .Warning.Success P	{ margin: 6px 0px; max-width: none; }
FORM.Account DIV.AccSuccessButtons	{ display: flex; justify-content: center; gap: 15px; margin-top: 10px; }
FORM.Account DIV.AccSuccessButtons INPUT[type=button]	{ margin: 0px; }

FORM.Account DIV.AccRow				{ display: flex; gap: 15px; }
FORM.Account DIV.AccField				{ display: flex; flex-direction: column; flex: 1; min-width: 0; }
FORM.Account DIV.AccRow3 DIV.AccCity	{ flex: 1; }
FORM.Account DIV.AccRow3 DIV.AccState,
FORM.Account DIV.AccRow3 DIV.AccZip	{ flex: 0 0 auto; }
FORM.Account DIV.AccState INPUT[type=text]	{ width: 4ch; }
FORM.Account DIV.AccZip INPUT[type=text]	{ width: 7ch; }

FORM.Account DIV.CatGrid	{ display: grid; grid-template-columns: repeat(5, 1fr); gap: 15px; margin: 15px 0px;
		background-color: #DAEFEEE0; border-radius: 15px; padding: 10px; }
FORM.Account DIV.CatCell		{ display: flex; }
FORM.Account DIV.CatCell LABEL	{ display: flex; flex-direction: column; align-items: center; text-align: center; cursor: pointer; margin: 0px; width: 100%; }
FORM.Account DIV.CatCell U		{ color: #000; text-decoration: none; font: 13pt 'PT Sans',sans-serif; }
FORM.Account DIV.CatIcon		{ display: flex; flex-direction: column; align-items: center; margin-top: auto; padding-top: 8px; }
FORM.Account DIV.CatIcon IMG	{ height: 40px; width: auto; margin-bottom: 6px; }
FORM.Account DIV.CatIcon B		{ border: 1px solid #F97A44; display: inline-block; padding: 0px; width: 22px;
		  font: 400 19px FontAwesome; color: #FFF; height: 22px; background-color: #FFF; margin: 5px 0px 20px;
		  vertical-align: text-bottom; border-radius: 5px; }

FORM.Account INPUT[type=button]	{ display: block; margin: 20px auto 0px; box-shadow: 3px 3px 2px #000000A0;
		font: 16pt Monda, sans-serif; padding: 5px 15px 7px; border-radius: 5px; border: none; cursor: pointer;
		background: linear-gradient(to bottom, #DDD, #888); color: #FFF; text-shadow: 1px 1px #000; }
}

#popup-container	{ display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
					  background-color: rgba(0, 0, 0, 0.7); justify-content: center; align-items: center; opacity: 0;
					  transition: opacity 0.3s ease-in-out; z-index: 1000; }
popup-image			{ background-color: white; padding: 20px; border-radius: 8px; max-width: 90%; max-height: 90%;
					  overflow: auto; position: relative; }

MAIN { width: 80%; /* background-color: #10364C; */ min-height: 50px; color: #FFF; margin: 20px auto 0px; padding: 10px 20px; }


}

/*
 * Optional: Makes the sample page fill the window.
 */
html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

#map { height: 100%; width: 100%; opacity: 0; transition: opacity 1s ease; }

 /* Optional styling for the close button within the popup */
  #popup-image button {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 8px 12px;
    cursor: pointer;
    background-color: #f0f0f0;
    border: 1px solid #CCC;
    border-radius: 4px;
    font-size: 1em;
  }

  #popup-image button:hover {
    background-color: #e0e0e0;
  }

.price-tag {
	background-color: #10364C; /* #4285F4; */
	border-radius: 8px;
	color: #FFF;
	font: 14pt Monnda, sans-serif;
	text-shadow: 2px 2px 1px #000;
	padding: 10px 15px;
	position: relative;
}

.price-tag::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translate(-50%, 0);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #10364C;	/* #4285F4; */
}

.cluster-badge {
	display: flex; align-items: center; justify-content: center;
	min-width: 36px; min-height: 36px; border-radius: 50%;
	color: #FFF; font: bold 13pt 'PT Sans', sans-serif; text-shadow: 1px 1px #000;
	box-shadow: 2px 2px 4px rgba(0,0,0,0.4); cursor: pointer; padding: 2px;
	transform: translateY(50%); /* AdvancedMarkerElement anchors content by its bottom edge; re-center the badge on its point */
}
.cluster-paid		{ background-color: #10364C; border: 2px solid #F97A44; }
.cluster-unpaid		{ background-color: rgba(66,133,244,0.55); border: 2px solid #4285F4; }

/**************************************************************/
/* Map Baloon */

/* Adjustments to Google Style */
.gm-style .gm-style-iw	{ }
.gm-style .gm-style-iw-c	{ background-color: #EAF4FF; padding: 0px 0px 0px 10px ! important; } /* Popup Baloon */
.gm-style .gm-style-iw-ch	{
	background: #0080c0 linear-gradient(to bottom, #00a1f2, #005c73); margin: 10px 10px 0px 0px; border-radius: 5px;
    color: #FFF; font: 19pt Oswald, sans-serif; display: flex; justify-content: space-evenly; align-items: center;
	padding: 0px 10px 4px; text-shadow: 2px 1px 0px #000; line-height: 19pt; transition: opacity 1s ease;
}
.gm-style .gm-style-iw BUTTON	{ background: linear-gradient(to bottom, #FF0000, #800000) ! important;
	margin: 12px 10px 0px 0px ! important; border-radius: 5px; opacity: 1 ! important; }
.gm-style .gm-style-iw BUTTON SPAN	{ margin: 4px ! important; background-color: white ! important; }
.gm-style .gm-ui-hover-effect>SPAN	{ }
.gm-style .gm-style-iw-d	{ overflow: hidden ! important; margin-right: 10px ! important; } /* content inside of the baloon */
.gm-style .gm-style-iw-tc::after	{ background: #EAF4FF ! important; }
.zgm-style DIV DIV DIV DIV DIV DIV DIV { font: bold 16pt Monda,sans-serif ! important; xcolor: #000 ! important;
	text-shadow: #FFF 3px 3px 3; zbackground-color: #000; line-height: 18pt ! important;
	padding: 0px 0px 0px 0px; border: 0px solid black; }

.MapLabel	{ color: red; }

/* NetChain Additions */
DIV.info	 	{ display: flex; }
DIV.info H3,
DIV.info H4		{ margin: 0px; }
DIV.info H3		{ font: 20pt Oswald,helvetica; border-bottom: 1px solid #000; }
DIV.info H4		{ font: 18pt 'PT Sans',helvetica; margin-top: 5px; }
DIV.info H5		{ font: 16pt 'PT Sans',helvetica; margin: 5px 0px 10px; }
DIV.info IMG	{ max-width: 220px; height: auto; display: block; margin: 10px 10px 10px 0px; border: 1px solid #CCC, border-radius: 10px; }
DIV.info ADDRESS{ font: 14pt 'PT Sans',sans-serif; margin: 10px 0px; }
DIV.info A.tel	{ font: 14pt Monda,sans-serif; }
DIV.info A.nav	{ font: 11pt Monda,sans-serif; color: #FFF; background: linear-gradient(to bottom, #0000FF, #00008C);
				  border-radius: 5px; text-decoration: none; display: block; width: fit-content; padding: 1px 10px; margin-top: 5px; }


.gm-style .gm-style-iw BUTTON,
.gm-style .gm-style-iw BUTTON.gm-ui-hover-effect,
BUTTON.gm-ui-hover-effect		{ width: 32px ! important; height: 32px ! important; top: -1px ! important; right: 1px ! important; }
BUTTON.gm-ui-hover-effect IMG	{ width: 32px ! important; height: 32px ! important; margin: 0px ! important; }



