BODY {    /* Color3 */
     font-family: arial,lucida,geneva,sans-serif,sans serif,sansSerif; 
     margin: 0px;  /* sets all margins to zero pixels   */ 
     /* the last one is the one that renders
     in this order, the background color will be used if the UA cannot render the gif */
     background-color:  #ff33cc;
     background-image: url('../../images/backgrounds/marchPink.gif');    
}

#main {
        min-width: 600px;
        margin-left:0;
        margin-right:0;
        padding-left:0;
        padding-right:0;
        height: 100%;
}

/* hack to create a minimum width in IE */
/* for the blog page */
#minWidth {
     width: 600px;
     margin: 0;
     padding: 0;
     height: 0;
     border-width: thin;  
     border: dotted #ff33cc;
}

/* hack to create a minimum width in IE */
/* for the archive links page */
#minWidthA {
     width: 790px;
     margin: 0;
     padding: 0;
     height: 0;
     border-width: thin;  
     border: dotted #ff33cc;
}

#topSpace  {  /*blog title  Current Projects  div id=topSpace   */  
     position: relative;
     top: 20px;
     right: 0px;
     left: 0px;
     height: 50px;
     font-family: comic sans ms,verdana,lucida,geneva,sans-serif,sans serif,sansSerif;
     font-size: 14pt;
     font-weight: bold;
     color: #ff33aa;       
     text-align: center;
} 

#bottomSpace  {   
     position: relative;
     top: 10px;
     right: 0px;
     left: 0px;
     bottom: 0px;
     margin-bottom: 0;      
}

#centerTopSpace  {   
     position: relative;
     top: 0px;
     right: 0px;
     left: 0px;
     bottom: 0px;
     margin-bottom: 0;      
}

#contentBorder  {  /*    div id=contentBorder    Color1 */  
     position: relative;
     top: 10px;
     margin-right: 60px;
     margin-left: 60px;
     background-color: #fbf038;  /* bright yellow */ 
     background-image: url(../images/backgrounds/horz/marchYellow4.gif); 
     border-width: thick;  
     border: solid #fbf038;   
     /* without these last 2 lines border-width and border
     the top of the contentBorder is invisible */          
} 

#contentBox  {  /*    div id=contentBox   Color2 */  
     position: relative;
     top: 0px;
     right: 0px;
     left: 0px;
     margin-top: 20px;
     margin-right: 20px;
               /* controls bottom border */
     margin-bottom: 20px;
     margin-left: 20px;
     padding-top: 0px;
     padding-right: 8px;
     padding-bottom: 2px;
     padding-left:  14px;
     font-size: 9pt;
     font-weight: normal;
     color: #000000; 
     background-color: #18d639;   /* bright green */ 
     background-image: url(../images/backgrounds/blueSpring1.gif);    /* from index.css maincontent */     
} 

/* Properties that both side lists have in common */
div.link-list {    /* div id=list2 class=link-list */
        width:120px;
        position:absolute;
        top:0;
        padding-left:0;
        padding-right:0;
        margin-left:0;
        margin-right:0;
}
/* we leave some place on the side using the margin-* properties */


/* and then we put each list on its place */
#list1 {
        left:0;
}
#list2 {
        right:0;
}

.homeButton{  /* class=homeButton   */  
     position: absolute;
     top: 6px;
     left: 6px;
     width: 75px;
     height: 50px; 
}


IMG#homeButton {
    width: 75px; 
    height: 50px;
    border: 0px;
    padding-right: 0px;
}

.blogButton{
     position: absolute;
     top: 6px;
     right: 6px;
     width: 75px;
     height: 50px; 
}

IMG#blogButton{
    width: 75px; 
    height: 50px;
    border: 0px;
    padding-right: 0px;
}

/* ******************************************** */ 

div.linkBox  {  /* div id=inner class=linkBox */ 
     position: relative;
     top: 0px;
     padding-top:14px;
     font-size: 9pt;  
     height: 100px;  
} 

#left {
     float: left;
     left: 0;
     min-width: 250px;
     width: 48%;
     z-index: 1;
}

#right {
     right: 0;
     margin-left:  300px;
}

/* ******************************************** */

.red { /*special emphasis*/
     color:  #ff0066;  
     font-weight: bold;
}  

/*  TYPE SELECTOR (for A element - the anchor tag) with pseudo class :LINK - an unvisted link */
/* ----------------------------------------------------------------------------------*/

A:link {  /* controls link display */
     color: #003300;
     font-weight: bold;
     text-decoration: none;
}

A:visited {  /* controls link display */
     color: #000066;
     font-weight: bold;
     text-decoration: none;
}

A:active {  /* controls link display */
     color: #ff3300;    
     font-weight: bold;        
     text-decoration: underline;
}

A:hover {  /* on IE only */
     color: #ff3300; 
     font-weight: bold;             
     text-decoration: underline;
}