.help-block{

    color:red !important
  
  }
  
  
  
  
  
  
  :root{
  
  --color--negro: #1B1B1B;
  
  --color--blanco: #FFFFFF;
  
  --color--verde: #2ecc71;
  
  --color--watercourse: #27ae60;
  
  --color--rojo: #c4c5d3; 
  
  --color--scarlett: #82838a;
  
  --color--naranja: #EB9532;
  
  --color--pirategold: #f39c12;
  
  --color--pumpkin: #d35400;
  
  --color--purpura: #7E3661;
  
  --color--celeste: #3498DB;
  
  --color--azul: #2A7AAF;
  
  --color--steelblue: #6977FF;
  
  --color--belizehole: #5767fa;
  
  --color--megaman: #48dbfb;
  
  --color--greendannertile: #74b9ff;
  
  --color--cyanite: #0abde3;
  
  --color--celestefrancia: #2e86de;
  
  --color--spray: #02a5ca;
  
  }
  
  
  
  .boton{
  
  border: 3px solid rgba(100,100,100,0.1);
  
  margin-bottom:20px;
  
  padding: 10px;
  
  width: auto;
  
  font-family: 'Poppins',sans-serif;
  
  font-size: 16px;
  
  border-radius: 8px;
  
  cursor: pointer;
  
  color: #FFF;
  
  background-size: 300%;
  
  transition: 0.5s ease-in;
  
  height: 50px;
  
  /* text-decoration: none; */
  
  }
  
  /**Mi clase boton personalizado*/
  
  .custom_btn{
  
  border: 2px solid;
  
  border-radius: 5px;
  
  cursor: pointer;
  
  margin: 0 20px;
  
  padding: 0.2rem 0.8rem;
  
  font-weight: bold;
  
  font-size: 1.2rem;
  
  display: inline-block;
  
  
  
  
  
  }
  
  
  
  .custom_btn:focus{
  
  outline: 0;
  
  }
  
  /**Para los efectos*/
  
  .efecto{
  
  background-position: 100%;
  
  background-size: 400%;
  
  transition: background 0.5s ease-in-out;
  
  }
  
  
  
  .efecto:hover{
  
  background-position: 0;
  
  text-decoration: none;
  
  color: var(--color--blanco);
  
  }
  
  /**colores */
  
  
  
  
  
  
  
  .verde{
  
  background-color: var(--color--verde);
  
  color: var(--color--blanco);
  
  border-color: var(--color--verde);
  
  background-image: linear-gradient(45deg,var(--color--watercourse) 50%, transparent 50%);
  
  box-shadow: 0 5px 15px 0 rgba(23, 168, 108, 0.75);
  
  }
  
  
  
  .verde:hover{
  
  border-color: var(--color--watercourse);
  
  }
  
  
  
  .celeste{
  
  background-color: var(--color--cyanite);
  
  color: var(--color--blanco);
  
  border-color: var(--color--cyanite);
  
  background-image: linear-gradient(45deg,var(--color--spray) 50%, transparent 50%);
  
  box-shadow: 0 5px 15px 0 var(--color--megaman);
  
  }
  
  
  
  .celeste:hover{
  
  border-color: var(--color--spray);
  
  }
  
  
  
  .azul{
  
  background-color: var(--color--steelblue);
  
  color: var(--color--blanco);
  
  border-color: var(--color--steelblue);
  
  background-image: linear-gradient(45deg,var(--color--belizehole) 50%, transparent 50%);
  
  box-shadow: 0 5px 15px 0 var(--color--steelblue);
  
  }
  
  
  
  .azul:hover{
  
  border-color: var(--color--belizehole);
  
  }
  
  
  
  .rojo{
  
  background-color: var(--color--rojo);
  
  color: var(--color--blanco);
  
  border-color: var(--color--rojo);
  
  background-image: linear-gradient(45deg,var(--color--scarlett) 50%, transparent 50%);
  
  box-shadow: 0 5px 15px 0 var(--color--scarlett);
  
  }
  
  
  
  .rojo:hover{
  
  border-color: var(--color--scarlett);
  
  }
  
  
  
  .naranja{
  
  background-color: var(--color--naranja);
  
  color: var(--color--blanco);
  
  border-color: var(--color--naranja);
  
  background-image: linear-gradient(45deg,var(--color--pumpkin) 50%, transparent 50%);
  
  box-shadow: 0 5px 15px 0 var(--color--pumpkin);
  
  }
  
  
  
  .naranja:hover{
  
  border-color: var(--color--pumpkin);
  
  }
  
  
  
  .boton:hover{
  
  background-position: right;
  
  color: #FFF;
  
  text-decoration: none;
  
  transition: 0.5s ease-in;
  
  }
  
  
  
  .boton-azul{
  
  background-image: linear-gradient(to left,#00B7DA,#161569,#00B7DA);
  
  }
  
  
  
  .boton-verde{
  
  background-image: linear-gradient(to left,#5CB85C,#1E3C1E,#5CB85C);
  
  }
  
  
  
  .panel-custom > .panel-heading {
  
  background-image: linear-gradient(to right,var(--color--steelblue),var(--color--celeste),var(--color--megaman));
  
  color:#FFF;
  
  border-color: #337ab7;
  
  }
  
  
  
  .popover-title {
  
  color: var(--color--blanco);
  
  background-color: var(--color--greendannertile);
  
  
  
  }