body {
  font-family: 'Raleway', sans-serif;
  background-color: #282F44 !important;
}

h1 {
  font-style: normal;
  font-weight: 700;
  font-size: 24px;
  color: #F7F9F9;
  text-align: center;
  margin-bottom: 32px;
}

h5 {
  font-weight: bold;
}

.container {
  /* 720 */
  /* max-width: 960px; */
  /* margin: auto; */
  /* padding: 0 30px; */
}

.flex-container {
  display: flex;
  /* flex-flow: column wrap; */
  justify-content: center;
  /* align-items: stretch; */
  /* align-content: space-between; */
  /* height: 550px; */
}

.unone {
  user-select: none;
}

/* Style applied to the spin button once a power has been selected */
.clickable {
  cursor: pointer;
}

/* Style untuk Button di Main Page */

.btn-ungu {
  width: 160px;
  border: 2px solid;
  border-radius: 12px;
  color: #262626;
  background-color: #282F44;
  padding: 16px 24px 12px 24px;

  transition: 0.3s;
}

.btn-ungu:hover,
.btn-ungu:active {
  border: 2px solid #282F44;
  border-radius: 100px;
  background-color: #1F2434;
}

.btn-form {
  width: 326px;
  border: 2px solid;
  border-radius: 12px;
  color: #262626;
  background-color: #282F44;
  padding: 16px 24px 12px 24px;

  transition: 0.3s;
}

.btn-form:hover,
.btn-form:active {
  border: 2px solid #282F44;
  border-radius: 100px;
  background-color: #1F2434;
}


.text-border-white {
  /* SHADOW WHITE */
  text-shadow: 1px 1px 2px #F9F9F9;
}

.border-white {
  /* BORDER WHITE */
  text-shadow: 1px 0 0 #F9F9F9, -1px 0 0 #F9F9F9, 0 1px 0 #F9F9F9, 0 -1px 0 #F9F9F9, 1px 1px #F9F9F9, -1px -1px 0 #F9F9F9, 1px -1px 0 #F9F9F9, -1px 1px 0 #F9F9F9;
}