#title {
    background: #006fea;
    line-height: 32px;
    height:30px;
    position:relative;
    margin:0;
    padding:0;
    border-radius:3px 3px 0 0;
    background-image:
      linear-gradient(to right, #0050db, rgba(255,255,255,.1) 4px, rgba(255,255,255,0) 200px),
      linear-gradient(to left, #0034b0, #0056e1 1px, #0064f4 2px, rgba(0,0,0,0) 3px),
      linear-gradient(to bottom, #4aa9ff, #33a4ff 1px, #008aff 2px, #007ef4 3px, #0075f0 4px, rgba(0,0,0,0) 5px),
      linear-gradient(to top, #005dd9, #0067e9 1px, #007afb 2px, #0081fb 3px, rgba(0,0,0,0) 4px);
    font-family: sans-serif;
    color:white;
    font-weight: normal;
    font-size:14px;
    padding-left:8px;
    text-shadow: 1px 1px 0 #0a2a95;
    position: sticky;
    top: 0
    }

    .close{
    position:absolute;
    right: 6px;
    top: 6px;
    height: 19px;
    padding-left:19px;
    width:0;
    overflow:hidden;
    border:1px solid white;
    border-radius: 3px;
    background:
      radial-gradient(circle at 20px 20px, #e84f00, rgba(255,255,255,0)),
      radial-gradient(circle at -5px -5px, white, rgba(255,255,255,.3), rgba(255,255,255,0)),
      linear-gradient(to bottom, rgba(255,255,255,0.2), rgba(255,255,255,0)),
      linear-gradient(to right, rgba(255,255,255,0.2), rgba(255,255,255,0))
      ;
    background-color: #e81000;
    &:after{
      content:"";
      display:block;
      position:absolute;
      top:0;
      right:0;
      left:0;
      bottom:0;
      border:1px solid rgba(33,0,0,0.2);
      border-radius: 2px;
    }
    &:before{
      content:"×";
      position:absolute;
      left:2.5px;
      top:-7px;
      color: white;
      text-shadow:none;
      font-size:23px;
    }
  }

  .windows {
    max-width: 750px !important;
    max-height: 540px;
    margin: var(--spacing) auto;
    border-radius: var(--border-radius); 
    background-color: #fff;
    border: 3px solid black;
    border-radius:5px 5px 0 0;
    border-color: #0072ef #01279e #01279e #0236d8;

    overflow-y:auto
}

.windowspet {
  width: 600px;
  max-height: 500px;
  margin: var(--spacing) auto;
  border-radius: var(--border-radius); 
  background-color: #fff;
  border: 3px solid black;
  border-radius:5px 5px 0 0;
  border-color: #0072ef #01279e #01279e #0236d8;

  overflow-y:auto
}

body {
  background-image: url('/misc/gc/img/Bliss.jpg');
  background-size: cover;
}

.flexpet {
    display: flex;
    flex-flow: row wrap;
    gap: var(--halfspacing) var(--spacing);
    
}

.flexpet > * {
    flex: 1 1 150px;
    margin:0 auto;
}

dialog {
  border: none;
    background: none
}

table {
  width: 300px;
    background-color: #FFFFCC 
}

h2 {
  font-family: 'Heffaklump', sans-serif;
  font-size: 2em !important;
  text-decoration: underline var(--underline);
}