* {
	margin: 0;
	padding: 0;
}
html{overflow-x:hidden;}
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	line-height:18px;

	background-repeat: repeat;
	background-position: 0px 0px;
	background-image: url(/images/oeolaBackground.jpg);
	
}
#legal{padding-top:0px;}

p{color:#333;}
h1, h2, h3 ,h4{
	color: #339dff;
}
.h2_hover{background-color:#FFFFCC;
	      padding:3px;
		  border:none;
	      color: #339dff;
		  font-size:18px;
		  font-weight:bold;
		  width:100%;
}
h5{
	/*color: #14e889;*/
	color:#090;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:15px;
}
h6
{	color: #339dff;
	font-size:12px;
	font-weight:normal;
}

h4{
    padding-bottom:10px;
}

img{}

ol{margin-left:0px; }
li{ list-style-type:none; }
a {	color: #999;}

a:hover {
    font-weight:normal;
}
input{ margin:5px 3px 3px 0; color:#999; border:#c3c3c3 1px solid; }
.input{ padding:2px; margin:3px; color:#fff; border:#e0e0e0 1px solid; background-color:#339dff;font-size:12px;}
textarea{margin-bottom:10px; color:#999; border:#edfdce 1px solid; padding:2px; font-size:12px;width:100%; margin-top:10px; height:100px; 	overflow-y:scroll;
} 
.textarea {
	width:480px;
	border:none;
	padding:4px 8px  4px 3px;
	line-height:16px;
	background-image: url(/images/bgcode.gif);
	background-repeat: repeat;
	border:#c3c3c3 1px solid;

}
.textareaWarning{
	width:480px;
	color:#C00;
	border:none;
	padding:4px 8px  4px 3px;
	line-height:16px;
	background-image: url(/images/bgcode.gif);
	background-repeat: repeat;
	border:#cc0000 1px solid;

}

/* Wrapper */

#wrapper {

}

/* Header */

#header {
	width: 840px;
	height:60px;	
	*height:80px ;
	margin: 0 auto;
	position:relative;
	z-index:2;
}

/* Logo */
*+html #logo {
	float: left;
	top : 0px;
	left:-10px;
	/*left:-43px; for 節慶用較大尺寸logo (IE7)*/
	position:absolute;
}

#logo {
	float: left;
	top : 5px;
	*top : 5px;
	left:-10px;
	/*left:-43px; for 節慶用較大尺寸logo*/
	position:absolute;
}

#logo h1 {
	margin: 0;
	padding: 0;
	font: italic 36px "Trebuchet MS", Arial, Helvetica, sans-serif;
}

#logo h2 {
	margin: -5px 0 0 0;
	padding: 0;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 10px;
	font-weight: bold;
	color: #D4C792;
}

#logo a {
	text-decoration: none;
}

/* Menu */

#menu {
	float: right;
	width:70%;
}

#menu ul {
	margin: 0;
	padding: 15px 0 0 0;
	list-style: none;
	line-height: normal;
}

#menu li {
  margin:0 5px;
}

#menu a {
	display: block;
	text-align: center;
	font-size: 12px;
	text-decoration: underline;
	color:#666666;
}

#menu a:hover, #menu .active a {
	text-decoration: none;    
}
 
/* Page */

#page {
	width: 790px;
	padding-left:30px;
	margin: 0px auto 10px auto;
}
#page2 {
	width: 770px;
	margin: 5px auto 10px auto;
	padding:15px 20px;
	background-color:#fff;
	border:#ccc 1px solid;
}

#page3{
	width: 840px;
	margin: -25px auto 10px auto;
	
}
*+html #page4 {
	margin: 4px auto 10px auto;

}
#page4 {
	width: 766px;

	
	margin: 5px auto 10px auto;
	
	
	padding:15px 20px;
	padding:35px 20px \9;
	*padding:15px 20px;
	_padding:15px 20px;

	background-color:#fff;
	border:#ccc 1px solid;
	
	position:relative;
	

}


/* Content */

#content {
	float: left;
	width: 500px;
	/*border-right:#e0e0e0 1px dashed;*/
	padding-right:25px;
}

#content h1, #content h2, #content h3 {
}

#content ul, #content ol {
	list-style-position: inside;
}

#content .boxed {
	float: left;
	width: 46%;
	padding-right: 2%;
}

#content .boxed h2 {
	padding: 5px 0;
	background: url(/images/img5.jpg) repeat-x left bottom;
}

/* alignment classes */
.float-left  { float: left; }
.float-right { float: right; padding-right:3px; }
.float-right2 { float: right; padding-right:15px; padding-bottom:20px; margin-top:-33px;}
.floatDownloadIcon { float: right; padding-right:15px; padding-top:13px;}
.align-left  { text-align: left; }
.align-right { text-align: right; }

/* display and additional classes */
.clear { clear: both; }
/* Sidebar */
.clearfix {
    display: inline-block;                  
}


#sidebar {
	background: url(/images/oeolaRightShareWhiteBg_h390_2.JPG) repeat-y center top;
	float: right;
	width: 240px;
	position: relative;
	left: 0px;
	top: 0px;
	/*border:#fff 1px solid;*/}

	

.sidebar_top{
	background: url(/images/oeolaRightShareWhiteBg_h390_1.JPG) no-repeat center top;
	height:12px;}

#sidebar ul {
	background: url(/images/oeolaRightShareWhiteBg_h390_3.JPG) no-repeat center bottom;
	margin: 0;
	list-style: none;
	line-height: normal;
	/*background-color:#e1f6f8;*/
	width: 225px;
	padding:0 0 20px 15px;
	_width: 210px;/*IE6*/
	_padding:0 0 20px 15px;/*IE6*/
	
}

#sidebar li {

}

#sidebar li ul {
background: url()


}

#sidebar li li {
	list-style: none;
	padding: 3px;
	margin: 3px ;
	/*
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #fff;
	*/
	line-height:16px;
}

#sidebar h2 {
	padding: 0 5px 5px 5px;
	font:  1.4em 'Trebuchet MS', Tahoma, Sans-serif;
	color: #339dff;
	margin-bottom:3px;
	/*
	border-left-width: 5px;
	border-left-style: solid;
	border-left-color: #339dff;
	*/
}

#sidebar h3 {
	font-size: 77%;
	color: #D4C792;
}

#sidebar p {
	margin: 0;
	line-height: normal;
	color: #999999;
}

#sidebar a {
	border: none;
    color: #339dff; ;
	text-decoration:underline;
	}

#sidebar a:hover {  color:#2180bc;text-decoration:underline;}

/* Submenu */

#submenu {
}

/* News */

#news {
}

#news a {
	font-size: 85%;
}

/* Footer */

#footer {
	margin-top: 0px auto;
	
	/*background-image: url(/images/footer-bg.png);*/
	/*border-top:#cfcfcc 1px solid;*/
	height:60px;
}

#footer p {
	margin-top: 0px auto;
	text-align: center;
	color:#999;
	line-height:50px;
}

#footer a {
	text-decoration: underline;
}

#footer a:hover {
	text-decoration: none;
}
/*Other*/
.funplaydiv{
	width:750px;
	background-color:#FFFFFF;
   }
.funplayUpload{
	width:800px;
	height:455px;
	padding-top:45px;
	padding-left:40px;
	z-index:1;
	margin:-15px auto 0px auto;
	background-image: url(/images/oeolaFunPlayBg.jpg);
	background-repeat: no-repeat;
}
.fun-play{
	width:795px;
	height:455px;
	padding-top:45px;
	padding-left:45px;

	margin:-15px auto 0px auto;
	background-image: url(/images/oeolaFunPlayBg.jpg);
	background-repeat: no-repeat;
}
.fun-play-big{
	width:795px;
	height:490px;
	padding-top:45px;
	padding-left:45px;

	margin:-15px auto 0px auto;
	background-image: url(/images/oeolaFunPlayBigBg.jpg);
	background-repeat: no-repeat;
}
/*
*+html .fun-play2 {
	width:840px;
	height:500px;
	padding-top:45px;
	
	margin:-11px auto;
	
	background-image: url(/images/oeolaFunPlayBg.jpg);
	background-repeat: no-repeat;
}
*/
.fun-play2{
	width:840px;
	height:500px;
	padding-top:45px;
	
	margin:-15px auto;
	
	background-image: url(/images/oeolaFunPlayBg.jpg);
	background-repeat: no-repeat;
	
}

.fun-play3{
	width:750px;
	padding:30px 15px 5px 15px;
	margin:0px auto;
	background-image: url(/images/note.png);
	background-repeat: no-repeat;
	height:200px;
	background-position: center center;
   }
.funplay3_div{
	*padding-top:20px;
	 padding-left:20px;
	 padding-right:20px;
    margin-top:20px; 
	}
.funplay3_div2{
	margin:40px auto;
	width:350px;
	}
.fun-play4{
	padding:10px;
	border:1px solid #cfcfcc;
	width:750px;
	margin:5px auto;
	background-color:#FFFFFF;
   }
.bg-color{
	padding:10px;
	width:200px;
	
}
.respond{
  padding-top:10px;
  padding-bottom:10px;
  border-bottom:#CCCCCC 1px solid;
  margin-bottom:5px;
  margin-top:10px;
  padding-left:10px;
 
  word-break:break-all;
  overflow:hidden;
  *overflow:inherit;
  }

.bt-r{
	background-image: url(/images/oeolaButton_02.gif);
	background-repeat: no-repeat;
	background-position: right center;
	padding-right:15px;
	padding-left:10px;	
	display:block;	
	height:45px;
	}
.bt-l {
	background-image: url(/images/oeolaButton_01.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left:5px;
	height:45px;
	line-height:45px;
	display:block;
	text-align:center;
	color:#FFFFFF;
	font-weight:bold;
	margin:0 auto;
	font-size:15px;
}
.bt-l a{
   color:#FFFFFF;
   background-position: left center;
   text-decoration:none;
}
.bt-l a:hover{
   color:#FFFFFF;
   background-position: left center;
   font-weight:bold;
   text-decoration:none;
}
a.yellow-txt, a.yellow-txt:visited {
	color:#FF9900;
	font-size:12px;
   }
a.yellow-txt:hover {
   font-weight:bold;
   text-decoration:none;
   }
.file-line{
	background-image:url(/images/oeolaDownloadListBg.jpg);
	background-repeat:no-repeat;
 	padding-bottom:10px;
    padding-top:10px;
}
.file-line-white{
	background-image:url(/images/oeolaDownloadListWhiteBg.jpg);
	background-repeat:no-repeat;
 	padding-bottom:10px;
    padding-top:10px;
 }
/*Text inputs*/
.textinput, .textinputHovered {
	width:480px;
	height:15px;
	background:url(/images/oeolaInput.gif) no-repeat left top;
	border:none;
	padding:4px 6px;
}
.textinputHovered {
	background-position:left bottom;
}
/*Button*/
.buttonSubmit {
	width:64px;
	height:35px;
	color:#FFF;
	font-weight:bold;
	padding:-10px 5px;
	*padding:2px 5px;
	cursor:pointer;
	border:none;
	background-image: url(/images/btnBrowseComplete.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}


/*Upload*/
#upload{
    min-height:350px;
	margin-top:10px;
}

.upload-img{
	width:75px;
	height:75px;
	background-image:url(/images/loading_indicator_big.gif);
	/*background-image: url(/images/img_test3.gif);*/
	background-color:#FFFFFF;
	background-repeat: no-repeat;
	background-position: center center;
	padding:3px;
	border:1px dashed #999999;
	margin:1px;

}
.slogan{
	color:#fff;
	font-size:20px;
	font-weight:bold;
	margin-top:40px;
	}
.textarea_noneborder{
    border:none;
	color: #666666;
	line-height:18px;
	
	background-color:#FFFFCC;
	}

.share {
	border-left-width: 5px;
	border-left-style: solid;
	border-left-color: #339dff;
	padding:10px 10px 10px 15px;
	display:block;
	background-image: url(/images/bgcode.gif);
}
.notice {
	color:#f5851f;
	line-height:16px;
	padding-top:3px;
	margin-bottom:10px;
}
/*Comment*/
#commentDiv{
	
	position:inherit;
	z-index:5;
}

/*20091001_viola */
.btnUploadShare{
   padding-left:558px;
   margin-top:-1px ;/9
   *margin-top:3px;
   _margin-top:3px;
}
*+html .btnUploadShare{
  
   margin-top:3px ;
 
}
html:root .btnUploadShare {
	   margin-top:-2px;

}
.statement{
	left:0;
	padding-top:0px;
	position:absolute;
	top:3px;
	z-index:10;
}
.unTextDecoration{
	text-decoration:none;
}
.wordwrap{
		overflow: hidden;
		word-break:break-all;
		-moz-binding: url('/css/wordwrap.xml#wordwrap');
}
.report{
	width:650; 
	height:250;
	margin-top:20px;
}
.red{
   color:#CC0000;
}
.redBold{
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
   color:#CC0000;
}
.listStyleDisc{		
	list-style-type:disc;
}
.blueTitle{
	color: #339dff;
	font-size:16px;
	font-weight:bold;
}
.uploadFile{
	float:right;
	width:445px;
	*width:445px;
	 height:340px;
	overflow-y:scroll;
	overflow-x:hidden;
}
.bigBlueLink {
	color: #339dff;
	font-size:15px;
	font-family:Arial, Helvetica, sans-serif;
	padding:0 5px 0 5px;
	text-decoration:none;
	cursor:pointer;
}
.bigBlueLink a{
	color: #339dff;
	font-size:15px;
	font-family:Arial, Helvetica, sans-serif;
	padding:0 5px 0 5px;
	text-decoration:underline;
}
.bigBlueLink a:hover{
	color: #FFFFFF;
	background-color:#339dff;
	font-size:15px;
	padding:0 5px 0 5px;
	text-decoration:none;
}
.bigGreenLink {
	color: #090;
	font-size:15px;
	font-family:Arial, Helvetica, sans-serif;
	padding:0 5px 0 5px;
	text-decoration:none;
}
.bigGreenLink a{
	color: #090;
	font-size:15px;
	font-family:Arial, Helvetica, sans-serif;
	padding:0 5px 0 5px;
	text-decoration:underline;
}
.bigGreenLink a:hover{
	color: #FFFFFF;
	background-color:#090;
	font-size:15px;
	padding:0 5px 0 5px;
	text-decoration:none;
}
.feedbackTitleDiv{
	text-align:right;
	width:500px;
	padding-right:5px;
}
.inputShareTitle{
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	color:#666;
	width:480px;
	padding:5px;
	border:1px solid #CCC;
	background-color:#FFF;
	margin-left:5px;
	/*
	color:#666;
	width:500px;
	height:15px;
	background:url(/images/oeolaInput.gif) no-repeat left top;
	border:none;
	padding:4px 6px;
	*/
}
.textareaShareDesc{
	margin-left:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#666;
	padding:5px 2px 5px 5px;
	border:1px solid #CCC;
	background-color:#FFF;
	overflow:hidden;
}
.inputShareGrayTitle{
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bold;
	color:#666;
	width:480px;
	border:none;
	margin-left:5px;
	padding:5px;
	background:none;
}
.textareaShareDescUnBorder{
	margin-left:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#666;
	padding:5px 2px 5px 6px;
	border:none;
	background:none;
	overflow:hidden;
}
.textPercent{
	color:#339EFF;
	margin-top:30px;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	line-height:18px;
}