

/**********  this is VERSION 1 but see 2 3 and 4 below *****/


#balloon {
	MARGIN: 0 auto; WIDTH: 185px; background: #CCC; background-color: #CCC;
	
}

TABLE .tableBalloon {
	BORDER: 0px; PADDING: 0px; FONT-SIZE: 0.85em; MARGIN-left: -2px; MARGIN-top: -99px; BORDER-COLLAPSE: collapse; 
}
.balloon {
	MARGIN: 0 auto; WIDTH: 65px; background: transparent; background-color: transparent;
	
}
.balloon UL {
	BORDER: 0; PADDING: 0; MARGIN: 0;  LIST-STYLE-TYPE: none; 
}

.balloon UL LI {
	BORDER: 0; FLOAT: left; MARGIN: 5px; WIDTH: 144px; HEIGHT: 10px; padding-left: 8px; BACKGROUND: url(arrow.gif) no-repeat left top;
}
.balloon UL LI A {
	DISPLAY: block; BACKGROUND: transparent; WIDTH: 144px; COLOR: #000; HEIGHT: 15px; TEXT-DECORATION: none
}
.balloon UL LI A:visited {
	DISPLAY: block; BACKGROUND: transparent; WIDTH: 144px; COLOR: #000; HEIGHT: 15px; TEXT-DECORATION: none
}
.balloon UL LI A IMG {
	BORDER: 0;
}
.balloon UL LI A:visited IMG {
	BORDER: 0; 
}
.balloon UL LI DL {
	VISIBILITY: hidden; POSITION: absolute
}

.balloon DL {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: url(bottom.gif) no-repeat left bottom; 
	PADDING-BOTTOM: 25px; WIDTH: 200px; PADDING-TOP: 0px; HEIGHT: auto
}
.balloon DT {
	PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; FONT-SIZE: 1.1em; 
	BACKGROUND: url(top.gif) no-repeat left top; PADDING-BOTTOM: 1px; MARGIN: 0px; COLOR: #000; 
	PADDING-TOP: 10px; TEXT-ALIGN: center
}
.balloon DD {
	BORDER-RIGHT: #e3e0e1 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #e3e0e1 0px solid; 
	PADDING-LEFT: 15px; FONT-SIZE: 1em; BACKGROUND: url(info.gif) #fff no-repeat right bottom; 
	PADDING-BOTTOM: 5px; MARGIN: 0px; BORDER-LEFT: #e3e0e1 1px solid; COLOR: #000; PADDING-TOP: 5px; 
	BORDER-BOTTOM: #e3e0e1 0px solid; 
}
.balloon DD P {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 10px 0px; LINE-HEIGHT: 1.5em; 
	PADDING-TOP: 0px
}
.balloon DL#web1, .balloon DL#web2, .balloon DL#web3, .balloon DL#web4, .balloon DL#web5 {
	BACKGROUND: url(bottom.gif) no-repeat left bottom; HEIGHT: auto
}

.balloon DL#web1 DT, .balloon DL#web2 DT, .balloon DL#web3 DT, .balloon DL#web4 DT, .balloon DL#web5 DT {
	BACKGROUND: url(top.gif) no-repeat left top
}

.balloon UL LI:hover {
	COLOR: #000; POSITION: relative
}
.balloon UL LI:hover DL {
	LEFT: 150px; VISIBILITY: visible; TOP: -95px
}
.balloon UL LI:hover DL EM {
	DISPLAY: block; BACKGROUND: url(pointer2.gif); LEFT: -35px; WIDTH: 36px; POSITION: absolute; TOP: 75px; 
	HEIGHT: 36px
}
.balloon UL LI:hover DL A {
	DISPLAY: inline; BACKGROUND: none transparent scroll repeat 0% 0%; COLOR: #606; 
	TEXT-DECORATION: underline
}
.balloon UL LI:hover DL A:hover {
	TEXT-DECORATION: none
}


/* test version2 


TABLE .tableBalloon2 {
	BORDER: 2px; PADDING: 0px; FONT-SIZE: 0.85em; 
	MARGIN-left: -2px; MARGIN-top: -99px; 
	BORDER-COLLAPSE: collapse; 
}*/



.balloon2 {
	MARGIN: 0 auto; WIDTH: 265px; FONT-SIZE: 1em;
	background: transparent; background-color: transparent;
	
	
}
.balloon2 UL {
	BORDER: 0; PADDING: 0; MARGIN: 0;  LIST-STYLE-TYPE: none; 
}

.balloon2 UL LI {
	BORDER: 0; FLOAT: left; MARGIN: 5px; WIDTH: 244px; 
	HEIGHT: 35px; padding-left: 8px; 
	BACKGROUND: url(arrow.gif) no-repeat left top;
}
.balloon2 UL LI A {
	DISPLAY: block; BACKGROUND: transparent; WIDTH: 244px; 
	COLOR: #000; HEIGHT: 15px; TEXT-DECORATION: none
}
.balloon2 UL LI A:visited {
	DISPLAY: block; BACKGROUND: transparent; WIDTH: 244px; 
	COLOR: #000; HEIGHT: 15px; TEXT-DECORATION: none
}
.balloon2 UL LI A:hover {
	DISPLAY: block; BACKGROUND: #ccc; WIDTH: 244px; 
	COLOR: #000; HEIGHT: 15px; TEXT-DECORATION: none;
	padding-bottom: 4px;
}
.balloon2 UL LI A IMG {
	BORDER: 0;
}
.balloon2 UL LI A:visited IMG {
	BORDER: 0; 
}
.balloon2 UL LI DL {
	VISIBILITY: hidden; POSITION: absolute
}

/* hovering balloon bit starts here */

.balloon2 DL {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; 
	BACKGROUND: url(bottom.gif) no-repeat left bottom; 
	PADDING-BOTTOM: 25px; WIDTH: 200px; 
	PADDING-TOP: 0px; HEIGHT: auto
}
.balloon2 DT {
	PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; 
	FONT-SIZE: 1.1em; BACKGROUND: url(top.gif) no-repeat left top; 
	PADDING-BOTTOM: 1px; MARGIN: 0px; COLOR: #000; PADDING-TOP: 4px; 
	TEXT-ALIGN: center
}
.balloon2 DD {
	BORDER-RIGHT: #e3e0e1 1px solid; PADDING-RIGHT: 15px; 
	BORDER-TOP: #e3e0e1 0px solid; PADDING-LEFT: 15px; 
	FONT-SIZE: 1em; BACKGROUND: url(info.gif) #fff no-repeat right bottom; 
	PADDING-BOTTOM: 5px; MARGIN: 0px; BORDER-LEFT: #e3e0e1 1px solid; 
	COLOR: #000; PADDING-TOP: 5px; BORDER-BOTTOM: #e3e0e1 0px solid; 
}
.balloon2 DD P {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; 
	MARGIN: 10px 0px; LINE-HEIGHT: 1.5em; PADDING-TOP: 0px
}
.balloon2 DL#web1, .balloon DL#web2, .balloon DL#web3, .balloon DL#web4, .balloon DL#web5 {
	BACKGROUND: url(bottom.gif) no-repeat left bottom; HEIGHT: auto
}

.balloon2 DL#web1 DT, .balloon DL#web2 DT, .balloon DL#web3 DT, .balloon DL#web4 DT, .balloon DL#web5 DT {
	BACKGROUND: url(top.gif) no-repeat left top
}

.balloon2 UL LI:hover {
	COLOR: #000; POSITION: relative
}
.balloon2 UL LI:hover DL {
	LEFT: 250px; VISIBILITY: visible; TOP: -95px
}
.balloon2 UL LI:hover DL EM {
	DISPLAY: block; BACKGROUND: url(pointer2.gif); LEFT: -35px; 
	WIDTH: 36px; POSITION: absolute; TOP: 75px; HEIGHT: 36px
}
.balloon2 UL LI:hover DL A {
	DISPLAY: inline; BACKGROUND: none transparent scroll repeat 0% 0%; 
	COLOR: #606; TEXT-DECORATION: underline
}
.balloon2 UL LI:hover DL A:hover {
	TEXT-DECORATION: none
}




/**********  VERSION 3 RIGHT *****/



.balloon3 {
	MARGIN: 0 auto; WIDTH: 165px; FONT-SIZE: 1em;
	background: transparent; background-color: transparent;
	
	
}
.balloon3 UL {
	BORDER: 0; PADDING: 0; MARGIN: 0;  LIST-STYLE-TYPE: none; 
}

.balloon3 UL LI {
	BORDER: 0; FLOAT: left; MARGIN: 5px; WIDTH: 144px; 
	HEIGHT: 25px; padding-left: 8px; 
	BACKGROUND: url(arrow.gif) no-repeat left top;
}
.balloon3 UL LI A {
	DISPLAY: block; BACKGROUND: transparent; WIDTH: 144px; 
	COLOR: #666; HEIGHT: 15px; TEXT-DECORATION: none
}
.balloon3 UL LI A:visited {
	DISPLAY: block; BACKGROUND: transparent; WIDTH: 144px; 
	COLOR: #999; HEIGHT: 15px; TEXT-DECORATION: none
}
.balloon3 UL LI A:hover {
	DISPLAY: block; BACKGROUND: #ccc; WIDTH: 144px; 
	COLOR: #000; HEIGHT: 15px; TEXT-DECORATION: none;
	padding-bottom: 4px;
}
.balloon3 UL LI A IMG {
	BORDER: 0;
}
.balloon3 UL LI A:visited IMG {
	BORDER: 0; 
}
.balloon3 UL LI DL {
	VISIBILITY: hidden; POSITION: absolute
}

/* hovering balloon bit starts here */

.balloon3 DL {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; 
	BACKGROUND: url(bottom.gif) no-repeat left bottom; 
	PADDING-BOTTOM: 25px; WIDTH: 200px; 
	PADDING-TOP: 0px; HEIGHT: auto
}
.balloon3 DT {
	PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; 
	FONT-SIZE: 1.5em; BACKGROUND: url(top.gif) no-repeat left top; 
	PADDING-BOTTOM: 1px; MARGIN: 0px; COLOR: #000; PADDING-TOP: 4px; 
	TEXT-ALIGN: center
}
.balloon3 DD {
	BORDER-RIGHT: #e3e0e1 1px solid; PADDING-RIGHT: 15px; 
	BORDER-TOP: #e3e0e1 0px solid; PADDING-LEFT: 15px; 
	FONT-SIZE: 1.1em; BACKGROUND: url(info.gif) #fff no-repeat right bottom; 
	PADDING-BOTTOM: 5px; MARGIN: 0px; BORDER-LEFT: #e3e0e1 1px solid; 
	COLOR: #000; PADDING-TOP: 5px; BORDER-BOTTOM: #e3e0e1 0px solid; 
}
.balloon3 DD P {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; 
	MARGIN: 10px 0px; LINE-HEIGHT: 1.5em; PADDING-TOP: 0px
}
.balloon3 DL#web1, .balloon DL#web2, .balloon DL#web3, .balloon DL#web4, .balloon DL#web5 {
	BACKGROUND: url(bottom.gif) no-repeat left bottom; HEIGHT: auto
}

.balloon3 DL#web1 DT, .balloon DL#web2 DT, .balloon DL#web3 DT, .balloon DL#web4 DT, .balloon DL#web5 DT {
	BACKGROUND: url(top.gif) no-repeat left top
}

.balloon3 UL LI:hover {
	COLOR: #000; POSITION: relative
}
.balloon3 UL LI:hover DL {
	RIGHT: 170px; VISIBILITY: visible; TOP: -95px
}
.balloon3 UL LI:hover DL EM {
	DISPLAY: block; BACKGROUND: url(pointer3.gif); RIGHT: -35px; 
	WIDTH: 36px; POSITION: absolute; TOP: 75px; HEIGHT: 36px
}
.balloon3 UL LI:hover DL A {
	DISPLAY: inline; BACKGROUND: none transparent scroll repeat 0% 0%; 
	COLOR: #606; TEXT-DECORATION: underline
}
.balloon3 UL LI:hover DL A:hover {
	TEXT-DECORATION: none
}

/**********  VERSION 4 RIGHT *****/



.balloon4 {
	MARGIN: 0 auto; WIDTH: 165px; FONT-SIZE: 0.85em;
	background: transparent; background-color: transparent;
	
	
}
.balloon4 UL {
	BORDER: 0; PADDING: 0; MARGIN: 0;  LIST-STYLE-TYPE: none; 
}

.balloon4 UL LI {
	BORDER: 0; FLOAT: left; MARGIN: 5px; WIDTH: 144px; 
	HEIGHT: 25px; padding-left: 8px; 
	BACKGROUND: url(arrow.gif) no-repeat left top;
}
.balloon4 UL LI A {
	DISPLAY: block; BACKGROUND: transparent; WIDTH: 144px; 
	COLOR: #EEE; HEIGHT: 15px; TEXT-DECORATION: none
}
.balloon4 UL LI A:visited {
	DISPLAY: block; BACKGROUND: transparent; WIDTH: 144px; 
	COLOR: #EEE; HEIGHT: 15px; TEXT-DECORATION: none
}
.balloon4 UL LI A:hover {
	DISPLAY: block; BACKGROUND: transparent; WIDTH: 144px; 
	COLOR: #000; HEIGHT: 15px; TEXT-DECORATION: none;
	padding-bottom: 4px;
}
.balloon4 UL LI A IMG {
	BORDER: 0;
}
.balloon4 UL LI A:visited IMG {
	BORDER: 0; 
}
.balloon4 UL LI DL {
	VISIBILITY: hidden; POSITION: absolute
}

/* hovering balloon bit starts here */

.balloon4 DL {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; 
	BACKGROUND: url(bottom.gif) no-repeat left bottom; 
	PADDING-BOTTOM: 25px; WIDTH: 200px; 
	PADDING-TOP: 0px; HEIGHT: auto
}
.balloon4 DT {
	PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; 
	FONT-SIZE: 1.1em; BACKGROUND: url(top.gif) no-repeat left top; 
	PADDING-BOTTOM: 1px; MARGIN: 0px; COLOR: #000; PADDING-TOP: 4px; 
	TEXT-ALIGN: center
}
.balloon4 DD {
	BORDER-RIGHT: #e3e0e1 1px solid; PADDING-RIGHT: 15px; 
	BORDER-TOP: #e3e0e1 0px solid; PADDING-LEFT: 15px; 
	FONT-SIZE: 1em; BACKGROUND: url(info.gif) #fff no-repeat right bottom; 
	PADDING-BOTTOM: 5px; MARGIN: 0px; BORDER-LEFT: #e3e0e1 1px solid; 
	COLOR: #000; PADDING-TOP: 5px; BORDER-BOTTOM: #e3e0e1 0px solid; 
}
.balloon4 DD P {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; 
	MARGIN: 10px 0px; LINE-HEIGHT: 1.5em; PADDING-TOP: 0px
}
.balloon4 DL#web1, .balloon DL#web2, .balloon DL#web3, .balloon DL#web4, .balloon DL#web5 {
	BACKGROUND: url(bottom.gif) no-repeat left bottom; HEIGHT: auto
}

.balloon4 DL#web1 DT, .balloon DL#web2 DT, .balloon DL#web3 DT, .balloon DL#web4 DT, .balloon DL#web5 DT {
	BACKGROUND: url(top.gif) no-repeat left top
}

.balloon4 UL LI:hover {
	COLOR: #000; POSITION: relative
}
.balloon4 UL LI:hover DL {
	RIGHT: 170px; VISIBILITY: visible; TOP: -95px
}
.balloon4 UL LI:hover DL EM {
	DISPLAY: block; BACKGROUND: url(pointer3.gif); RIGHT: -35px; 
	WIDTH: 36px; POSITION: absolute; TOP: 75px; HEIGHT: 36px
}
.balloon4 UL LI:hover DL A {
	DISPLAY: inline; font-size: 1.1em; BACKGROUND: none transparent scroll repeat 0% 0%; 
	COLOR: #606; TEXT-DECORATION: underline
}
.balloon4 UL LI:hover DL A:hover {
	TEXT-DECORATION: none
}