@import url('https://fonts.googleapis.com/css?family=Merriweather|Muli');

<<link href="https://fonts.googleapis.com/css?family=Merriweather|Muli" rel="stylesheet">/>
/************************************************
 * TABLE OF CONTENTS
 ************************************************
 * 1. BASIC STYLING
 * 2. HEADER
 * 3. MAIN
 */

/* 1. BASIC STYLING */
html {
  box-sizing:border-box;
  font-size:100%;
}
*, *::before, *::after {
  box-sizing:inherit;
}
h1 {
  font-family: 'Merriweather', serif;
  color : #000;

}
body {
  margin:0;
  font-family: 'Muli', sans-serif;
  color : #828282;
}
p {
  line-height:1.25;
}

.page {
  max-width:1024px;
  margin:0 auto;
}
.hidden {
  position:absolute;
  left:-10000px;
}

/* 2. HEADER */
#header, main, #footer {
  padding:1em;
}

header {
  /*border:
  margin-bottom:1em; */
  background-color: #d3d3d3;

}

main {
  border:1px
  width:52.5%;
  display:inline-block;
  margin-left:0%;
  margin-right:0%;
}

.container {
    position: relative;
 }

 .centerer {
    text-align: center;
    margin: 20px auto;
    width: 80%;
 }

 .button {
    cursor: pointer;
    border: 3px solid #27AE60;
    border-radius: 30px;
    width: 200px;
    margin: 10px auto;
    padding: 10px 0;
    background-color: #27AE60
    text color: #fff
 }

 .button:hover {
    background-color: #003306;
    border: 3px solid #003306;
    color: #;
 }

 .btn-small {
    width: 100px;
 }

 .error-message {
    color: red;
    display; none;
 }

 #xregistration-page,
 #successful-registration,
 #claim-page,
 #pending-verification,
 #claim-approval-confirmation {
    display: none;
 }

 .green {
    color: #27AE60;
 } 

 input {
    height: 25px;
    font-size: 15px;
 }

 .spacer {
    padding: 10px 0;
 }
 
 #age-required { 
    opacity: 0;
    font-size: 12px;
 }