.btn-qc {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-qc-toogled {
  color: #000;
  /*border-color: #000;*/
}



.btn-start {
  color: #fff;
  background-color: #448844;
  border-color: #337733;
}

.btn-stop {
  color: #fff;
  background-color: #AA5555;
  border-color: #773333;
}

.quiz-select {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

.invisible {
  display: none;
}


.choice-label .choice-input {
  margin-left: -18px !important;
}

.choice-label-edit {
  width: 100%;
 min-height: 16px;
 padding: 2px;
 padding-left: 32px;
 margin-left: 0px;
 margin-right: 0px;
 margin-bottom: 2px;
 /*
 background-color:#f5f5f5;
 border:1px solid #e3e3e3;
 border-radius: 4px;
 -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.05);
 box-shadow:inset 0 1px 1px rgba(0,0,0,0.05);
 */
}


.choice-label {
  width: 100%;
 min-height: 16px;
 padding: 10px;
 padding-left: 32px;
 margin-left: 0px;
 margin-right: 0px;
 margin-bottom: 3px;
 background-color:#f5f5f5;
 border:1px solid #e3e3e3;
 border-radius: 4px;
 -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.05);
 box-shadow:inset 0 1px 1px rgba(0,0,0,0.05);
}

#quiz-outer .panel-heading, #chat-outer .panel-heading  {
    padding: 3px 12px;
}

.chat-body-style {
  border: 1px solid black;
  background-color: #fff !important;
  overflow-y: scroll;
}

.chat
{
    list-style: none;
    margin: 0;
    padding: 0;
}

.chat li
{
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px dotted #B3A9A9;
    background-color: #fff !important;
}

.chat li.left .chat-body
{
    margin-left: 60px;
}

.chat li.right .chat-body
{
    margin-right: 60px;
}


.chat li .chat-body p
{
    margin: 0;
    color: #777777;
    background-color: #fff !important;

}

.panel .slidedown .glyphicon, .chat .glyphicon
{
    margin-right: 5px;
}

.panel-body
{
    overflow-y: scroll;
    height: 250px;
}

::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}

::-webkit-scrollbar
{
    width: 12px;
    background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #555;
}

:root {
  --avatar-size: 4rem;
  /* change this value anything, e.g., 100px, 10rem, etc. */
}

.circle {
  background-color: #ccc;
  border-radius: 50%;
  height: var(--avatar-size);
  text-align: center;
  width: var(--avatar-size);
}

.initials {
  font-size: calc(var(--avatar-size) / 2); /* 50% of parent */
  line-height: 1;
  position: relative;
  top: calc(var(--avatar-size) / 4); /* 25% of parent */
}