@import url('../fonts/futural/stylesheet.css');
@import url(http://fonts.googleapis.com/css?family=Meddon);
body {
background-color: #fff;

color: #222;
font-size: 18px;
font-family: FuturaLight, Helvetica, Arial, sans-serif;
}

h1 {
color: #A7CE39;
text-align: center;
line-height: 0.8;
text-shadow: 0 0 1px #fff;
font-size: 2.7em;
margin: 0.5em;
text-transform: uppercase;
}

h1 i {
display: block;
color: #000;
font-family: 'Meddon', cursive;
font-size: 0.6em;
text-transform: none;
}

button {
background: #fff;
color: #A7CE39;
text-shadow: 1px 1px 2px black;
padding: 0.25em;

width: 4em;
font-size: 1.25em;
cursor: pointer;
border-radius: 0.25em;
border: solid 2px;
margin: 1em auto;
clear: both;
display: block;
margin-bottom: 1em;
}

button:active {
box-shadow: inset 0px 0px 10px black;
color: #aaa;
}


input[type="text"], input[type="email"], input[type="number"] {
width: 250px;
height: 2em;
}


form {
/*width: 460px;*/
margin: 0 auto;
margin-top: 2em;
}

form legend {
  font-weight: bold;
}

form label, .font-style legend {
  display: inline-block;
  line-height: 1.75;
  vertical-align: top;
  text-align: right;
  width: 160px;
}

.message label {
line-height: 1;
}

.message input {
top: 23px;
position: relative;
}

.font-style legend {
float: left;
font-weight: normal;
width: 127px;

  margin-right: 1em;
}

.font-style label {
text-align: left;
width: 80px;
margin-left: 1em;
}

#block {
font-family: block;
}

#script {
font-family: script;
}

input[type="radio"] {
width: initial;
}

fieldset {
position: relative;
width: 500px;
margin: 0 auto;
padding: 0.75em;
}

form fieldset ol {
  margin: 0;
  padding: 0;
}
form li {
  list-style: none;
  padding: 5px;
  margin: 0;
}
form .font-style fieldset {
  border: none;
  margin: 3px 0 0;
}

form em {
  font-weight: bold;
  font-style: normal;
  color: #f00;
}

.flash-message {
color: #A7CE39;
background: #E3E18A;
display: block;
width: 250px;
margin: 1em auto;
border: 2px dotted;
padding: 0.25em;
text-align: center;
padding: 1em;
position: absolute;
top: 220px;
left: 50%;
margin-left: -125px;
border-radius: 1em;
z-index: 1;
}

.error {
color: #f00;
}

.success {
color: #008678;
}



footer {
position: absolute;
bottom: 0;
right: 0;
margin-right: 0.5em;
display: block;
}

footer a {
text-decoration: none;
color: #000;
}

footer a:hover {
text-decoration: underline;
}

a.config {
position: absolute;
bottom: 0;
left: 0;

background: url("../images/cog.png") no-repeat;
width: 48px;
height: 48px;

text-indent: -999px;
overflow: hidden;
}

#config-options-container {
display: none;
}

.config-options {
font-size: 1.25em;
}


.config-options form {
margin: 1em;
}

label.error {
position: absolute;
display: inline-block;
background: #A7CE39;
color: #fff;
text-shadow: 1px 1px 2px #555;
border-radius: 10px;
padding: 5px;
width: 200px;
text-align: center;
border: 1px solid #000;
}

.font-style label.error {
right: -185px;
}

.email label.error {;
width: 280px;
}

.message label.error {
/* right: -220px; */
}


.order-count {
position: absolute;
bottom: 0;
left: 50px;
color: #888;
}


.social-club {
margin-top: 1em;
text-align: center;
}

.social-club .logo {
display: block;
width: 200px;
margin: 0 auto;
}