/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container { position: relative;}
.jcarousel-clip { z-index: 2; padding: 0; margin: 0; overflow: hidden; position: relative;}
.jcarousel-list { z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0;}

.jcarousel-list li, .jcarousel-item { float: left; list-style: none; 
 /* We set the width/height explicitly. No width/height causes infinite loops. */
 width: 580px; height: 100px;}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next { z-index: 3; display: none;}
.jcarousel-prev { z-index: 3; display: none;}
.jcarousel-skin-tango .jcarousel-container {}
.jcarousel-skin-tango .jcarousel-container-horizontal { width: 580px; padding: 20px 40px;}
.jcarousel-skin-tango .jcarousel-clip-horizontal { width: 580px; height: 100px;}
.jcarousel-skin-tango .jcarousel-item { width: 580px; height: 100px; /*background-color: Yellow;*/}
.jcarousel-skin-tango .jcarousel-item-horizontal { margin-right: 10px;}
.jcarousel-skin-tango .jcarousel-item-placeholder { background: #fff; color: #000;}

/***  Horizontal Buttons */
.jcarousel-skin-tango .jcarousel-next-horizontal { position: absolute; top: 43px; right: 5px; width: 32px; height: 32px; cursor: pointer; background: transparent url(/lib/images/next-horizontal.png) no-repeat 0 0;}
.jcarousel-skin-tango .jcarousel-next-horizontal:hover { background-position: -32px 0;}
.jcarousel-skin-tango .jcarousel-next-horizontal:active { background-position: -64px 0;}
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active { cursor: default; background-position: -96px 0;}
.jcarousel-skin-tango .jcarousel-prev-horizontal { position: absolute; top: 43px; left: 5px; width: 32px; height: 32px; cursor: pointer; background: transparent url(/lib/images/prev-horizontal.png) no-repeat 0 0;}
.jcarousel-skin-tango .jcarousel-prev-horizontal:hover { background-position: -32px 0;}
.jcarousel-skin-tango .jcarousel-prev-horizontal:active { background-position: -64px 0;}
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active { cursor: default; background-position: -96px 0;}

#mycarousel .image { float: left; width: 150px; height: 150px; overflow: hidden;}
#mycarousel .image img { width: 150px; height: 100px;}
#mycarousel .wrapper { float: left; width: 410px; margin: 0 0 0 20px;}
#mycarousel span.titel { color: #003d7c; font-size: 11px; font-weight: bold; float: left; margin: 0 0 6px 0}
#mycarousel span.datum { clear: both; float: left; font-style: italic; margin: 0 0 10px 0;}
#mycarousel span.teaser { clear: both; float: left; margin: 0 0 10px 0; height: 28px; width: 400px; overflow: hidden;}
#mycarousel a.lees { clear: both; float: left; color: #fff; font-size: 9px; font-weight: bold; display: block; background: url(/lib/images/btn_leesmeer.png) no-repeat; width: 80px; height: 17px; text-align: center; text-decoration: none; padding: 3px 0 0 0;}


/*PORTAL*/
.portal .jcarousel-skin-tango .jcarousel-clip-horizontal { width: 880px; height: 120px; }
.portal .jcarousel-skin-tango .jcarousel-container-horizontal { width: 880px; padding: 0 40px 20px 40px;}
.portal .jcarousel-skin-tango .jcarousel-item { width: 410px; padding: 10px; background: url(/lib/images/bg_portal_nieuws.png) repeat-x;}

.portal #mycarousel .image { float: left; width: 150px; height: 150px; margin: 0 10px 0 0; overflow: hidden;}
.portal #mycarousel .image img { width: 150px; height: 100px;}

.portal #mycarousel .wrapper { float: left; width: 250px; margin: 0; overflow: hidden;}
.portal #mycarousel span.titel { margin: 0 0 10px 0; width: 410px; float: left; height: 15px; overflow: hidden;}
.portal #mycarousel span.datum { margin: 0 0 6px 0;}
.portal #mycarousel span.teaser { clear: both; float: left; margin: 0 0 10px 0; height: 28px; width: 100%; overflow: hidden;}