/*div.row > div{
        border: red dashed 1px;
    }*/

p {
  margin-bottom: 2rem;
}

a.link_login {
  color: white;
  text-decoration: underline;
}

#error-login {
  background-color: #f6f6f6 !important;
  padding: 15px;
  margin-bottom: 10px;
}

#mensaje-retorno {
  font-size: 0.8em;
  background-color: #f6f6f6 !important;
  padding: 15px;
}

#arrow-right {
  margin-top: 15px;
  padding-top: 10px;
}

.registro-user {
  margin-top: 30px;
  border: none !important;
  border-radius: 5px;
  color: #662082;
  background-color: #f6f6f6;
  padding: 15px;
  width: 154px;
}

.registro-user:hover {
  border: none !important;
  border-radius: 5px;
  color: #662082;
  background-color: #f6f6f6;
  padding: 15px;
  width: 154px;
}

.ini_sesion {
  margin-top: 30px;
  margin-bottom: 30px;
  border: none !important;
  border-radius: 5px;
  color: #662082;
  background-color: #f6f6f6;
  padding: 15px;
  width: 154px;
}

.ini_sesion:hover {
  border: none !important;
  border-radius: 5px;
  color: #662082;
  background-color: #f6f6f6;
  padding: 15px;
  width: 154px;
}

.login-input {
  margin-top: 15px;
}

.firebase-btn {
  margin-top: 30px;
  border: none !important;
  border-radius: 5px;
  color: #662082;
  background-color: #f6f6f6;
}

.login-phone {
  padding: 0 !important;
  color: #fff !important;
  text-align: center;
}

.txt-login {
  padding: 15px;
  color: #fff !important;
  margin-bottom: 20px;
}

.feature_title {
  color: #fff !important;
}

#yivana-logo {
  padding: 30px;
}

#login-yivana {
  margin-top: 200px;
  margin-bottom: 100px;
}

body {
  background-color: #662082;
}

/*li:hover{
			   cursor: pointer;
		  }*/
#login-area {
  text-align: center;
}

#code-area {
  text-align: center;
}

#sesion-form input {
  height: 0;
  padding: 25px !important;
  border-right-style: none;
  border-left-style: none;
  border-top-style: none;
  border-bottom: 2px solid #f6f6f6;
  -webkit-appearance: none !important;
  box-shadow: none !important;
  margin-bottom: 15px;
  text-align: center;
  width: 100% !important;
  background: transparent;
  border-radius: none !important;
  color: #f6f6f6 !important;
  border-radius: 0px !important;
}

#register-form input {
  border-radius: 0px !important;
  height: 0;
  padding: 25px !important;
  border-right-style: none;
  border-left-style: none;
  border-top-style: none;
  border-bottom: 2px solid #f6f6f6;
  -webkit-appearance: none !important;
  box-shadow: none !important;
  margin-bottom: 15px;
  text-align: center;
  width: 100% !important;
  background: transparent;
  border-radius: none !important;
  color: #f6f6f6 !important;
}

::-webkit-input-placeholder {
  color: #f6f6f6 !important;
}

::-moz-placeholder {
  /* Firefox 18- */
  color: #f6f6f6 !important;
}

:-moz-placeholder {
  /* Firefox 19+ */
  color: #f6f6f6 !important;
}

:-ms-input-placeholder {
  color: #f6f6f6 !important;
}

#firebase-login-form input :focus {
  outline: 0;
}

.content-info {
  display: none;
}

.banner {
  display: none;
}

img {
  display: block;
  margin: auto;
}

.firebase-container {
  margin-top: 3rem;
}

.firebase-auth-providers {
  display: flex;
  justify-content: center;
  gap: 32px;
}

.firebase-auth-providers img {
  cursor: pointer;
  max-width: 60px;
}

/*
			##Device = Low Resolution Tablets, Mobiles (Landscape)
			##Screen = B/w 481px to 767px
		  */

@media (min-width: 481px) and (max-width: 767px) {
  #login-area {
    padding: 10px;
  }

  #code-area {
    padding: 10px;
  }

  .login-phone {
    margin-bottom: 15px;
  }

  .ini_sesion {
    width: 100%;
  }

  .registro-user {
    width: 100%;
  }

  .ini_sesion:hover {
    width: 100%;
  }

  .registro-user:hover {
    width: 100%;
  }
}

/*
			##Device = Most of the Smartphones Mobiles (Portrait)
			##Screen = B/w 320px to 479px
		  */

@media (min-width: 320px) and (max-width: 480px) {
  #login-area {
    padding: 10px;
  }

  #code-area {
    padding: 10px;
  }

  .login-phone {
    margin-bottom: 15px;
  }

  .ini_sesion {
    width: 100%;
  }

  .registro-user {
    width: 100%;
  }

  .ini_sesion:hover {
    width: 100%;
  }

  .registro-user:hover {
    width: 100%;
  }
}

@media (min-width: 768px) {
  .col-md-offset-3 {
    margin-left: 25%;
  }
}