/*
----------------------------------------
Filename:    structurepublic.css
Last update: 06-10-2025
----------------------------------------
*/
.tooltip {
  position: relative;
  display: inline-block;
}
.tooltip .tooltiptext {
  visibility: hidden;
  width: 16em;
  top: 100%;
  left: 50%;
  margin-left: -7.5em;
  margin-top: 0.5em;
  background-color: #a66;
  color: white;
  text-align: center;
  padding: 0.2em 0em;
  border-radius: 0.3em;
  font-family: Oxygen, Arial, serif;
  font-size: 0.9em;
  font-style: italic;
  font-weight: normal;
  position: absolute;
  z-index: 1;
}
.tooltip:hover .tooltiptext {
  visibility: visible;
}
.tooltip .tooltiptextsm {
  visibility: hidden;
  width: 18em;
  top: 50%;
  left: 50%;
  margin-left: -7.5em;
  margin-top: 0.0em;
  background-color: #a66;
  color: white;
  text-align: center;
  padding: 0.4em 0.4em;
  border-radius: 0.3em;
  font-family: Oxygen, Arial, serif;
  font-size: 0.8em;
  font-style: italic;
  font-weight: normal;
  position: absolute;
  z-index: 1;
}
.tooltip:hover .tooltiptextsm {
  visibility: visible;
}
.ui-menu {
  border: white solid;
  border-radius: 8px;
  background-color: white;
}
.ui-state-active {
  color: #833 !important;
  border: white solid;
  border-radius: 8px;
  background-color: #dd6 !important;
}
a.hidden {
  color: #833;
}
/* This is the attribute tag for the precinct chair name. Be
careful of what is applied here. Generally a color attribute 
is all that is needed. */
a.hidden:link {
    text-decoration: none;
}
body {
    background-color: #A1C3FC;
    background-image: url("../images/header_background6.jpg");
    background-size: cover;
}
div#bottom { /* bottom containts the website area between the header and footer components. */
}
div#footer { /* footer does not need height attributes. */
    width: 100%;
    text-align: center;
    padding-top: 0.5em;
    color: white;
}
div#headercontent {
    margin: 0.2em 0.4em;
}
div#headertop {
    margin-right: 1em;
    margin-top: 1em;
    float: right;
}
div#login {
    width: 15em;
    margin-top: 1em;
}
div#loginreq {
    margin-left: auto;
    margin-right: auto;
    margin-top: 2em;
    margin-bottom: 2em;
    width: 50%;
}
div#main { /* main is the top level container for the website. */
    margin: 0;
}
div#navblock {
    margin-left: 1.0em;
    float: left;
}
div#orginput {
    margin-top: 1.0em;
    margin-right: 1.0em;
}
div#orgname {
    margin: 1.5em 1.0em 0.0em 0.2em;
}
div#orglogin {
    margin: 1.5em 1.0em;
}
div#statbody {
    background-color: #A1C3FC;
    margin: 0.2em 0.4em;
    padding: 0.2em 0.5em 1.2em 0.5em;
    overflow: visible;
}
div#statbodymob {
    background-color: #A1C3FC;
    margin: 0.2em 0.4em;
    padding: 0.2em 0.5em 1.2em 0.5em;
    overflow: visible;
    border: 1px solid #3aa;
    border-radius: 9px;
}
/* The div title attribute is used to display the website title. */
div#title {
    color: #1B1783; 
    font-family: Oxygen, Arial, Helvetica;
    font-size: 44pt;
    font-weight: bold;
    font-style: italic;
    text-shadow: -2px -2px whitesmoke;
    margin: 0.3em 1.0em;
}
div#titlemob {
    color: #1B1783; 
    font-family: Oxygen, Arial, Helvetica;
    font-size: 16pt;
    font-weight: bold;
    font-style: italic;
    text-shadow: -2px -2px whitesmoke;
    margin-top: 0.1em;
    text-align: center;
}
div#top { /* top contains the header and navigation components. */
    padding: 0;
    border: 0;
    margin: 0;
    width: 100%;
    height: 15%;
}
div#topmobile { /* top contains the header and navigation components. */
    padding: 0;
    border: 0;
    margin: 0;
    overflow: auto;
}
/* userbody is used to display any user theme with the body, or content
portion of the web page. The height and width attributes should not be
specified absolutely, since the userheader is contained in an absolutely
defined div. */
div#userbody {
    margin: 0.2em 0.4em;
    padding-bottom: 1.2em;
    overflow: hidden;
}
/* userheader is used to display any user theme with the body header,
which is the top "static" portion of all web pages prior to the content
portion of the web page (articles, events, etc.) The height and width
attributes of this div should not be specified absolutely, since the
userheader is contained in an absolutely defined div. */
div#userheader {
    /*background-color: #A1C3FC;*/
    margin: 0.2em 0.4em;
    height: 8.0em;
    width: 99%;
    display: flex;
    justify-content: space-between;
}
div.menuitemv {  /* Normal, not selected */ 
    padding: 0.2em 0.5em;
    margin: 0.5em 0;
    font-family: Calibri, Cambria, Arial;
    font-weight: normal;
    font-style: italic;
    font-size: 1.3em;
    background-color: #888888;
    color: #CCC;
    border: 1px solid silver;
    border-radius: 12px;
    box-shadow: 5px 5px 2px #833;
}
div.menuitemv:hover { /* Hover style */
    background-color: #444444;
    color: #EEEEEE;
    border: 1px solid #3aa;
    box-shadow: 3px 3px 2px #bb4;
}
div.menuitemva { /* Active, menu selected */
    padding: 0.2em 0.5em;
    font-family: Calibri, Cambria, Arial;
    font-weight: normal;
    font-style: italic;
    font-size: 1.4em;
    background-color: #686868;
    color: #EFF;
    border: 1px solid silver;
    border-radius: 12px;
    box-shadow: 3px 3px 2px #44a;
}
div.menuitemvs {  /* Special, not selected */ 
    padding: 0.2em 0.5em;
    margin: 0.5em 0;
    font-family: Calibri, Cambria, Arial;
    font-weight: normal;
    font-style: italic;
    font-size: 1.3em;
    background-color: #FFFF80;
    color: #229;
    border: 1px solid silver;
    border-radius: 12px;
    box-shadow: 5px 5px 2px #833;
}
div.menuitemvs:hover { /* Hover style */
    font-family: Calibri, Cambria, Arial;
    font-weight: normal;
    font-style: italic;
    font-size: 1.4em;
    background-color: #444444;
    color: #EEEEEE;
    border: 1px solid #3aa;
    box-shadow: 3px 3px 2px #bb4;
}
div.menurow {
    padding-bottom: 1.0em;
    clear: both;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
div.menurowmobile {
    padding-bottom: 1.0em;
    clear: both;
}
div.menuv {
    margin-top: 0.8em;
}
div.mobile {
    margin-left: 1.0em;
}
/* userstyle is used to display headers, which include articles, calendar
events and news/commentary headers. */
h2.userstyle {
    font-family: Arial, Times, serif;
    font-weight: bold;
    font-style: italic;
    font-size: 16pt;
    text-align: left;
    color: #A52A2A;
}
li.mobile { 
    margin: 1.0em;
    list-style: none;
}
p.login {
    font-family: Palatino, Times, serif;
    font-weight: normal;
    font-style: normal;
    font-size: 0.9em;
    color: #222222;
    margin: 0;
}
p.footer {
    font-family: Palatino, Times, serif;
    font-weight: normal;
    font-style: normal;
    font-size: 0.7em;
    color: black;
    margin: 0.2em;
}
/* The span menuitemv is used to display the left side menu block. */
span.menuitemv {  /* Normal, not selected */ 
    padding: 0.2em 0.5em;
    margin-right: 0.8em;
    font-family: Calibri, Cambria, Arial;
    font-weight: normal;
    font-style: italic;
    font-size: 1.1em;
    background-color: #4169E1;
    color: #CCC;
    border: 1px solid silver;
    border-radius: 12px;
    box-shadow: 5px 5px 2px #833;
}
span.menuitemv:hover { /* Hover style */
    background-color: #671a6a;
    color: #EEEEEE;
    border: 1px solid #3aa;
    box-shadow: 3px 3px 2px #bb4;
    cursor: pointer;
}
span.menuitemva { /* Active, menu selected */
    padding: 0.2em 0.5em;
    margin-right: 0.8em;
    font-family: Calibri, Cambria, Arial;
    font-weight: normal;
    font-style: italic;
    font-size: 1.4em;
    background-color: #671a6a;
    color: #EFF;
    border: 1px solid silver;
    border-radius: 12px;
    box-shadow: 3px 3px 2px #44a;
}
span.menuitemvs {  /* Special, not selected */ 
    padding: 0.2em 0.5em;
    margin-right: 0.8em;
    font-family: Calibri, Cambria, Arial;
    font-weight: normal;
    font-style: italic;
    font-size: 1.3em;
    background-color: #FFFF80;
    color: #229;
    border: 1px solid silver;
    border-radius: 12px;
    box-shadow: 5px 5px 2px #833;
}
span.menuitemvs:hover { /* Hover style */
    padding: 0.2em 0.5em;
    margin-right: 0.8em;
    font-family: Calibri, Cambria, Arial;
    font-weight: normal;
    font-style: italic;
    font-size: 1.4em;
    background-color: #444444;
    color: #EEEEEE;
    border: 1px solid #3aa;
    box-shadow: 3px 3px 2px #bb4;
}
span.menuitemvsa {  /* Special, not selected */ 
    padding: 0.2em 0.5em;
    margin-right: 0.8em;
    font-family: Calibri, Cambria, Arial;
    font-weight: normal;
    font-style: italic;
    font-size: 1.3em;
    background-color: #FFFF80;
    color: #229;
    border: 1px solid silver;
    border-radius: 12px;
    box-shadow: 5px 5px 2px #833;
}
span.mobile {
    display: inherit;
}
span.titleemph {
    color: whitesmoke; 
    text-shadow: -2px -2px #A1C3FC;
}