/**********************************
 * TITLE: Gila Screen Stylesheet  *
 * URI  : gila/gila-screen.css    *
 * MODIF: 2003-Apr-30 19:09 +0800 *
 **********************************/

/* Modified 28-March-2026 by Ted ROche to support DARK mode only
 * Requires update to 
 * Settings.php to add a $SITE['CSSscreenDark']
 * top.php to add the darkmode stylesheet to the top AFTER the primary stylesheet
 */

@media (prefers-color-scheme:dark) { /* If the dark scheme is specifically requested: */

  body {
  color: white;
  background-color: black;
}

/* New */ 
  a { color: lightblue; }
  a:visited { color: orchid; }
  a:hover {color: cornflowerblue;}

#page {
        color: white;
        background-color: dimgray;
}

/* ##### Header ##### */

#header {
  color: inherit;
  background-color: #3173B1;
}

.headerTitle a {
  color: black;
  background-color: transparent;
}

.headerTitle span {
  color: white;
  background-color: transparent;
}

.headerTemp {
  color: white;
}

.subHeader {
  color: white;
  background-color: #666666;
}

.subHeaderRight {
  color: white;
  background-color: #666666;
}

.subHeader a {
  color: violet;
  text-decoration: none;
  font-weight: bold;
}

/* ##### Left Side Bar ##### */

.leftSideBar .sideBarTitle {
  color: ivory;
  background-color: #3173B1;
}

.leftSideBar a {
  color:ivory;
  background-color: transparent;
}

.leftSideBar a:visited {
  color: orchid;
  background-color: transparent;
}

.leftSideBar a:hover {
  background-color: cornflowerblue;
  color: dimgray;
}

.leftSideBar .sideBarText {
  color: white;
  background-color: transparent;
}

.leftSideBar .thisPage {
  color: white;
  background-color: transparent;
}

/* ##### Main Copy ##### */

#main-copy {
  color: white;
  background-color: dimgray;
  border-left-color: rgb(216,210,195);
}

#main-copy-dark {
  color: dimgray;
  background-color: white;
  border-left-color: rgb(216,210,195);
}

#main-copy h1 {
  color: white;
  background-color: transparent;
  border-top-color: rgb(216,210,195);
}

#main-copy a {
  color: #336699;
  background-color: transparent;
}

.table-top {
  color: white;
  background-color: #96C6F5;
}

/* TODO: this black text on while, and the background is not gray. Needs troubleshooting */
.column-dark {
  color: black;
  background-color: dimgray;
}

.column-light {
  color: white;
  background-color: dimgray;
}

.watchBox {
  color: white;
  background-color: #FF9900;
  border-color: rgb(34,70,79);
}
#main-copy .watchBox a {
  color: blue;
}
#main-copy .watchBox a:hover {
  color: blue;
  background-color: inherit;
}

.advisoryBoxnoactive {
  color: white;
  background-color: dimgray;
  border-color: rgb(34,70,79);
}

.advisoryBox {
  color: white;
  background-color: #FFCC00;
  border-color: rgb(34,70,79);
}
#main-copy .advisoryBox a {
  color: blue;
}
#main-copy .advisoryBox a:hover {
  color: blue;
  background-color: inherit;
}

.warningBox {
  color: dimgray;
  background-color: #CC0000;
  border-color: rgb(255,255,255);
}
#main-copy .warningBox a {
  color: dimgray;
}
#main-copy .warningBox a:hover {
  color: dimgray;
  background-color: inherit;
}

.tornadowarningBox {
  color: dimgray;
  background-color: #CC0000;
  border: dimgray;
}
#main-copy .tornadowarningBox a {
  color: dimgray;
}
#main-copy .tornadowarningBox a:hover {
  color: dimgray;
  background-color: inherit;
}

/* ##### ajaxSidebar ##### */
.ajaxSidebar {
    background-color: dimgray;
}
.ajaxSidebar h2 {
        color: dimgray;
        background-color: #5B9AD2;
}

.ajaxSidebar .meas {
        color: white;
        background-color: dimgray;
        }
.ajaxSidebar .data {
        color: #3173B1;
        background-color: dimgray;
        }
.ajaxSidebar td {
         background-color: dimgray;
}
.ajaxDashboard .datahead {
        color:  dimgray;
        background-color: #3173B1;
}

.ajaxDashboard .datahead2 {
		border-bottom-color: #CCCCCC;
        color:  dimgray;
        background-color: #3173B1;
}
.ajaxDashboard .data1 {
         color: white;
         border-bottom-color: #CCCCCC;
         background-color: dimgray;
}
.ajaxDashboard .data2 {
         color: white;
         background-color: dimgray;
}
.ajaxDashboard td {
         background-color: dimgray;
}


/* ##### Footer ##### */

#footer {
  color: white;
  background-color: #3173B1;
}

#footer a {
  color: lightblue;
  background-color: transparent;
}

#footer a:visited {
  color: orchid;
  background-color: transparent;
}

.jsuparrow {
background-color:#CDDBCD;
color:#22464F;
}

.jsupoutline {
background-color:#CDDBCD;
border-color: #2266AA;
}

/* WordPress additions for Weather Display PHP AJAX Templates */
/* Copy and paste all of this to the END of your CSS files */

/* Begin Sidebar */
#sidebar
{
	background-color: #F1F8FE;
	}

/* End Sidebar */


/* Begin Calendar */
	background-color: {#fff; }
/* End Calendar */


#sidebar {
    color: white;
	}

small, #sidebar ul ul li, #sidebar ul ol li, .nocomments, .postmetadata, blockquote, strike {
	color: #777;
	}

/* Begin Blog Main Copy */
#blog-main {
  color: white;
  background-color: dimgray;
  border-left-color: rgb(216,210,195);
}

#blog-main-dark {
  color: dimgray;
  background-color: white;
}

#blog-main h1 {
  color: white;
  background-color: transparent;
}

#blog-main h2 {
  color: white;
  background-color: transparent;
}

#blog-main a {
  color: #336699;
  background-color: transparent;
}

/* Captions */

.wp-caption {
	border-color: #ddd;
	background-color: #f3f3f3;
}

/* End captions */

.thread-alt {
  color: white;
  background-color: #F1F8FE;
}

.thread-even {
  color: white;
  background-color: dimgray;
}

/* ##### mjc extra ##### */

.menuLinkSelectedhoriz {
background-color: #3173B1;
color: dimgray;
}

.menuLinkSelected {
background-color: #3173B1;
color: dimgray;
}

/* end of weather-screen-blue-narrow-dark.css */
} /* end dark mode */