/* position and dimensions of the navigator */
#carousel .navi {
    margin-left:328px;
    width:200px;
    height:20px;
}


/* items inside navigator */
#carousel .navi a {
    width:12px;
    height:12px;
    float:left;
    margin:3px;
    background:url(../img/navigator.png) 0 0 no-repeat;
    display:block;
    font-size:1px;
}

/* mouseover state */
#carousel .navi a:hover {
    background-position:0 -12px;
}

/* active state (current page state) */
#carousel .navi a.active {
    background-position:0 -24px;
}


/* get rid of those system borders being generated for A tags */
#carousel a:active {
    outline:none;
}

#carousel :focus {
    -moz-outline-style:none;
}

#carousel .vertical {

    /* required settings */
position:relative;
overflow:hidden;
    height: 665px;
    width: 650px;
    border-top:1px solid #ddd;
}

	/* root element for scrollable items */
#carousel .items {
    position:absolute;
    height:20000em;
    margin: 0px;
}


/* root element for horizontal scrollables */
#carousel .scrollable {
	position:relative;
	overflow:hidden;
	width: 510px;
	height: 200px;
	float:left;
}



/* single scrollable item */
#carousel .item {
	float:left;
	cursor:pointer;
	width:500px;;
	height:200px;
	padding:10px;
}

#carousel {
	margin:0 auto; 
	width: 650px;
	height: auto; 	
}

/* Bubbles */
#carousel div.navi {
	margin-left:250px;
	cursor:pointer;
}

/******************** BOUTONS ******************************/


/* prev, next, prevPage and nextPage buttons */
#carousel a.browse {
    background:url(../img/hori_large.png) no-repeat;
    display:block;
    width:30px;
    height:30px;
    float:left;
    margin:40px 10px;
    cursor:pointer;
    font-size:1px;
}

/* right */
#carousel a.right { background-position: 0 -30px; clear:right; margin-right: 0px;}
#carousel a.right:hover { background-position:-30px -30px; }
#carousel a.right:active { background-position:-60px -30px; }


/* left */
#carousel a.left { margin-left: 0px; }
#carousel a.left:hover  { background-position:-30px 0; }
#carousel a.left:active { background-position:-60px 0; }

/* up and down */
#carousel a.up, a.down  {
    background:url(../img/vert_large.png) no-repeat;
    float: none;
    margin: 10px 50px;
}

/* up */
#carousel a.up:hover { background-position:-30px 0; }
#carousel a.up:active { background-position:-60px 0; }

/* down */
#carousel a.down { background-position: 0 -30px; }
#carousel a.down:hover { background-position:-30px -30px; }
#carousel a.down:active { background-position:-60px -30px; }


/* disabled navigational button */
#carousel a.disabled {
    visibility:hidden !important;
}

#carousel .main-information {
	font-size: 14px;
	font-weight: bold;
}

#carousel .advanced-information {
	display: none;
}