
body {
  /* min-height: 75rem; */
  padding-top: 4.5rem;
  background-color:#231;
  overflow-x:hidden;
}

.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.profile-link {
  color:#fff;
  text-decoration:none;
}
.profile-picture {
  height:32px;
}

.outer-wrapper .row {
  margin-left:5px;
  margin-right:5px;
}

.play_area {
  position:relative;
  /*background-color: #052; */
  /* background-color:#efe; /* temp */
  background: radial-gradient(circle, rgba(25,92,25,1) 0%, rgba(35,56,21,1) 100%);
  min-height: 500px;
}

.seat {
  position:absolute;
  width: 100px;
  border: 2px solid #555;
  border-radius: 5px;
  background-color: #fff;
  padding:4px;
}

.seat[pos="1"] {
  left:11%;
  margin-top:200px;
}
.seat[pos="2"] {
  left:32%;
  margin-top:20px;
}
.seat[pos="3"] {
  left:61%;
  margin-top:20px;
}
.seat[pos="4"] {
  left:81%;
  margin-top:200px;
}
.seat[pos="5"] {
  left:0%;
  padding-left:20px;
  margin-top:392px;
  width:100%;
  min-height:80px;
  background-color: rgba(0,0,0,0.5);
  color:#fff;
}
.seat[pos="1"] .played-card {
  left:105px;
  margin-top:5px;
}
.seat[pos="2"] .played-card {
  left:35px;
  margin-top:74px;
}
.seat[pos="3"] .played-card {
  left:35px;
  margin-top:74px;
}
.seat[pos="4"] .played-card {
  left:-38px;
  margin-top:5px;
}
.seat[pos="5"] .played-card {
  left:50%;
  margin-left:-22px;
  margin-top:-134px;
}


/* same as seat dims so the prompt areas corespond */
.prompt-target {
  position:absolute;
  width: 100px;
  height: 70px;
}
.seat[pos="5"] .prompt-target {
  margin-top:-10px;
  width:100%;
  padding-left:-20px;
}

.prompt {
  background:#fff;
  color:#444;
  padding:4px 8px;
  border-radius:4px;
  font-size:18px;
  display:none;
  z-index:30;
  min-width:120px;
  min-height:50px;
}
.prompt-content .btn {
  margin-right:5px;
}
.prompt[data-show] {
  display:block;
}
.prompt .material-symbols-outlined, .dealer .material-symbols-outlined, .picker .material-symbols-outlined, .blitz .material-symbols-outlined {
  vertical-align: text-bottom;
  font-size:18px;
  padding-right:4px;
  padding-left:4px;
}
.prompt .spinner-border {
  margin-right:5px;
}
.prompt .call-up {
 /* hand cursor */
 cursor: pointer;

}
.arrow,
.arrow::before {
  position: absolute;
  width: 8px;
  height: 8px;
  background: inherit;
  z-index: -1;
}
.arrow {
  visibility: hidden;
}
.arrow::before {
  visibility: visible;
  content: '';
  transform: rotate(45deg);
}
.prompt[data-popper-placement^='top'] > .arrow {
  bottom: -4px;
}
.prompt[data-popper-placement^='bottom'] > .arrow {
  top: -4px;
}
.prompt[data-popper-placement^='left'] > .arrow {
  right: -4px;
}
.prompt[data-popper-placement^='right'] > .arrow {
  left: -4px;
}

.hand {
  position:relative;
/*  margin-top:400px;
  left:50%;
  transform: translateX(-50%); */
  left:140px;
  height:80px;
  top:400px;
  min-width:400px;
}
.card, .played-card {
/*width: 32px;
  height: 58px;*/
  width: 45px;
  height: 63px;
  background-color: #fff;
  border: 1px solid #000;
  border-radius: 5px;
  float:left;
  margin-right:5px;
  padding:4px;
  font-size:14px;
  line-height:10px;
  font-family: Arial, Helvetica, sans-serif;
}
.card .suit, .played-card .suit {
  width:37px;
  text-align:center;
  font-size:40px;
  margin-top:8px;
  display:inline-block;
}
.card-bottom {
  display:inline-block;
  position:absolute;
  bottom:4px;
  right:4px;
  transform: rotate(180deg);
}
.flip180 {
  transform: rotate(180deg);
}
.card-sm {
  border:1px solid #000;
  padding:0px 4px 4px 4px;
  border-radius:3px;
  background-color:#fff;
}
.played-card {
  position:absolute;
  z-index:20;
}
.red, .red {
  color:red;
}
.black, .black {
  color:black;
}
.card.toBury {
  border: 1px solid #f00;
  margin-top:-10px;
}

.chat_wrapper {
  min-height: 500px;
  border: 1px solid #ddd;
  background-color: #eee;
  border-radius: 5px;
  padding: 15px;
}
.chat_wrapper .members {
  min-height: 426px;
  width: 20%;
  overflow-y: scroll;
  overflow-x: hidden;
  background-color: #fff;
  border:1px solid #ddd;
  border-left:2px solid #eee;
  padding: 5px;
  margin-bottom: 5px;
  float: right;
}
.members .member-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.chat {
  min-height: 426px;
  width: 80%;
  overflow-y: scroll;
  border:1px solid #ddd;
  background-color: #fff;
  padding: 5px;
  margin-bottom: 5px;
}
.chat p {
  margin-bottom: 0px;
}
.chat p.system {
  color: #06f;
  font-style: italic;
}
.chat_input_text {
  width: 100%;
  border: 1px solid #ddd;
  padding: 5px 60px 5px 5px;
  border-radius: 1px;
}
.chat_input_text:focus {
  outline: none;
}

.chat_input_submit {
  position: absolute;
  margin-left:-54px;
  margin-top:3px;
}

.container {
    max-width: 100% !important;
}

@media (min-width: 576px) {

}

@media (min-width: 768px) {
}


@media (min-width:992px) {

}
