*
{
box-sizing:border-box;
}
@font-face {
font-family: localpacifico;
src: url(Pacifico-Regular.ttf);
}
html, body
{
  min-height: 100%;
  min-width: 100%;
}
body
{
background-color:#f9f9f9;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
#header
{
position:sticky;
display:table;
overflow:auto;
top:0;
z-index:1;
width:100%;
height:2.5em;
padding:6px;
padding-right:10px;
background-color:#5aa9e6;
border-style:solid;
border-color:#5aa9e6;
border-radius:0 0 5px 5px;
color:white;
}
#headerhome
{
position:relative;
display:table-cell;
float:left;
font-family:localpacifico;
}
.landingfullcontainer
{
position:relative;
height:100%;
width:100%;
padding: 0;
}
.landingcenter
{
display:block;
position:relative;
width:100%;
top:35%;
left:50%;
transform:translate(-50%, -35%);
-ms-transform:translate(-50%, -50%);
}
a
{color:white;}
#headerhome
{
float:left;
}
#heading
{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
float:left;
margin:auto;
}
#headerlogout
{
float:right;
}
.totalholder {
    width: 50%;
    margin: auto;
}
h1
{
text-align:center;
font-family:localpacifico;
color:#5aa9e6;
}
h2
{
text-align:center;
color:#5aa9e6;
}
input[type=text], input[type=number], input[type=tel], input[type=password], input[type=email], select 
{
width:80%;
padding:7px;
border: 1px solid #ccc;
border-radius:4px;
}
label
{
padding: 10px 10px 10px 0;
display: inline-block;
}
input[type=submit], button
{
background-color: #5aa9e6;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
float: left;
}
#formcontainer
{
padding:20px;
}
.landingleftcol
{
float: left;
width: 50%;
margin-top: 6px;
color:grey;
font-size:2em;
text-align: center;
}
.landingrightcol
{
float: left;
width: 50%;
margin-top: 6px;
}
/*For admin registration page */
.lefthalf, .righthalf
{
float: left;
width: 40%;
margin: 6px;
}
.landingrow:after
{
content : "";
display : table;
clear : both;
}
.landingrow
{
margin-bottom: 6px;
}


.container 
{
  display: block;
  position: relative;
  padding-left: 35px;
  padding-bottom: 0px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.container input {
    position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 10px;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #595759;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #5aa9e6;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container .checkmark:after {
  left: 9px;
  top: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background : white;
} 
input[type=submit]:hover, button:hover, #headerhome:hover, #headerlogoutbut:hover
{
background-color:#2e8a21;
}
@media screen and (max-width: 600px)
{
.landingrightcol, .landingleftcol, input[type=submit], input[type=number], input[type=tel], input[type=password], input[type=text], input[type=email]
{
width: 100%;
margin-top: 0;
}
}
