@charset "utf-8";
/**
 * jquery.scrollable 1.0.2. Put your HTML scroll.
 * 
 * Copyright (c) 2009 Tero Piirainen
 * http://flowplayer.org/tools/scrollable.html
 *
 * Dual licensed under MIT and GPL 2+ licenses
 * http://www.opensource.org/licenses
 *
 * Launch  : March 2008
 * Version : 1.0.2 - Tue Feb 24 2009 10:52:08 GMT-0000 (GMT+00:00)
 */

.scrollable-wrapper {
	border-top: 1px solid #ccc;
	margin-top: 0.5em;
	padding-top: 0.25em;
	padding: 0;
	}
	
.scrollable-wrapper .centering-wrapper {
	width: 95%;
	margin: 0 auto 0 auto;
	}	

.scrollable {
	/*  root element for the scrollable. when scrolling occurs this element stays still.  */     
	/* required settings */ 
	position:relative; 
	overflow:hidden;             
	height:25.5em; 
	/* this makes it possible to add next button beside scrollable */
	float:left;
	margin-top: 0.25em;
	} 

 .scrollable .items {
	  /*  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. */     
      /* this cannot be too large */ 
	 width:10000em;     
	 position:absolute;
	 } 

  .scrollable .items  .scro-content{ 
  /*  a single item. must be floated on horizontal scrolling typically this element is the one that *you* will style the most. */     
  float:left; 
  height: 25em;
  margin-right: 0.2em;
  overflow: hidden;
  } 
  
h4.scro-title {
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	letter-spacing: -0.06em;
	position: absolute; /*逼迫IE6, IE7, IE8擴充連結感應區域*/
	padding: 1em 100em 100em 0; /*逼迫IE6, IE7, IE8擴充連結感應區域*/
	margin: 0;
	font-size: 1.3em;
	font-weight: normal;
	color: #000000;
	} 

h4.scro-title a {
	color: #000000;
	padding: 1em 100em 100em 0; /*擴大連結感應區域*/
	margin: 0 0 0 1em;
	}

h4.scro-title a:hover {
	text-decoration: none;
	}

.items .transp-wrapper {
	height: 3em;
	/*多此一無語意之圖層的原因：IE6, IE7似乎無法直接針對h4設定透明度*/
	border-bottom: 1px solid #888888;
	background-color: #cccccc;
	/*CSS (不)透明度*/
	-moz-opacity: 0.7; 
	-khtml-opacity: 0.7; 
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; /*(新發售)IE8的透明濾鏡，必須置於舊版指令之前；字會有點糊糊的*/
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); /*舊版IE的透明濾鏡*/
	opacity: 0.7; /*CSS3，Opera 9以後才支援*/		
	}	
 
/* you may want to setup some decorations to active item */ 
.items .active { 
}

a.prev, a.next, a.prevPage, a.nextPage {
	/* prev, next, prevPage and nextPage buttons */
	display:block;
	width:18px;
	height:18px;
	background-image: url(../object/left.png);
	background-repeat: no-repeat;
	float:left;
	margin: 3em 1em 3em 1em;
	cursor:pointer;
	}

a.prev:hover, a.next:hover, a.prevPage:hover, a.nextPage:hover {
	/* mouseover state */
	background-position:0px -18px;		
	}

a.disabled {
	/* disabled navigational button */
	visibility:hidden !important;		
	}

a.next, a.nextPage {
	/* next button uses another background image */
	background-image: url(../object/right.png);
	clear:right;	
	}

/* navigator */
.navi {
	/* position and dimensions of the navigator */
	float: right;
	margin-right: 10%;
	margin-top: 0.5em;
	height:20px;
	}

.scrollable-wrapper > .navi {
margin-top: 20%;
margin-top: 1em;
}

 .navi a {
	  /* items inside navigator */
	 width:8px;
	 height:8px;
	 float:left;
	 margin:3px;
	 background-image: url(../object/navigator.png);
	 background-position: 0 0;
	 background-repeat: no-repeat;  
	 cursor:pointer;	
	 }
 
 .scrollable-wrapper > .navi a {
	 margin: 1.5px;
	 }

  .navi a:hover {
	   /* mouseover state */
	  background-position:0 -8px;
	  }

 .navi a.active {
	  /* active state (current page state) */
	 background-position:0 -16px;     
	 } 

/**/

#scro-1999 {
	background-image: url(../object/scro_rpt_1999.jpg);
	background-position: 30% 80%;
	background-repeat: repeat-x;
	}
	
#scro-2000 {
	background-image: url(../object/scro_rpt_2000.jpg);
	background-position: 0 0;
	background-repeat: repeat-x;
	}

#scro-2001 {
	background-image: url(../object/scro_rpt_2001.jpg);
	background-position: 0 50%;
	background-repeat: repeat-x;
	}

#scro-2002 {
	background-image: url(../object/scro_rpt_2002.jpg);
	background-position: top right;
	background-repeat: repeat-x;
	}
	
#scro-2004 {
	background-image: url(../object/scro_rpt_2004.jpg);
	background-position: top left;
	background-repeat: repeat-x;
	}

#scro-2007 {
	background-image: url(../object/scro_rpt_2007.jpg);
	background-position: 50% 0;
	background-repeat: repeat-x;
	}
	
#scro-2008 {
	background-image: url(../object/scro_rpt_2008.jpg);
	background-position: 35% 98%;
	background-repeat: repeat-x;
	}	
