:root {
  --grey: #b7b7b7;
  --red: #ff001b;
  --black: #1e1e1e;
  --dark: #212529;
  --green: #00BB46;
  --yellow: #FEDD61;
}

@font-face {
  font-family: Kbold;
  src: url("../font/Karla-Bold.ttf");
}
@font-face {
  font-family: Kreg;
  src: url("../font/Karla-Regular.ttf");
}
@font-face {
  font-family: Rblack;
  src: url("../font/Rubik-Black.ttf");
}
@font-face {
  font-family: Rbold;
  src: url("../font/Rubik-Bold.ttf");
}
@font-face {
  font-family: Rmed;
  src: url("../font/Rubik-Medium.ttf");
}
@font-face {
  font-family: Rreg;
  src: url("../font/Rubik-Regular.ttf");
}
h1, h2, h3, h4, h5, h6 {
  font-family: Kbold;
}

.rblack {
  font-family: Rblack;
}

.rmed {
  font-family: Rmed;
}

.rreg {
  font-family: Rreg;
}

input {
  font-family: Rreg;
}

.mr-2 {
  margin-right: 20px;
}

p, a, input, button {
  font-size: 12px;
  font-family: Kreg;
}

body {
  font-family: Rreg;
  font-size: 12px;
}

.fs-20 {
  font-size: 20px;
}

.c-height {
  padding-top: 2px;
  padding-bottom: 2px;
}

.bg-black {
  background: var(--grey);
}

.red {
  color: var(--red);
}

.red:hover {
  background: var(--red);
  color: #fff;
}

.custom-right-dropdown[data-bs-popper] {
  right: 0 !important;
  left: unset !important;
}

.dropdown-menu {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  border: 0px solid transparent;
}

.dropdown-custom .dropdown-toggle {
  color: var(--grey);
  text-decoration: none !important;
}

.card-custom {
  min-height: 100px;
}

.list-program {
  text-decoration: none;
  color: var(--black);
}

p.informasi-tryout {
  color: var(--black) !important;
}

.name-tryout {
  min-height: 70px;
  padding-bottom: 10px;
}

/*sidebar*/
.sidebar {
  width: 400px;
  height: 100vh;
  background: var(--dark);
  color: #fff;
}

.bg-red {
  background: var(--red);
  color: #fff;
  border: 0px solid transparent !important;
}

.list-soal {
  height: 500px;
  overflow-y: scroll;
}

.ls-custom {
  width: 40px !important;
}

.info-program {
  font-family: Rblack;
  background: var(--dark);
  color: var(--grey);
  padding: 20px;
}

.info-program h5 {
  margin-bottom: 0 !important;
}

/*login*/
#login {
  background: var(--grey);
  background: linear-gradient(to right, var(--black), var(--dark));
}

#login .card-title {
  font-size: 30px !important;
  font-family: Rblack !important;
}

.btn-login {
  font-size: 0.9rem;
  letter-spacing: 0.05rem;
  padding: 0.75rem 1rem;
}

.btn-google {
  color: white !important;
  background-color: #ea4335;
}

.btn-facebook {
  color: white !important;
  background-color: #3b5998;
}

.cs-box {
  width: 100%;
  min-height: 50px;
  padding: 20px;
}

.bg-green {
  background: var(--green);
}

.nilai {
  font-family: Rbold;
  text-align: center;
  letter-spacing: 0.01em;
  color: var(--black);
  font-size: 48px;
}

.percen-nilai {
  font-size: 24px;
  font-family: Kbold;
  letter-spacing: 0.01em;
}

#soal img {
  width: auto;
  height: unset;
}

.finish-style {
  background: #159957 !important; /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #155799, #159957) !important; /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #155799, #159957) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  color: #fff !important;
}

.finish-style p {
  color: #fff !important;
}

.peringkat {
  color: var(--green);
}

.table-nilai th, .table-nilai td {
  padding-left: 20px;
  padding-right: 20px;
}

.table-nilai th {
  font-family: Rmed;
  background: var(--yellow);
  color: var(--black);
  font-size: 14px;
  border: 1px solid var(--yellow) !important;
}

.table-nilai td {
  background: #fff;
  color: var(--black);
}

@media (max-width: 480px) {
  #soal img {
    width: 100% !important;
    height: unset !important;
  }
}
.br-20 {
  border-radius: 25px;
}

.bg-voucher {
  background: #f45353;
  font-size: 14px;
  font-family: Rmed, serif;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  width: fit-content;
}

.copy {
  color: #fff;
  cursor: pointer;
}

.next-prev-box {
  margin-left: 0px !important;
}

.jawaban-responsive {
  display: block !important;
}

.next-prev-pilihan {
  display: flex;
  margin-bottom: 20px;
}

/*# sourceMappingURL=style.css.map */