/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
#Home .scrollable {

	/* required settings */
	position:absolute;
	overflow:hidden;
	width: 925px;
	height:358px;
	border: 5px #fff solid;
	background-color: #fff;
	margin-top:0px;

	/* custom decorations 
	border:1px solid #ccc; */

}

/*
	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.
*/
#Home .scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}

#Home .items div {
	float:left;
	width:925px;
	height: 328px;
	position: relative;
}

/* single scrollable item */
#Home .scrollable img {
	float:left;
	background-color:#fff;
	/*border:1px solid #ccc;*/
	position: relative;

	
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}

/* active item */
#Home .scrollable .active {
	/*border:2px solid #000;*/
	position:relative;
	cursor:default;
}



/* text overlay */
#Home .scrollable h2 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0px 0px 5px 0px;
}

#Home .scrollable h2 span {
   color: #fff;
   font-family: Arial, Helvetica, Sans-Serif;
font-weight:bold;
font-size:30px;
   letter-spacing: -0.5px;
	background: rgb(0, 0, 0); /* fallback color */
	background: rgba(0, 0, 0, 0.85);
   padding: 5px 20px 5px 10px;
line-height:47px;
}

#Home .scrollable h2 span.spacer {
   padding:0 5px;
}

#Home .scrollable h3 {
    position: absolute;
  bottom: -47px;
   left: 0;
   margin: 0;
   z-index: 5000;
line-height:59px;
}

#Home .scrollable h3 span {
   color: #555;
   font-family: Arial, Helvetica, Sans-Serif;
font-weight:bold;
   padding: 10px 10px 10px 5px;
font-size:12pt;
}

#Home .scrollable h3 span a {
   color: #555;

}

#Home .scrollable h3 span a:hover {
   color: #47177a;
text-decoration:none;
}
      

#Home .bar {
    position: absolute;
   bottom: 0;
    left: 0;
    width: 100%;
	height:24px;
    margin: 0; 
    background-color: transarent;

}



/* position and dimensions of the navigator */
#Home .navi {
	margin-left:804px;
	width:165px;
	height:20px;
	background-color: #fff;
}


/* items inside navigator */
#Home .navi a {
	width:12px;
	height:12px;
	float:left;
	margin:6px 6px;
	background:url(/assets/frontscrollable/navigator.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
	color:#fff;
}

/* mouseover state */
#Home .navi a:hover {
	background-position:0 -12px; 
	color:#fff;     

}

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



























































/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */
