body {
  font-family: Verdana, Helvetica, sans-serif;
  font-size: 1.2rem;
  padding: 0;
  margin: 0rem;
  border: 3px solid black;
  background: radial-gradient(circle, blue, red);
  color: white;
}
a { color: white; }
a:hover { color: red; }

    h1, h2, h3, h3, h5, h6 { padding: 0; margin: 0; }
    h1 {
      height: 4rem;
      clear: both;
      font-size: 1.5rem;
      color: white;
      background: radial-gradient(circle, red, blue);
      background-repeat: no-repeat;
      background-image: url('/assets/images/ll.webp');
      background-position: left top;
      background-size: contain;
      margin: 0;
      padding: 0.4rem 0.1rem 2rem 0;
      text-align: right;
      display: block;
    }
    h1 small {
      display: block;
      font-size: 1rem;
      color: white;
      margin: 0.4rem 0 0.5rem 0;
      padding: 0 0.1rem 0 0;
    }
    h2 { width: 99%; height: 2rem; float: none; font-size: 1.55rem;
      color:red; background-color: black;
      padding: 1rem; margin: 0;
      text-align: right;
      clear: both;
    }
    h3 {
      padding: 2rem 0 0 0; margin: 0;
    }
    /* 67% 26.5% */
    .inv { display: none; }
    .info { font-size: 0.8rem }
    .clarification { color: gray; font-weight: bold; }
    .nav { clear: both; height: 2rem; border-bottom: 1px gold dotted;
      padding: 0.5rem 0 0.2rem 0; margin: 0;
      text-align: center;
    }
    .nav a { padding: 0.5rem; font-size: 1.6rem; }
    main { clear: both; padding: 0; margin: 0;}
    footer { clear: both; }
    .server { clear: both; font-size: 0.8rem; color: silver; }
    div { margin: 0 0 1rem 0; padding: 0.5rem; clear: both; }
    .domain { color: red; }
    div a { text-decoration: none; }
    div a:hover { text-decoration: underline; }

    .topnav {
      background-color: #333;
      overflow: hidden;
      }
      /* Style the links inside the navigation bar */
      .topnav a {
      float: left;
      display: block;
      color: #f2f2f2;
      text-align: center;
      padding: 14px 16px;
      text-decoration: none;
      font-size: 17px;
      }

      /* Change the color of links on hover */
      .topnav a:hover {
      background-color: #ddd;
      color: black;
      }

      /* Add an active class to highlight the current page */
      .topnav a.active {
      background-color: #4CAF50;
      color: white;
      }

      /* Hide the link that should open and close the topnav on small screens */
      .topnav .icon {
      display: none;
      }
      .card {
          /* Add shadows to create the "card" effect */
          box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
          transition: 0.3s;
          width:20rem;
          float:left;
          height:16rem;
          margin: 0.3rem;
          clear: right;
          line-height: 1.6rem;
      }
      /* On mouse-over, add a deeper shadow */
      .card:hover {
          box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
      }
      /* Add some padding inside the card container */
      .container {
          padding: 2px 16px;
      }
      /* The Overlay (background) */
      .overlay {
      /* Height & width depends on how you want to reveal the overlay (see JS below) */
      height: 100%;
      width: 0;
      position: fixed; /* Stay in place */
      z-index: 1; /* Sit on top */
      left: 0;
      top: 0;
      background-color: rgb(0,0,0); /* Black fallback color */
      background-color: rgba(0,0,0, 0.9); /* Black w/opacity */
      overflow-x: hidden; /* Disable horizontal scroll */
      transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
      }

      /* Position the content inside the overlay */
      .overlay-content {
      position: relative;
      top: 25%; /* 25% from the top */
      width: 100%; /* 100% width */
      text-align: center; /* Centered text/links */
      margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
      }

      /* The navigation links inside the overlay */
      .overlay a {
      padding: 8px;
      text-decoration: none;
      font-size: 36px;
      color: #818181;
      display: block; /* Display block instead of inline */
      transition: 0.3s; /* Transition effects on hover (color) */
      }

      /* When you mouse over the navigation links, change their color */
      .overlay a:hover, .overlay a:focus {
      color: #f1f1f1;
      }

      /* Position the close button (top right corner) */
      .overlay .closebtn {
      position: absolute;
      top: 20px;
      right: 45px;
      font-size: 60px;
      }
article {
clear: both;
margin: 0 0 2rem 0;
padding: 0 0 2rem 0;
border-bottom: 0px solid gold;
}

h2#bio {
width: auto;
height: 4rem;
background: radial-gradient(circle, black, blue);
background-repeat: no-repeat;
background-image: url('/assets/images/bio/pasthomas_100.jpg');
background-position: left top;
text-align: right;
color: white;
border-bottom: 1px dotted gold;

}
      /* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
      @media screen and (max-height: 450px) {
      .overlay a {font-size: 20px}
      .overlay .closebtn {
          font-size: 40px;
          top: 15px;
          right: 35px;
      }
    }
    footer {
      margin: 4rem 0 4rem 0;
      padding: 1rem;
      font-size: 1rem;
      font-variant: small-caps;
      border-top: 1px solid gray;
    }
    .article-last {
      clear: both;
      margin: 0 0 2rem 0;
      padding: 0 0 2rem 1rem;
      border-bottom: none;
    }
    #server-utils-footer {
      width: auto;
      height: 4rem;
      font-size: 0.8rem;
      color: white;
      background: radial-gradient(circle, black, blue);
      margin: 0;
      padding: 0.5rem;
      font-variant: small-caps;
    }
    #server-utils-footer ul {
      list-style-type: none;
      margin: 0; padding: 0;
    }
    #server-utils-footer ul a {
      padding: 0.2rem;
      color: white;
    }

    h3 {
      margin: 0;
      padding: 0;
    }
    video {
      margin: 0;
      padding: 0;
    }
    nav {
      margin: 0;
      padding: 0;
    }

img { border: 0; }
