/* Button styles */
/*-webkit-appearance:none; - This is crucial to stop apple devices changing the style of the button */
input, select, textarea { font-family: Open Sans, sans-serif !important; }
#regBodyContent input[type=submit], #regBodyContent input[type=button] { margin-top: 10px; cursor: pointer; -webkit-appearance: none; background-color: #F78D2B; color: #FFF; font-weight: bold; font-size: 1.1em; padding: 7px 20px; border: none; }
#regBodyContent input[type=submit]:hover { background-color: #FFAA32; }
#regBodyContent input[type=submit][disabled=disabled] {background-color: gray !important}


#regBodyContent.cruftsPress input[type=submit] { cursor: pointer; -webkit-appearance: none; background-color: #a3e953; color: #006954; font-weight: bold; font-size: 1.1em; padding: 7px 20px; border: none; }
  #regBodyContent.cruftsPress input[type=submit]:hover { background-color: #a3e953 }

input[type=submit].buttonOrange {background-color: #FFAA32 !important}
input[type=submit].buttonBlue {background-color: #687c93 !important}
input[type=submit].buttonGreen {background-color: #687c4e !important}

#regBodyContent input[type=email], #regBodyContent input[type=number], #regBodyContent input[type=text], #regBodyContent input[type=password], #regBodyContent textarea { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 4px 5px; color: #333333; background-color: #FFFFFF; border: 1px solid #CCCCCC; }
  #regBodyContent input[type=text].Required, #regBodyContent input[type=password].Required, #regBodyContent textarea.Required, #regBodyContent select.Required { background-color: #E6E7E8; border: 1px solid #CCCCCC; color: #E31837; padding: 4px 5px; font-style: italic; }
#regBodyContent input[type=text].ErrorBox, #regBodyContent input[type=password].ErrorBox, #regBodyContent textarea.ErrorBox, #regBodyContent select.ErrorBox { border-color: #CF2B2B; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; outline: thin; outline-style: dotted; outline-color: invert; -moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.075), 0px 0px 8px rgba(82,168,236,0.6); -webkit-box-shadow:inset 0px 1px 1px rgba(0,0,0,0.075), 0px 0px 8px rgba(82,168,236,0.6); box-shadow:inset 0px 1px 1px rgba(0,0,0,0.075), 0px 0px 8px rgba(82,168,236,0.6); }


#regBodyContent input[type=text]:focus, #regBodyContent input[type=password]:focus, #regBodyContent textarea:focus { border-color: rgba(82,168,236,0.8); -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; outline: thin; outline-style: dotted; outline-color: invert; -moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.075), 0px 0px 8px rgba(82,168,236,0.6); -webkit-box-shadow:inset 0px 1px 1px rgba(0,0,0,0.075), 0px 0px 8px rgba(82,168,236,0.6); box-shadow:inset 0px 1px 1px rgba(0,0,0,0.075), 0px 0px 8px rgba(82,168,236,0.6); }
#regBodyContent input[type=checkbox], #regBodyContent input[type=radio] { border: none; }

#regBodyContent select { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 1px solid #CCCCCC; background-color: #FFFFFF; color: #333333; padding: 4px 5px; }
input[type=checkbox] { border: none; }
input[type=radio] { border: none; }


input[type=submit]:disabled {
  opacity: 0.5
}


#regBodyContent div.buttonGroup { margin: 12px 0 20px 0 }
  #regBodyContent div.buttonGroup input[type=submit] { display: inline-block; margin-left: 60px; font-size: .9em }
    #regBodyContent div.buttonGroup input[type=submit]:first-child { margin-left: 0 }

#regBodyContent div.buttonGroup input[type=submit]:nth-child(1) { background-color: #FFAA32 !important; }
#regBodyContent div.buttonGroup input[type=submit]:nth-child(2) { background-color: #687c93 !important }
#regBodyContent div.buttonGroup input[type=submit]:nth-child(3) { background-color: #687c4e !important }
#regBodyContent div.buttonGroup input[type=submit]:nth-child(4) { background-color: #3E5A91 !important }
#regBodyContent div.buttonGroup input[type=submit]:nth-child(5) { background-color: #767A44 !important }
#regBodyContent div.buttonGroup input[type=submit]:nth-child(6) { background-color: #687c4e !important }

#regBodyContent.cruftsPress div.buttonGroup input[type=submit]:nth-child(1) { background-color: #a3e953 !important; color: #006954 !important; }
#regBodyContent.cruftsPress div.buttonGroup input[type=submit]:nth-child(2) { background-color: #a3e953 !important; color: #006954 !important; }
#regBodyContent.cruftsPress div.buttonGroup input[type=submit]:nth-child(3) { background-color: #a3e953 !important; color: #006954 !important; }


/* RESPONSIVE: MAKE FONTS A BIT BIGGER/EASIER TO READ ON MOBILES */
@media (max-width: 480px) { #regBodyContent input[type=email], #regBodyContent input[type=number], #regBodyContent input[type=text], #regBodyContent input[type=password], #regBodyContent textarea, #regBodyContent select { font-size: 1.1em; }
  input[type='checkbox'] {  width: 20px; height: 20px; background: white; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 2px solid #555; }
  input[type='checkbox']:checked { background: #abd; }
}

div.chk {margin-bottom: 10px; clear: both; text-align: left}
div.chk input[type=checkbox] {float: left;}
 div.chk label  {
 padding-left: 10px; display: table-cell
}
/*Password Tool CSS */
#password_description { font-size: 10px; font-style: italic; }
#password_strength { height: 10px; display: block; }
#password_strength_border { width: 160px !important; height: 10px; border: 1px solid black; }
.strength0 { width: 160px; background: #cccccc; }
.strength1 { width: 40px; background: #ff0000; }
.strength2 { width: 80px; background: #56e500; }
.strength3 { background: #399800; width: 120px; }
.strength4 { background: #4dcd00; width: 160px; }