/*
root element for the scrollable.
when scrolling occurs this element stays still.
*/
#event-wrapper{
position:relative;
/*background:#ffcc00;
*/width:950px;
margin:-170px auto 20px auto;
font-size:1.1em;
line-height:1.3em;
}
.scrollable {
/* required settings */
position:relative;
z-index:1;
overflow:hidden;
width:898px;
height:230px;

/* custom decorations */
border:1px solid #ccc;
background:url(../../img/scrollable-bg.png) repeat-x;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
box-shadow: 0px 2px 10px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 2px 10px rgba(0,0,0,0.1);
-webkit-box-shadow: 0px 2px 10px rgba(0,0,0,0.1);
}

/*
root element for scrollable items. Must be absolutely positioned
and it should have a extremely large width to accomodate scrollable items.
it's enough that you set the width and height for the root element and
not for this element.
*/
.scrollable .items {
/* this cannot be too large */
width:20000em;
position:absolute;
clear:both;
}
.scrollable .items .eventbox {
float:left;
width:180px;
height:230px;
overflow:hidden;
}
.eventbox .eimg{
display:block;
width:160px;
height:106px;
overflow:hidden;
text-align:center;
margin-bottom:10px;
}
.eventbox strong{
margin-bottom:5px;
color:#C43030;
font-size:0.9em;
line-height:1.4em;
}
.eventbox img,.eventbox strong{
display:block;
/*width:100%;
*/cursor:pointer;
}
.eventbox span.etext{
border-bottom:1px dotted #e5e5e5;
font-size:0.9em;
line-height:1.4em;
}
.scrollable .items .eventbox a{
display:block;
width:160px;
height:210px;
padding:10px;
background:url(../../img/scrollable-line.png) no-repeat right 10px;
overflow:hidden;
color:#333;
}
.scrollable .items .eventbox a:hover{
background:#fcfcfc url(../../img/scrollable-line.png) no-repeat right 10px;
overflow:hidden;
}
.scrollable .items .eventbox a:hover img{
filter: alpha(opacity=70);
-moz-opacity:0.70;
opacity:0.70;
}
/* single scrollable item */
/*.scrollable img {
float:left;
margin:20px 5px 20px 21px;
background-color:#fff;
padding:2px;
border:1px solid #ccc;
cursor:pointer;
width:100px;
height:75px;
}
*/
/* active item */
/*.scrollable .active {
border:2px solid #000;
z-index:9999;
position:relative;
}
*/

