@import url("reset.css");
body{overflow:hidden;
font:11px/20px Georgia, "Times New Roman", Times, serif;
text-align:center;
margin:50px auto;
color:#000;
background:url(images/bg2.gif);}
a{color:#666;text-decoration:none;}
a:hover{cursor:help;text-decoration:none;}
#main{width:720px;height:600px;
background:url(images/layout.png) no-repeat right;
margin:0 auto;
text-align:left;
position:relative;
}
#title{position:absolute;
top:0;
left:-50px;
width:280px;
height:140px;
background: url(images/title.png) no-repeat left top;}
#nav {
	position:absolute;
	top:-20px;
	left:220px;
	padding:0;
	height: 90px;		/* 選單圖片的高 */
	list-style: none;
	overflow: hidden;
	width:450px;		 /*131 * 2 */
}
#nav li {
	float:left;
	padding: 0;
}
#nav li a {
	display: block;
	width: 131px;		/* 選單圖片的寬 */
	height: 90px;		/* 選單圖片的高 */
	line-height: 90px;	/* ie suck */
	text-indent: -9999px;
	margin-top: 45px;	/* 需要設定為圖片寬/2 */
	background-repeat: no-repeat;
}
.vivitar{background:url(images/menu_2.png);}
.tolne{background:url(images/menu_3.png);}
.intro{background:url(images/menu_1.png);}
#prolink{position:absolute;top:35px;right:0;}
#prolink ul{list-style:none;padding:0;margin:0;}
#prolink ul li{width:32px;height:32px;float:left;padding:0 2px;}
#prolink ul li a{text-indent: -9999px;height:32px;width:32px;display:block;}
.twitter{background:url(images/twitter.png) no-repeat;}
.plurk{background:url(images/plurk.png) no-repeat;}
.flickr{background:url(images/flickr.png) no-repeat;}
#content, #index, #intro{
overflow:auto;
background:#fff;
position:absolute;
top:115px;
left:50px;
width:625px;
height:365px;
padding:10px;
text-align:center;
margin:0 0 0 10px;}
#content li{float:left;
width:120px;
height:120px;
background:url(images/albumbg2.png);
padding:0;}
#content li.album_none{width:120px;
height:120px;
background:url(images/albumbg_none.png);
padding:0;}
#content li img{width:80px;
height:80px;
border:0;
padding:20px 10px 10px 10px;
margin:0;}
#content li a{display:block;}
#content li a img{opacity:.7;
filter:alpha(opacity=70);}
#content li:hover img{opacity:1;
filter:alpha(opacity=100);}
#thx{position:absolute;bottom:110px;left:65px;clear:both;}
#thx li a, #intro li a{text-decoration:underline;color:#222;}
#thx li a:hover, #intro li a:hover{text-decoration:none;color:#999;}
#index, #intro{margin:0;}
#index li{border-bottom:1px dashed #ccc;padding:2px;text-align:left;font:13px Georgia, "Times New Roman", Times, serif;height:20px;line-height:20px;}
#index img{width:200px;height:150px;border:0;padding:5px;margin:20px 0 0;float:left;}
#index a:hover img{display:block;}
#intro li{border-bottom:1px dashed #ccc;padding:2px;text-align:left;font:12px Georgia, "Times New Roman", Times, serif;width:52%;height:18px;line-height:18px;}
#intro img{float:right;border:4px solid #fff;-moz-box-shadow: 4px 4px 5px #999;
-webkit-box-shadow: 4px 4px 5px #999;
box-shadow: 4px 4px 5px #999;}
#button{width:52px;height:200px;position:absolute;top:250px;left:-18px;}
#button li{width:52px;height:99px;}
#button li a{display:block;width:52px;height:99px;}
.back{background:url(images/back.png);}
.next{background:url(images/next.png);}
.webtitle{font:23px Georgia, "Times New Roman", Times, serif;}
#ad{position:absolute;
top:85px;
left:230px;
width:450px;}
div#abgne_marquee{
	position: relative;
	overflow: hidden;
	_font-style:normal;
	width: 450px;
	height: 26px !important;
	_height:20px;
	font-size:23px !important;
	font-family:MS UI Gothic;
	*font-size:18pt;
}
div#abgne_marquee ul, div#abgne_marquee li {
	margin: 0;
	padding: 0;
}
div#abgne_marquee ul {
	position: absolute;
}
div#abgne_marquee ul li a {
	display: block;
	overflow: hidden;
	color:#333;
	height: 26px;
	_height:20px;
	line-height: 26px;
	_line-height:20px;
	text-decoration: none;
	font-size:23px !important;
	*font-size:18pt;
	font-family:MS UI Gothic;
}
div#abgne_marquee ul li a:hover{color:#c0c0c0;}
.mid{vertical-align:middle;}
#footer{color:#333;position:absolute;bottom:80px;left:65px;letter-spacing:1px;}
#footer a:hover{text-decoration:underline;color:#000;}
/*-----連結說明-----*/
.info, .info2, .info3, .text_info, .v_info, .t_info{position:relative;}
.info span, .info2 span, .info3 span, .text_info span, .v_info span, .t_info span{display:none;letter-spacing:1px;}
.info:hover span {
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
display:block;
position:absolute;
top:120px; left:0;
width:120px;
padding:5px 10px;
background:#000;
text-align:left;
color:#fff;
}
.info2:hover span{-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
display:block;
position:absolute;
top:15px; left:120px;
width:120px;
padding:5px 10px;
background:#000;
text-align:left;
color:#fff;}
.info3:hover span{-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
display:block;
position:absolute;
top:15px; right:120px;
width:120px;
padding:5px 10px;
background:#000;
text-align:left;
color:#fff;}
.text_info:hover span{-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
display:block;
position:absolute;
top:100px; left:40px;
width:120px;
padding:2px 5px;
background:#000;
text-align:left;
color:#fff;
opacity:.6;
filter:alpha(opacity=60);}
.v_info:hover span{-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
display:block;
position:absolute;
top:30px; left:215px;
left:5px \9;
width:200px;
padding:2px 5px;
background:#efefef;
text-align:left;
color:#333;}
.t_info:hover span{-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
display:block;
position:absolute;
top:30px; left:5px;
width:200px;
padding:2px 5px;
background:#efefef;
text-align:left;
color:#333;}