@import url('https://fonts.googleapis.com/css2?family=Wallpoet&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

html,
body {
	margin:0px;
	padding:0px;
	font-family: 'Roboto',"Segoe UI", Tahoma, Geneva, sans-serif;
	line-height: 1.42857;
	background-color:#333;
	color:#FFF;
}
h1#title {
	background-repeat: no-repeat;
	background-position: top left;
	background-color:transparent;
	text-indent:120px;
	font-size:80px;
	height:100px;
	margin-top:0px;
	margin-left:10px;
	margin-bottom:0px;
}
h1#title a:link,
h1#title a:visited,
h1#title a:active {
	font-family: 'Wallpoet', "Segoe UI", Tahoma, Geneva, sans-serif;
	text-decoration:none;
	color:#FFF;
    font-weight: 400;
}
span#extras {
	background-color:#CCC;
	color:#000;
	font-size:12px;
	border-radius: 20px 0 0 20px;
	padding:4px 6px;
	float:right;
	margin-top:5px;
}
span#extras img {
	vertical-align: middle;
}
span#extras a:link {
	font-weight:bold;
	color:#000;
	text-decoration:none;
}
span.nobreak {
	white-space: nowrap;
}
a:link {
	color:#000;
}
a:active,
a:visited {
	color:#000;
}
table tr td {
	padding:2px;
}
table tr:nth-child(even) {
	background: #777;
}
table tr:nth-child(odd) {
	background: transparent;
}
table tr th {
	background:#0099cc;
	color:#EEE;
	padding:6px;
}
label {
	margin-left:15px;
}
div#current-conditions {
	padding-left:10px;
	padding-top: 10px;
}

div#current-conditions table {
	float:left;
	margin-right:20px;
	background-color:#666;
	padding:10px;
}
div#current-conditions table#moonandvane {
	padding:0px;
	margin:0px;
	float:none;
	width:100%;
}

div#current-conditions div#mapContainer {
	float:left;
	width:608px;
	padding:0px;
	margin:0px;
}

div#current-conditions div.mapTitle {
	background:#0099cc;
	color:#EEE;
	padding:6px;
	font-weight:bold;
	text-align:center;
}

div#current-conditions div.mapNewLine {
	padding:10px !important;
	background-color:#666;
}

div#current-conditions div#map_canvas {
	overflow: hidden;
	width:608px;
	height:300px;
	color:#000;
}
div#current-conditions  div#map_canvas table {
	float:none;
	margin:0px;
	background-color:transparent;
	padding:0px;
}
div#current-conditions  div#map_canvas label {
	margin-left:2px;
	margin-right:10px;
}
div#current-conditions td#sunrise,
div#current-conditions td#sunset {
	background-repeat:no-repeat;
	text-indent:64px;
}

div#current-conditions div#map_canvas table tr {
	background: transparent;
}
div#current-conditions div#map_canvas table tr th,
div#current-conditions div#map_canvas table tr td {
	background: transparent;
	color: #000;
	padding:2px;
}

div#current-conditions table td.statusBox {
	text-align:center;
	font-size:28px;
}
div#current-conditions table div#currentTemp {
	font-size:56px;
	font-weight:bold;
	text-align:center;
	padding: 0 10px;
}
div#current-conditions table div#highlow {
	font-size:24px;
	font-weight:bold;
	text-align:center;
}
div#forecast {
	padding:20px 10px;
	clear:both;
}
div#forecast table {
	background-color:#666;
	border:10px solid #666;
	border-collapse:collapse;
}
div#forecast table td {
	text-align:center;
	vertical-align:top;
	border-left:2px solid #333;
}
div#forecast table td p {
	margin:0px;
}
div#forecast table th {
	border:2px solid #666;
}
div#forecast table tr#forecastTempRow {
	font-size:24px;
}
div#forecast table td
div#forecast table td.description {
	font-weight:normal;
	vertical-align:top;
}
div#forecast table td p span.bolder {
	font-weight:bold !important;
}
div#pageOptions {
	margin-top:15px;
	margin-left:10px;
}
div#pageOptions table {
	background-color:#666;
	padding:10px;
	width:100%;
}
div#pageOptions table td {
	padding:10px;
}
div#pageOptions select,
div#pageOptions input[type=button] {
	border: 1px solid #000;
	background-color:#777;
	font-size:16px;
}
div#pageOptions input[type=button] {
	margin-left:10px;
}
div#pageOptions select option:hover {
	color:#EEE;
	box-shadow: 0 0 10px 100px #0099cc inset;
}

#footer {
	text-align:center;
	font-size:10pt;
	color:#888;
}
#footer a:link,
#footer a:visited,
#footer a:active {
	color:#FFF;
	text-decoration: none;
}
#footer span {
	padding-left: 10px;
	padding-right: 10px;
}
div#hourlyWeather {
	margin-left:10px;
	margin-right:10px;
	clear:both;
}
div#hourlyWeather table {
	background-color:#666;
	padding:10px;
	width:100%;
}
div#hourlyWeather table td {
	text-align:center;
	vertical-align:top;
	height:100%;
	background-color:#666;
}
div#weatherControl,
div#sunControl {
	background-color:white;
	padding:1px 6px;
	border-radius:2px;
	border:1px solid rgba(0, 0, 0, 0.14902);
	box-shadow:rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px;
	-webkit-background-clip:padding-box;
}
div#weatherControl input,
div#sunControl input {
	margin:1px 1px 0px 1px;
	vertical-align:middle;
}
div#weatherControl label,
div#sunControl label {
	font-weight:500;
	font-size:11px;
	color:#000;
}
span.smaller {
	font-size:80%;
}
.infoTable {
    padding-bottom: 30px;
}