@charset "utf-8";
/* CSS Document */
/* set the image to use and establish the lower-right position */ 
.cssbox, .cssbox_body, .cssbox_head, .cssbox_head h2 {
    background: transparent url(./images/box.png) no-repeat bottom right; 
} 
.cssbox { 
    width: 710px ; /* !importantintended total box width - padding-right(next) */
    width: 695px; /* IE Win = width - padding */
    padding-right: 15px; /* the gap on the right edge of the image (not content padding) */
    margin: 0px auto; /* use to position the box */ 
} 

/* set the top-right image */ 
.cssbox_head { 
    background-position: top right; margin-right: -15px; /* pull the right image over on top of border */
    padding-right: 30px; /* right-image-gap + right-inside padding */ 
} 

/* set the top-left image */ 
.cssbox_head h2 { 
    background-position: top left; 
    margin: 0; /* reset main site styles*/ 
    border: 0; /* ditto */ 
    padding: 25px 0 15px 40px; /* padding-left = image gap + interior padding ... no padding-right */ 
    height: auto ; height: 1%; /* !important IE Holly Hack */ 
} 

/* set the lower-left corner image */ 
.cssbox_body { 
    background-position: bottom left; 
    margin-right: 25px; /* interior-padding right */ 
    padding: 15px 0 15px 40px; /* mirror .cssbox_head right/left */ 
} 

/*image code*/
.floatleft {
	float:left;
	margin: 12px; 
}

/*tool tip code*/
a.info{
    position:relative; /*this is the key*/
    z-index:24; background-color:#ccc;
    color:#000;
    text-decoration:none}

a.info:hover{z-index:25; background-color:#ff0}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:200em;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: center}


/*button code*/


a.squarebutton{
background: transparent url('./images/square-red-left.gif') no-repeat top left;
display: block;
float: left;
font: normal 12px Arial; /* Change 12px as desired */
line-height: 15px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
height: 23px; /* Height of button background height */
padding-left: 9px; /* Width of left menu image */
text-decoration: none;
}

a:link.squarebutton, a:visited.squarebutton, a:active.squarebutton{
color: #494949; /*button text color*/
}

a.squarebutton span{
background: transparent url('./images/square-red-right.gif') no-repeat top right;
display: block;
padding: 4px 9px 4px 0; /*Set 9px below to match value of 'padding-left' value above*/
}

a.squarebutton:hover{ /* Hover state CSS */
background-position: bottom left;
}

a.squarebutton:hover span{ /* Hover state CSS */
background-position: bottom right;
color: black;
}

.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
width: 100%;
}

/*
#menu a {
   background: url(./images/button.png) no-repeat bottom right;
   display:block;
	width:500;
	height:200px;
	padding:5px;
	margin:0px;
   }
#menu a:hover {
   background-image: url(./images/button-rollover.png);
   }
*/
/*
.button {
width:100px;
height:20px;
padding:5px;
margin:0px;
background-image:url(./images/button.png) no-repeat top left;
}

.button a:link, .button a:visited {
display:block;
width:100px;
height:20px;
padding:5px;
margin:0px;
background-image: url(./images/button.png) no-repeat top left;
}

.button a:hover, .button a:active {
display:block;
width:100px;
height:20px;
padding:5px;
margin:0px;
background-image: url(./images/button-rollover.png) no-repeat top left;
}
*/


/*
.btn { display: block; position: relative; background: #aaa; padding: 5px; float: left; color: #fff; text-decoration: none; cursor: hand; }
.btn * { font-style: normal; background-image: url(./images/button.png); background-repeat: no-repeat; display: block; position: relative; }
.btn i { background-position: top left; position: absolute; margin-bottom: -5px;  top: 0; left: 0; width: 5px; height: 5px; }
.btn span { background-position: bottom left; left: -5px; padding: 0 0 5px 10px; margin-bottom: -5px; }
.btn span i { background-position: bottom right; margin-bottom: 0; position: absolute; left: 100%; width: 10px; height: 100%; top: 0; }
.btn span span { background-position: top right; position: absolute; right: -10px; margin-left: 10px; top: -5px; height: 0; }
*/
/*
* html .btn span,
* html .btn i { float: left; width: auto; background-image: none; cursor: pointer; }
*/
/*
.btn.blue { background: #2ae; }
.btn:hover { background-image: url(./images/button-rollover.png)};
*/
/*.btn:hover { background-color: #a00; } */
/*
.btn:active { background-color: #444; }
.btn[class] {  background-image: url(./images/button.png); background-position: bottom; }
*/