:root {
  --input-padding-x: 1.5rem;
  --input-padding-y: .75rem;
}
body {
  background: #2757b7;
  font-family: 'Montserrat', sans-serif;
  background: linear-gradient(to right, #152e6d, #2757b7);
}
.card { margin-top: 200px; }
.btn-wg {
    -moz-transition: all 0.2s; -o-transition: all 0.2s; -webkit-transition: all 0.2s; transition: all 0.2s;
    display: inline-block;
    background-color: #2757b7;
    color: #fff;
    border:none;
    padding: 5px 24px 5px 24px;
    border-radius: 20px;
    font-weight: 300;
    outline: none;
    cursor: pointer; }
.btn-wg { outline: none !important; }
.btn-wg:hover { background-color: #152e6d; -moz-transition: all 0.2s; -o-transition: all 0.2s; -webkit-transition: all 0.2s; transition: all 0.2s; }
.card-signin {
  border: 0;
  border-radius: 1rem;
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1);
}
.card-signin .card-title {
  margin-bottom: 2rem;
  font-weight: 300;
  font-size: 1.5rem;
}
.card-signin .card-body {
  padding: 2rem;
}
.form-signin {
  width: 100%;
}
.form-signin .btn {
  font-size: 80%;
  border-radius: 5rem;
  letter-spacing: .1rem;
  font-weight: bold;
  padding: 1rem;
  transition: all 0.2s;
}
.form-label-group {
  position: relative;
  margin-bottom: 1rem;
}
.form-label-group input {
  height: auto;
  border-radius: 2rem;
}
.form-label-group>input,
.form-label-group>label {
  padding: var(--input-padding-y) var(--input-padding-x);
}
.form-label-group>label {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  cursor: text;
  margin-bottom: 0;
  /* Override default `<label>` margin */
  line-height: 1.5;
  color: #495057;
  /*border: 1px solid transparent;*/
  border-radius: .25rem;
  transition: all .1s ease-in-out;
}
.form-label-group input::-webkit-input-placeholder {
    color: #777;
}
.form-label-group input:-ms-input-placeholder {
    color: #777;
}
.form-label-group input::-ms-input-placeholder {
    color: #777;
}
.form-label-group input::-moz-placeholder {
    color: #777;
}
.form-label-group input::placeholder {
  color: #777;
}
.form-label-group input:not(:placeholder-shown) {
  padding-top: 10px;
  padding-bottom: 10px;
}
.form-label-group input:not(:placeholder-shown)~label {
  padding-top: calc(var(--input-padding-y) / 3);
  padding-bottom: calc(var(--input-padding-y) / 3);
  font-size: 12px;
  color: #777;
}
.btn-google {
  color: white;
  background-color: #ea4335;
}
.btn-facebook {
  color: white;
  background-color: #3b5998;
}
.form-label-group input { border-radius: 0.8rem; }
.form-control {
    color: #000;
    background-color: #f4f4f4;
    border: none;
}
.form-control:focus { box-shadow: none; background-color: #dfdfdf; }
.custom-control { padding-left: 2rem; }
.custom-control-input:focus~.custom-control-label::before { box-shadow: none; }
.custom-control-label::before { background-color: #f4f4f4; border: none; top: 0; border-radius: 4px; left: -2rem;  width: 1.5rem;
    height: 1.5rem; }
.custom-control-label::after { top:0; width: 1.5rem; left: -2rem;
    height: 1.5rem; }
.custom-control-input:checked~.custom-control-label::before { background-color: #2757b7; }
.webgablogo {
text-align: center;
margin-top: 30px;
}
.webgablogo .toplogo {     font-size: 31px;
font-weight: 900;
line-height: 28px;
color: #ccc;
}
.webgablogo .bottomlogo {
font-size: 14px;
font-weight: 300;
color: #ccc;
}
.webgablogo .bottomlogo a { font-weight: 700;
color: #ccc; }
.pwgroup { position: relative; }
label.check-text { position: absolute;
  right: 7px;
  top: 11px; }
.check-text input {
  display: none;
}
.check-text input ~ i {
  color: #ccc;
  cursor: pointer;
  padding: 6px;
  border-radius: 2px;
  width: 34px;
  font-weight: 200;
  text-align: center;
}
.check-text input ~ .checked {
  display: none;
}
.check-text input:checked ~ .checked {
  display: inline-block;
}
.check-text input:checked ~ .unchecked {
  display: none;
}
.blackNwhite {
  position: absolute;
  background-color: black;
  height: 100%;
  width: 100%;
}
.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Old versions of Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently
                                    supported by Chrome, Opera and Firefox */
  }
/* Fallback for Edge
-------------------------------------------------- */
@supports (-ms-ime-align: auto) {
  .form-label-group>label {
    display: none;
  }
  .form-label-group input::-ms-input-placeholder {
    color: #777;
  }
}
/* Fallback for IE
-------------------------------------------------- */
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
  .form-label-group>label {
    display: none;
  }
  .form-label-group input:-ms-input-placeholder {
    color: #777;
  }
}