@import url("../fonts/gibson.css");

html,
body {
  margin: 0;
  padding: 0 !important;
  width: 100%;
  font-family: "Gibson", sans-serif;
  background: #FFFFFF;
  color: #000000;
  font-size: 14px;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.blanco {
  color: #FFFFFF;
}

.col-left {
  background: url(../images/landing/background.png) top left;
  padding-right: 13% !important;
  padding-top: 7%;
}

.vago {
  bottom:  0;
  left: 100%;
  max-height: 90%;
  transform: translate(-50%);
  z-index: 1;
}

.voodoo {
  bottom:  0;
  right: 100px;
  z-index: 5;
}

.logo {
  top:  0;
  left: 0;
  max-width: 80%;
}

.entrar {
  top: 10px;
  right: 10px;
}

.controles {
  right: 0;
  left:  30px;
  bottom: 20px;
  height: 55px;
  border-radius: 30px 0 0 30px;
  background: rgba(209, 160, 0, 0.5);
  padding: 15px;
}

.col-right {
  padding-left: 13% !important;
}

.fake-nice-select {
    -webkit-tap-highlight-color: transparent;
    background-color: #fff;
    border-radius: 5px;
    border: solid 1px #e8e8e8;
    box-sizing: border-box;
    clear: both;
    cursor: pointer;
    display: block;
    float: left;
    font-family: inherit;
    font-size: 14px;
    font-weight: normal;
    height: 42px;
    line-height: 40px;
    outline: none;
    padding-left: 18px;
    padding-right: 30px;
    position: relative;
    text-align: left !important;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
    width: auto;
}

.nice-select,
.nice-select:active,
.nice-select:focus,
.fake-nice-select,
.fake-nice-select:active,
.fake-nice-select:focus {
  border-radius: 30px;
  border: 4px solid #EEEEEE;
  line-height: 33px;
  padding-left: 35px;
  background-size: 20px;
  background-position: 10px center;
  background-repeat: no-repeat;
}

.nice-select.interes,
.fake-nice-select.interes {
  background-image: url('../images/landing/interes.png');
}

.nice-select.vivienda,
.fake-nice-select.vivienda {
  background-image: url('../images/landing/vivienda.png');
}

.nice-select.vivienda2,
.fake-nice-select.vivienda2 {
  background-position: 10px 10px;
  background-image: url('../images/landing/vivienda.png');
}

.nice-select.ciudad,
.fake-nice-select.ciudad {
  background-image: url('../images/landing/ciudad.png');
}

.nice-select.presupuesto,
.fake-nice-select.presupuesto {
  background-image: url('../images/landing/presupuesto.png');
}

.nice-select.habitaciones,
.fake-nice-select.habitaciones {
  background-image: url('../images/landing/habitaciones.png');
}

.nice-select.banos,
.fake-nice-select.banos {
  background-image: url('../images/landing/banos.png');
}

.nice-select.parqueadero,
.fake-nice-select.parqueadero {
  background-image: url('../images/landing/parqueadero.png');
}

.nice-select.pregunta1,
.fake-nice-select.pregunta1 {
  background-image: url('../images/landing/vivienda.png');
}

.nice-select.pregunta2,
.fake-nice-select.pregunta2 {
  background-image: url('../images/landing/vivienda.png');
}

.nice-select.nombre,
.fake-nice-select.nombre {
  background-image: url('../images/landing/nombre.png');
}

.nice-select.correo,
.fake-nice-select.correo {
  background-image: url('../images/landing/correo.png');
}

.nice-select.celular,
.fake-nice-select.celular {
  background-image: url('../images/landing/celular.png');
}

.nice-select.forma,
.fake-nice-select.forma {
  background-image: url('../images/landing/celular.png');
}

.nice-select,
.nice-select .current,
.nice-select::placeholder,
.fake-nice-select,
.fake-nice-select .current,
.fake-nice-select::placeholder {
  color: #959595;
}

.nice-select:after,
.fake-nice-select:after {
  border-color: #AAAAAA;
  width: 10px;
  height: 10px;
  margin-top: -7px;
  right: 15px;
}

.nice-select.error,
.fake-nice-select.error {
  border-color: #ff7672;
  background-color: #ffc7c6;
  color: red;
}

.nice-select.error .current,
.fake-nice-select.error .current {
  color: red;
}

.nice-select.error:after,
.fake-nice-select.error:after {
  border-color: #ff7672;
}

#terminos + .state,
#terminos + label + .state  {
  border: 4px solid transparent;
  border-radius: 25px;
  padding: 5px;
  position: relative;
}

#terminos.error + label + .state  {
  border-color: #ff7672;
  background-color: #ffc7c6;
}

#terminos.error + label + .state > label:before  {
  border-color: red;
}

label.error {
  display: none !important;
}

.nice-select.open,
.fake-nice-select.open {
  box-shadow: 0 10px 20px rgba(110, 110, 110, 0.3);
  border-color: #FFFFFF;
}

.nice-select.open,
.nice-select.open::placeholder,
.nice-select .list,
.fake-nice-select.open,
.fake-nice-select.open::placeholder,
.fake-nice-select .list {
  background-color: #FFC400;
  color: #FFFFFF;
}

.nice-select.open .current,
.fake-nice-select.open .current {
  color: #FFFFFF;
  font-weight: 600;
}

.nice-select.open:after,
.fake-nice-select.open:after {
  border-color: #FFFFFF;
}

.nice-select .option,
.fake-nice-select .option {
  background-color: #FFC400;
  font-size: 14px;
}

.nice-select .option:hover,
.nice-select .option.focus,
.nice-select .option.selected,
.nice-select .option.selected.focus,
.fake-nice-select .option:hover,
.fake-nice-select .option.focus,
.fake-nice-select .option.selected,
.fake-nice-select .option.selected.focus {
  background-color: #DBA800;
  font-size: 16px;
  font-weight: 600;
}

.pretty {
  white-space: inherit;
  margin-right: 0;
}

.pretty .state label {
    text-indent:inherit;
    padding-left: 30px;
}

.pretty .state label:before {
  border: 4px solid #EEEEEE;
  width: calc(1em + 11px);
  height: calc(1em + 11px);
  top: 15px;
  left: 5px;
}

.pretty .state label:after {
  width: calc(1em + 8px);
  height: calc(1em + 8px);
  top: calc((0% - (100% - 5.21em)) - 8%);
  left: 6.5px;
}

.barra {
  background: #F4F4F4;
  border-radius: 30px;
}

.btn-verde {
  background-color: #49CB04;
  background-image: url("../images/landing/btn.png");
  background-position: right 15px center;
  background-repeat: no-repeat;
  color: white !important;
  border-radius: 30px !important;
  padding: 10px 115px 10px 25px;
  box-shadow: 0 10px 20px rgba(16, 224, 24, 0.3);
  border: none !important;
  font-weight: 600;
}

.btn-fucsia {
  background-color: #a945b5 !important;
  background-image: url("../images/landing/btn.png");
  background-position: right 15px center;
  background-repeat: no-repeat;
  color: white !important;
  border-radius: 30px !important;
  padding: 10px 45px 10px 25px;
  box-shadow: 0 10px 20px rgba(169, 69, 181, 0.3) !important;
  border: none !important;
  font-weight: 600;
}

.btn-transparente {
  background-color: transparent !important;
  color: #484848 !important;
  border-radius: 30px !important;
  padding: 10px 25px;
  border: none !important;
  box-shadow: none !important;
  text-decoration: underline !important;
}

.modalProcesos .modal-dialog {
  width: 400px;
}

.modalProcesos .modal-content {
  height: 90px;
  border: 0;
  border-radius: 50px;
}

.procesando {
  bottom: 0;
  right: 0;
}

.contenedor-gracias {
  border: 1px dashed #707070;
  border-radius: 15px;
}

.codigo {
  border-radius: 30px;
  background: #F4F4F4;
  padding: 15px 40px;
}

.nota {
  color: #808080;
}

.btn-volver {
  position: absolute;
  bottom: 0;
  margin-bottom: -20px;
  right: 20px;
  background-image: url("../images/landing/volver.png");
}

@media (max-width: 991px) {
  .view_lg {
    display: none;
  }

  .view_sm {
    display: block;
  }

  .campos-form-sm {
    display: block;
    width: 100%;
    position: fixed;
    bottom: 0;
  }

  .campos-form-sm .form-login-sm {
    position: absolute;
    bottom: 0;
    height: auto;
    overflow: hidden;
    background-color: white;
    width: 90%;
    right: 5%;
    padding-top: 2rem;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-bottom: 2rem;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
  }
}