/* liScroll styles */

.tickercontainer { /* the outer div with the black border */
position: relative;
background: #1ba8dc; 
width: 788px; 
height: 22px;
margin: 0 auto; 
padding: 0
overflow: hidden;
margin-bottom: 4px;
color: #333;
}
.tickercontainer .mask { /* that serves as a mask. so you get a sort of padding both left and right */
position: relative;
left: 10px;
width: 768px;
overflow: hidden;
}
.tickercontainer .visualmask {
position: absolute;
top: 0;
z-index: 3;
left: 10px;
width: 64px;
height: 22px;
background: url("/wp-content/themes/surfsession/images/mask.png") no-repeat;
}
.tickercontainer .visualmask2 {
position: absolute;
top: 0;
z-index: 3;
right: 10px;
width: 64px;
height: 22px;
background: url("/wp-content/themes/surfsession/images/mask2.png") no-repeat;
}
ul.newsticker { /* that's your list */
position: relative;
left: 750px;
font: bold 11px Verdana;
line-height: 22px;
list-style-type: none;
margin: 0;
padding: 0;

}
ul.newsticker li {
/*float: left;  important: display inline gives incorrect results when you check for elem's width */
display: inline;
margin: 0;
padding: 0;
}
ul.newsticker a {
white-space: nowrap;
padding: 0;
color: #000;
font: bold 11px Verdana;
line-height: 22px;
margin: 0 10px 0 0;
} 
ul.newsticker span {
margin: 0 10px 0 0;
}