#brs_update_explanation {
  background: #DFF0D9;
  color: #48874A;
  padding: 5px;
  border: 1px solid #D6E8C7;
  margin-top: 20px;
  display: none;
}

#brs_update_explanation_1, #brs_update_explanation_2, #brs_update_explanation_3, #brs_update_explanation_4 {
  display: none;
}

brs_update_hashes {
  display: none;
  margin-top: 20px;
}

#brs_update_hashes table {
  border-collapse: collapse;
  border: 1px solid #bbb;
}

#brs_update_hashes table td {
  padding: 2px;
  margin-bottom: 1px;
}

#brs_update_explanation span {
  display: none;
}

#brs_update_drop_zone, #brs_update_result {
  padding: 25px;
  text-align: center;
  font-weight: bold;
  font-size: 30px;
  line-height: 30px;
  background: #DFF0D9;
  color: #48874A;
  border: 1px solid #D6E8C7;
  display: none;
}

#brs_update_hash_progress {
  height: 15px;
  background: #48874A;
  display: none;
  margin-top: 20px;
}

.modal-body {
  padding-bottom: 8px;
}

.animate-change {
  background-color: green;
}

#at td {
  background-color: #E5E6EB;
}

.incorrect {
  background: #E2424F !important;
  color: white !important;
  border: 1px solid #E4404B !important;
}

.alert-no-icon {
  margin-left: 0px !important;
  padding-left: 15px !important;
}

/* http://stackoverflow.com/questions/12996736/basic-jquery-animation-elipsis-three-dots-sequentially-appearing */

@keyframes opacity {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

#loading_dots {
  text-align: center;
  margin: 100px 0 0 0;
}

#loading_dots span {
  animation-name: opacity;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}

#loading_dots span:nth-child(1) {
  animation-delay: 100ms;
}

#loading_dots span:nth-child(2) {
  animation-delay: 300ms;
}

#loading_dots span:nth-child(3) {
  animation-delay: 500ms;
}