/* pink - FF3366
   blue - 3399FF
*/
 
body, html,table,tr,td {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	background-color:#fff;
	
	
	line-height:12pt;
	margin: 0; padding: 0; 
}


A:link {
    color: #666;
    text-decoration: none;
    border-bottom: #DEDCDC;
    border-width: 0px 0px 1px 0px;
    border-style: none none solid none;
}


a:visited {
	color: #666;
    text-decoration: none;
    border-bottom: #DEDCDC;
    border-width: 0px 0px 1px 0px;
    border-style: none none solid none;}
    
a:hover {
	color:#000;
    text-decoration: none;
    border-bottom: #000;
    border-width: 0px 0px 1px 0px;
    border-style: none none solid none;
}
a:active {text-decoration: none;
    border-bottom: #DEDCDC;
    border-width: 0px 0px 1px 0px;
    border-style: none none solid none;}


input, textarea, select {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color: #666;
	font-size: 10px;
	border-color: #CCC;   
	border:1px;
	}
	
input.button {background-color: #cc0000;}	

.calendar {
	font-size: 9px;
	height: 16px;
	line-height : 16px;
}




.dottedForm { 
   border-top: 0px; 
   border-left: 0px; 
   border-right: 0px; 
   border-bottom: 1px solid #ccc; 
   background-color: #ffffff; 
   color: #666; 
 
}

.dottedFormBox { 
   border-top: 1px solid #ccc;  
   border-left: 1px solid #ccc;  
   border-right: 1px solid #ccc; 
   border-bottom: 1px solid #ccc; 
   background-color: #ffffff; 
   color: #666; 
}

 

     
/* all items on the left naviation side have the "fixItem" class - position them to absolute so it'll work ok in IE */
.fixItem{
	position:absolute;
}

/* this overrides the above setting, so that non-IE browsers will fix the menu items */
/* disabled - change to fixed to turn it back on...absolute will turn it off */
body>div.fixItem { position: fixed
} 

.position {
 position: absolute; 
 top:35px; left:225px; 
 text-align:left; padding:0px;

}

a.dottedFormBox:link{color:#666; background-color:#fff;  border-top: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc}
a.dottedFormBox:visited{color:#666; background-color:#ff;  border-top: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc}
a.dottedFormBox:hover{color:#666; background-color:#eee;  border-top: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc}
a.dottedFormBox:active{color:#666; background-color:#eee;  border-top: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc}
 
a:link img {border: 1px solid #ccc} 
a:visited img {border: 1px solid #ccc} 
a:hover img {border: 1px dashed #ccc}
a:active img {border: 1px dashed #ccc}

 
/*add this class and menu class to a href of an image if you don't want border OR underline (seperate classes with a space) */
a.noBorder:link img {border: 0px solid #ccc} 
a.noBorder:visited img {border: 0px solid #ccc} 
a.noBorder:hover img {border: 0px solid #000}
a.noBorder:active img {border: 0px solid #ccc}

/*created for the tiny photo thumbs on menu - didn't want dark border on rollover*/
a.greyHoverBorder:hover img {border: 1px solid #ccc}


/*add this to img tags to get rid of border on images*/
.noBorder {border:0px solid #ccc}


/*add this class to the a href of an image if you dont want it to have an underline*/
a.menu:link{color: #666;border-width: 0px 0px 0px 0px;text-decoration: none;}
a.menu:visited{color: #666;border-width: 0px 0px 0px 0px;text-decoration: none;}
a.menu:hover{text-decoration: none;border-width: 0px 0px 0px 0px; color:#000;}
a.menu:active{color: #3399FF;border-width: 0px 0px 0px 0px;text-decoration: none;}
 
 
.active {
	color:#000;
	/*border-bottom:1px solid #000;*/
	font-weight:900;
}

.entry {
border: 0px dotted #ccc; background-color:#fff; width:500px; padding:0px
}

.menuBlock { 
    text-align:right
    width:55px;
    border: 0px solid #cccccc;  
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 1px;
    padding-bottom: 2px;
    left: 15px; 
    line-height:10pt;
    z-index:10;
   
} 




/* CSS TOOL TIPS*/
/* <a class=toolTip href="#">Link <span> What you want in the tooltop </span></a> */

a.toolTip{ /*this styles what the link looks like*/
    z-index:24;
    position:relative; /*this is the key*/
   
	}

a.toolTip:hover{ /* this styles what the hover link looks like */
	z-index:25;
	background-color:#fff;
	
	}    
    

a.toolTip span{display: none}

a.toolTip:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:auto;
    padding:4px;
    line-height:10pt;
    border:1px solid #ccc;
    background-color:#eee; color:#666;
    text-align: left
    
    }
    
    

/* --------------------------------*/




.bar{
width:500px; 
height:1px;
border-top: 0px; 
border-left: 0px; 
border-right: 0px; 
border-bottom: 1px solid #ccc; 
} 

.title {
font-size:11pt;
font-weight: bold;
color:#99CC00;
text-transform: uppercase;

}


h1 {
font-size:9pt;
display: inline; 
font-weight:400;
}


/* used for quotes in the blog */
h2{
margin-left:10px;
padding:5px;
border-left:1px solid #ccc;
font-size:10px;
font-weight:400;

}






.date{
text-transform: uppercase;

}

/* used for code in the blog */
pre {
	width:500px;
	padding:5px;
	height:175px;
	overflow:auto;
	color:#666;
	font-size:9px;
	font-family: courier;
	border:1px dotted #ccc;
}


/* images in blog */
.blogImgSpan {	
	border:0px solid #ccc;
	margin:0 15px 0 0;
}
	
.blogImg {	
	border:1px solid #ccc;
	padding:4px;
}
	






.loading{
margin:0 auto;
background: url(http://www.susanbuck.net/sb/includes/lightbox/loading.gif) center center no-repeat;
margin-top:10px;   
}
 




#navcontainer { width: 59px; }

#navcontainer ul
{ 

margin: 0px;
padding-left: 0px;
padding-bottom: 0px;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
}

#navcontainer a
{
display: block;
padding-left: 4px;
padding-right: 0px;
padding-top: 1px;
padding-bottom: 1px;
width: 59px;

border-bottom: 1px solid #eee;
}

#navcontainer a:link, #navlist a:visited
{
color: #666;
border:1px #ccc;
text-decoration: none;
}


#navcontainer a:hover, #navlist a:hover
{
background-color: #eee;
background: url("http://www.susanbuck.net/sb/images/greyTile.jpg");
color: #000;
}