/* Flat Aqua Sign Up Form */

body {
	background-color: #fff;
	font: 14px Helvetica;
}
a {
	cursor: pointer;
	color: darkblue;
}
::placeholder {
    text-transform: none;
}

#fieldTable {
	width: 100%;
}

#formContainer {
  float: center;
  width: 380px;
  padding: 30px 20px;
  background-color: #f0f6f9;
  text-align: left;
  border-radius: 5px 0px 0px 5px;
  margin-left: auto;
  margin-right: auto;

}
#formContainer ul {
	list-style: none; 
	margin: 0; 
	padding: 0;
}
.formRow {
	padding: 5px; 
	text-align: left !important;
	clear: both;
}
.fieldName, #collectFunds td {
	margin-bottom:10px;
	color: #5F6C7A;
	vertical-align: middle;
	margin-right: 15px;
	float: none !important;
}

.inputTextField, .object_Contact, .rightElement {
  display: inline;
  margin: 0 auto;
  width: 100% !important;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,.2);
  height: 45px;
  line-height: 45px;
  margin-bottom: 10px;
  font-size: 14px;
  color: rgba(0,0,0,.4);
  font: normal 14px/14px Helvetica, sans-serif;
}
.intl-tel-input {
	width: 100%;
}
.inputTextField:focus, .object_Contact:focus, .rightElement:focus {
	outline: none;
    border-color: #53CACE;
}

input[type="text"] {
  display: block;
  margin: 0 auto;
  width: 100%;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,.2);
  height: 45px;
  line-height: 45px;
  margin-bottom: 10px;
  margin-left: 0px;
  font-size: 14px;
  color: rgba(0,0,0,.4);
}
/*
textarea {
	outline: none;
    border-color: #53CACE;
	}

select {
    background: url('http://app.greenrope.com/users/myteam29042/Media313.png') no-repeat right, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#D3D3D3), color-stop(100%,#D3D3D3));
   appearance:none;
    -webkit-appearance:none;
   -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    width:100%;
    height:30px;
}
*/


#formSubmit {
  margin-top: 25px;
  width: 100px;
  border: 0;
  background-color: #53CACE;
  border-radius: 5px;
  color: white;
  cursor: pointer;
  display: block;
  margin: 15px auto 5px auto;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

 #formsubmit:hover {
 	background-color:#80A24A;
 }

#reqInfo {margin-bottom: 20px; color: #FFCC02 !important;}
.formText {
	color: #808080;
	text-shadow: #f5ffff 0 1px 0;
	margin-bottom:20px !important;
	width: 300px !important;
	display: block;
}
#confirmText {
	display: block;
    font-size: 12px;
    color: #D3D3D3;
}
.introText {
	font: 24px "Trebuchet MS", Arial, Helvetica, sans-serif;
    padding: 0px 0px 10px 40px;
    display: block;
    text-align: left;
    border-bottom: 1px solid #F5F5F5;
    margin: -10px -30px 10px -30px;
    color: #5F6C7A !important;
	}
.userCheckboxes {
	clear: both;
}
#teamSelection {display: inline-block; width: 100%; color:#D3D3D3!important;}
li#field_BirthdayMM.formRow {margin-bottom: 20px;}
li#field_Gender.formRow {margin-bottom: 20px;}

#emailEntryAlert {
	color:	#D3D3D3;
}

.reqMarker {
	font-size: 12px;
	color:	#FFCC02 !important;
}

li select {
	margin-left: 0px !important;
	padding:	5px;
}

#collectFunds {
	color: #fff;
}

#collectFunds span {
	color:	#fff;
}

.teamCheck {
	color: #d3d3d3 !important;
}


#collectFunds {
	margin-left: 0px;
}
#collectFunds td {
	text-align: left !important;
	margin-bottom: 0px;
	display: block;
	margin-left: 10px;
}
#collectFunds table {
	background: transparent;
}
#collectFunds .inputTextField {
	margin-bottom: 20px !important;
}


/* custom object styles */
input[type=checkbox].object_Contact, select.object_Contact {
	display: inline-block;
	width: auto !important;
}
.objectImage, .objectFile {
	padding: 5px;
}
.objectSet {
	margin: 8px 0px;
	text-align: left;
}
.objectSet .mask-variable {
	display: inline-block;
	margin-top: -4px;
	margin-left: 3px;
	vertical-align: middle;
}
.objectDatetime {
	line-height: 32px;
}
.objectDatetime select {
	vertical-align: inherit !important;
}



/******************* Responsive Styles *******************/
@media screen and (max-width : 1024px){

form {
    width: 100%;
  background-size: 100%;
}
body {
    width:  100%;
}
#formContainer img {
    max-width:  100%;
}
#container {
    margin: 10px !important;
      margin-left: auto !important;
  margin-right: auto !important;
}
}
@media screen and (max-width : 480px){
#formContainer {
    padding:    10px;
}
.inputTextField, .rightElement {
    width:  95%;
}
}


/* new style of checkboxes */
.newCheckboxWrapper {
  display: inline-block;
  position: relative;
  padding-left: 24px;
  margin-bottom: 15px;
  cursor: pointer;
  font-size: 14px;
  text-align: left;
}
.newCheckboxWrapper input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}
.newCheckboxIndicator, .newCheckboxIndicatorRed, .newCheckboxIndicatorGreen {
  position: absolute;
  top: -1px;
  left: 0px;
  height: 16px;
  width: 16px;
  background: #e6e6e6;
  outline: 1px solid #ccc;
}
.newCheckboxWrapper:hover input ~ .newCheckboxIndicator, .newCheckboxWrapper input:focus ~ .newCheckboxIndicator {
  background: #ccc;
}
.newCheckboxWrapper input:checked ~ .newCheckboxIndicator {
  background: #428BCA;
}
.newCheckboxWrapper:hover input:not([disabled]):checked ~ .newCheckboxIndicator, .newCheckboxWrapper input:checked:focus ~ .newCheckboxIndicator {
  background: #5BC0DE;
}
.newCheckboxWrapper input:checked ~ .newCheckboxIndicatorRed {
  background: #B64700;
}
.newCheckboxWrapper:hover input:not([disabled]):checked ~ .newCheckboxIndicatorRed, .newCheckboxWrapper input:checked:focus ~ .newCheckboxIndicatorRed {
  background: #FF946D;
}
.newCheckboxWrapper input:checked ~ .newCheckboxIndicatorGreen {
  background: #5CB85C;
}
.newCheckboxWrapper:hover input:not([disabled]):checked ~ .newCheckboxIndicatorGreen, .newCheckboxWrapper input:checked:focus ~ .newCheckboxIndicatorGreen {
  background: #76DF5B;
}
.newCheckboxWrapper input:disabled ~ .newCheckboxIndicator, .newCheckboxWrapper input:disabled ~ .newCheckboxIndicatorRed, .newCheckboxWrapper input:disabled ~ .newCheckboxIndicatorGreen {
  background: #e6e6e6;
  opacity: 0.6;
  pointer-events: none;
}
.newCheckboxIndicator:after, .newCheckboxIndicatorRed:after, .newCheckboxIndicatorGreen:after {
  content: '';
  position: absolute;
  display: none;
}
.newCheckboxWrapper input:checked ~ .newCheckboxIndicator:after, .newCheckboxWrapper input:checked ~ .newCheckboxIndicatorRed:after, .newCheckboxWrapper input:checked ~ .newCheckboxIndicatorGreen:after {
  display: block;
}
.newCheckboxWrapper .newCheckboxIndicator:after, .newCheckboxWrapper .newCheckboxIndicatorRed:after, .newCheckboxWrapper .newCheckboxIndicatorGreen:after {
  left: 6px;
  top: 2px;
  width: 3px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.newCheckboxWrapper input:disabled ~ .newCheckboxIndicator:after, .newCheckboxWrapper input:disabled ~ .newCheckboxIndicatorRed:after, .newCheckboxWrapper input:disabled ~ .newCheckboxIndicatorGreen:after {
  border-color: #7b7b7b;
}
