:root {
  --color_text_common: #fff;
  --color_bg_common: #000;
  --color_border_card: #000;
  --color_bg_login: #6610f2; }

[data-theme="light"] {
  --color_text_common: #000;
  --color_bg_common: white;
  --color_border_card: #ea4335;
  --color_bg_login: #6610f2; }

:root {
  --body_bg: url("../../../dark/images/welcome-bg.jpg"); }

[data-theme="light"] {
  --body_bg: url("../../../light/images/welcome-bg.jpg"); }

.form-login {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  color: var(--color_text_common); }
  .form-login > div {
    opacity: 0.9; }

.card-signin {
  border: 0;
  border-radius: 0;
  border: 1px solid var(--color_border_card);
  background-color: var(--color_bg_common); }
  .card-signin .card-title {
    margin-bottom: 2rem;
    font-weight: 300;
    font-size: 1.5rem; }
  .card-signin .card-body {
    padding: 2rem;
    font-family: Glyphicons Halflings;
    position: relative; }

.form-signin {
  width: 100%; }
  .form-signin .btn {
    background-color: var(--color_bg_login);
    color: var(--color_text_common);
    letter-spacing: 0.1rem;
    font-weight: bold;
    transition: all 0.2s;
    margin-top: 1rem;
    font-size: 20px;
    display: inline-block;
    width: 100%;
    border-radius: 0;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
    .form-signin .btn:hover {
      opacity: 0.8; }

body {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
  background-image: var(--body_bg);
  background-size: cover; }

.form-group {
  position: relative; }

.form-control {
  background: transparent;
  color: var(--color_text_common); }
  .form-control:hover, .form-control:focus {
    background: transparent; }

.dropdown {
  position: absolute;
  background: transparent;
  color: var(--color_text_common); }

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  background: transparent; }