#careerTestAlpha #userGuide {
  margin-top: 10px; }

.test_alpha_q.ui.centered.grid {
  padding-top: 30px; }

.careerTestAlphaSelected {
  padding: 2%;
  border: 5px solid #fbbd08 !important; }

.careerTestAlphaNotSelected {
  filter: brightness(40%); }

.careerTestAlphaInactive {
  filter: brightness(40%); }

.career-result-img {
  width: 200px;
  height: auto;
  position: relative;
  vertical-align: middle;
  max-width: 100%;
  background-color: transparent;
  margin-right: 1.5em;
  margin-bottom: 1.5em;
  border-radius: 0.125rem; }

/* alpha result chart */
table.alpha-result-chart {
  border-collapse: collapse; }

table.alpha-result-chart td, table.alpha-result-chart tr {
  white-space: nowrap;
  padding: 0 10px 3px 10px; }

.alpha-result-chart tr td:nth-child(1) {
  border-right: 1px solid lightgray;
  text-align: right; }

.alpha-result-chart tr td:nth-child(2) {
  width: 100%; }

.alpha-result-chart tr:nth-child(1) td:nth-child(2) .alpha-result-bar {
  background-color: #9ee09e; }

.alpha-result-chart tr:nth-child(2) td:nth-child(2) .alpha-result-bar {
  background-color: #fdfd97; }

.alpha-result-chart tr:nth-child(3) td:nth-child(2) .alpha-result-bar {
  background-color: #cc99c9; }

.alpha-result-chart tr:nth-child(4) td:nth-child(2) .alpha-result-bar {
  background-color: #ff6663; }

.alpha-result-chart tr:nth-child(5) td:nth-child(2) .alpha-result-bar {
  background-color: #feb144; }

.alpha-result-chart tr:nth-child(6) td:nth-child(2) .alpha-result-bar {
  background-color: #9ec1cf; }

.alpha-result-bar {
  height: 20px;
  border-radius: 5px; }

.alpha-result-bar.bar0 {
  width: 0%; }

.alpha-result-bar.bar1 {
  width: 10%; }

.alpha-result-bar.bar2 {
  width: 20%; }

.alpha-result-bar.bar3 {
  width: 30%; }

.alpha-result-bar.bar4 {
  width: 40%; }

.alpha-result-bar.bar5 {
  width: 50%; }

.alpha-result-bar.bar6 {
  width: 60%; }

.alpha-result-bar.bar7 {
  width: 70%; }

.alpha-result-bar.bar8 {
  width: 80%; }

.alpha-result-bar.bar9 {
  width: 90%; }

.alpha-result-bar.bar10 {
  width: 100%; }

/* alpha result chart animation */
.alpha-result-chart .alpha-result-bar .progress {
  height: inherit;
  -webkit-animation: progress-active 2s ease infinite;
  animation: progress-active 2s ease infinite; }

.alpha-result-chart tr:nth-child(1) .alpha-result-bar .progress {
  animation-delay: 0s; }

.alpha-result-chart tr:nth-child(2) .alpha-result-bar .progress {
  animation-delay: 0.2s; }

.alpha-result-chart tr:nth-child(3) .alpha-result-bar .progress {
  animation-delay: 0.4s; }

.alpha-result-chart tr:nth-child(4) .alpha-result-bar .progress {
  animation-delay: 0.6s; }

.alpha-result-chart tr:nth-child(5) .alpha-result-bar .progress {
  animation-delay: 0.8s; }

.alpha-result-chart tr:nth-child(6) .alpha-result-bar .progress {
  animation-delay: 1s; }

.alpha-result-chart tr:nth-child(1) .alpha-result-bar .progress {
  background-color: #6e9c6e;
  opacity: 0; }

.alpha-result-chart tr:nth-child(2) .alpha-result-bar .progress {
  background-color: #b1b169;
  opacity: 0; }

.alpha-result-chart tr:nth-child(3) .alpha-result-bar .progress {
  background-color: #a37aa0;
  opacity: 0; }

.alpha-result-chart tr:nth-child(4) .alpha-result-bar .progress {
  background-color: #e60000;
  opacity: 0; }

.alpha-result-chart tr:nth-child(5) .alpha-result-bar .progress {
  background-color: #cb8c36;
  opacity: 0; }

.alpha-result-chart tr:nth-child(6) .alpha-result-bar .progress {
  background-color: #7e9aa5;
  opacity: 0; }

@-webkit-keyframes progress-active {
  0% {
    opacity: 0.3;
    width: 0; }
  100% {
    opacity: 0;
    width: 100%; } }

@keyframes progress-active {
  0% {
    opacity: 0.3;
    width: 0; }
  100% {
    opacity: 0;
    width: 100%; } }

@media only screen and (min-width: 1200px) {
  #alphaTestProgressWrapper {
    max-width: 1000px; } }

#alphaTestProgressContainer {
  position: fixed;
  bottom: 10px;
  z-index: 3;
  left: 0%;
  width: 100%; }
  #alphaTestProgressContainer .progress-bar {
    color: white;
    text-align: center; }

@media only screen and (max-width: 1199px) {
  #alphaTestProgressWrapper {
    max-width: 90%; } }

@media only screen and (max-width: 450px) {
  #alphaTestProgressContainer {
    bottom: 50px; } }

#screenWidthBelow450px {
  position: fixed;
  bottom: 0px;
  background-color: #db2828;
  margin: 0;
  color: white; }

@media only screen and (min-width: 450px) {
  #screenWidthBelow450px {
    display: none; } }

#careerTestAlpha img, .hoverPointer, .ui.tabular.menu .item {
  cursor: pointer; }

@media only screen and (max-width: 768px) {
  #careerTestAlpha .test_alpha_q div.ui.image.seven.wide.column {
    padding: 0 0 0  7px; }
  #careerTestAlpha .test_alpha_q div.ui.image.seven.wide.column:first-of-type {
    padding: 0 7px 0 0; } }

@media only screen and (min-width: 450px) {
  #screenWidthBelow450px {
    display: none; } }

@media only screen and (max-width: 450px) {
  #alphaTestProgressContainer {
    bottom: 50px; } }