#wrapper {
  display: grid;
  /* autofit is what we want to is expands avail cols to use all space */
  grid-template-columns: repeat(auto-fill, minmax(600px, 1fr));
  grid-gap: 1rem;
}
#wrapper > div {
  -webkit-box-shadow: 0 0 3px #ccc;
  box-shadow: 0 0 3px #ccc;
  padding: 5px;
}

* {
  font-family: "Lato";
  font-size: calc(15px + 0.390625vw);
  scrollbar-color: grey transparent;
  scroll-behavior: smooth;
}

body {
  margin-left: 30px;
  margin-right: 30px;
  background-image: url('../contacts/Shadowrun_bg.svg');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-position: center top;
}
h1.name {
  text-align: left;
  color: #bf40bf;
  font-size: 1.8rem;
  font-weight: 900;
}
h2 {
  text-align: left;
  color: #bf40bf;
  font-size: 1.5rem;
  font-weight: 900;
}
h3 {
  text-align: left;
  color: #bf40bf;
  font-size: 1.3rem;
  font-weight: 900;
}

p {
  text-align: justify;
  text-justify: inter-word;
}



/* General stats table */
table.stats {
  border: 0px;
  background-color: rgba(211, 211, 211, 0.5);
  border-collapse: separate;
  padding: 5px;
  width: 80%;
  min-width: 200px;
}
table.stats th {
  color: #bf40bf;
  text-align: center;
}
table.stats td {
  text-align: center;
}

/* Weapon table divs  - might not keep... */
/*
div.weapon {
  display: table;
  align: center;
  width: 80%;
  margin: 1em auto auto auto;
  font-size: 0.9rem;
  background-color: rgba(211, 211, 211, 0.5);
}
div.weapon_title {
  display: table-row;
  color: #bf40bf;
  font-weight: 900;
  align: left;
}

div.weapon_header {
  display: table-row;
  color: #bf40bf;
  font-weight: 900;
  text-align: center;
  background-color: rgba(192, 192, 192, 0.5);
}

div.weapon_stats {
  display: table-row;
  text-align: center;
}

div.weapon_td {
  display: table-cell;
  text-align: center;
}

div.basic_row {
  display: table-row;
  text-align: left;
}
*/



#comment-marker {
  color: #bf40bf;
  font-weight: bolder;
  background-color: unset;
}
#comment-content {
  text-align: justify;
  text-justify: interword;
  background-color: unset;
  width: 100%;
}
/*
#comment-author {
  text-align: justify;
  text-justify: interword;
  background-color: unset;
}
*/

p {
  text-align: justify;
  text-justify: inter-word;
}

img.packphoto {
  float: left;
  margin: 10px;
  width: 25%;
  clip-path: polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%);
}

img.weaponphoto {
  float: left;
  margin: 10px;
  width: 25%;
}

span.bevel {
  filter: drop-shadow(10px 10px 0.75rem rgba(50, 50, 0, 0.5));
}

#justified {
  text-align: justify;
  text-justify: interword;
}

div.divcomments {
  display: table;
  align: center;
  width: 80%;
  margin: 1em auto auto auto;
  font-size: 0.9rem;
}
div.divrow {
  display: table-row;
}
div.comment-marker {
  display: table-cell;
  color: #bf40bf;
  font-weight: 900;
  width: 2ch;
}
div.comment-content {
  display: table-cell;
  width: 100%;
}