body {
  background-color: #FCFCFC;
}

@media only screen and (max-width: 667px) {
  #main-section .instruction .instruction-item p {
    font-size: 14px !important;
  }
}
@media only screen and (max-width: 543px) {
  #main-section .instruction {
    /*padding: 30px;*/
  }
  #main-section .instruction-item {
    padding: 7px;
  }
  #main-section .instruction .instruction-item p span {
    display: none;
  }
  #main-section .instruction .instruction-item p {
    font-size: 17px !important;
  }
  #main-section .item-display .the-item img {
    width: 135px !important;
  }
  #main-section .item-display .the-item span {
    font-size: 15px !important;
  }
}
@media only screen and (max-width: 595px) {
  .tableRow .fileName {
    display: none !important;
  }
}
#main-section .item-display .the-item img {
  width: 200px;
}

#main-section {
  max-width: 1000px;
  margin: 0 auto;
}
#main-section .page-heading {
  font-weight: 400;
  font-size: 20px;
  color: #0a0a0a;
  text-align: center;
  margin-top: 70px;
  margin-bottom: 30px;
  padding: 0 25px;
}
#main-section .bold-heading {
  font-weight: 600;
  font-size: 20px;
  color: #0a0a0a;
  text-align: center;
  /* margin-top: 70px; */
  margin-bottom: 20px;
}
#main-section .red-warning {
  color: red;
  font-weight: 600;
  font-size: 16px;
  text-align: center;
  margin-bottom: 20px;
}
#main-section .green-message {
  color: #27ae60;
  font-weight: 600;
  font-size: 16px;
  text-align: center;
  margin-bottom: 20px;
}
#main-section .instruction .remove-left-border {
  border-left: none !important;
}
#main-section .instruction .remove-right-border {
  border-right: none !important;
}
#main-section .instruction .instruction-item {
  background-color: white;
  border: 1px solid #d0d0d0;
  text-align: center;
  padding: 17px;
  cursor: pointer;
}
#main-section .instruction .instruction-item p {
  font-size: 18px;
  font-weight: 400;
  color: #989898;
}
#main-section .instruction .current-selection {
  background-color: #03a9f4 !important;
  border: 1px solid #03a9f4;
}
#main-section .instruction .current-selection p {
  color: white !important;
}
#main-section .instruction .selection-done p {
  color: #03a9f4 !important;
}

.item-display {
  margin-top: 70px;
}
.item-display .the-item {
  text-align: center;
  cursor: pointer;
  padding: 15px 0;
}
.item-display .the-item:hover span {
  background: #03a9f4;
  color: white;
}
.item-display .the-item span {
  font-size: 19px;
  text-align: center;
  margin-top: 25px;
  display: block;
  background: rgba(236, 236, 236, 0.58);
  padding: 25px 0;
  /* border: 1px solid #ececec; */
  font-weight: 600;
  color: #615e5e;
}

.wrapper {
  margin: 0 auto;
  padding: 40px 15px;
}

.table {
  margin: 0 0 40px 0;
  width: 100%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  display: table;
}

.tableRow {
  display: table-row;
  background: #f9f9f9;
}

.tableRow:nth-of-type(odd) {
  background: #e9e9e9;
}

.tableRow.header {
  font-weight: 900;
  color: #ffffff;
  background: #ea6153;
}

.tableRow.green {
  background: #27ae60;
}

.tableRow.blue {
  background: #2980b9;
}

@media screen and (max-width: 580px) {
  .tableRow {
    padding: 8px 0;
  }
}
.cell {
  padding: 12px 12px;
  display: table-cell;
}

.bold-text {
  font-weight: 600;
}

.marginAndCenter {
  text-align: center;
  margin-bottom: 30px;
}

.clickable-row {
  cursor: pointer;
}
.clickable-row:hover {
  background-color: #b6b7b7;
}

/*
 ------------ Spinner CSS
*/
.spinner {
  margin: 0 auto;
  margin-top: 70px;
  width: 100px;
  height: 50px;
  text-align: center;
  font-size: 23px;
}

.spinner > div {
  background-color: #5a5a5a;
  height: 100%;
  width: 7px;
  display: inline-block;
  animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
  animation-delay: -1.1s;
}

.spinner .rect3 {
  animation-delay: -1s;
}

.spinner .rect4 {
  animation-delay: -0.9s;
}

.spinner .rect5 {
  animation-delay: -0.8s;
}
@keyframes sk-stretchdelay {
  0%, 40%, 100% {
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }
  20% {
    transform: scaleY(1);
    -webkit-transform: scaleY(1);
  }
}
.loading-text {
  text-align: center;
  font-size: 19px;
  margin-top: 13px;
  font-weight: 600;
  color: #5a5a5a;
}

#loader {
  display: none;
}
