/* compass */
.button-01, #register .wrapper #formBox .submitBox button {
  background: #78cd00;
  border-bottom: 2px solid #5a9a00;
  font-size: 19px;
  font-weight: bold;
  color: #fff;
  text-transform: uppercase;
  height: 53px;
  line-height: 53px;
  text-align: center;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  text-shadow: 1px 2px 2px #5a9a00;
  cursor: pointer;
}
.button-01:hover, #register .wrapper #formBox .submitBox button:hover {
  background: #69b300;
}
.button-01.loader, #register .wrapper #formBox .submitBox button.loader {
  background: url("/global/cc3/prod/img/loader/78cd00.gif") no-repeat center center #78cd00;
  text-indent: -9999px;
  overflow: hidden;
}

.button-02 {
  background: #fff;
  border: 1px solid #8bbab1;
  font-size: 14px;
  color: #8bbab1;
  text-transform: uppercase;
  height: 60px;
  line-height: 60px;
  text-align: center;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  cursor: pointer;
  text-decoration: none;
}
.button-02:hover {
  color: #4e776f;
  border: 1px solid #4e776f;
}

.button-03 {
  background: #8bbab1;
  border-bottom: 2px solid #7da79f;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  text-transform: uppercase;
  height: 60px;
  line-height: 60px;
  text-align: center;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  cursor: pointer;
  text-decoration: none;
}
.button-03:hover {
  background: #6c948c;
  border-bottom: 2px solid #61857e;
}
.button-03.loader {
  background: url("/global/cc3/prod/img/loader/30_8bbab1.gif") no-repeat center center #8bbab1;
  text-indent: -9999px;
  overflow: hidden;
}
.button-03.disable {
  background: #c5ddd8;
  border-bottom-color: #8bbab1;
  cursor: default;
}

.button-04 {
  background: #e6c928;
  border-bottom: 2px solid #cfb524;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  text-transform: uppercase;
  height: 60px;
  line-height: 60px;
  text-align: center;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  cursor: pointer;
  text-decoration: none;
}
.button-04:hover {
  background: #c4a915;
  border-bottom: 2px solid #b09813;
}

input[type="text"], input[type="email"], input[type="password"], select {
  border: 1px solid #b0abac;
  height: 33px;
  line-height: 33px;
  font-size: 17px;
  color: #3f3f3f;
  width: 100%;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  cursor: pointer;
}

input[type="text"], input[type="email"], input[type="password"] {
  width: 98%;
  padding-left: 2%;
}

input.error, select.error {
  border: 1px solid #ee3131;
}

label.error {
  color: #ee3131;
  text-align: left;
  width: 100%;
  margin: 5px 0 -10px 0;
  font-weight: bold;
}

input, .label {
  cursor: pointer;
}

#register {
  background-image: url('../../../img/index/bg/default_desktop.jpg?1479901851');
  background-repeat: no-repeat;
  background-position: center center;
  -moz-background-size: cover;
  -o-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  height: 100vh;
  width: 100%;
  position: relative;
}
.COUNTRY-IN #register {
  background-image: url('../../../img/index/bg/IN_desktop.jpg?1493796233');
}
.COUNTRY-RU #register {
  background-image: url('../../../img/index/bg/RU_desktop.jpg?1493796193');
}
.COUNTRY-ZA #register {
  background-image: url('../../../img/index/bg/ZA_desktop.jpg?1493796127');
}
.COUNTRY-TR #register {
  background-image: url('../../../img/index/bg/TR_desktop.jpg?1493796152');
}
.COUNTRY-BR #register, .COUNTRY-CO #register, .COUNTRY-MX #register, .COUNTRY-AR #register {
  background-image: url('../../../img/index/bg/LATAM_desktop.jpg?1493796179');
}
.STEP-1 #register {
  min-height: 600px;
}
.STEP-1 #register .wrapper {
  min-height: 600px;
}
.STEP-emailExist #register {
  min-height: 600px;
}
.STEP-emailExist #register .wrapper {
  min-height: 600px;
}
.STEP-2 #register {
  min-height: 800px;
}
.STEP-2 #register .wrapper {
  min-height: 800px;
}
#register .wrapper {
  width: 920px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
  height: 100vh;
}
@media screen and (min-width: 960px) {
  #register .wrapper {
    width: 94%;
    padding-right: 3%;
    padding-left: 3%;
  }
}
@media screen and (min-width: 1220px) {
  #register .wrapper {
    width: 1140px;
    padding-left: 30px;
    padding-right: 30px;
  }
}
#register .wrapper .logo {
  position: absolute;
  left: 3%;
}
#register .wrapper .logo {
  text-align: left;
  width: 270px;
  height: 68px;
  float: left;
  background-image: url('../../../img/logo/register.png');
  background-repeat: no-repeat;
  background-position: left top;
  margin-top: 30px;
}
#register .wrapper #formHead .logo {
  display: none;
}
#register .wrapper #formHead h1 {
  font-size: 23px;
  color: #504a4c;
  height: 60px;
  margin-bottom: 10px;
  width: 100%;
  line-height: 26px;
  margin-top: 10px;
}
#register .wrapper #formHead .slogan {
  display: none;
}
.STEP-1 #register .wrapper #formHead .slogan.step-1 {
  display: inline-block;
  vertical-align: top;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
}
.STEP-2 #register .wrapper #formHead .slogan.step-2 {
  display: inline-block;
  vertical-align: top;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
}
#register .wrapper #formBox {
  width: 468px;
  min-height: 200px;
  padding: 30px 50px;
  background: rgba(255, 255, 255, 0.8);
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}
.STEP-1 #register .wrapper #formBox {
  margin-top: 150px;
}
.STEP-emailExist #register .wrapper #formBox {
  margin-top: 150px;
  width: 300px;
  padding: 40px 50px;
}
.STEP-2 #register .wrapper #formBox {
  margin-top: 100px;
}
#register .wrapper #formBox .submitBox {
  width: 100%;
}
#register .wrapper #formBox .submitBox button {
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 20px;
}
#register .wrapper #formBox .submitBox button.loader {
  text-indent: 0px;
}
#register .wrapper #formBox .submitBox button.loader span {
  visibility: hidden;
}
#register .wrapper #formBox #step-1 {
  display: none;
}
.STEP-1 #register .wrapper #formBox #step-1 {
  display: block;
}
#register .wrapper #formBox #step-1 .row {
  width: 100%;
  margin-bottom: 20px;
}
#register .wrapper #formBox #step-1 .row .titleForm {
  width: 28%;
  font-size: 14px;
  color: #232323;
  font-weight: bold;
  text-align: right;
  padding-right: 2%;
}
#register .wrapper #formBox #step-1 .row .inputRadio {
  width: 35%;
  font-size: 16px;
  color: #232323;
  text-align: left;
}
#register .wrapper #formBox #step-1 .row .inputRadio .label {
  padding-left: 10%;
}
#register .wrapper #formBox #step-2 {
  display: none;
}
.STEP-2 #register .wrapper #formBox #step-2 {
  display: block;
}
#register .wrapper #formBox #step-2 .formSection {
  width: 100%;
}
#register .wrapper #formBox #step-2 .formSection .formSectionTitle {
  display: none;
}
#register .wrapper #formBox #step-2 .formSection .row {
  width: 100%;
  margin-bottom: 20px;
  display: table;
}
#register .wrapper #formBox #step-2 .formSection .row .titleForm {
  width: 38%;
  font-size: 13px;
  color: #232323;
  font-weight: bold;
  text-align: right;
  padding-right: 2%;
  display: table-cell;
  vertical-align: middle;
}
#register .wrapper #formBox #step-2 .formSection .row .titleForm .passwordNotes {
  font-size: 11px;
  color: #5c5c5c;
}
#register .wrapper #formBox #step-2 .formSection .row .inputText, #register .wrapper #formBox #step-2 .formSection .row .inputSelect {
  width: 60%;
  font-size: 16px;
  color: #232323;
  text-align: left;
  display: table-cell;
}
#register .wrapper #formBox #step-2 .formSection .row .inputText .autoCompleteBox, #register .wrapper #formBox #step-2 .formSection .row .inputSelect .autoCompleteBox {
  width: 100%;
}
#register .wrapper #formBox #step-2 .formSection .row .inputText .BDPicker, #register .wrapper #formBox #step-2 .formSection .row .inputText .birthday-picker, #register .wrapper #formBox #step-2 .formSection .row .inputSelect .BDPicker, #register .wrapper #formBox #step-2 .formSection .row .inputSelect .birthday-picker {
  width: 100%;
}
#register .wrapper #formBox #step-2 .formSection .row .inputText .BDPicker select, #register .wrapper #formBox #step-2 .formSection .row .inputText .birthday-picker select, #register .wrapper #formBox #step-2 .formSection .row .inputSelect .BDPicker select, #register .wrapper #formBox #step-2 .formSection .row .inputSelect .birthday-picker select {
  width: 30%;
}
#register .wrapper #formBox #step-2 .formSection .row .inputText .BDPicker select:nth-child(2), #register .wrapper #formBox #step-2 .formSection .row .inputText .birthday-picker select:nth-child(2), #register .wrapper #formBox #step-2 .formSection .row .inputSelect .BDPicker select:nth-child(2), #register .wrapper #formBox #step-2 .formSection .row .inputSelect .birthday-picker select:nth-child(2) {
  margin: 0px 5%;
}
#register .wrapper #formBox #step-2 .formSection .row .inputText label.error, #register .wrapper #formBox #step-2 .formSection .row .inputSelect label.error {
  font-size: 12px;
}
#register .wrapper #formBox #step-2 .formSection .row.container-emailCheckReg, #register .wrapper #formBox #step-2 .formSection .row.container-sexPreferences {
  display: none;
}
#register .wrapper #formBox #step-2 .formSection .row.container-emailInputInfo {
  text-align: right;
  margin-bottom: 5px;
  font-size: 10px;
}
#register .wrapper #formBox #step-2 #registerBoxPrivacy {
  text-align: justify;
  font-size: 10px;
  line-height: 12px;
  margin-top: 15px;
}
#register .wrapper #formBox #step-2 #registerBoxPrivacy br {
  display: none;
}
#register .wrapper #formBox #loginForm .title, #register .wrapper #formBox #recoverForm .title {
  font-size: 14px;
  color: #3f3f3f;
  margin-bottom: 20px;
  text-align: left;
}
#register .wrapper #formBox #loginForm .label, #register .wrapper #formBox #recoverForm .label {
  color: #232323;
  width: 100%;
  font-size: 13px;
  font-weight: bolder;
  text-align: left;
  line-height: 33px;
}
#register .wrapper #formBox #loginForm .inputTextBox, #register .wrapper #formBox #recoverForm .inputTextBox {
  width: 100%;
}
#register .wrapper #formBox #loginForm .recoverPassBox, #register .wrapper #formBox #loginForm .backLoginBox, #register .wrapper #formBox #recoverForm .recoverPassBox, #register .wrapper #formBox #recoverForm .backLoginBox {
  text-align: right;
  width: 100%;
  margin-top: 5px;
}
#register .wrapper #formBox #loginForm .recoverPassBox a, #register .wrapper #formBox #loginForm .backLoginBox a, #register .wrapper #formBox #recoverForm .recoverPassBox a, #register .wrapper #formBox #recoverForm .backLoginBox a {
  color: #232323;
}
#register .wrapper #formBox #loginForm .createNewAccount a, #register .wrapper #formBox #recoverForm .createNewAccount a {
  margin-top: 10px;
  color: #232323;
}
#register .wrapper #formBox #loginForm .submit, #register .wrapper #formBox #recoverForm .submit {
  width: 100%;
}
#register .wrapper #formBox #recoverForm .title {
  font-size: 20px;
  text-align: center;
}
