/*
   The Happi Style -- SCC

   A document using the Happy Style has four main elements
   (Header, MainCol, SideBar, and Footer), and a fifth 'sub 
   element' to Header (Description).
   
    +-----------------------+
    | Header                |
    | - - - - - - - - - - - |
    |   Description         | 
    +-----------------------+
    | SideBar | MainCol     |
    |         |             |
    |         |             |
    +-----------------------+
    | Footer                | 
    +-----------------------+	

   
    The header should preferably consist of a title in H1.

    Note that the placement of SideBar and MainCol is not
    always perfect. MainCol is a float:right and under some 
    conditions SideBar and MainCol does not both fit next
    to eachother.

    In order to get the rigth layout the MainCol div has
    to preced the SideBar div.
    

*/

/* The normal color scheme is black on a light yellow background. */
BODY{    
  background-color: #F5f0C5;       /* Light yellow */
  color: #000000;
  font-family: "Book Antique", "Utopia", "Garamond", "Verdana",
               Times, serif;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;        
}

h1,h2,h3,h4,h5,h6{padding:0px;
                  margin:0px;}

#header{
  padding:0px 0px 0px 0px;
  margin:0px 0px 0px 0px;           
  border-bottom:dotted 1px #E0AD12; /* Orange line   */
  background:#F5E39E;               /* Beige-yellow  */
  color:#FFFFFF;
}

#header h1{
  padding:25px 0px 10px 5px;
  border-top:double 3px #BF5C00;
  border-bottom:solid 1px #E89E47;
  color:#FFDFBF;                    /* light-Gray-red */ 
  background:#D06038;               /* Orangey-red    */  
  font:bold 300% Verdana, sans-serif;/* Big blocky title */
  letter-spacing:-2px;
}

#description{
        padding:0px;
        margin:7px 12% 7px 5%;
	color:#9E5205;              /* Brown-red */
	background:transparent;
	font:bold 85% Verdana,Sans-Serif;
}
#description a:hover{background:transparent;text-decoration:none;}


div#mainCol{
        float: right;
        width: 85%;
        height: auto;
        top: 20%;
        right: 0;
	padding: 1px 1px 10px 1px;
	border-left:dotted 1px #E0AD12;
        /* Note: word-wrap is IE specific - used to be able to display
           code and paths *in* the float. */ 
	word-wrap: break-word;
	overflow: hidden;
        z-index: 2;
}

div#sideBar{
	position: fixed;
        height: auto;
        top: 25%;
        right: auto;
        bottom: 100px;
        left: 0;
	padding:0px;
	text-align: center;
	font:bold 90% Verdana,Sans-Serif;
	word-wrap: break-word;
	overflow: hidden;
	z-index: 1;
	background-color: #F5f0C5;
	}

div#footer{
        clear:both;
        position: fixed;
        width: 100%;
        height: 100px;
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        padding:0px;
        border-top:solid 1px #E0AD12;
	z-index: 3;
	background-color: #F5f0C5;
	}


#sideBar ul{
  margin:0px 0px 2px 0px;
  padding:0px;
  list-style-type:none;
  font-size:95%;}
#sideBar li{
  margin:0px;
  padding:0px;
  list-style-type:none;
  font-size:95%;}
#sideBar ul a{
  padding:2px;
  margin:1px;
  width:100%;
  border:none;
  color:#999999;
  text-decoration:none;}
#sideBar ul a:link{color:#999999;}
#sideBar ul a:visited{color:#999999;}
#sideBar ul a:active{color:#ff0000;}
#sideBar ul a:hover{color:#DE7008;text-decoration:none;}
#sideBar h6{
  color:#B8A80D;
  font-size:140%;
  font-family:"Trebuchet MS",Trebuchet,Verdana,Sans-Serif;
}

div#codeBox{
	margin:0px 0px 0px 0px;
	padding:5px 5px;
	width:90%;
	border:ridge #E0AD12;
	background: #FFFCC0;
        font-family: "Lucida-typewriter", courier, monospace;
	font-size: 70%;
	font-weight: bold;
	word-wrap: normal;
}

P{
  width: 30em;
  max-width: 80%; 
}


.note{ font: italic 80% cursive;
       font-family: "Dijkstra", "Lucida Handwriting", "Bradley Hand", "Garamond", cursive; }

.CompanyName{ font:bold 100% Verdana, Sans-Serif; }
.JobTitle{ font: bold 100% "Garamond", serif; }
.Achivement{ font: 80% "Garamond", serif; }

.menu{ 
	margin:0px 0px 0px 0px;
	padding:0px;
	border-top:solid 1px #BF5C00;
	border-bottom:solid 1px #E89E47;
	color:#FFDFBF;
	background: #D06038;
	font:bold 100% Verdana,Sans-Serif;
	letter-spacing:-2px;
	}


  
A.menu{color:yellow; text-decoration:none;}
A.menu:visited{color:#505020;}
A.menu:hover{color: red; background-color: #505020;}


A{
  color:#009020;
  text-decoration:none;
}
A:visited{color:#d08015;}
A:hover{
  color:red;
  background-color: #F5f0C5;
}


@media print {
BODY {background-color: white}
}