Bootstrap-Glow Effekt in Formularfeldern bearbeiten

Bootstrap-Formulare haben einen "Glow" Effekt, welcher aktiv wird, wenn man in das Feld klickt:

Doch wie kann man diesen Effekt bearbeiten?

Dies geht mit etwas CSS-Code:

.form-control:focus {
  border-color: #00FF00;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 10px rgba(0, 255, 0, 0.75);
} 

Dieser verändert die Farbe des Rahmens und den "Schatteneffekt" welcher die Umrandung leicht glühen lässt.

Das Ergebnis sieht so aus:

Die Parameter an denen man drehen kann erklärt:

Rahmenfarbe

border-color: #00FF00;

Farbe des Effekts mit Ausdehnung und Transparenz

10px rgba(0, 255, 0, 0.75)

Die 10px geben die Dicke des Effekts an. Die rba-Farbangabe die Farbe. Diese kann auch von der Rahmenfarbe abweichen. Die 0.75 geben die Transparenz des Effekts an.

---