body, html {
    margin: 0;
    padding: 0;
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;

    font-family: "Verdana", "Helvetica", "Arial", sans-serif;
}

header {
    
    padding-top: 1em;
    padding-bottom: 1em;

    overflow: hidden;

    box-shadow: 0 0 5px gray;
}

footer {
    
    padding-top: 1em;
    padding-bottom: 1em;
    background: linear-gradient(#e7e7e7 0, #f7f7f7 100%);
    overflow: hidden;
}

header, footer {
    flex: none;
}

#header-wrapper, .main-wrapper, #footer-wrapper {
    padding-left: 1em;
    padding-right: 1em;
}

@media only screen and (max-width: 480px) {
    #header-wrapper {
        text-align: center;
    }
}

h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
}

.main-wrapper {
    flex: 1 0 auto;
}

.main-wrapper::after {
    content: '\00a0';
    display: block;
    height: 0;
    visibility: hidden;
}

footer .menu {
    float: right;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

footer .menu li {
    text-align: right;
}

.notice {
	background:none repeat scroll 0 0 #FFFFDD;
	border:1px solid #FFFF00;
	padding:10px;
}
.error {
	background:none repeat scroll 0 0 #FFDDDD;
	border:1px solid #FF0000;
	padding:10px;
}
.notice p {
	padding: 0;
	margin: 0;
}

.notice, .error
{
padding:10px; 
margin: 25px 25px;
display: none;
}
.wrapper, #header-wrapper, #footer-wrapper {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}


.help span{
    position: absolute;
    right: 0;
    display: none;
    border: 1px solid gray;
    background: white;

    box-shadow: 0px 0px 50px rgb(200,200,200);

    min-width: 300px;
    padding: 3px;
}

.help {
    float: right;
}

.help:hover span{
    display: block;
}

.help img {
    z-index: 999;
    position: relative;
    vertical-align: middle;
}

.help {
    /*float: left;*/
    position:relative;
    display: inline-block;
    /*font-weight: bold;*/
    /*text-align: center;*/

    margin-left: 6px;

}

.help a {
    text-decoration: none;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
}

/* responsive searchtable */

@media (max-width: 750px) {
  
  table, thead, tbody, th, td, tr { 
    display: block; 
  }

  .default td {
      text-align: left;
  }

  #search_results {
    overflow-x: hidden;
    min-width: 230px;
    width: 90%;
    margin-left: 5%;
  }
  
  .searchtable td { 
    /* Behave  like a "row" */
    border-bottom: 1px solid #eee;
    position: relative;
    text-align: right; 
  }

  .searchtable .header {
    display: none;
  }

  .searchtable td:before { 
    float: left;
    padding-right: 10px; 
    white-space: nowrap;
    /* Label the data */
    content: attr(data-label);

    color: #000;
    font-weight: bold;
  }

}

.searchtable {
    width: 100%;
}

.searchtable .header {
    background: #00aaef;
    color: white;
    text-align: center;
    padding: 0.25em;
}

.searchtable td {
    border-right: 1px solid white;
    padding: 0.25em;
}

.searchtable tr.odd {
    background: #e5e5e5;
}

.container {
    margin-top: 2em;
    margin-bottom: 2em;
}

.index form {
    display: block;
    max-width: 394px;
    margin-left: auto;
    margin-right: auto;
}

.pure-form.pure-form-stacked input.forminput {
    display: inline-block;
}

input[type=text], input[type=password], input[type=email], input[type=url], input[type=date], input[type=month], input[type=time], input[type=datetime], input[type=datetime-local], input[type=week], input[type=number], input[type=search], input[type=tel], input[type=color], input[type=file] {
    line-height: 20px;
}

.pure-form select {
    height: 38px;
}

input[type=submit] {
    margin: 0.25em 0;
    min-height: 50px;
    min-width: 110px;
    text-transform: uppercase;
    padding: 0.5em 1em;
    background: #00aaef;
    color: white;
}

input {
    border: 1px solid #ccc;
    border-radius: 3px;
}

#search_results {
    display: none;
}

.pure-form legend {
    font-size: 16pt;
    border-bottom: 0;
}

.g-recaptcha {
    display: inline-block;
}

.recaptcha {
    text-align: center;
}

#no-sub {
    text-align: center;
    background-color: #ffdddd;
    color: #ff0000;
    border: 1px solid #ff0000;
    padding: 60px;
}

#logo {
    max-width: 100%;
}