@font-face {
  font-family: 'JosefinSans-SemiBold';
  src: url('../fonts/JosefinSans-SemiBold.ttf');
}

body {
  background: #ffffff;
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
}

.header {
  background: rgb(2, 0, 36);
  background: -moz-linear-gradient(0deg, rgba(2, 0, 36, 1) 0%, rgba(255, 255, 255, 1) 0%, rgba(135, 159, 196, 0.15449929971988796) 93%, rgba(10, 60, 134, 0.1516981792717087) 100%);
  background: -webkit-linear-gradient(0deg, rgba(2, 0, 36, 1) 0%, rgba(255, 255, 255, 1) 0%, rgba(135, 159, 196, 0.15449929971988796) 93%, rgba(10, 60, 134, 0.1516981792717087) 100%);
  background: linear-gradient(0deg, rgba(2, 0, 36, 1) 0%, rgba(255, 255, 255, 1) 0%, rgba(135, 159, 196, 0.15449929971988796) 93%, rgba(10, 60, 134, 0.1516981792717087) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#020024", endColorstr="#0a3c86", GradientType=1);
}

.header .dropdown-toggle::after {
  display: none !important;
}

.header .dropdown-menu {
  border-radius: .5em;
  -webkit-box-shadow: 0px 15px 13px 0px rgba(34, 60, 80, 0.15);
  -moz-box-shadow: 0px 15px 13px 0px rgba(34, 60, 80, 0.15);
  box-shadow: 0px 15px 13px 0px rgba(34, 60, 80, 0.15);
}

.logo {
  font-size: 4.5em;
  font-family: 'JosefinSans-SemiBold';
  background: #0D6EFD;
  background: linear-gradient(to bottom right, #3586ff 23%, #6943E6 78%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.btn {
  font-size: .8em;
  transition: .3s;
  border-radius: .5em;
  font-weight: bold;
}

.btn:hover {
  -webkit-box-shadow: 0px 6px 7px -1px rgba(34, 60, 80, 0.25);
  -moz-box-shadow: 0px 6px 7px -1px rgba(34, 60, 80, 0.25);
  box-shadow: 0px 6px 7px -1px rgba(34, 60, 80, 0.25);
}

.hover-shadow:hover {
  -webkit-box-shadow: 0px 15px 13px 0px rgba(34, 60, 80, 0.25);
  -moz-box-shadow: 0px 15px 13px 0px rgba(34, 60, 80, 0.25);
  box-shadow: 0px 15px 13px 0px rgba(34, 60, 80, 0.25);
  cursor: pointer;
}

.main-content {
  position: relative;
  flex: 1;
}

.main-content .description img {
  max-width: 100%;
  height: auto !important;
  margin: .5em 0;
  border-radius: .5em;
}

.category-list a {
  color: #000;
}

.category-list a:hover {
  color: #777;
}

.category-list .badge {
  font-size: .7em;
  padding: .1em .5em .2em .5em;
}

.exam-card,
.container-light {
  background: #f3f5fb;
  border-radius: 1em;
  border: none;
  transition: .3s;
  padding: .5em;
}

.container-light .form-control {
  background-color: #fdfdfd;
  border-color: #e8e8e8;
}

.exam-card .progress {
  height: .4rem;
}

.exam-card .text-mini {
  font-size: .8em;
}

.exam-card .card-header,
.exam-card .card-footer {
  background: none;
  border: none;
}

.mini-info {
  font-size: .8em;
}

.main-search .form-control {
  padding-bottom: 0.45rem;
  border: 1px solid #fff;
  border-radius: .5em;
  -webkit-box-shadow: 0px 6px 13px 0px rgba(34, 60, 80, 0.15);
  -moz-box-shadow: 0px 6px 13px 0px rgba(34, 60, 80, 0.15);
  box-shadow: 0px 6px 13px 0px rgba(34, 60, 80, 0.15);
}

.main-search .form-control::placeholder {
  color: #76adff;
  font-weight: bold;
}

.main-search .form-control:focus::placeholder {
  color: #0d6efd;
}

.main-search .form-control:focus {
  -webkit-box-shadow: 0px 18px 13px 0px rgba(34, 60, 80, 0.25);
  -moz-box-shadow: 0px 18px 13px 0px rgba(34, 60, 80, 0.25);
  box-shadow: 0px 18px 13px 0px rgba(34, 60, 80, 0.25);
  border: 1px solid #0d6efd;
  color: #0d6efd;
  font-weight: bold;
}

.ui-autocomplete {
  position: absolute;
  cursor: default;
  background: #fff;
}

.ui-widget.ui-widget-content {
  border: 0px;
  border-radius: 0 0 0.5em 0.5em;
  padding: 1em;
  color: #444;
  padding-left: 0.8rem;
  font-size: 0.9em;
  font-weight: bold;
  line-height: 1.8em;
  border: 1px solid #0d6efd;
  border-top: none;
  -webkit-box-shadow: 0px 18px 13px 0px rgba(34, 60, 80, 0.25);
  -moz-box-shadow: 0px 18px 13px 0px rgba(34, 60, 80, 0.25);
  box-shadow: 0px 18px 13px 0px rgba(34, 60, 80, 0.25);
}

.ui-widget.ui-widget-content .item-category {
  color: #999;
  font-size: 0.9em;
  font-weight: normal;
  line-height: 0.8em;
  padding-bottom: 1em;
}

.ui-menu-item .ui-menu-item-wrapper {
  padding: 0;
  padding-bottom: 0.3em;
}

.ui-menu-item .item-value.ui-menu-item-wrapper.ui-state-active {
  background: none !important;
  font-weight: none !important;
  color: #0d6efd !important;
  border-color: #fff !important;
}

.progress-counter {
  padding: .1em .6em;
  font-size: .8em;
  margin-top: .4em;
  opacity: .7;
  font-weight: bold;
  border: 1px solid #0D6EFD;
}

.progress-counter:hover {
  opacity: 1;
}

.progress-counter.current {
  background-color: #0D6EFD;
  color: #fff;
  opacity: 1;
}

.progress-counter.passed {
  background-color: #48c55c;
  border-color: #48c55c;
  color: #fff;
}

.progress-counter.wrong {
  background-color: #c54848;
  border-color: #c54848;
  color: #fff;
}

.process-timer {
  font-size: 3em;
  color: #5197ff;
}

.guest-link .btn {
  border-radius: 1em 0 0 1em !important;
}

.guest-link input {
  border-radius: 0 1em 1em 0 !important;
  border-color: #e8e8e8 !important;
  background: #f3f5fb !important;
}

.answer-icon {
  margin-top: -.2em;
}

.error-code {
  font-size: 3em;
  color: #5197ff;
}

@media (max-width: 1200px) {
  h1.logo {
    font-size: 3.8em;
  }
}

@media (max-width: 992px) {
  h1.logo {
    font-size: 3em;
  }
}