/* See http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php */
.clearfix:after {
  content:"";
  display:table;
  clear:both;
}

* {
  margin: 0;
  padding: 0;
  outline:0;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  background: #fff url('https://www.agentpiggy.com/static/es/img_new/body.png') repeat-x top;
  height: 100%;
}
body {
  font-size: 15px;
  line-height: 1.4em;
  color: #666;
  font-family: Open Sans, Sans-Serif;
  background: url('https://www.agentpiggy.com/static/es/img_new/header.png') top center no-repeat;
  height: 100%;
}

a {
  color: #313132;
}

h1, h2 {
  font-family: "ABeeZee", cursive;
  text-align: center;
  font-weight: normal;
  color: #333;
  padding: 0 0 10px 0;
}
h1 { font-size: 30px; line-height: 36px; }
h2 { font-size: 18px; }

input, textarea {
  -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px inset;
  -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px inset;
  box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px inset;
  padding: 10px !important;
  height: auto !important;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  text-align: center;
  width: 264px;
  border: 1px solid #aaa;
  font-size: 18px !important;
  margin-top: 12px;
}

a.big_button.disabled, a.big_button.disabled:active, a.big_button.disabled:hover {
  color: #cc;
  cursor: default;
}
a.big_button span {
    display: block;
    width: 18px;
    height: 24px;
}
a.big_button span.left {
    float: left;
	left: 34px;
	position: relative;
}
a.big_button span.right {
    float: right;
	right: 34px;
	position: relative;
}

#signup-container {
  width: 780px;
  margin: 0 auto;
  /*position: relative;*/
}

#logo {
  margin: 0 auto;
  text-align: center;
  padding: 60px 0 53px 0;
}

.signup-box {
  border: 3px solid white;
  /* box shadow */
  -webkit-box-shadow: 0px 2px 5px #3e8aa6;
  -moz-box-shadow: 0px 2px 5px #3e8aa6;
  box-shadow: 0px 2px 5px #3e8aa6;
  /* rounded corners */
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  border-radius: 12px;
  /* gradient background */
  background-image: linear-gradient(bottom, #EDEDED 100%, #FFFFFF 15%);
  background-image: -o-linear-gradient(bottom, #EDEDED 100%, #FFFFFF 15%);
  background-image: -moz-linear-gradient(bottom, #EDEDED 100%, #FFFFFF 15%);
  background-image: -webkit-linear-gradient(bottom, #EDEDED 100%, #FFFFFF 15%);
  background-image: -ms-linear-gradient(bottom, #EDEDED 100%, #FFFFFF 15%);
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(1, #EDEDED),
    color-stop(0.15, #FFFFFF)
  );
  margin: 0 0 80px 0;
}

.signup-box h1 {
	margin: 0px 93px;
}
.signup-box .signup-box-content {
  padding: 30px 30px 60px 30px;
  text-align: center;
  position: relative;
}
.signup-box-content .big_button {
    position: absolute;
    margin-left: -89px;
    left: 50%;
	bottom: -50px;
	font-size: 34px !important;
}
.signup-box-content .big_button.left {
    margin-left: 0;
    left: 20px;
}
.signup-box-content .big_button.right {
    margin-left: 0;
    left: auto;
    right: 20px;
}
.language-es #signup .signup-box-content .big_button, .language-br #signup .signup-box-content .big_button {
    margin-left: -128px;
}
.language-es #step-username .signup-box-content .big_button, .language-br #step-username .signup-box-content .big_button {
    margin-left: -117px;
}

/* LANDING PAGE */
#login, #signup {
  float: left;
  width: 370px;
}
#signup .signup-box-content, #login .signup-box-content {
    height: 355px;
}
#login {
  margin-right: 23px;
}
.tiny-note {
  font-size: 12px;
  padding-top: 15px;
}
.small-note {
  font-size: 18px;
  color: #333;
  padding-top: 10px;
}
#parent-note {
  font-size: 14px;
  text-align: center;
}

/* STEPS */
#helper-piggy {
  position: absolute;
  top: -30px;
  left: 10px;
}

/* STEP 1: USERNAME */
#step-username .signup-box-content {
  padding-bottom: 80px;
}

/* STEP 2: GENDER */
#gender-buttons {padding: 5px 186px;height:152px;}
#gender-buttons a {text-decoration: none;}
.gender {
	display: block;
	float: left;
	margin: 0 14px 14px 14px;
	background-repeat: no-repeat;
	background-position: center center;
	width: 142px;
	height: 134px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
}
.gender.selected {
	border: 4px solid #c1e036;
}
  
/* STEP 4: WISHLIST */
#wish-search-results {
  padding: 20px 0;
}
#wish-image-note {
  padding-top: 8px;
  display: none;
}
.marketplace-item {
  display: block;
  float: left;
  margin: 0 14px 14px 14px;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center center;
  width: 209px;
  height: 168px;
  -moz-box-shadow: rgba(0,0,0, 0.4) 0px 2px 5px;
  -webkit-box-shadow: rgba(0,0,0, 0.4) 0px 2px 5px;
  box-shadow: rgba(0,0,0, 0.4) 0px 2px 5px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}
.marketplace-item.disabled { opacity: 0.2; }
.marketplace-item.faded { opacity: 0.4; }
.marketplace-item.selected {
  border: 4px solid #c1e036;
}

#signupStep6 span.error {margin-bottom: 10px;}
/* FINAL STEP: DONE */
#recap {
  border-top: 1px solid #D1D1D1;
  margin-top: 20px;
  border-bottom: 1px solid #D1D1D1;
  margin-bottom: 20px;
  padding-bottom: 15px;
}
#recap-top {
  border-top: 1px solid #D1D1D1;
  margin-top: 20px;
  margin-bottom: 10px;
  padding-bottom: 10px;
}
  #recap table {
    width: 100%;
  }
  #recap td {
    color: #333;
    width: 50%;
  }
  #recap .label {
    text-align: right;
    padding: 2px 5px 2px 2px;
  }
  #recap .value {
    text-align: left;
    padding: 2px 2px 2px 5px;
    font-size: 18px;
  }

#signup-container #popupLogin {width:auto;}

.kidSignupErrorContainer .commonError {font-size:13px !important;}
#signupLogin input {color:#8B8989 !important;}

#signupStep1Btn {
  position: absolute;
  margin-left: -78px;
}
.language-br #signupStep1Btn {margin-left: -104px !important;}
.language-es #signupStep1Btn {margin-left: -113px !important;}

#fbConnect {margin-top: 10px;}
.language-es #signup .signup-box-content, .language-es #login .signup-box-content{height: 404px;}
.language-br #signup .signup-box-content, .language-br #login .signup-box-content {height: 377px;}