@charset "utf-8";
/* CSS Document */
/*  
    root element for the scrollable.  
    when scrolling occurs this element stays still.  
*/ 
#dentistsSlideBox { position:relative; width:198px; clear:both; padding:10px 0; }
div.scrollable { position:relative; overflow:hidden; width:110px; height:202px; margin:0 auto; }
 
/*  
    root element for scrollable items. Must be absolutely positioned 
    and it should have a super large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/ 
div#dentists { width:20000em; position:absolute; } 
 
/*  
    a single item. must be floated on horizontal scrolling 
    typically this element is the one that *you* will style 
    the most. 
*/ 
div.scrollable div#dentists div { width:110px; float:left; }
 
/* you may want to setup some decorations to active item */ 
div#dentists div.active { background-color:#fff; }

/* disabled navigational button */
a.disabled { visibility:hidden !important; }
/* prev, next, prevPage and nextPage buttons */
a.prev, a.next, a.prevPage, a.nextPage { 
	display:block; width:25px; height:25px; float:left; margin:0px 2px; cursor:pointer; }

/* disabled navigational button
a.disabled {
	visibility:hidden !important;		
}
 */
/* next button uses another background image */
a.prev, a.prevPage { background-image:url(/images/p-pre-arw.gif); clear:right;
	position:absolute; top:70px; left:5px; }
a.next, a.nextPage { background-image:url(/images/p-next-arw.gif); clear:right;
	position:absolute; top:70px; right:5px; }

/* mouseover state */
a.prev:hover, a.next:hover, a.prevPage:hover, a.nextPage:hover { background-position:0px -25px; }


/*********** navigator ***********/


/* position and dimensions of the navigator */
div.navi { margin-left:10px; width:170px; height:20px; }


/* items inside navigator */
div.navi a {
	width:8px;
	height:8px;
	float:left;
	margin:3px;
	background:url(/images/navigator.png) 0 0 no-repeat;     
	cursor:pointer;	
}

/* mouseover state */
div.navi a:hover { background-position:0 -8px; }

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

div.scrollable p { padding-top: 0; margin-top: -5px; }
