$card-browser-width: 600px;
$card-width: 340px;
$card-min-height: 390px;

.pointer {
  cursor: pointer;
}

//Inspire me
.cards {
  font-size: 12px;
  width: $card-browser-width;
  margin: 0 auto;
  padding-top: 20px;
  .card-browser {
    position: relative;
  }
  .inspire-card {
    position: relative;
    height: $card-min-height;
    min-height: $card-min-height;
    width: $card-width;
    margin: 0 auto 6px auto;
    display: table;
    border-left: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    img {
      display: block;
      margin: 0 auto;
    }
    .card-top {
      height: 5px;
      background-color: #c7c2dd;
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
    }
    .card-content {

    }
    .card-bottom {
      height: 5px;
      background-color: #c7c2dd;
      position: absolute;
      bottom: 0;
      right: 0;
      width: 100%;
    }
  }
  #slot-machine {
    position: absolute;
    width: 150px;
    height: 200px;
    top: 30px;
    left: 50%;
    margin-left: $card-width/2; /* 170px; */
  }
  .question {
    width: 100%;
    margin-top: 20px;
    padding: 10px;
  }
  .card-browser {
    #previousCardButton,
    #nextCardButton {
      position: absolute;
      top: 0;
      height: 24px;
      width: 24px;
      font-size: 20px;
      cursor: pointer;
      text-decoration: none;
    }
    a.inactive:hover {
      color: #DDDDDD;
    }
    #previousCardButton {
      left: 150px;
    }
    #nextCardButton {
      right: 150px;
    }
    #card-bottom-control {
      position: relative;
      height: 20px;
      font-size: 20px;
      text-align: center;
    }
  }
  .bs-callout-info,
  .bs-callout-warning {
    padding: 3px 10px;
  }
}

.card-comment {
  margin-top: 5px;
}

#admin {
  margin: 10px;
}