body {color: black; font-family:Verdana, "Bitstream Vera Sans", "DejaVu Sans", Tahoma, Geneva, Arial, "Sans-serif";
      background: url('/img/background.jpg') ; 
      background-size: 100% 100%;
      background-repeat: no-repeat;
      margin:0px; text-align:left; }

a:link {text-decoration:underline; color: black; }
a:visited {color: black;}
a:hover {color: black; background-color: yellow; }
a:active {color: black; background-color: #99cc00; }


ul {list-style-image: url(/img/redball.gif)}
ul ul {list-style-image: url(/img/blueball.gif)}
menu {list-style-image: url(/img/glossaryicon.gif); }
em {font-family:"arial black";text-decoration:none;}
hr {background:#ff0 url(/img/line3.gif)}
//-------------------------- Custom IDs ----------------------------
#logo
{
 top: 10px;
 left: 10px;
 width: 60px;
 height: 60px;
 padding:30px;
 margin:5px:
 border: 3px inset #aaa;
 position : absolute;
 z-index : 1;
}

#title
{
	position: absolute;
	z-index:0;
	top: 0px;
	left: 70%;
	height: 60px;
	width: 25%;
	text-align: right;
    color:#fff;
	 mix-blend-mode: luminosity;
}

#leftmenu
{
	position: absolute;
	z-index:0;
	top: 20%;
	left: 0%;
    //color:#fff;
	//background-color: #FFF;
    //mix-blend-mode:  difference;
	display:block;
	color: #000;
	width: 10%;
	height: 75%;
	font-size: 0.9em;
    font-weight: bold;
	font-family: Arial, Helhetica;
}

#leftmenu li {
    padding-bottom:1.2em;
}


#leftmenu a {
    color:#999;
    mix-blend-mode:  difference;
  text-decoration: none;
}
#leftmenu a:hover {
    color:#000;
    mix-blend-mode:  screen;
    background:rgba(250,250,200,0.95); 
}

#rtmargin
{
	position: absolute;
	z-index:0;
    background:rgba(250,250,200,0.75);  
	top: 16%;
	left: 73%;
	display:block;
	color: #000;
	width: 15%;
	height: 57%;
	font-size: 10px;
	font-family: Arial, Helhetica;
    padding: 2em;
    border-radius:2em;
    border-width: 5px;	
    border-style: ridge;
    border-color:#aaaaaa;
}



#main
{
	position: absolute;
	z-index:0;
	top: 18%;
	left: 13%;
	background-color: #FFF;
	color: #000;
	width: 50% ;
	height: 68%;
	font-size: 0.8em;
	font-family: tahoma, Arial, Helvetica;
    padding:5px;
}

#thought
{
	position: absolute;
	z-index:0;
	top: 88%;
	left: 15%;
	background-color: #FFa;
	color: #000;
	width: 50% ;
	height: 8%;
	font-size: 0.8em;
	font-family: Arial, Helvetica;
	text-decoration: italics;
	text-justification: center;
	border: 0.1em solid #000;
    padding:5px;
}
.tabs {
  position: relative;   
  min-height: 2em; /* This part sucks */
  clear: both;
  top: -3em;
  left:12%;
  width:60%;
  height:73%;
  margin: 25px 0;
  font-size: 0.8em;
}
.tab {
  float: left;
}
.tab label {
  background: #777; 
  padding: 7px; 
  border: 1px solid #555; 
  border-radius: 0.8em 0.8em 0 0;
  margin-left: -1px; 
  margin-right:7px;
  margin-bottom:0;
  position: relative;
  left: 1px; 
  width: 15%;
}

.tab label:hover {
    background: #ffa; 
    border: 1px solid #0cc; 
}
.tab label:active {
    background: #aaf; 
    border: 1px solid #0cc; 
}

.tab [type=radio] {
  display: none;   
}
.content {
  position: absolute;
  top: 22px;
  left: 0;
 // background: white;
  background:rgba(250,250,200,0.95); 
  right: 0;
  bottom: 0;
  padding: 20px;
  border: 1px solid #ccc; 
}
[type=radio]:checked ~ label {
 // background: white; 
   background:rgba(250,250,200,0.95); 
  border-bottom: 1px solid white;
  z-index: 2; 
}
[type=radio]:checked ~ label ~ .content {
  z-index: 1; 
}

[type=radio]:checked  ~ .content {
  display: block;
}

[type=radio]:not(:checked)  ~ .content {
  display: none;
}


//-------------------------- Slide show ----------------

.photo{
    height:300;
    width:400;
    padding:30px;
    background:#ffffbb;
    border-width:15px;	
    border-style:inset;
    border-color:#aaaaaa;
}

#slideshow {
		    position: relative;
		    box-shadow: 0 0 20px rgba(0,0,0,0.4);
            margin: 15px auto;
            height:300px;
            width:400px;
            padding:40px;
            background:#ffffbb;
            left:10px;
            border-width:15px;	
            border-style:inset;
            border-color:#aaaaaa;
		}

#slideshow > div {
		    position: absolute;
            height:300px;
            width:400px;
		    top: 35px;
		    left:40px;
		    right: 30px;
		    bottom: 30px;
    }