/* 7dtd.css — page-specific styles */

/* ==== character art ================================================= */
.wolf-img{              /* right-side zombie dog */
  position:absolute;
  top:20px;
  right:40px;
  width:250px;
  height:auto;
  pointer-events:none;
}

.wolf-img-left{         /* left-side zombie dog */
  position:absolute;
  top:20px;
  left:40px;
  width:250px;
  height:auto;
  pointer-events:none;
}

.woman-img{             /* janitor (left, lower) */
  position:absolute;
  bottom:10px;
  left:20px;
  width:320px;
  height:auto;
  pointer-events:none;
}

.man-img{               /* hazmat (right, lower) */
  position:absolute;
  bottom:10px;
  right:20px;
  width:320px;
  height:auto;
  pointer-events:none;
}

@media(max-width:768px){
  .wolf-img,
  .wolf-img-left,
  .woman-img,
  .man-img{display:none;}
}

/* ==== headings & text =============================================== */
.section-title{
  margin:10px 0 15px;
  font-size:1.6em;
  color:#00cccc;
  text-shadow:0 0 5px #00cccc;
}

.status-text{
  font-weight:bold;
  font-size:1.1em;
  margin-bottom:20px;
}

/* ==== rules list ==================================================== */
.rules-list{
  margin:0 auto 30px;
  padding:0;
  list-style-position:inside;
  text-align:center;
}
.rules-list li{margin:.3em 0;}

/* ==== settings table ================================================ */
.settings-table{
  margin:0 auto;
  border-collapse:collapse;
  width:100%;
  max-width:600px;
}
.settings-table th,
.settings-table td{
  border:1px solid #00cccc;
  padding:8px 12px;
  vertical-align:top;
}
.settings-table th{
  background:#00cccc;
  color:#000;
  text-align:center;
  width:40%;
}

/* ==== scroll wrapper ================================================ */
.settings-scroll{
  max-height:500px;
  overflow-y:auto;
  margin:0 auto 30px;
  width:90%;
  max-width:600px;
  padding-right:3px;
  box-sizing:content-box;
  position:relative;
  z-index:5;
}
@media(max-width:768px){
  .settings-scroll{
    max-height:none;
    overflow:visible;
    padding-right:0;
  }
}
.settings-scroll::-webkit-scrollbar{width:8px;}
.settings-scroll::-webkit-scrollbar-thumb{
  background:#00cccc;
  border-radius:4px;
}

/* ==== modpack link =================================================== */
.modpack-link{
  text-align:center;
  margin:20px auto;
  font-size:1.2em;
}
.modpack-link a{
  color:#00cccc;
  font-weight:bold;
  text-decoration:none;
}
.modpack-link a:hover{text-decoration:underline;}

/* ==== map image ====================================================== */
.map-img{
  display:block;
  margin:0 auto 30px;
  width:70%;
  max-width:600px;
  height:auto;
  border:3px solid #00cccc;
  border-radius:6px;
  box-shadow:0 0 10px rgba(0,204,204,.5);
}
@media(max-width:768px){
  .map-img{
    width:95%;
    border-width:2px;
  }
}