/* sms popup */

#popup-telefono {
  z-index: 4000;
  position: fixed;
  left: 0px;
  top: 0px;
  background-color: rgba(100, 100, 100, 0.5);
  width: 100%;
  height: 100%;
}

div.modal-telefono-input {
  padding-top: 0px !important;
  padding-bottom: 20px !important;
  color: #333333;
  font-size: 20px;
}
div.modal-telefono-input input, div.modal-telefono-input div {
  padding: 10px !important;
  border: 1px solid #989898 !important;
  height: 54px;
  width: 54px;
  font-size: 20px;
  border-radius: 8px 8px 8px 8px;
  -moz-border-radius: 8px 8px 8px 8px;
  -webkit-border-radius: 8px 8px 8px 8px;
  text-align: center;
  display: inline-block;
  margin: 0 !important;
}
div.modal-telefono-input div {
  padding: 10px !important;
  border: 0px solid #cccccc !important;
  height: 28px;
  width: 36px;
  font-size: 20px;
  border-radius: 8px 8px 8px 8px;
  -moz-border-radius: 8px 8px 8px 8px;
  -webkit-border-radius: 8px 8px 8px 8px;
  text-align: left;
  display: inline-block;
  margin: 0 !important;
}
div.cod_pais {
  width: 36px !important;
}
input.pupup_sms_telefono_cod {
  width: 72px !important;
}
div.quince {
  width: 23px !important;
}
input.pupup_sms_telefono {
  width: 120px !important;
}

.modal-telefono {
  z-index: 3100;
  opacity: 1.0 !important;
  background: #fff;
  background-image: url("/img/jpg/bg-registro-escritorio.jpg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100%;
  -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.25);
  border: 0px solid #ffffff;
  padding: 0px;
  width: 90%;
  max-width: 674px;
  margin: 0 auto;
  margin-top: 5%;
  border-radius: 34px;
  -moz-border-radius: 34px;
  -webkit-border-radius: 34px;
  position: relative;
  overflow: auto;
  max-height: 90vh;
}

.modal-telefono-dos {
  background-image: url("/img/png/bg-registro-escritorio-4.png");
  background-position: top -50px center;
}
  
.modal-content {
  padding: 50px;
}
    
.modal-content-textos{
        width: 55%;
        max-width: 300px;
        line-height: 1.3;
        margin-bottom: 70px;
        min-height: 220px;
}
    
.modal-close {
  position: absolute;
  top: 0em;
  right: 0em;
  z-index: 3200;
  font-size: 0;
  cursor: pointer;
  width: 80px;
  height: 80px;
  background-image: url("/img/svg/icono-cerrar.svg");
  background-size: 20px;
  background-position: center center;
  background-repeat: no-repeat;
  display: inline-block;
}
    
div.modal-telefono-input div {
  padding: 10px !important;
  border: 0px solid #cccccc !important;
  height: 28px;
  width: 36px;
  font-size: 20px;
  border-radius: 8px 8px 8px 8px;
  -moz-border-radius: 8px 8px 8px 8px;
  -webkit-border-radius: 8px 8px 8px 8px;
  text-align: left;
  display: inline-block;
  margin: 0 !important;
}
    
.modal-telefono-input {
        overflow: hidden;
        padding: 10px;
        text-align: center;
    }
    
.btn-enviar-codigo, 
.btn-mas-tarde {
  padding: 14px 24px 14px;
  font-family: Roboto-Bold;
  font-size: 16px;
  color: #fff;
  background-color: #034D8E;
border: 1px solid #034D8E;
  -ms-transition: all .2s;
  -moz-transition: all .2s;
  -webkit-transition: all .2s;
  border-radius: 50px;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  cursor: pointer;
  height: auto;
  width: 210px;
  margin-top: 10px;
    line-height: 18px;
}
.btn-mas-tarde {
  color: #034D8E;
  background-color: #ffffff;
  border: 1px solid #034D8E;
}
    
input.pupup_sms_telefono {
  width: 180px !important;
}
    
div.modal-telefono-input {
  padding-top: 4px !important;
  padding-bottom: 20px !important;
  color: #333333;
  font-size: 20px;
}
    
div.modal-telefono-input input,
div.modal-telefono-input input:focus,
div.modal-telefono-input div {
  padding: 10px !important;
  border: 1px solid #989898 !important;
  height: 54px;
  width: 54px;
  font-size: 20px;
  border-radius: 8px 8px 8px 8px;
  -moz-border-radius: 8px 8px 8px 8px;
  -webkit-border-radius: 8px 8px 8px 8px;
  text-align: center;
  display: inline-block;
  margin: 0 !important;
}
    
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px #ffffff inset;
}
    
div.modal-telefono-input input::placeholder{
  color: #BABABA;
    opacity: 1;
    -ms-transition: all .1s;
  -moz-transition: all .1s;
  -webkit-transition: all .1s;
}
    
@media screen and (max-width: 760px) {
    
.modal-content-textos .font-size-26 { font-size: 24px !important;}
.modal-content-textos .font-size-20 { font-size: 18px !important;}
.modal-content-textos .font-size-16 { font-size: 14px !important;}
   
}
    
@media screen and (max-width: 700px) {
.modal-content-textos .font-size-20 { font-size: 17px !important;}
.modal-content-textos .font-size-16 { font-size: 13px !important;}
   
}
    
@media screen and (max-width: 639px) {
.modal-content-textos .font-size-20 { font-size: 16px !important;}
.modal-content-textos .font-size-16 { font-size: 12px !important;}
 
.modal-telefono {
  background-size: 110%;
  width: 95%;
}
    
.modal-content-textos {
  width: 50%;
  margin-bottom: 70px;
  min-height: 220px;
}
    
.modal-content {  padding: 40px;}
    
}
    
@media screen and (max-width: 590px) {
 
.modal-telefono {
  background-image: url("/img/jpg/bg-registro-escritorio-mobile.jpg");
  background-repeat: no-repeat;
  background-position: top -250px center;
  background-size: 100%;
  border-radius: 16px;
  -moz-border-radius: 16px;
  -webkit-border-radius: 16px;

}
    
.modal-content-textos {
  width: 50%;
  margin-bottom: 70px;
  min-height: 220px;
}
    
.modal-content {  padding: 30px;}
    
}
    
@media screen and (max-width: 550px) {

.modal-content-textos {
  width: 57%;
  margin-bottom: 50px;
}    
    
.modal-telefono {

  background-position: top -220px center;
  background-size: 100%;


}
}
    
@media screen and (max-width: 510px) {
 
    
.modal-telefono {
  background-position: top -240px center;
  background-size: 110%;
}
    
}
    
@media screen and (max-width: 490px) {
    
.modal-telefono {
  background-position: top -210px center;
  background-size: 110%;
}
    
}
    
@media screen and (max-width: 460px) {
    
.modal-telefono {
  background-position: top -175px center;
  background-size: 110%;
}
    
.modal-telefono .mb-3.pt-3.font-size-20.color333333 {
    padding-top: 0px !important;
    margin-bottom: 10px !important;
}
    
div.modal-telefono-input input, 
div.modal-telefono-input input:focus, 
div.modal-telefono-input div {
  padding: 10px !important;
  padding-left: 5px !important;
  padding-right: 5px !important;
  border: 1px solid #989898 !important;
  height: 39px;
  width: 39px;
  font-size: 16px;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  text-align: center;
  display: inline-block;
  margin: 0 !important;
}
    
div.modal-telefono-input,
div.modal-telefono-input{
  color: #333333;
  font-size: 16px;
}
    
input.pupup_sms_telefono_cod {
  width: 60px !important;
}
    
input.pupup_sms_telefono {
  width: 120px !important;
}
    
}
    
@media screen and (max-width: 430px) {
    
.modal-telefono {
  background-position: top -175px center;
  background-size: 110%;
}
    
.modal-telefono .mb-3.pt-3.font-size-20.color333333 {
    padding-top: 0px !important;
    margin-bottom: 10px !important;
}
    
.modal-content-textos {
  width: 60%;
  margin-bottom: 20px;
}
    
}
    
@media screen and (max-width: 410px) {
    
.modal-telefono {
  background-position: top -145px center;
  background-size: 110%;
}
    
    
.modal-telefono .font-size-26 {
    font-size: 22px !important;
    
}
    
@media screen and (max-width: 370px) {
    
.modal-telefono {
  background-position: top -115px center;
  background-size: 110%;
}
    
.modal-telefono .font-size-26 {    font-size: 21px !important;  }
.modal-telefono .font-size-20 {    font-size: 15px !important;  }   
}
    
@media screen and (max-width: 370px) {
    
.modal-telefono {
  background-position: top -145px center;
  background-size: 120%;
}
    
.modal-telefono .font-size-26 {    font-size: 21px !important;  }
.modal-telefono .font-size-20 {    font-size: 15px !important;  }   
}
    
@media screen and (max-width: 350px) {
    
.modal-telefono {
  background-image: url("/img/jpg/bg-registro-escritorio.jpg");
  background-repeat: no-repeat;
  background-position: top -15px center;
  background-size: 100%;
  border-radius: 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
    margin-top: 0%;
    width: 100%;
}
    
.modal-content-textos {
  width: 100%;
  margin-bottom: 10px;
    margin-top: 140px;
    min-height: auto;
}
    
.modal-content {
  padding: 20px;
}
    
.modal-close {
  width: 50px;
  height: 50px;
}
    
.btn-enviar-codigo, .btn-mas-tarde {
  padding: 14px 20px 14px;
  font-size: 14px;
  width: 160px;
}
    
}
    
@media screen and (max-width: 320px) {
    
.modal-telefono {
  background-size: 110%;
}
    
.modal-telefono-input {
  padding-letf: 0px;
  padding-right: 0px;
}
    
input.pupup_sms_telefono {
  width: 100px !important;
}
    
}