@import url('https://fonts.googleapis.com/css?family=Cabin:400,500,600,700');
body { position: relative; font-family: 'Cabin', sans-serif; }

.alert-danger { color: #FFF!important; background-color: #3E509A!important; border-color: #3E509A!important; }

/* Navbar */
.navbar { position: absolute; left: 0; right: 0; background-color: transparent!important; }
.navbar .navbar-brand img { width: 119px; }

/* Header */
.header { background: linear-gradient(to left top, #CA447A, #3E509A); color: #FFF; padding: 150px 0 70px; }
@media(min-width: 768px) {
  .header .title { padding: 0 100px; }
}
@media(min-width: 1280px) {
  .header .title { padding: 0 150px; }
}

/* Register */
.register { background: #F7F6F7; padding: 100px 0;  }
.register form label { margin-bottom: .2rem; }
.register .btn-outline-tmg { background: #FFF; border-color: #3E509A; color: #3E509A; padding-left: 30px; padding-right: 30px; }
.register .btn-outline-tmg:hover { background: #3E509A; border-color: #3E509A; color: #FFF; }

.register .card { border-radius: 6px; margin: 30px 0 60px; border: 1px solid transparent; }
.register .card .card-body { padding: 50px 20px; }
.register .card .card-body hr { width: 30%; border-color: #968ff4; }
.register .card .card-body h1 {
  font-size: 3em;
  font-weight: 700;
  line-height: 50px;
  background: #968ff4;
  background: linear-gradient(135deg,#968ff4 45%,#6ab6e5 70%);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}
.register .card .card-body span {
  font-size: 2em;
  font-weight: 500;
  line-height: 50px;
  padding-top: 15px;
  padding-bottom: 20px;
  background: #968ff4;
  background: linear-gradient(135deg,#968ff4 45%,#6ab6e5 70%);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}
.register .card .card-body span:nth-child(2n+0) { font-size: 1.7em; }
.register .card .card-footer { background-color: transparent; border-top: none; }
.register .card .card-footer .btn-rounded {
  position: absolute;
  left: calc(50% - 25px);
  bottom: -25px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  background-color: #3E509A;
  border-color: #3E509A;
  border-radius: 50%;
  color: #FFF;
}
.register .card .card-footer .btn-rounded i { font-size: 1.6em; }

.register .card.active { background: linear-gradient(to left top, #CA447A, #3E509A); margin: 30px 0 60px; border-radius: 6px; border: none; }
.register .card.active .card-body { padding: 100px 20px; }
.register .card.active .card-body hr { border-color: #FFF; }
.register .card.active .card-body h1 { -webkit-text-fill-color: initial; color: #FFF; }
.register .card.active .card-body span { -webkit-text-fill-color: initial; color: #FFF; }


@media(max-width: 991px) {
  .register .card .card-body span { font-size: 3.8em; }
}
@media(min-width: 992px) and (max-width: 1199px) {
  .register .card .card-body span { font-size: 3em; }
}

.feeds {
  padding: 0 !important;
}

.feeds li i {
  background: #968ff4;
  background: linear-gradient(135deg,#968ff4 45%,#6ab6e5 70%);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  font-size: 0.7em;
}
.register .card .card-body .feeds li{
  list-style: none;
  padding: 0;
}

.register .card.active .card-body .feeds li i {
  background: #fff;
  background: linear-gradient(135deg,#fff 45%,#fff 70%);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  font-size: 0.7em;
}

/* Footer */
.footer { background: #F7F6F7; }
.footer a {
  position: absolute;
  left: calc(50% - 20px);
  top: -20px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: #FFF;
  color: #3E509A;
  border: 1px solid #3E509A;
  border-radius: 50%;
}
.footer a:hover { background: #3E509A; color: #FFF; }
.footer p { border-top: 1px solid #CCC; padding-top: 30px; padding-bottom: 25px; }

.bootstrap-tagsinput {
  border: 1px solid #e5e6e7;
  box-shadow: none;
  background: #FFF;
  padding: .5rem 1rem;
  font-size: 1.25rem;
  line-height: 1.5;
  border-radius: .3rem;
}

.label-info, .badge-info {
  background-color: #303F9F;
  color: #FFFFFF;
  padding: 5px;
}

.has-error .form-control, .has-error .form-control:focus {
  border-color: #ED5565;
}

.has-error label {
  color: #ED5565;
}