@media screen and (min-width: 600px) {
    body {
        max-width: 750px!important;
        margin: 0 auto!important;
        background-position: center top;
        background-size: 750px;
    }
    .bottom {
        max-width: 750px!important;
    }
    /*
       body > div:nth-child(3) > img:nth-child(5) {
           top: 300px!important;
       }
       .welcomeMessageStyle {
           max-width: 550px!important;
           margin: 0 100px!important;
           margin-top: 200px !important;
       }
       .spacer {
           height: 70px!important;
       }
       .bottomSpacer {
           height: 1em;
       }
       .bottomFill {
           padding-bottom: 1em;
       }
    */
}

/* For narrow phones, like the iPhone 5 -- shrink the font-size of the initial description under the logo */
@media screen and (max-width: 330px) {
    .waveHeaderText {
        font-size: 108%;
        font-weight: bold;
        margin-top: 0.5em;
    }
}
@media screen and (min-width: 331px) {
    .waveHeaderText {
        font-size: 140%;
        font-weight: bold;
        margin-top: 0.5em;
    }
}

.unindentList ul { margin-left: -12px;  line-height: 120%; }
.unindentList ol { margin-left: -12px;  line-height: 120%; }
.unindentList li { margin-top: 0.4em;   line-height: 120%; }
.unindentList li span {
    position: relative;
    left: -0.2em;
    line-height: 120%;
}
p { line-height: 120%; }
p + ul { margin-top: -0.8em; }
ul + p { margin-top: -0.8em; }

html, body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
    max-width: 25em;
    margin-top: 1px;
    margin: 0;
}

.topBar {
    margin-left:  10px;
    margin-right: 10px;
}
.darkBlueText {
    color: #003052;
}
.pageText {
    margin-left: 10px;
    margin-right: 10px;
}
.button {
    padding-top:    10px;
    padding-bottom: 10px;
    margin-top:      5px;
    margin-bottom:   5px;
    color: white;
    line-height: 100%;
    font-size:   90%;
    text-align: center;
    text-decoration: none;
}
.inactive {
    background-color: rgb(151,151,151);
}
.buttonLink {
    text-decoration: none;
    color: white;
}
.buttonLink:visited {
    color: white;
}
.buttonImage {
    margin-bottom: 5px;
}
/* --- The nailed-to-the-bottom webapp nav buttons ------- */
.bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
    margin-left: 0;
    background-color: #ffffff;
    z-index: 3;
}
.bottomSpacer {
    width: 100%;
    height: 0px;
    background-color: #003052;
}
.pill {
    border: none;
    background-color: #5cace6;
    color:  white;
    padding-top:    0px;
    padding-right:  0px;
    padding-bottom: 0px;
    padding-left: 4px;
    display: inline-block;
    margin:  4px 2px;
    border-radius: 20px;
    font-size: 100%;
    letter-spacing: .1rem;
    text-align: left;
    width: 7em;
}

.fullWidth {
   width: 100vw; 
   max-width: 750px;
}

.howToVoteSpacer { padding-top: 0.5em; }

address-search {
    font-family: 'Roboto';
    display: block;
    width: 93vw;
    max-width: 725px;
    margin: 0 10px 10px 10px;
}

/* ===================================================== */
      .accordion {
          padding: 14px;
          font-weight: bold;
          width: 90%;
          border:    1px solid grey;
          margin-bottom: -1px;
       }

       /* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
       .active, .accordion:hover {
          background-color: #ccc;
       }

       /* Style the accordion panel. Note: hidden by default */
       .panel {
          max-height: 0;
          overflow:   hidden;
          transition: 0.6 ease-in-out;
          opacity:    0;
          width: 90%;
          max-width: 90%;
       }

       .panel.show {
          opacity: 1;
          max-height: 500px;
       }

   .noUnderline { text-decoration: none; }
       .back0 { }
       .back1 { background-color: #d2d2d2; }
       a, a:visited { color: blue; }


       .roundButton {
           color: #ffffff;
           background-color: #5CACE6;
           border-color: #5CACE6;
           border-radius: 15px;
           padding: 8px;
       }