/* // qolc.net : Primary CSS Stylesheet */

/* Default Tag Styles */

body {
  font-family: tahoma,verdana,helvetica,sans-serif;
  background: #444;
  padding: 0.4em;
}

a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

/* Link Image */
a img {
  border: 1px outset #ace;
  padding: 3px;
  margin-left: auto;
  margin-right: auto;
}
a:hover img {
  border-style: inset;
}

h1 {
  font-size: 3em;
  margin: -0.3em 0.2em 0.2em 0;
}

h1 a {
  text-decoration: none;
  color: inherit;
}

h1 a:hover {
  text-decoration: none;
}

h2 {
  font-size: 1.5em;
}

/* Reduce gap between headings */
h1+h2 {
  margin-top: -0.3em;
}

/**************************************************************************/
/* shell-outer/shell-inner = Evil construction to get funky triple border */

/* Common to all shells */
.shell-outer {
  background: white;
  border: 1px outset black;
  padding: 0.4em;
}

.shell-inner {
  border: 1px inset black;
}

#Main .shell-outer {
  position: relative;
  /* The Right margin here must be the value of the following 'left' selector
     plus the desired margin on the right. */
  margin: 0.4em 11.3em 0.4em 0.4em; 
  /* The Left value must be the width of the Menu, plus 2x Menu's padding
     plus Menu's left margin, plus Menu's border, plus desired gap. I think. */
  left: 10.9em;
  z-index: 3;
}
#Main .shell-inner {
  background: #ffd;
  padding: 1em;
  overflow: auto;
  font-size: 90%;
} 

#MainTopRight {
  float: right;
  font-size: x-small;
}

/* Extra selectors for the menu shell, see also .shell-* */
#Menu .shell-outer { 
  position: fixed;
  width: 9em;
  z-index: 9;
  /* The Right margin and possibly the bottom margin here are irrelevant 
     because nothing else is in the same (fixed) flow */
  margin: 0.4em 1em 2em 0.4em; 
}

#Menu .shell-inner {
  background: #822;
  padding: 0.5em 0.5em 0.5em 0.5em;
  z-index: 10; 
  text-align: centre;
  /* overflow: hidden; */
}

/************************************************************************/
/* Menu */

#Menu #Title h1 {
  font-size: 1.5em;
  color: white;
  margin-left: -0.2em;
}

#Menu hr {
  background: #ace;
}

/* For the links, the background colour of each block changes when visited
   as well as just the text colour */
#Menu #Links a {
  display: block;
  background: #ace;
  text-decoration: none;
  text-align: left;
  color: #22f;
  border: 1px outset #ace;
  padding: 0 0.3em;
  font-size: 0.9em;
  font-weight: bold;
}

/* Order seems to be important here - if :visited is after :hover, 
   you don't get the hover effect on visited links */
#Menu #Links a:visited {
  background-color: #aac;
  color: #228;
}
#Menu #Links a:hover {
  background: white;
  border-style: inset;
}
#Menu #Links a:active {
  background-color: red;
}

#Copyright {
  background: #822;
  color: #ffc;
  margin-top: 2em;
  padding: 0.5em;
  text-align: center;
  border: 1px groove #ffc;
  font-size: 70%;
}

#Copyright a {
  color: #ccf;
}

#Copyright a:visited {
  color: #ccc;
}

/*********************************************************************/
/* Other specific IDs */

#Fullpage {
  background: #ec9;
  text-align: left;
  margin: 1em;
  padding: 1em;
  font-size: 90%;
}

/*********************************************************************/
/* Common Classes */

.float-spacer {
  clear: both;
}

.author {
  white-space: nowrap;
  font-family: PenguinAttack, cursive;
  font-weight: bold;
  font-size: 1.2em;
}

.nobreak {
  white-space: nowrap;
}

.smush {
  letter-spacing: -0.2em;
}