/* compass */
.button-01, #login .wrapper #loginBox .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, #login .wrapper #loginBox .submitBox button:hover {
  background: #69b300;
}
.button-01.loader, #login .wrapper #loginBox .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;
}

.wrapperIndex, #headerOut .wrapper, #login .wrapper {
  width: 920px;
  padding-left: 20px;
  padding-right: 20px;
}
@media screen and (min-width: 960px) {
  .wrapperIndex, #headerOut .wrapper, #login .wrapper {
    width: 94%;
    padding-right: 3%;
    padding-left: 3%;
  }
}
@media screen and (min-width: 1220px) {
  .wrapperIndex, #headerOut .wrapper, #login .wrapper {
    width: 1140px;
    padding-left: 30px;
    padding-right: 30px;
  }
}

.inputTextLogin, #login .wrapper #loginBox input {
  height: 33px;
  line-height: 33px;
  font-size: 19px;
  color: #3f3f3f;
  padding-left: 2%;
  width: 98%;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  cursor: pointer;
}

input, select {
  border: 1px solid #b0abac;
}

input.error, select.error {
  border: 1px solid #ee3131;
}
input.error:focus, select.error:focus {
  outline-color: #ee3131;
}

label.error {
  color: #ee3131;
  text-align: left;
  width: 100%;
  margin: 5px 0 -10px 0;
  font-weight: bold;
}

#headerOut {
  position: absolute;
  width: 100%;
  z-index: 1;
}
#headerOut .wrapper #logo {
  text-align: left;
  width: 410px;
  height: 104px;
  float: left;
  background-image: url('../img/logo/index.png?1479901850');
  background-repeat: no-repeat;
  background-position: left top;
  margin-top: 30px;
}

#login {
  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: 650px;
  height: 100vh;
  width: 100%;
  position: relative;
}
.COUNTRY-IN #login {
  background-image: url('../img/index/bg/IN_desktop.jpg?1493796233');
}
.COUNTRY-RU #login {
  background-image: url('../img/index/bg/RU_desktop.jpg?1493796193');
}
.COUNTRY-ZA #login {
  background-image: url('../img/index/bg/ZA_desktop.jpg?1493796127');
}
.COUNTRY-TR #login {
  background-image: url('../img/index/bg/TR_desktop.jpg?1493796152');
}
.COUNTRY-BR #login, .COUNTRY-CO #login, .COUNTRY-MX #login, .COUNTRY-AR #login {
  background-image: url('../img/index/bg/LATAM_desktop.jpg?1493796179');
}
#login .wrapper {
  position: relative;
  height: 650px;
  height: 100vh;
}
#login .wrapper #loginBox {
  margin-top: 150px;
  width: 310px;
  padding: 30px 39px;
  background: rgba(255, 255, 255, 0.8);
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}
#login .wrapper #loginBox h2 {
  font-size: 26px;
  color: #504a4c;
  height: 30px;
  margin-bottom: 20px;
}
#login .wrapper #loginBox .label {
  font-size: 13px;
  color: #232323;
  height: 25px;
  line-height: 25px;
  font-weight: bold;
  text-align: left;
  width: 100%;
}
#login .wrapper #loginBox .inputTextBox {
  width: 100%;
  margin-bottom: 20px;
}
#login .wrapper #loginBox .inputTextBox.input-password {
  margin-bottom: 5px;
}
#login .wrapper #loginBox .submitBox {
  width: 100%;
}
#login .wrapper #loginBox .submitBox button {
  width: 100%;
}
#login .wrapper #loginBox #notRegisteredBox {
  color: #7a7687;
  margin-top: 20px;
  font-weight: bold;
}
#login .wrapper #loginBox #notRegisteredBox a {
  color: #7a7687;
}
#login .wrapper #loginBox #loginForm .recoverPassBox {
  font-size: 12px;
  text-align: right;
  width: 100%;
  margin-bottom: 20px;
}
#login .wrapper #loginBox #loginForm .recoverPassBox a {
  text-decoration: underline;
  color: #232323;
}
#login .wrapper #loginBox #loginForm .errorPlace .error {
  margin: -5px 0 15px 0;
}
#login .wrapper #loginBox #recoverForm {
  display: none;
}
#login .wrapper #loginBox #recoverForm .input-email {
  margin-bottom: 10px;
}
#login .wrapper #loginBox #recoverForm .backLoginBox {
  font-size: 12px;
  text-align: right;
  width: 100%;
  margin-bottom: 20px;
}
#login .wrapper #loginBox #recoverForm .backLoginBox a {
  text-decoration: underline;
  color: #232323;
}
#login .wrapper #loginBox #recoverForm .errorPlace .error {
  margin: -5px 0 15px 0;
}

.ISMOBILE #headerOut {
  position: initial;
  background: #36304a;
  height: 50px;
}
.ISMOBILE #headerOut .wrapper #logo {
  width: 130px;
  float: left;
  margin: 10px 0;
  background-size: cover;
  height: 30px;
}
.ISMOBILE #login {
  background-image: none;
  height: auto;
  margin-bottom: 50px;
}
.ISMOBILE #login .wrapper {
  height: auto;
}
.ISMOBILE #login #loginBox {
  margin: 0;
  padding: 0;
  width: 100%;
  margin-top: 30px;
  padding: 0 20px;
}
.ISMOBILE #login #loginBox h2 {
  color: #7c2b3c;
}
