form {
            display: none;
        }
        #container {
            margin-right:auto;
            margin-left:auto;
        }

        @media (min-width:768px) {
            #container {
                width:750px;
                padding-left:15px;
                padding-right:15px
            }
        }
        @media (min-width:992px) {
            #container {
                width:970px
            }
        }
        @media (min-width:1200px) {
            #container {
                width:1170px
            }
        }

        /* Fix for square outline on w3-round inputs */
        input:focus, select:focus {
          outline: none !important;
          box-shadow: 0 0 1pt 1pt #DDDDDD;
        }

        .required:after {
            content:" *";
            color: red;
        }

        .hidden {
            display: none;
        }

        .password-toggle-icon {
            float: right;
            margin-right:5px;
            margin-top: -1.4em;
            position: relative;
            z-index: 2;
        }

        .w3-label {
            margin-top:.5rem; margin-bottom:.25rem; 
        }

        /* I don't know why, but this needs to be tweaked to keep responsiveness */
        select.w3-select { padding-top: 5px !important }



        fieldset {
            margin-bottom: 1.5em;
        }
            Xfieldset > legend {
                font-weight: bold;
            }

        /* Create two equal columns that float next to each other */
        .responsiveColumn {
          float: left;
          width: 50%;
          padding: 5px;
        }

        /* Clear floats after the columns */
        .responsiveRow:after {
          content: "";
          display: table;
          clear: both;
        }

        /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
        @media screen and (max-width: 600px) {
          .responsiveColumn {
            width: 100%;
          }
        }