@import "color.less";
.quesnaire {
  .unitTestBtn {
    display: block !important;
    margin: 0px;
    width: 100% !important;

    .unitTestbg {
      cursor: pointer;
      padding: 5px 10px;
      background-color: #fff;
      border-radius: 4px;
      border: 1px solid rgb(143, 143, 143);
	  margin-top: 10px;
    }

    input[type="checkbox"],
    input[type="radio"] {
      visibility: hidden;
      margin-left: -10px;

      &:checked {
        ~ .unitTestbg {
          background-color: rgb(36, 184, 128) !important;
          border: none;
          color: #fff;
          font-weight: bolder;
        }
      }
    }
  }
  .uloadBtn-icon{
      font-size:18px;
      position: relative;
      top:1px;
      margin-right:4px;
  }
  .commentArea {
    width: 100%;
    padding: 10px;
    margin-top: 12px;
    background: rgba(139, 139, 139, 0.1);
    border: 1px solid @border;
    border-radius: 6px;
    color: rgb(68, 68, 68);
    &:focus {
      outline-color: #24b880;
    }
  }
  .unitTestbtnWithImg {
    display: inline-block !important;
    margin:10px;
    width: 20% !important;
    vertical-align: top;
    .checkImg {
      width: 100% !important;
    }
  }
  .mustAns{
    color:red
  }
  .undoNum,.hintnoAns{
    color:#fa6400;
    font-weight: bolder;
  }
  .messageCardBtn {
    width: 35%;
    margin: 30px 5px 10px 5px;
    padding: 5px;
    border: none;
    color: rgb(106, 101, 101);
    font-weight: 500;
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.1);
    outline: none;
    cursor: pointer;
    &:hover{
      background: rgba(0, 0, 0, 0.2);
    }
  }
  .quesnairefinished-icon {
    font-size: 60px;
    position: relative;
    left: 0px;
    margin: 10px 0px;
  }
}
